jQuery(document).ready(function(){

	var oWidth = jQuery("#background").width();
	var oHeight = jQuery("#background").height();
	var wWidth = jQuery(window).width();
	var wHeight = jQuery(window).height();
	var pOrientation = (oWidth / oHeight);
	var wOrientation = (wWidth / wHeight);
	
	if(pOrientation > 1 && wOrientation < 1) {
		var scaleFactor = (wWidth / oWidth);
		var nWidth = wWidth;
		var nHeight = scaleFactor * oHeight;
		var zoomDiff = Math.round(Math.log(scaleFactor) / Math.log(0.9));
		if(zoomDiff != 0) {
			jQuery(".zoom").eq(jQuery(".zoom").index(jQuery("#activeZoom")) - zoomDiff).attr("id", "newActiveZoom");
			jQuery("#activeZoom").removeAttr("id");
			jQuery("#newActiveZoom").attr("id", "activeZoom");
			jQuery("#background").animate({"width": nWidth + "px", "height": nHeight + "px", "margin-top":  (-1 * nHeight / 2) + "px", "margin-left":  (-1 * nWidth / 2) + "px"}, 200);
			jQuery(".zoom:not(#activeZoom)").css("opacity","0.5");
			jQuery("#activeZoom").css("opacity","1");
		}
		//console.info("scaleFactor: " + scaleFactor);
		//console.info("zoomDiff: " + zoomDiff);
	}
	else {
		var scaleFactor = wHeight / oHeight;
		var nHeight = wHeight;
		var nWidth = scaleFactor * oWidth;
		var zoomDiff = Math.round(Math.log(scaleFactor) / Math.log(0.9));
		if(zoomDiff != 0) {
			jQuery(".zoom").eq(jQuery(".zoom").index(jQuery("#activeZoom")) - zoomDiff).attr("id", "newActiveZoom");
			jQuery("#activeZoom").removeAttr("id");
			jQuery("#newActiveZoom").attr("id", "activeZoom");
			jQuery("#background").animate({"width": nWidth + "px", "height": nHeight + "px", "margin-top":  (-1 * nHeight / 2) + "px", "margin-left":  (-1 * nWidth / 2) + "px"}, 200);
			jQuery(".zoom:not(#activeZoom)").css("opacity","0.5");
			jQuery("#activeZoom").css("opacity","1");
		}
		//console.info("scaleFactor: " + scaleFactor);
		//console.info("zoomDiff: " + zoomDiff);
	}
	
	jQuery(".zoom:not(#activeZoom)").css("opacity","0.5");
	
	jQuery("#background").dblclick(function() {
		var div = jQuery("#background");
		var oWidth = div.width();
		var oHeight = div.height();
		var nWidth = oWidth / 0.9;
		var nHeight = oHeight / 0.9;
		if (jQuery(".zoom:last").attr("id") != "activeZoom") {
			jQuery(".zoom").eq(jQuery(".zoom").index(jQuery("#activeZoom"))+1).attr("id", "newActiveZoom");
			jQuery("#activeZoom").removeAttr("id");
			jQuery("#newActiveZoom").attr("id", "activeZoom");
			jQuery("#background").animate({"width": nWidth + "px", "height": nHeight + "px", "margin-top":  (-1 * nHeight / 2) + "px", "margin-left":  (-1 * nWidth / 2) + "px"}, 1000);
			jQuery(".zoom:not(#activeZoom)").css("opacity","0.5");
			jQuery("#activeZoom").css("opacity","1");
		}
	});
	
	jQuery("#zoomOut").click(function(){
		var div = jQuery("#background");
		var oWidth = div.width();
		var oHeight = div.height();
		var nWidth = oWidth * 0.9;
		var nHeight = oHeight * 0.9;
		if (jQuery(".zoom:first").attr("id") != "activeZoom") {
			jQuery(".zoom").eq(jQuery(".zoom").index(jQuery("#activeZoom"))-1).attr("id", "newActiveZoom");
			jQuery("#activeZoom").removeAttr("id");
			jQuery("#newActiveZoom").attr("id", "activeZoom");
			jQuery("#background").animate({"width": nWidth + "px", "margin-left":  (-1 * nWidth / 2) + "px", "height": nHeight + "px", "margin-top":  (-1 * nHeight / 2) + "px"}, 200);
			jQuery(".zoom:not(#activeZoom)").css("opacity","0.5");
			jQuery("#activeZoom").css("opacity","1");
		}
	});
	
	jQuery("#zoomIn").click(function(){
		var div = jQuery("#background");
		var oWidth = div.width();
		var oHeight = div.height();
		var nWidth = oWidth / 0.9;
		var nHeight = oHeight / 0.9;
		if (jQuery(".zoom:last").attr("id") != "activeZoom") {
			jQuery(".zoom").eq(jQuery(".zoom").index(jQuery("#activeZoom"))+1).attr("id", "newActiveZoom");
			jQuery("#activeZoom").removeAttr("id");
			jQuery("#newActiveZoom").attr("id", "activeZoom");
			jQuery("#background").animate({"width": nWidth + "px", "height": nHeight + "px", "margin-top":  (-1 * nHeight / 2) + "px", "margin-left":  (-1 * nWidth / 2) + "px"}, 200);
			jQuery(".zoom:not(#activeZoom)").css("opacity","0.5");
			jQuery("#activeZoom").css("opacity","1");
		}
	});
	
	jQuery(".zoom").click(function(e){
		var div = jQuery("#background");
		var oWidth = div.width();
		var oHeight = div.height();
		var diff = jQuery(".zoom").index(jQuery("#activeZoom"))-jQuery(".zoom").index(jQuery(e.target));
		var factor = Math.pow(0.9, diff);
		var ms = 100 * diff * (diff < 0 ? -1 : 1);
		if (diff != 0) {
			jQuery(".zoom").eq(jQuery(".zoom").index(jQuery(e.target))).attr("id", "newActiveZoom");
			jQuery("#activeZoom").removeAttr("id");
			jQuery("#newActiveZoom").attr("id", "activeZoom");
			jQuery("#background").animate({"width": oWidth * factor + "px", "height":  oHeight * factor + "px", "margin-top":  -1 * oHeight * factor / 2 + "px", "margin-left":  -1 * oWidth * factor / 2 + "px"}, ms);
			jQuery(".zoom:not(#activeZoom)").css("opacity","0.5");
			jQuery("#activeZoom").css("opacity","1");
		}
	});
	
	jQuery(".zoom").mouseenter(function(e){
		jQuery(this).css("background-color", "#e3007a");
		jQuery(this).css("opacity","1");
	});
	
	jQuery(".zoom").mouseleave(function(e){
		jQuery(this).css("background-color", "#000000");
		jQuery(".zoom:not(#activeZoom)").css("opacity","0.5");
		jQuery("#activeZoom").css("opacity","1");
	});

	
	jQuery("#closeCtrl").click(function(){
		if (jQuery("#content").width() != 230) {
			jQuery("#silouette").fadeOut();
			jQuery("#content").animate({"width": 289}, function(){jQuery("#closeImg").fadeOut();jQuery("#openImg").fadeIn();jQuery("#logo").fadeOut();jQuery("#content").animate({"height": 30},function(){ jQuery("#content").animate({"width": 230})})}); 
		}
		else {
			 jQuery("#content").animate({"width": 289}, function(){
			 	
			 	jQuery("#logo").fadeIn();
				jQuery("#openImg").fadeOut();
				jQuery("#closeImg").fadeIn();
				if (jQuery("#textContainer").css("display") != "none"){
			 		jQuery("#silouette").fadeIn();
			 	}
				jQuery("#content").animate({"height": 113}, function(){jQuery("#content").animate({"width": "100%"})});
			 });
		}
	});

	var btnExt = ".png";
	
	jQuery("#controls div img").mouseenter(function(){
		var imgString = jQuery(this).attr("src").split(btnExt);
		jQuery(this).attr("src", imgString[0] + "-over" + btnExt);
	});

	jQuery("#controls div img").mouseleave(function(){
		var imgString = jQuery(this).attr("src").split("-over" + btnExt);
		jQuery(this).attr("src", imgString[0] + btnExt);
	});
	
	/*
	jQuery("#controls div").mouseenter(function(){
		jQuery(this).css("background-color", "#e3007a");
	});
	
	jQuery("#controls div").mouseleave(function(){
		jQuery(this).css("background-color", "#000000");
	});
	*/
	
	jQuery("#logo").mouseenter(function(){
		jQuery(this).css("background-color", "#e3007a");
	});
	
	jQuery("#logo").mouseleave(function(){
		jQuery(this).css("background-color", "#000000");
	});
	
	jQuery("#logo").click(function(){
		if (jQuery("#textContainer").css("display") == "none") {
			jQuery("#silouette").fadeIn(500);
			jQuery("#textContainer").fadeIn(500);
			jQuery("#galleryContainer").fadeOut(500);
			jQuery("#scrollLeft").unbind("click").unbind("mouseenter");
			jQuery("#scrollRight").unbind("click").unbind("mouseenter");
		}
		else {
			jQuery("#silouette").fadeOut(500);
			jQuery("#galleryContainer").fadeIn(500);
			jQuery("#textContainer").fadeOut(500);
			jQuery("#scrollLeft").click(function(){
				var thisImage = jQuery("#first");
				var nextImage = jQuery(".imgs").eq(jQuery(".imgs").index(jQuery("#first"))+1);
				if (nextImage.width()){
					var nextFirstImage = jQuery(".imgs").eq(jQuery(".imgs").index(nextImage)+1);
					if (nextFirstImage.width()){
						marginLeft = (thisImage.width()+nextImage.width()+2);
						thisImage.removeAttr("id");
						nextFirstImage.attr("id", "first");
						jQuery("#galleryContainer").animate({"left": jQuery("#galleryContainer").position().left-marginLeft});
					}
				}
			}).mouseenter(function(){
				jQuery(this).css("background-color", "#e3007a");
			});
			jQuery("#scrollRight").click(function(){
				var thisImage = jQuery("#first");
				var nextImage = jQuery(".imgs").eq(jQuery(".imgs").index(jQuery("#first"))-1);
				if (nextImage.width()){
					var nextFirstImage = jQuery(".imgs").eq(jQuery(".imgs").index(nextImage)-1);
					if (nextFirstImage.width()){
						marginLeft = (thisImage.width()+nextImage.width()+2);
						thisImage.removeAttr("id");
						nextFirstImage.attr("id", "first");
						jQuery("#galleryContainer").animate({"left": jQuery("#galleryContainer").position().left+marginLeft});
					}
				}
			}).mouseenter(function(){
				jQuery(this).css("background-color", "#e3007a");
			});
		}
	});
	
	jQuery("#scrollLeft").click(function(){
		if(jQuery("#galleryContainer:animated").size() == 0){
			var thisImage = jQuery("#first");
			var index = jQuery(".imgs").index(jQuery("#first"));
			var nextImage = jQuery(".imgs").eq(index + 1);
			if (nextImage.width()){
				marginLeft = thisImage.width() + 2;
				thisImage.removeAttr("id");
				nextImage.attr("id", "first");
				jQuery("#galleryContainer").animate({"left": jQuery("#galleryContainer").position().left - marginLeft});
			}
		}
	});
	
	jQuery("#scrollRight").click(function(){
		if(jQuery("#galleryContainer:animated").size() == 0){
			var thisImage = jQuery("#first");
			var index = jQuery(".imgs").index(jQuery("#first"));
			var nextImage = jQuery(".imgs").eq(index - 1);
			if (nextImage.width() && index > 0){
				marginLeft = nextImage.width() + 2;
				thisImage.removeAttr("id");
				nextImage.attr("id", "first");
				jQuery("#galleryContainer").animate({"left": jQuery("#galleryContainer").position().left + marginLeft});
			}
		}
	});

	
	/**
	 * MOVE UP functionality
	 */
	jQuery("#moveUp").mouseenter(function(){
		if (jQuery(window).height() < jQuery("#background").height()){
			jQuery("#moveUpImg").css("display", "block");
		}
	}).mouseleave(function(){
		jQuery("#moveUpImg").css("display", "none");
	});
	
	jQuery("#moveUp").click(function(){
		if (jQuery(window).height() < jQuery("#background").height()){
			jQuery("#background").animate({marginTop : jQuery(window).height()/-2},{duration: 2000, easing: "swing"});
		}
	}).mouseleave(function(){
		jQuery("#background").stop();
	});

	jQuery("#moveUpImg").mouseenter(function(){
		var imgString = jQuery(this).attr("src").split(btnExt);
		jQuery(this).attr("src", imgString[0] + "-over" + btnExt);
	})

	jQuery("#moveUpImg").mouseleave(function(){
		var imgString = jQuery(this).attr("src").split("-over" + btnExt);
		jQuery(this).attr("src", imgString[0] + btnExt);
	})

	
	/**
	 * MOVE DOWN functionality
	 */
	jQuery("#moveDown").mouseenter(function(){
		if (jQuery(window).height() < jQuery("#background").height()){
			jQuery("#moveDownImg").css("display", "block");
		}
	}).mouseleave(function(){
		jQuery("#moveDownImg").css("display", "none");
	});

	jQuery("#moveDown").click(function(){
		if (jQuery(window).height() < jQuery("#background").height()){
			jQuery("#background").animate({marginTop : jQuery(window).height()/2-jQuery("#background").height()},{duration: 2000, easing: "swing"});
		}
	}).mouseleave(function(){
		jQuery("#background").stop();
	});

	jQuery("#moveDownImg").mouseenter(function(){
		var imgString = jQuery(this).attr("src").split(btnExt);
		jQuery(this).attr("src", imgString[0] + "-over" + btnExt);
	})

	jQuery("#moveDownImg").mouseleave(function(){
		var imgString = jQuery(this).attr("src").split("-over" + btnExt);
		jQuery(this).attr("src", imgString[0] + btnExt);
	})

	
	/**
	 * MOVE LEFT functionality
	 */
	jQuery("#moveLeft").mouseenter(function(){
		if (jQuery(window).width() < jQuery("#background").width()){
			jQuery("#moveLeftImg").css("display", "block");
		}
	}).mouseleave(function(){
		jQuery("#moveLeftImg").css("display", "none");
	});

	jQuery("#moveLeft").click(function(){
		if (jQuery(window).width() < jQuery("#background").width()){
			jQuery("#background").animate({marginLeft : jQuery(window).width()/-2},{duration: 2000, easing: "swing"});
		}
	}).mouseleave(function(){
		jQuery("#background").stop();
	});

	jQuery("#moveLeftImg").mouseenter(function(){
		var imgString = jQuery(this).attr("src").split(btnExt);
		jQuery(this).attr("src", imgString[0] + "-over" + btnExt);
	})

	jQuery("#moveLeftImg").mouseleave(function(){
		var imgString = jQuery(this).attr("src").split("-over" + btnExt);
		jQuery(this).attr("src", imgString[0] + btnExt);
	})

	
	/**
	 * MOVE RIGHT functionality
	 */
	jQuery("#moveRight").mouseenter(function(){
		if (jQuery(window).width() < jQuery("#background").width()){
			jQuery("#moveRightImg").css("display", "block");
		}
	}).mouseleave(function(){
		jQuery("#moveRightImg").css("display", "none");
	});

	jQuery("#moveRight").click(function(){
		if (jQuery(window).width() < jQuery("#background").width()){
			jQuery("#background").animate({marginLeft : jQuery(window).width()/2-jQuery("#background").width()},{duration: 2000, easing: "swing"});
		}
	}).mouseleave(function(){
		jQuery("#background").stop();
	});

	jQuery("#moveRightImg").mouseenter(function(){
		var imgString = jQuery(this).attr("src").split(btnExt);
		jQuery(this).attr("src", imgString[0] + "-over" + btnExt);
	})

	jQuery("#moveRightImg").mouseleave(function(){
		var imgString = jQuery(this).attr("src").split("-over" + btnExt);
		jQuery(this).attr("src", imgString[0] + btnExt);
	})
	
	jQuery("#openInteractiveImg").mouseenter(function(){
		var imgString = jQuery(this).attr("src").split(btnExt);
		jQuery(this).attr("src", imgString[0] + "-over" + btnExt);
	})
	
	jQuery("#openInteractiveImg").mouseleave(function(){
		var imgString = jQuery(this).attr("src").split("-over" + btnExt);
		jQuery(this).attr("src", imgString[0] + btnExt);
	})
	
	jQuery(".imgs").mouseenter(function(e) {
		jQuery(this).css("opacity", 0.9);
	});
	
	jQuery(".imgs").mouseleave(function(e) {
		jQuery(this).css("opacity", 1);
	});

});

/**
 * Change Image
 * 
 * @param src Source of the new image
 * @param width Width of the new image
 * @param height Height of the new image
 * @return
 */
function changeImg(src, width, height) {
		if (jQuery("#background img").attr("src") == src)
			return;
		var diff = 10-jQuery(".zoom").index(jQuery("#activeZoom"));
		
		jQuery("#background").fadeOut(500, function(){
			var image = new Image();
			image.onload = function() {
				jQuery("#background img").attr("src", src);
			    jQuery("#background").css({"width": (width/2)*Math.pow(0.9, diff)+"px", "height":  (height/2)*Math.pow(0.9, diff)+"px", "margin-top":  -1*(height/2)*Math.pow(0.9, diff)/2+"px", "margin-left":  -1*(width/2)*Math.pow(0.9, diff)/2+"px"});
				jQuery("#background").fadeIn(500);       
				jQuery("#loading").hide();
			};
			jQuery("#loading").show();
			image.src = src;
		});
}