var paralax = {
	time: 1520, //For animation layer 
	intervalId: null,//Id used to break the autoscroll
	intervalTime:6000, //Used for autoscrolling
	bgMovement:200, //Pixels
	keyController: false, //for key press '<' or '>' - stop autoscroll
	rollController: false, //on link roll over - stop autoscroll
	
	autoScroll: function(){
		if(paralax.rollController == false){
		var href = $(".arrow-next").attr('href');
		window.location = href;
		}
	},
	setAutoScroll: function(){
		paralax.intervalId = setInterval(paralax.autoScroll, paralax.intervalTime);
	},
	removeAutoScroll: function(){
		clearInterval(paralax.intervalId);
	},
	addRollover: function(){
		$(".our-work").mouseenter(function() {$(this).addClass('hover');
		paralax.rollController = true;	
		})
		 .mouseleave(function() {$(this).removeClass('hover');
		paralax.rollController = false;
		 });
	},
	addHref: function(){
		$('.our-work').each(function(){ 
			$(this).click(function(){		
			window.location = $("a", this).attr('href');
			});
		});
	},
	controlArrows: function(id){
		var listLength = $('#projects-list>li').length;
		if(id==1){
			paralax.doCircular(id);
			$(".arrow-prev").attr('href', "javascript:paralax.showPrev(6)");
		}
		else{	
			paralax.doCircular(id);
			$(".arrow-prev").attr('href', "javascript:paralax.showPrev(" + (id-1) + ")");
		}
		if(id==listLength){
			paralax.doCircular(id);
			$(".arrow-next").attr('href', "javascript:paralax.showNext(1)");
		}
		else{
			paralax.doCircular(id);
			$(".arrow-next").attr('href', "javascript:paralax.showNext(" + (id+1) + ")");	
		}
	},	
	animateItem: function(item, timeDuration, distance, direction){
		var itemTime = timeDuration-50;
		var element = item;
		var actualLeft= element.css('margin-left');
		var reverse_dist;	
		if(direction==null||direction==undefined||direction==''||direction=='fromLeft'){
			reverse_dist = '-' + distance + 'px';
		}
		if(direction=='fromRight'){
			reverse_dist = (1600+distance) + 'px';
		}

		//reset left property (out of the screen)
		element.css('margin-left',reverse_dist);

		//animate element
		element.animate({
			marginLeft:actualLeft},
			itemTime,
			function() {
				element.removeAttr("style");
		});
	},	
	doNext: function(id){
		$(".arrow-prev").attr('href', "javascript:void(0)");
		$(".arrow-next").attr('href', "javascript:void(0)");
		var _width = '1600px';	
		var nextBox = '#projects>.item-1';
		var actualBox = '#projects>.item-2';
		$(actualBox).animate({
			width: '-='+ _width},
			paralax.time+50,
			function() {
				 $(actualBox).removeAttr("style");    
		});	
		$(nextBox).css('background-position', paralax.bgMovement+'px 0px');
		$(nextBox).animate({
			backgroundPosition: '0px 0px',
		    width: '+='+_width},
		    paralax.time,
			function() {
		    	$('.element').removeAttr("style");
			    $(actualBox).removeClass('activeItem');
			    paralax.controlArrows(id);
		});	
	},
	doPrev: function(id){
		$(".arrow-prev").attr('href', "javascript:void(0)");
		$(".arrow-next").attr('href', "javascript:void(0)");
		var _width = '1600px';
		var nextBox = '#projects>.item-1';
		var prevBox = '#projects>.item-3';
		var actualBox = '#projects>.item-2';
		$(nextBox).hide();
		$(prevBox ).css('width','0');
        $(prevBox ).css('z-index','100');
		$(prevBox).css('background-position','-' + paralax.bgMovement + 'px 0px');
		$(prevBox).animate({
			backgroundPosition: '0px 0px',
			width: '+='+_width},
			paralax.time,
			function() {
			    $(actualBox).removeClass('activeItem');
			    paralax.controlArrows(id);
			    $('.element').removeAttr("style");
			    $(nextBox).show();
		});
	},
	doCircular: function(id,show){
		paralax.removeAutoScroll();
		paralax.setAutoScroll();
		var hide='';
		if(show==false){var hide = ' hide';}
		$('#projects>li').remove();
		var listLength = $('#projects-list>li').length;
		paralax.actualDot(id);
		switch(id){
			case listLength:
				var item = $('#projects-list>.box-'+(id-1)).clone();
				item.addClass('item-3'+hide);
				item.appendTo('#projects');	
				var  item = $('#projects-list>.box-'+(id)).clone();
				item.addClass('item-2');
				item.addClass('activeItem');
				item.appendTo('#projects');	
				var item = $('#projects-list>.box-'+(1)).clone();
				item.addClass('item-1'+hide);
				item.appendTo('#projects');	
				break; 
			case 1:
				var item = $('#projects-list>.box-'+(listLength)).clone();
				item.addClass('item-3'+hide);
				item.appendTo('#projects');	
				var item = $('#projects-list>.box-'+(id)).clone();
				item.addClass('item-2');
				item.addClass('activeItem');
				item.appendTo('#projects');	
				var item = $('#projects-list>.box-'+(id+1)).clone();
				item.addClass('item-1'+hide);
				item.appendTo('#projects');	
				break; 
			default: 
				var item = $('#projects-list>.box-'+(id-1)).clone();
				item.addClass('item-3'+hide);
				item.appendTo('#projects');	
				var item = $('#projects-list>.box-'+(id)).clone();
				item.addClass('item-2');
				item.addClass('activeItem');
				item.appendTo('#projects');	
				var item = $('#projects-list>.box-'+(id+1)).clone();
				item.addClass('item-1'+hide);
				item.appendTo('#projects');	
			    break;		  
			}	
		paralax.addRollover();
		paralax.addHref();
	},
	showNext: function(id){
		paralax.doNext(id);
		switch(id){
		case 1:
			paralax.animateItem($('.adidas-our-work'),(paralax.time),0,'fromRight');
			paralax.animateItem($('.adidas-item'),(paralax.time),0,'fromRight');
			break;
		case 2:
			paralax.animateItem($('.las-vegas-our-work'),(paralax.time-100),0,'fromRight');
			paralax.animateItem($('.las-vegas-item'),(paralax.time-200),0,'fromRight');
			break;
		case 3:
			paralax.animateItem($('.budweiser-our-work'),(paralax.time-200),600,'fromRight');
			paralax.animateItem($('.budweiser-item'),(paralax.time),0,'fromRight');
			break;		
		case 4:
			paralax.animateItem($('.gucci-our-work'),(paralax.time),300,'fromRight');
			paralax.animateItem($('.gucci-item'),(paralax.time),0,'fromRight');
			break;	
		case 5:
			paralax.animateItem($('.rolex-our-work'),(paralax.time-300),200,'fromRight');
			paralax.animateItem($('.rolex-item'),(paralax.time-400),0,'fromRight');
			break;	
		case 6:
			paralax.animateItem($('.nissan-our-work'),(paralax.time),0,'fromRight');
			//paralax.animateItem($('.nissan-item'),(paralax.time),0,'fromRight');
			break;			
		default:
			break;
		}	
	},
	showPrev: function(id){
		paralax.doPrev(id);
		switch(id){
		case 1:
			paralax.animateItem($('.adidas-our-work'),(paralax.time-300),500);
			paralax.animateItem($('.adidas-item'),(paralax.time-200),500);
			break;
		case 2:
			paralax.animateItem($('.las-vegas-our-work'),(paralax.time-100),500);
			paralax.animateItem($('.las-vegas-item'),(paralax.time-200),500);
			break;
		case 3:
			paralax.animateItem($('.budweiser-our-work'),(paralax.time),600);
			paralax.animateItem($('.budweiser-item'),(paralax.time-200),400);
			break;
		case 4:
			paralax.animateItem($('.gucci-our-work'),(paralax.time-100),500);
			paralax.animateItem($('.gucci-item'),(paralax.time),500);
			break;				
		case 5:
			paralax.animateItem($('.rolex-our-work'),(paralax.time-200),500);
			paralax.animateItem($('.rolex-item'),(paralax.time-100),500);
			break;	
		case 6:
			paralax.animateItem($('.nissan-our-work'),(paralax.time-100),200);
			//paralax.animateItem($('.nissan-item'),(paralax.time),500);
			break;			
		default:
			break;
		}		
	},
	actualDot: function(id){
		$('#counter>#items>li').each(function(e){
			$(this).removeClass('active');	
			if(id==(e+1)){
				$(this).addClass('active');	
			}
		});			
	}
}

$(document).ready(function() {
	paralax.doCircular(1, false);
	$('.projects>.box').removeClass('hide');
	$('#career-opportunities').mouseenter(function() {$(this).addClass('hover')}) .mouseleave(function() {$(this).removeClass('hover')});
	$('#career-opportunities').click(function(){window.location = $("a", this).attr('href');})
	
	$(document).keyup(function(e) {
		if (e.keyCode == 39  && !paralax.keyController){
			paralax.rollController == false;
			paralax.keyController = true;
			var href = $(".arrow-next").attr('href');
			window.location = href;	
			setTimeout('paralax.keyController=false', paralax.time);
			return false;
		}		
		if(e.keyCode == 37 && !paralax.keyController){
			paralax.rollController == false;
			paralax.keyController = true;
			var href = $(".arrow-prev").attr('href');
			window.location = href;	
			setTimeout('paralax.keyController=false', paralax.time);
			return false;
		}			
	});
	moveBg();	
	window.onresize = function(event) {moveBg()}	
});

function detectWidth() {
	  var myWidth = 0, myHeight = 0;
	  if( typeof( window.innerWidth ) == 'number' ) {
	    //Non-IE
	    myWidth = window.innerWidth;
	    myHeight = window.innerHeight;
	  } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
	    //IE 6+ in 'standards compliant mode'
	    myWidth = document.documentElement.clientWidth + 21;
	    myHeight = document.documentElement.clientHeight + 21;
	  } 
	  document.documentElement.style.overflowX = 'hidden';
	 return myWidth;
	}

function moveBg(){
	document.documentElement.style.overflowX = 'hidden';
	var diffWidth = (1600-(detectWidth()))/2;
	if(diffWidth>0 && diffWidth<327){
		var actualWidthSt = '-' + diffWidth + 'px';
		var actualWidthSt_pos = (1600-diffWidth) + 'px';
		$('#the-hanger-work').css('left', actualWidthSt);
		$('#projects-container').css('width', actualWidthSt_pos);
	}
	if(diffWidth<=0){
		$('#the-hanger-work').css('left', '0px');
		$('#projects-container').css('width', '1600px');
	}
	if(diffWidth>=327){
		$('#the-hanger-work').css('left', '-327px');
		$('#projects-container').css('width', '1273px');
	}
	if(diffWidth>=325){
		document.documentElement.style.overflowX = 'visible';
	}
	return diffWidth;
}