$(document).ready(function(){

	// resize images, center vertically
	function resizeImages() {
		// resize div
		newDivHeight = ($(window).height())*0.9;
		if ($(window).width()>1000 && $(window).height()*0.9>725) {
			$('#product').height(newDivHeight);
			$('.product_item').height(newDivHeight);
			$('#product #button').css('top', (newDivHeight/2)-42+'px');
		} else {
			$('#product').height(725);
			$('.product_item').height(725);
			$('#product #button').css('top', '300px');
		}
		// resize images
 		$('img.product_image').imgscale({
			parent:'#product',
			scale:'fill',
			center: true
		});
	}
	$(window).resize(function() {
		resizeImages();
	});
	
	// show product when loaded
	$('#product').show();
	$('#product_loader').hide();
	resizeImages();
	
	// init vars
	$current = 1;
	$productAmount = $("#product > div").size();
	$max = $productAmount-2;
	
	// init position images
	$i=0;
	for (i=0;i<=$max;i++) {
		$('.product'+i+'').hide();
	}
	$('.product1').show();

	// init position button left
	$('#product .left').css('left', '-85px');
	
	// next photo on iphone & ipad
	function nextPhotoMobile() {
		if ($current != $max) {
			$('.product'+($current)+'').hide();
			$('.product'+($current+1)+'').show();
			$('.product'+($current+1)+'').css('left', '5%');
			$('.product'+($current+1)+'').animate({left:'0%'}, {duration:400, easing:"easeOutExpo", queue:false});
			$current ++;
		}
		if ($current == 2) {
			$('#product .left').animate({left:'0px'}, {duration:600, easing:"easeOutExpo", queue:false});
		}
		if ($current == $max) {
			$('#product .right').animate({right:'-85px'}, {duration:600, easing:"easeOutExpo", queue:false});
		}
	}
	
	// prev photo on iphone & ipad
	function prevPhotoMobile() {
		resizeImages();
		if ($current != 1) {
			$('.product'+($current)+'').hide();
			$('.product'+($current-1)+'').show();
			$('.product'+($current-1)+'').css('left', '-5%');
			$('.product'+($current-1)+'').animate({left:'0%'}, {duration:400, easing:"easeOutExpo", queue:false});
			$current --;
		}
		if ($current == 1) {
			$('#product .left').animate({left:'-85px'}, {duration:600, easing:"easeOutExpo", queue:false});
		}
		if ($current == $max-1) {
			$('#product .right').animate({right:'0px'}, {duration:600, easing:"easeOutExpo", queue:false});
		}
	}
	
	// next photo
	function nextPhoto() {
		if ($current != $max) {
			$('.product'+($current)+'').hide();
			$('.product'+($current+1)+'').show();
			$('.product'+($current+1)+'').css('left', '20%');
			$('.product'+($current+1)+'').animate({left:'0%'}, {duration:500, easing:"easeOutExpo", queue:false});
			resizeImages();
			$('.product'+($current+1)+' .product_description').css('margin-right', '-40px');
			$('.product'+($current+1)+' .product_description').css('margin-left', '40px');
			$('.product'+($current+1)+' .product_description').animate({'margin-right':'0px','margin-left':'0px'}, {duration:1300, easing:"easeOutExpo", queue:false});
			$current ++;
		}
		if ($current == 2) {
			$('#product .left').animate({left:'0px'}, {duration:600, easing:"easeOutExpo", queue:false});
		}
		if ($current == $max) {
			$('#product .right').animate({right:'-85px'}, {duration:600, easing:"easeOutExpo", queue:false});
		}
	}

	// previous photo
	function prevPhoto() {
		resizeImages();
		if ($current != 1) {
			$('.product'+($current)+'').hide();
			$('.product'+($current-1)+'').show();
			$('.product'+($current-1)+'').css('left', '-20%');
			$('.product'+($current-1)+'').animate({left:'0%'}, {duration:500, easing:"easeOutExpo", queue:false});
			resizeImages();
			$('.product'+($current-1)+' .product_description').css('margin-right', '40px');
			$('.product'+($current-1)+' .product_description').css('margin-left', '-40px');
			$('.product'+($current-1)+' .product_description').animate({'margin-right':'0px','margin-left':'0px'}, {duration:1300, easing:"easeOutExpo", queue:false});
			$current --;
		}
		if ($current == 1) {
			$('#product .left').animate({left:'-85px'}, {duration:600, easing:"easeOutExpo", queue:false});
		}
		if ($current == $max-1) {
			$('#product .right').animate({right:'0px'}, {duration:600, easing:"easeOutExpo", queue:false});
		}
	}
	
	jQuery.extend(jQuery.browser,{SafariMobile : navigator.userAgent.toLowerCase().match(/iP(hone|ad)/i) });
	$(function(){
		if($.browser.SafariMobile){ 
			
			// buttons
			$('.right').mouseup(function(){
				nextPhotoMobile();
			})
			$('.left').mouseup(function(){
				prevPhotoMobile();
			})
			
		} else { // if user is using a normal browser
			
			// buttons
			$('.right').mouseup(function(){
				nextPhoto();
			})
			$('.left').mouseup(function(){
				prevPhoto();
			})

			// parallax
	
			// init value + position function
			positionAmount = 300;	
			function definePositon(variation) {
		 		newPosition = (scrollPercentage*(positionAmount*variation))-(positionAmount*variation);
				return newPosition;
			}
			// if browser is taller than the page, do not apply parallax effect
			if( $(window).height() >= $(document).height() ) {
				$('.img1').css('backgroundPosition', '100% 30px');
				$('.img2').css('backgroundPosition', '100% 30px');
				$('.img3').css('backgroundPosition', '100% 30px');
				$('.img4').css('backgroundPosition', '100% 30px');
				$('.img5').css('backgroundPosition', '100% 30px');
				$('.img6').css('backgroundPosition', '100% 30px');
				$('.img7').css('backgroundPosition', '50% 20px');
				$('.img8').css('backgroundPosition', '63% 380px');
				$('.img9').css('backgroundPosition', '40% 250px');
			} else { // if not, then hide background images
				$('.img1').css('backgroundPosition', '-9999px -9999px');
				$('.img2').css('backgroundPosition', '-9999px -9999px');
				$('.img3').css('backgroundPosition', '-9999px -9999px');
				$('.img4').css('backgroundPosition', '-9999px -9999px');
				$('.img5').css('backgroundPosition', '-9999px -9999px');
				$('.img6').css('backgroundPosition', '-9999px -9999px');
				$('.img7').css('backgroundPosition', '-9999px -9999px');
				$('.img8').css('backgroundPosition', '-9999px -9999px');
				$('.img9').css('backgroundPosition', '-9999px -9999px');
			}
			// parallax effect
			$(window).scroll(function(){
				scrollPercentage = $(window).scrollTop() / ( $(document).height() - $(window).height() );
				$('.img1').css('backgroundPosition', ''+(definePositon(0.3)+100)+'% '+(definePositon(.9)+30)+'px');
				$('.img2').css('backgroundPosition', ''+(definePositon(0.38)+100)+'% '+(definePositon(2.1)+30)+'px');
				$('.img3').css('backgroundPosition', ''+(definePositon(0.4)+100)+'% '+(definePositon(1.4)+30)+'px');
				$('.img4').css('backgroundPosition', ''+(definePositon(0.32)+100)+'% '+(definePositon(1.6)+30)+'px');
				$('.img5').css('backgroundPosition', ''+(definePositon(0.44)+100)+'% '+(definePositon(1.1)+30)+'px');
				$('.img6').css('backgroundPosition', ''+(definePositon(0.47)+100)+'% '+(definePositon(1.8)+30)+'px');
				$('.img7').css('backgroundPosition', ''+(definePositon(0.2)+50)+'% '+(definePositon(1.1)+20)+'px');
				$('.img8').css('backgroundPosition', ''+(definePositon(0.28)+63)+'% '+(definePositon(1.8)+380)+'px');
				$('.img9').css('backgroundPosition', ''+(definePositon(0.15)+40)+'% '+(definePositon(1.8)+250)+'px');
				if (scrollPercentage == 1) {
					$('#like').animate({bottom: '0'});
				};
				if ($(window).scrollTop() < ($(document).height()-$(window).height()-50)) {
					$('#like').css('bottom', '-50px');
				}
			});

			// animated scroll on keypress 

			$(document).bind('keydown', function (e) {
				if (e.keyCode == '40') { 
			        $(window)._scrollable().stop();
			        $.scrollTo('+=200', 500, 'easeOutExpo');
			        return false;
			    }
			    if (e.keyCode == '38') { 
			        $(window)._scrollable().stop();
			        $.scrollTo('-=200', 500, 'easeOutExpo');
			        return false;
			    }
				if (e.keyCode == '39') {
					nextPhoto();
				}
				if (e.keyCode == '37') {
					prevPhoto();
				}
			});
		}
	});

	
});