/* 
 * portfolio.js (inside-manside script for papshevstudio.com)
 * v0.7
 *
 * Coded by Denis Arkhipov
 * vikhlun@gmail.com
 *
 * Date: Apr 04 2011
 */

$(function(){
	if ($('body').hasClass('page-index')) {
		papshev.initIndex();
	} else if ($('body').hasClass('page-portfolio')) {
		papshev.init();
	} else if ($('body').hasClass('page-works')) {
		papshev.initWorks();
	} else if ($('body').hasClass('page-order')) {
		papshev.initOrder();
	} else if ($('body').hasClass('page-404')) {
		papshev.init404();
	};
});
var papshev = function(){
	var windowSize, pack, items, length, current, currentClient, ribbon, clients, sliderWidth, hash, uri, slideshow;
	var animation = false;
	
	function init() {
		pack = $('#pack');
		ribbon = $('#ribbon');
		clients = $('#clients');
		
		getHash();
		uri = location.href.slice(0,location.href.indexOf('#'));
		
		makeClients();
		
		make();
		
		sliderInit();
		
		window.onresize = function(){
			windowResize();	
			goToCurrent();
		};
		
		$('#prev').click(function(){
			if (!animation)
				slide(-1);
		});
		$('#next').click(function(){
			if (!animation)
				slide(1);
		});
		
		$('.pathBar h2 a').click(function(){
			slideShowStop();
			clients.toggle();
			$(document).bind('click',function(e){
				target = $(e.target);
				if (!target.parents('#clients').length) {
					clients.hide();
					$(document).unbind('click');
				};
			});
			return false;
		});
		
		$(document).bind('keydown','left',function(){
			if ($('#prev').is(':visible')) {
				slideShowStop();
				$('#prev').trigger('click');
			};
			return false;
		}).bind('keydown','right',function(){
			if ($('#next').is(':visible')) {
				slideShowStop();
				$('#next').trigger('click');
			};
			return false;
		}).bind('keydown','space',function(){
			$('#sst').trigger('click');
			return false;
		});
		
		$('#sst').click(function(){
			if (!$(this).hasClass('slideShowToggler-active')) {
				$(this).addClass('slideShowToggler-active');
				if (!animation)
					slide(1);
				slideshow = setInterval((function(){
					if (!animation)
						slide(1);
				}),7000);
				$(document).bind('click',slideShowStop);
			} else {
				slideShowStop();
			};
			return false;
		});
	};
	
	function slideShowStop(e) {
		$(document).unbind('click');
		clearTimeout(slideshow);
		$('#sst').removeClass('slideShowToggler-active');
	};
	
	function sliderInit() {
		var ps = $('#progress-slider');
		ps
			.mousedown(function(e){
				e.preventDefault();
				slideShowStop();
				var clck = {
					"x":e.pageX,
					"left":parseInt(ps.css('left'))
				};
				var sl = $('<div id="progress-label">Слайд <span>'+(current+1)+'</span></div>').appendTo(ps);
				sl.css({
					'left':e.pageX - ps.offset().left + 12,
					'top':e.pageY - 12
				}).fadeIn(200);
				
				$(document).bind('mousemove',function(e){
					sliderMove(e,clck,ps,sl);
				}).mouseup(function(e){
					sliderStop(ps);
					$(document).unbind('mousemove');
					$(document).unbind('mouseup');
				});
			});
			
	};
	function sliderMove(e,clck,ps,sl) {
		var sliderWidth = parseInt(490 / portfolio[currentClient].slides.length);
		var sliderOffset = e.pageX - clck.x;
		var ps_left = clck.left + sliderOffset;
		var tempCurrent = parseInt(ps_left / sliderWidth);
		if (ps_left <= 0) {
			ps.css('left',0);
			ps.find('span').text(1);
		} else if (ps_left > (490-sliderWidth)) {
			ps.css('left',(490-sliderWidth));
			ps.find('span').text(portfolio[currentClient].slides.length);
		} else {
			ps.css('left',ps_left);
			ps.find('span').text(tempCurrent + 1);
		};
	};
	function sliderStop(ps) {
		var tempCurrent = parseInt(parseInt(ps.css('left')) / parseInt(490 / portfolio[currentClient].slides.length));
		$('#progress-label').stop().fadeOut(200,function(){ $(this).remove(); });
		if (tempCurrent != current) {
			current = tempCurrent;
			setHash();
			make();
		} else {
			setProgress();
		};
	};
	
	function getHash() {
		if (location.href.indexOf('#') >= 0) {
			hash = location.href.slice(location.href.indexOf('#')+1);
			var temp = hash.split('/');
			current = (temp[1]) ? parseInt(temp[1]): 0;
			currentClient = (temp[1]) ? getClientPos(temp[0]) : 0;
		} else {
			hash = portfolio[0].id+'/0';
			location.href = ('#'+hash);
			current = 0;
			currentClient = 0;
		};
	};
	
	function setHash() {
		hash = '#'+portfolio[currentClient].id+'/'+current;
		window.location.replace(uri+hash);
	};
	
	function getClientPos(id) {
		var pos = null;
		for (var i=0;i<portfolio.length;i++) {
			if (portfolio[i].id == id) {
				pos = i;
			};
		};
		return pos;
	};
	
	function make() { // making the workspace
		var slidesHTML = new String();
		
		ribbon.empty().css('margin-left',0);
		for (var i=0;i<portfolio.length;i++) {
			portfolio[i].loaded = false;
		};
		
		/*if (currentClient > 0) slidesHTML += getSlidesCode(currentClient-1);
		
		slidesHTML += getSlidesCode(currentClient);
		
		if (currentClient < (portfolio.length-1)) slidesHTML += getSlidesCode(currentClient+1);*/
		
		slidesHTML = make7();
		
		
		ribbon.append(slidesHTML);
		
		makeImages();
		
		//bindLoading(ribbon.find('img'));
		
		items = $('.item');
		items.show();
		
		length = items.length;
		
		$('.client-active').removeClass('client-active');
		$('#client-link-'+portfolio[currentClient].id).addClass('client-active');
		
		$('#client-title strong').text(portfolio[currentClient].title);
		
		windowResize();
		
		setProgress();
		
		goToCurrent();/**/
	};
	
	function makeImages() {
		var currentItem = getCurrent();
		createImage(currentItem);
		createImage(currentItem.next());
		createImage(currentItem.prev());
		createImage(currentItem.next().next());
		createImage(currentItem.prev().prev());
	};
	
	function createImage(item_) {
		if (item_.length && !item_.find('img').length) {
			item_.append('<img src="'+item_.attr('data-src')+'" alt="" />');
			bindLoading(item_.find('img'));
		};
	};
	
	function make7() {
		var slides = new String();
		slides += getSlideCode(-3);
		slides += getSlideCode(-2);
		slides += getSlideCode(-1);
		slides += getSlideCode(0);
		slides += getSlideCode(1);
		slides += getSlideCode(2);
		slides += getSlideCode(3);
		return slides;

	};
	
	function getSlideCode(dir) { // generates html code for 1 slide indexed by index
		var innerCurrent = current;
		var innerCurrentClient = currentClient;
		if (dir > 0) {
			for (var i=1;i<=dir;i++) {
				innerCurrent++;
				if (innerCurrent >= portfolio[innerCurrentClient].slides.length) {
					innerCurrentClient++;
					if (innerCurrentClient >= portfolio.length) {
						innerCurrentClient = 0;
					};
					innerCurrent = 0;
				};
			};
		} else if (dir < 0) {
			for (var i=1;i<=Math.abs(dir);i++) {
				innerCurrent--;
				if (innerCurrent < 0) {
					innerCurrentClient--;
					if (innerCurrentClient < 0) {
						innerCurrentClient = portfolio.length - 1;
					};
					innerCurrent = portfolio[innerCurrentClient].slides.length - 1;
				};
			};
		} else {
			
		};
		
		return '<div class="item" data-image="1" data-client="'+portfolio[innerCurrentClient].id+'" data-src="'+portfolio[innerCurrentClient].slides[innerCurrent].src+'" data-width="'+portfolio[innerCurrentClient].slides[innerCurrent].width+'" data-height="'+portfolio[innerCurrentClient].slides[innerCurrent].height+'" id="'+portfolio[innerCurrentClient].id+'-'+innerCurrent+'"></div>';
	};
	
	function bindLoading(items_) {
		items_.css('visibility','hidden').load(function(){
			$(this).css({
				opacity:0,
				visibility:'visible'
			}).animate({opacity:1},400);
		});
	};
	
	function getSlidesCode(index) { // generates html code for client slides by index == client nu
		var pre = new String();
		for (var i=0;i<portfolio[index].slides.length;i++) {
			pre += '<div class="item" data-image="1" data-client="'+portfolio[index].id+'" data-src="'+portfolio[index].slides[i].src+'" data-width="'+portfolio[index].slides[i].width+'" data-height="'+portfolio[index].slides[i].height+'" id="'+portfolio[index].id+'-'+i+'"></div>';
		};
		portfolio[index].loaded = true;
		return pre;
	};
	
	function makeClients() {
		var clientsHTML = '<ul>';
		for (var i=0;i<portfolio.length;i++) {
			clientsHTML += '<li id="client-link-'+portfolio[i].id+'" data-client="'+i+'"><a href="#'+portfolio[i].id+'/0"><p class="client-title"><strong>'+portfolio[i].title+'</strong></p><p class="client-info">'+portfolio[i].info+'</p></a></li>';
		};
		clientsHTML += '</ul>';
		clients.append(clientsHTML);
		$('#client-link-'+portfolio[currentClient].id).addClass('client-active');
		clients.find('a').click(function(){
			var a = $(this);
			if (!a.parent().hasClass('client-active')) {
				current = 0;
				currentClient = parseInt(a.parent().attr('data-client'));
				setHash();
				make();
				$('.pathBar h2 a').trigger('click');
			};
			return false;
		});
	};
	
	function slide(dir) {
		switchCurrent(dir);
		//checkNav();
		
		var nextItem = getCurrent();
		pos = nextItem.offset().left;
		
		itemWidth = nextItem.width();
		if (itemWidth < windowSize.width) {
			pos -= parseInt((windowSize.width - itemWidth)/2);
		};
		
		animation = true;
		
		ribbon.animate({
			marginLeft:'-='+pos
		},500,function(){
			animation = false;
			repaintAndMove(dir);
		});
		
		setHash();
	};
	
	function repaintAndMove(dir) {
		
		var currentItem = getCurrent();
		if (dir > 0) {
			offsetWidth = items.eq(0).width();
			items.eq(0).remove();
			ribbon.append(getSlideCode(3));
			offsetWidth = parseInt(ribbon.css('margin-left')) + offsetWidth;
			ribbon.css('margin-left',offsetWidth);
			createImage(currentItem.next().next());
		} else {
			offsetWidth = items.filter(':last').width();
			items.filter(':last').remove();
			ribbon.prepend(getSlideCode(-3));
			offsetWidth = parseInt(ribbon.css('margin-left')) - offsetWidth;
			ribbon.css('margin-left',offsetWidth)
			createImage(currentItem.prev().prev());
		};
		items = $('.item');
		items.show();
		windowResize();
		goToCurrent();
	};
	function switchCurrent(dir) { // switching current and currentClient variables to next ones
		nextSlide = parseInt(current) + dir;
		prevClient = currentClient;
		
		if (nextSlide >= portfolio[currentClient].slides.length) {
			current = 0;
			currentClient += dir;
			if (currentClient >= portfolio.length) {
				currentClient = 0;
			};
		} else if (nextSlide < 0) {
			currentClient += dir;
			if (currentClient < 0) {
				currentClient = portfolio.length - 1;
			};
			current = portfolio[currentClient].slides.length - 1;
			
		} else {
			current = nextSlide;
		};
		/*if ((prevClient < currentClient) && (currentClient < (portfolio.length-1)) && (!portfolio[currentClient+1].loaded)) {
			append('next');
		} else if ((prevClient > currentClient) && (currentClient > 0) && (!portfolio[currentClient-1].loaded)) {
			append('prev');
		};*/
		
		if (prevClient != currentClient) {
			switchClient(dir);
		} else {
			$('#progress-slider').animate({
				left:'+='+(sliderWidth*dir)
			},500);
		};
	};
	
	function append(dir) {
		appendClient = (dir == 'next') ? (currentClient + 1) : (currentClient - 1);
		//alert(appendClient)
		var slidesHTML = getSlidesCode(appendClient);
		if (dir == 'next') {
			ribbon.append(slidesHTML);
		} else {
			ribbon.prepend(slidesHTML);
		};
		
		bindLoading(ribbon.find('img[data-client="'+appendClient+'"]'));
		
		items = $('.item');
		length = items.length;
		windowResize();
		if (dir == 'prev') {
			var w = 0;
			items.filter(':hidden').each(function(){
				w += $(this).width();
			});
			ribbon.css({
				marginLeft:(parseInt(ribbon.css('margin-left')) - w)
			});
		};
		items.show();
	};
	
	function switchClient(dir) {
		$('.client-active').removeClass('client-active');
		$('#client-link-'+portfolio[currentClient].id).addClass('client-active');
		
		//$('#header strong').text(portfolio[currentClient].title);
		$('#client-title').find('strong').addClass('old');
		
		setProgress();
		if (dir > 0) {
			$('#progress-slider').stop().animate({left:0,width:sliderWidth},500);
			
			$('#client-title').append('<strong style="left:230px;">'+portfolio[currentClient].title+'</strong>');
			$('#client-title strong').animate({
				left:'-='+230+'px'
			},500,function(){
				$('#client-title .old').remove();
			});
		} else {
			$('#progress-slider').stop().animate({left:((portfolio[currentClient].slides.length-1)*sliderWidth),width:sliderWidth},500);
			
			$('#client-title').append('<strong style="left:-230px;">'+portfolio[currentClient].title+'</strong>');
			$('#client-title strong').animate({
				left:'+='+230+'px'
			},500,function(){
				$('#client-title .old').remove();
			});
		};
	};
	
	function checkNav() { // checking prev and next buttons for necessity
		if ((currentClient == 0) && (current == 0)) {
			$('#prev').hide();
			$('#next').show();
		} else if ((currentClient >= (portfolio.length-1)) && (current >= (portfolio[portfolio.length-1].slides.length-1))) {
			$('#prev').show();
			$('#next').hide();
		} else {
			$('#prev').show();
			$('#next').show();
		};
	};
	
	function setProgress() {
		sliderWidth = parseInt(490 / portfolio[currentClient].slides.length);
		$('#progress-slider').animate({width:sliderWidth,left:current*sliderWidth},{duration:100});
	};
	
	function windowResize() {
		windowSize = {
			width:$(window).width(),
			height:(($(window).height() > 600) ? $(window).height() : 600)
		};
		
		pack.height(windowSize.height-120);
		ribbon.width(windowSize.width*(length+1));
		
		itemsResize();
		clientsResize();
		//clientsResizeWorks();
	};
	
	function itemsResize() {
		items.each(function(i){
			item_ = items.eq(i);
			if (item_.attr('data-image') == 1) {
				var image = item_.find('img');
				imageWidth = item_.attr('data-width');
				imageHeight = item_.attr('data-height');
				
				// ratio = screen height / image real height
				// item width = image real width * ratio
				itemWidth = parseInt(((windowSize.height-120)/imageHeight) * imageWidth);
				
				if (itemWidth > windowSize.width) {
					image.css('margin-left',parseInt(-(itemWidth-windowSize.width)/2));
					itemWidth = windowSize.width;
				} else {
				};
				item_.width(itemWidth).css('margin-left',0);
			} else {
				item_.width(windowSize.width);
			};
		});
		
		// first item
		/*itemWidth = items.eq(0).width();
		if (itemWidth < windowSize.width) {
			items.eq(0).css('margin-left',parseInt((windowSize.width - itemWidth)/2));
		} else {
			items.eq(0).css('margin-left',0);
		};*/
	};
	
	function goToCurrent() { // set current item to center
	//alert(current);
		var currentItem = getCurrent();
		//alert(currentItem.html())
		pos = currentItem.offset().left;

		pos = parseInt(ribbon.css('margin-left')) - currentItem.offset().left;
		itemWidth = currentItem.width();
		if (itemWidth < windowSize.width) {
			pos += parseInt((windowSize.width - itemWidth)/2);
		};
		ribbon.css({marginLeft:pos});
		//checkNav();
	};
	
	function getCurrent() { // returns jquery object of current item
		return $('#'+portfolio[currentClient].id+'-'+current);
	};
	
	function clientsResize() { // resize popup clients box
		if (windowSize.width <= 1000) {
			clients
				.width(1000)
				.css('margin-left',-500)
				.find('li').width(332);
		} else if (windowSize.width < 1100) {
			clients.width(windowSize.width).css('margin-left',-parseInt((windowSize.width)/2));
			itemsInLine = parseInt((windowSize.width) / 296);
			itemsLeftovers = parseInt(((windowSize.width) - itemsInLine*296) / itemsInLine);
			clients.find('li').width(295+itemsLeftovers);
		} else {
			clients.width(windowSize.width-100).css('margin-left',-parseInt((windowSize.width-100)/2));
			itemsInLine = parseInt((windowSize.width - 100) / 296);
			itemsLeftovers = parseInt(((windowSize.width - 100) - itemsInLine*296) / itemsInLine);
			clients.find('li').width(295+itemsLeftovers);
		};
	};
	
	
	
	
	function initIndex() {
		var content = $('#content');
		$(window).resize(function(){
			content.height($(window).height()-120);
		});
		$(window).trigger('resize');
		
		swfobject.embedSWF("/media/flash/ps_intro.swf", "welcome", "100%", "100%", "9.0.0");
	};
	
	function initWorks() {
		clients = $('#clients');
		windowResizeWorks();
		window.onresize = windowResizeWorks;
		/*$('#logo').click(function(){
			$(this).animate({opacity:0},500,function(){ $(this).remove(); })
		});*/
	};
	
	function windowResizeWorks() {
		windowSize = {
			width:$(window).width(),
			height:(($(window).height() > 400) ? $(window).height() : 400)
		};
		
		clientsResizeWorks();
		logoResize();
	};
	
	function logoResize() {
		if (windowSize.height*1.6 < windowSize.width) {
			$('#logo-image').height(windowSize.height).width(parseInt(windowSize.height*1.6));
		} else {
			$('#logo-image').width(windowSize.width).height(parseInt(windowSize.width/1.6));
		};
		
	};
	
	function clientsResizeWorks() {
		if (windowSize.width > 1100) {
			clients.css({
				paddingLeft:50,
				paddingRight:50
			});
			itemsInLine = parseInt((windowSize.width - 100) / 296);
			itemsLeftovers = parseInt(((windowSize.width - 100) - itemsInLine*296) / itemsInLine);
			clients.find('li').width(295+itemsLeftovers);
			
		} else if (windowSize.width > 1000) {
			clients.css({
				paddingLeft:0,
				paddingRight:0
			});
			itemsInLine = parseInt((windowSize.width) / 296);
			itemsLeftovers = parseInt(((windowSize.width) - itemsInLine*296) / itemsInLine);
			clients.find('li').width(295+itemsLeftovers);
		} else {
			clients.css({
				paddingLeft:0,
				paddingRight:0
			});
			clients.find('li').width(332);
		};
	};
	
	
	
	
	function initOrder() {
		var order = $('#order');
		windowResizeOrder();
		window.onresize = windowResizeOrder;
		
		order.height(order.height())
		
		order.submit(function(){
			var full = true;
			order.find('input,textarea').each(function(){
				if ($(this).val() == '') { full = false };
				$(this).focusin(function(){
					if (order.find('.order-error').length) {
						order.find('.order-error').removeClass('order-error').html('<input type="submit" class="button" value="Отправить" />');
					};
				});
			});
			if (!full) {
				//order.find('.order-wrapper').fadeOut(300)
				//order.find('input[type="submit"]').fadeOut(300);
				order.find('.submit').addClass('order-error').html('Заполните, пожалуйста, все поля.');
			} else {
				order.find('.order-wrapper').fadeOut(200,function(){
					order.append('<span class="loader"></span>');
					
					var data = $('#order').find('input, textarea');
					$.post(
						'/order/jx_send_order/',
						data,
						function(data)
						{
							if (data.status == 'success')
							{
								order.find('.loader').fadeOut(200,function(){
									order.append('<span class="order-succes">Спасибо, мы ответим вам в ближайшее время.</span>');
									order.find('.order-succes').fadeIn(200);
								});
							}
							else
							{
								order.find('.loader').fadeOut(200,function(){
									order.append('<span class="order-succes">Произошла ошибка. Обновите страницу и попробуйте снова.</span>');
									order.find('.order-succes').fadeIn(200);
								});
							}
						},
						'json'
					);
				})
			};
			return false;
		});
	};
	
	function windowResizeOrder() {
		windowSize = {
			width:$(window).width(),
			height:(($(window).height() > 600) ? $(window).height() : 600)
		};
		
		var mt = parseInt((windowSize.height - 120 - $('#order').outerHeight()) / 2);
		$('#orderWrapper').height(windowSize.height-120-mt).css('padding-top',mt);
		
		//$('#order').css('margin-top',mt)
	};
	
	
	
	
	function init404() {
		windowResize404();
		window.onresize = windowResize404;
		$('#e404-image b').click(function(e){
			e.preventDefault();
			/*if ($('#e404-image i').is(':hidden')) {
				$('#e404-image i').show();
			} else {
				$('#e404-image i').fadeOut(1000);
			};*/
			$('#e404-image i').toggle();
		})
	};
	
	function windowResize404() {
		windowSize = {
			width:$(window).width(),
			height:(($(window).height() > 600) ? $(window).height() : 600)
		};
		
		if (windowSize.height > 860) {
			var off = windowSize.height - 860;
			$('#e404-inner').css({
				marginTop:(parseInt(off/3)*2),
				marginBottom:parseInt(off/3)
			});
			if (parseInt(off/3)*3 != off) {
				$('#e404-inner').css({
					marginTop:((parseInt(off/3)*2)+1)
				});
			};
		} else {
			$('#e404-inner').css({
				marginTop:0,
				marginBottom:0
			});
		};
		
		//$('#order').css('margin-top',mt)
	};
	
	return {
		init:init,
		initWorks:initWorks,
		initOrder:initOrder,
		initIndex:initIndex,
		init404:init404
	};
}();