$(document).ready(function(){

//	var something = 'getCreme';
	
	var ids = ['previous', 'next', 'seeWhat', 'getCreme'];
	
	var animDuration = 400;
	
	var currentScreen = 0;
	var numScreens = 8;
	
	var preLoader = new Image();
	
	for (var i = 0; i < ids.length; i++) {
	
	
		preLoader.src = "i/" + ids[i] + ".png";
		preLoader.src = "i/" + ids[i] + "Hover.png";
		preLoader.src = "i/" + ids[i] + "Active.png";
	
		$("." + ids[i] + "Link").hover(
			(function(i){
                return function() {
                
                	if (!($("." + ids[i] + "Btn").hasClass("btnInactive"))) {
						$("." + ids[i] + "Btn").attr("src", "i/" + ids[i] + "Hover.png");
                	}
                
                }
            })(i)	
		, (function(i){
                return function() {
					$("." + ids[i] + "Btn").attr("src", "i/" + ids[i] + ".png");
                }
            })(i)
        ).mouseleave(
        	(function(i){
            	return function() {
					$("." + ids[i] + "Btn").attr("src", "i/" + ids[i] + ".png");
                }
            })(i)
        ).mousedown(
        	(function(i){
            	return function() {
	            	if (!($("." + ids[i] + "Btn").hasClass("btnInactive"))) {
						$("." + ids[i] + "Btn").attr("src", "i/" + ids[i] + "Active.png");
					}
                }
            })(i)
		).mouseup(
        	(function(i){
            	return function() {
					$("." + ids[i] + "Btn").attr("src", "i/" + ids[i] + ".png");
                }
            })(i)
		).click(
        	(function(i){
            	return function() {
					if (ids[i] != 'getCreme') {
						return false;
					}
                }
            })(i)		
		);
	}
	
	var megaScreen = new Image();
	$(megaScreen).addClass("megaScreen");
	megaScreen.src = "i/screens/megaScreen.png";
	$(megaScreen)
		.css("position", "absolute")
		.css("left", "320px");
	$(".screenPlaceHolder").append(megaScreen);
	
	


	$(".seeWhatLink").mousedown(function() {

		$(".seeWhatLink").hide();
		$(".previousNext").css("display", "inline").hide().fadeIn(animDuration);
		
		
		$(".megaScreen").animate({
			left: "0px"
		}, animDuration);
		
		$(".previousBtn").addClass("btnInactive");
				
	});
	
	function nextScreen() {
		if (!($(".nextBtn").hasClass("btnInactive"))) {
			if (currentScreen < numScreens - 1) {
				currentScreen += 1;
				$(".megaScreen").animate({
					left: "-=320px"
				}, animDuration);
				
				if (currentScreen == numScreens - 1) {
					$(".nextBtn").addClass("btnInactive");
				}
				if (currentScreen > 0) {
					$(".previousBtn").removeClass("btnInactive");
				}	
			}	
		}	    
	};
	
	$(".nextLink").bind('mousedown', nextScreen);	
	
	$(".screenPlaceHolder").bind('mousedown', function() {
	    if ($('.seeWhatLink').css('display') != 'none') {
	        $(".seeWhatLink").mousedown();
	    } else {
	        nextScreen();
	    }
	});

	$(".previousLink").mousedown(function() {
	
		if (!($(".previousBtn").hasClass("btnInactive"))) {
			if (currentScreen > 0) {
				currentScreen -= 1;
				$(".megaScreen").animate({
					left: "+=320px"
				}, animDuration);
				
				if (currentScreen == 0) {
					$(".previousBtn").addClass("btnInactive");
				}
				if (currentScreen < numScreens - 1) {
					$(".nextBtn").removeClass("btnInactive");
				}
				
			}
			
		}
	});



});
