// JavaScript Document
var portfolio = function(){

};
(function(){
	var z=2;
	portfolio.z = function(){
		return z++;
	}
})();
/********* Общая инициализация *********/
$(function(){
	var p = portfolio;
	p.main = $('ul#portfolio');
	p.currentSlide = 0;
	p.scrollToSlide = function(i){
		if(i == p.slides.length - 1) var y = $(document).height() - $(window).height();
		$.scrollTo(y || (p.yStep * i + p.main.offset().top+50), 0, {axis: 'y'});
		if(!$.browser.msie) $(window).trigger('scroll.fix');
	}
	p.scrollStep = 600;
	
	p.browserHandle = function(){
		return $('<div class="browser-handle"><em></em></div>');
	}
	p.browserHandleBaseHeight = 91;
	p.browserHandleMinPos = 6;
	
	$(document).bind('changeCSS.handle', portfolio.refreshHandle = function(e, context){
		$('.browser-handle', context || document).each(function(){
			var handle = $(this), ins = $(this).siblings('ins'), img = ins.children().not('.portfolio-image-off');
			var check = function(){
				var aspect =  Math.min(ins.height() / img.height(), 1);
				if(aspect >= 1) return handle.hide();
				else handle.show();
				handle.height(aspect * portfolio.browserHandleBaseHeight + '%');
				handle.data('maxPos', 97 - aspect * portfolio.browserHandleBaseHeight);
				ins.trigger('mousewheel', [0]);
			};
			if(!img.length) check();
			else{
				if(img.get(0).complete) check();
				else img.load(function(ev){
					check();
					$(this).unbind(ev);
				});
			}
		});
	});
	
	
	$.fn.preload = function(){
		if(this.attr('tosrc') && !this.hasClass('loaded'))
			this.load(function(){
				$(this).addClass('loaded');
				if($(this).parent().length && $(this).siblings().not('.loaded').length == 0) $(this).parent().addClass('loaded');
				portfolio.refreshHandle();
			}).attr('src', this.attr('tosrc'));
	}
});

/********* CUBE *********/
$(function(){
	
	
	var p = portfolio, box = $('ul.portfolio-box:first'), wh, ww, windowHeightRefresh,
		size1600 = ww >= 1550,
		stylesheet = $('#addstylesheet');
	$(window).resize(windowHeightRefresh = function(){ 
		wh = $(window).height(); ww = $(window).width();
		
		if(size1600 && ww < 1550){
				size1600 = false;
			if(p.portfolioBox){
				p.portfolioBox.hide(); setTimeout(function(){
					p.portfolioBox.show();
					$(document).trigger('changeCSS');
				}, 50);
				$(document).trigger('changeCSS');
			}
			if($.browser.msie && parseInt($.browser.version) < 9){
				stylesheet.detach();
				$(document).trigger('changeCSS');
			}
		}else if(!size1600 && ww >= 1550){
				size1600 = true;
			if($.browser.msie && parseInt($.browser.version) < 9){
				stylesheet.appendTo('#head');
			}
			$(document).trigger('changeCSS');
		}
		
		
		if($.browser.msie) setTimeout(function(){
					$(document).trigger('changeCSS');
				}, 200);
	});
		
	windowHeightRefresh();
	
	/* if(!$.support.webkit3d) 
		return; */
	
	
	// $(window).bind('scroll resize', function(){
		// var scrollTop = $(this).scrollTop(),
			// windowCenter = scrollTop + wh/2,
			
			// y = box.offset().top, 
			// yCenter = y + box.height()/2, 
			
			// maxAngle = 20, 
			// threshold = .2,
			// k = .1,
			
			// offset = windowCenter - yCenter - wh * threshold;
			
		// var angle = offset * k;
			
		// angle = Math.max(angle, -maxAngle);
		// angle = Math.min(angle, 0);
		
		// if(p.box.hasClass('fixed')) angle = 0;
		
		// box.webkitTransform('rotateX(' + angle + 'deg)');
	
	// });
	
	//Подготовка
	
	//Назначение элементов, выставление высоты доп. скролла
	p.main.height(function(){
		return $(this).children().length * p.scrollStep;
	});
	(p.slides = p.main.children('li')).not(':first').detach();
	
	p.box = p.slides.first();
	p.slides = p.slides.map(function(){
		return {
			images : $($.map($.parseJSON($('ins > span', this).detach().html()) || [], function(src, i){ 
				var img = $('<img />').attr('tosrc', src);
				if(!i) img.preload();
				return img.get(0); 
			})),
			title : $('h2', this).html(),
			desc : $('div.portfolio-desc', this).html(),
			description : $('div.portfolio-description', this).html()
		}
	}).get();
		
	p.currentSide = 0;
	
	//Фиксируем ширину li при изменении размера
	var boxWidthHandler;
	$(window).resize(boxWidthHandler = function(){
		p.box.width(p.main.width());
	}); boxWidthHandler();
	
	//Делаем блок фиксированным при скролле
	$(window).bind('scroll.fix resize.fix', function(e){
		var offsetTop = p.main.offset().top, scrollTop = $(window).scrollTop();
		
		//Устанавливаем фиксенное положение
		if(offsetTop <= scrollTop) p.box.addClass('fixed');
		else{
			if(p.box.hasClass('fixed')){
				p.box.removeClass('fixed');
				p.rotate(0);
			}
			return
		}
		
		//Смотрим текущий слайд
		p.getYStep();
		var pos =  scrollTop - offsetTop,
			step = p.checkSlide(Math.round(pos / p.yStep), p.slides.length-1);
		
		p.rotate(step);
	});
	(p.getYStep = function(){
		return p.yStep = (p.main.innerHeight() - wh) / (p.slides.length-1);
	})();
	
	//Строю куб и ставлю туда первый слайд
	(p.portfolioBox = p.box.find('ul.portfolio-box')).empty().append(
		$('<li class="pb-current-side" />'),
		$('<li class="pb-second-side" />'),
		$('<li class="pb-back-side" />'),
		$('<li class="pb-third-side" />')
	)
	p.sides = $('ul.portfolio-box > li', p.main);
	p.browserImg = $('<img src="/content/images/browser.box.gif" class="pb-browser" alt="" />')
	
	
		
		
	p.setImage = function(slide, side, nowrite){
		var slide = p.checkSlide(slide), side = p.checkSide(side), cur = p.slides[slide], handle, ins;
		
		//cur.images.addClass('portfolio-image-off').first().removeClass('portfolio-image-off').css('opacity', 1);
		
		var currentSide = p.sides.eq(side), prevslide = currentSide.data('slide');
		if(typeof prevslide == "number" && p.sides.eq(side).data('slide') == slide){ 
			currentSide.find('ins > img:last').trigger('click', [$()]).parent().scrollTo(0, 500, {axis: 'y'});
		}
		
		else
			p.sides.eq(side).empty().append(
				ins = $('<ins />').append(cur.images.each(function(i){if(i)$(this).addClass('portfolio-image-off')})),
				p.browserImg.clone(),
				p.browserHandle()
			).data('slide', slide);
		
		var nowrite = nowrite || false;
		
		$(document).trigger('changeCSS.handle');
		if(nowrite) return;
		p.box.find('h2').stop(true).fadeTo(250, 0, function(){
			$(this).html(cur.title);
		}).fadeTo(250, 1);
		
		p.box.find('div.portfolio-desc').stop(true).fadeTo(250, 0, function(){
			$(this).html(cur.desc);
		}).fadeTo(250, 1);
		
		p.box.find('div.portfolio-description').stop(true).fadeTo(250, 0, function(){
			$(this).html(cur.description);
		}).fadeTo(250, 1);
		
	}
	p.currentAngle = 0;
	
	p.check = function(index, what){
		var index = index;
		if(index >= p[what].length) index = p[what].length-1;
		if(index < 0) index = 0;
		return index;
	}
	p.checkSide = function(index){
		var index = index % 4;
		if(index < 0) index += 4;
		return index;
	}
	p.checkSlide = function(index){return p.check(index,'slides')}
	p.setImage(0, 0);
	p.setImage(1,1, true);
	
	//Обработчик переключений
	p.rotate = function(index){
		var index = index;
		if(index == p.currentSlide) return;
		
		
		//Устанавливаем предыдущий и следующий
		
		if(typeof index == "boolean")
			index = index ? p.currentSlide - 1 : p.currentSlide + 1;
		
		index = p.checkSlide(index);
		
		//Смотрим в какую сторону вертеть
		var direct = index > p.currentSlide;
		p.currentSlide = index;
		p.checkArrows();
		
		
		
		p.currentAngle = (p.currentAngle - 90 * (direct ? 1 : -1))
		
		//Ставим на следующую сторону при нужном направлении
		var tAngle = p.currentAngle;
		p.currentSide = p.checkSide(Math.round(-p.currentAngle / 90)); 
		
		//Узнали сторону ставим туда
		p.setImage(p.currentSlide, p.currentSide);
		if(p.currentSlide-1 >= 0) 
			p.setImage(p.currentSlide-1, p.currentSide-1, true);
			
		if(p.currentSlide+1 < p.slides.length)
			p.setImage(p.currentSlide+1, p.currentSide+1, true);
		
		if($.support.webkit3d)
			p.portfolioBox.webkitTransform('rotateY(' + p.currentAngle + 'deg)')
		else
			p.sides.eq(p.currentSide).addClass('showed').show().css('zIndex', p.z()).removeClass('hidden').siblings().addClass('hidden').removeClass('showed');
		
		var c = p.currentSlide;
		setTimeout(function(){
			if(c == p.currentSlide)
				p.slides[c].images.preload();
		}, 3000);
		portfolio.refreshHandle();
	}
	p.refreshRotate = function(angle){
		p.portfolioBox.webkitTransform('rotateY(' + (p.currentAngle = angle || p.currentAngle) + 'deg)')
	};
	
});


/********* arrows ****/
$(function(){
	//if(!$.support.webkit3d) 
		//return;
	var p = portfolio;
	
	p.stageRotate = $('div.stage-rotate', p.main);
	
	p.main.children().first().append(
		$('<div id="portfolio-control" />').append(
			(p.controls = $('<em class="portfolio-prev" /><em class="portfolio-next" />')).each(function(){
				var next = $(this).hasClass('portfolio-next'), returnAngle, angle = 30;
				if($.support.webkit3d){
					$(this).bind({
						mouseenter : function(){
							if(next && (p.currentSlide == p.slides.length-1 || !p.box.hasClass('fixed'))) return $(document).mousemove();
							else if(!next && p.currentSlide == 0) return $(document).mousemove();
							p.stageRotate.webkitTransform('rotateY(' + (next ? -angle : angle) + 'deg)');
						}
					});
				}
				$(this).click(function(){
					if(next && p.currentSlide == p.slides.length-1) return $(document).mousemove();
					else if(!next && p.currentSlide == 0) return $(document).mousemove();
					if(p.box.hasClass('fixed'))
						p.scrollToSlide(next ? p.currentSlide+1 : p.currentSlide-1);
					else p.scrollToSlide(0);
					$(document).mousemove();
				});
			})
		).mousedown(false)
	);
	
	
	$(document).mousemove(function(e){
		if(p.controls.index(e.target) != -1) return;
		p.stageRotate.webkitTransform('rotateY(0deg)');
	});
	
	(p.checkArrows = function(){
		p.controls.parent().removeClass('first last');
		if(p.currentSlide == p.slides.length-1) p.controls.parent().addClass('last');
		if(p.currentSlide == 0) p.controls.parent().addClass('first');
	})();
});


/** Изменение размера у лого для правильных отступов **/
$(function(){
	var logo = $('#logo'), img = $('img', logo), handler;
	$(window).resize(handler = function(){
		var height = img.height();
		logo.css({
			marginTop	: -Math.round(height * .318),
			marginBottom: -Math.round(height * .136)
		});
	}); img.load(handler);
	if(img.get(0).complete) handler();
	setTimeout(handler, 300);
	
});

/** ANCHOR **/
$(function(){
	$('a[href=#portfolio]').click(function(){
		$.scrollTo($('#portfolio'), 500, {axis:'y'});
		return false;
	});
});

//WHOWEARE

$(function(){
	var whoweare = $('#whoweare');
	if($.browser.mozilla && $.support.transform) whoweare.addClass("transform-support");
	
	$(document).keydown(function(e){
		if(e.keyCode == 13 && e.ctrlKey){
			whoweare.addClass("transform-support");
			return false;
		}
	});
});

/*** SCROLL IN BOX ***/

	
$(function(){


	if(!$.support.webkit3d){
		$('ul.portfolio-box > li > ins').each(function(){
			$(this).parent().find('.browser-handle').remove();
			$(this).after(portfolio.browserHandle());
		});
		
		var complete = function(){
			portfolio.refreshHandle();
		},
		check = function(){
			var check = true;
			collection.each(function(){
				if(!this.complete) return check = false;
			});
			return check;
		},
		collection = $('ul.portfolio-box img').load(function(){
			if(check()) complete();
		});
		check();
		
		
	}
		portfolio.refreshHandle();


	$('ul.portfolio-box > li > ins').live('mousewheel', function(e, delta){
		var step = 20;
		if(delta != 0) $(this).scrollTop($(this).scrollTop() + (delta < 0 ? step : -step));
		
		var pos = $(this).scrollTop() / (this.scrollHeight - $(this).height());
		
		var handle = $(this).siblings('.browser-handle');
		if(!handle) return false;
		var maximum = handle.data('maxPos'), minimum = portfolio.browserHandleMinPos;
		
		$(this).siblings('.browser-handle').css('top', minimum + (maximum-minimum) * pos + '%');
		return false;
	});
	$('div.browser-handle').live('mousedown', function(e){
		var handle = $(this), startY = e.pageY, ins = $(this).prevAll('ins'), height = ins.height(), startPercent = handle.css('top');
		if(/[0-9\.]+px/.test(startPercent)) startPercent = parseInt(startPercent) * 100 / height;
		else startPercent = parseFloat(startPercent);
		
		var maxPos = handle.data('maxPos'), minPos = portfolio.browserHandleMinPos;
			document.ondragstart = document.body.onselectstart = function() { return false }
		$(document).bind({
			'mousemove.handle' : function(e){
				var move = e.pageY - startY,
					percent = move * 100 / height + startPercent;
				percent = Math.min(percent, maxPos);
				percent = Math.max(percent, minPos);
				handle.css('top', percent + '%');
				
				ins.scrollTop(Math.round(((percent - minPos) / (maxPos - minPos)) * (ins.get(0).scrollHeight - height)));
			},
			'mouseup.handle' : function(e){
				$(this).unbind('.handle');
				document.ondragstart = document.body.onselectstart = null;
			}
		});
	});
	
	$('ul.portfolio-box > li > ins > img').live('click', function(e, next){
		e.stopPropagation();
		if(!$(this).siblings().length) return;
		var noparse = next && !next.length,
			next = next || $(this).next();
		if(!next.length) next = $(this).siblings().first().filter('.portfolio-image-off');
		if(next.length == 0) return;
		
		next.removeClass('portfolio-image-off').stop(true).css('opacity', 0).fadeTo(500, 1);
			
		var current = $(this).addClass('portfolio-image-off').stop(true).css('opacity', 1).fadeTo(500, 0);
		var other = $(this).siblings().not(next).addClass('portfolio-image-off');
		
		if(!next.hasClass('loaded'))
			next.preload();
		
		if(!noparse) $(this).parent().scrollTop(0);
		portfolio.refreshHandle();
		$(this).parent().siblings('.browser-handle').css('top', portfolio.browserHandleMinPos + '%');
	});
	$(window).trigger('scroll.fix');
	
	
});