$(function ()
{
	var imgHeight = 700;
	var zoomCSS = {
		"display" : "none",
		"position" : "absolute",
		"top" : "0",
		"right" : "0",
		"width" : "48px",
		"height" : "48px",
		"background" : "url(_img/_layout/zoom.gif)"
	}
	var overlayCSS = {
		"display" : "none",
		"position" : "fixed",
		"z-index" : "1000",
		"top" : "0",
		"left" : "0",
		"width" : "100%",
		"height": "100%",
		"background-color" : "#000",
		"filter" : "alpha(opacity=85)",
		"-moz-opacity" : "0.85",
		"-khtml-opacity": "0.85",
		"opacity" : "0.85"
	}
	var fullsizeCSS = {
		"display" : "none",
		"position" : "absolute",
		"z-index" : "2000",
		"left" : "0",
		"width" : "100%",
		"height" : imgHeight + "px"
	}
	var imgCSS = {
		"display" : "block",
		"margin" : "0 auto",
		"height" : imgHeight + "px"
	}
	$(".painting, .print, .paper").css("position", "relative");
	$(".painting, .print, .paper").append("<span></span>");
	$(".painting>span, .print>span, .paper>span").css(zoomCSS);			
	var overlay = $("<div id='overlay'></div>");
	overlay.appendTo(document.body);	
	$("#overlay").css(overlayCSS);	
	$("#overlay").css("height", $(document).height());
	var fullsize = $("<div id='fullsize'></div>");
	fullsize.appendTo(document.body);	
	$("#fullsize").css(fullsizeCSS);
	$(".painting, .print, .paper").click(
		function ()
		{
			var img = $(this).children("img").attr("src");
			img = img.split("/");
			var newImg = "";
			for (i = 0; i < img.length; i++)
			{
				if (i == 2)
				{
					newImg += "_lg/";
				}			
				newImg += img[i];
				if (i < img.length - 1)
				{
					newImg += "/";
				}
			}
			img = newImg;
			$("#overlay").fadeIn();
			$("<img id='#fullimg' src='" + img + "' />").appendTo("#fullsize");			
			$("#fullsize").css("top", ($(window).height() - imgHeight)/2);
			$("#fullsize>img").css(imgCSS);
			$("#fullsize").fadeIn();
			$("#fullsize, #overlay").click(
				function ()
				{
					$("#fullsize").fadeOut();
					$("#overlay").fadeOut();
					$("#fullsize>img").remove();
				}
			);
		}
	);
});

$(window).bind("resize", function ()
{  
	$("#overlay").css("height", $(window).height());  
});

$(window).load(function ()
{
	$(".painting, .print, .paper").each(
		function ()
		{
			var img = $(this).children("img")[0];
			var zoom = $(this).children("span");
			zoom.css("left", img.width-48 + "px");
			$(this).css("width", img.width);
			$(this).css("cursor", "pointer");
			$(this).hover(
				function ()
				{
					zoom.fadeIn();
				},
				function ()
				{
					zoom.fadeOut();
				}
			);
		}
	);
});

$(document).keyup(function (e)
{
	if (e.keyCode == 27)
	{
		$("#fullsize").fadeOut();
		$("#overlay").fadeOut();
		$("#fullsize>img").remove();
	}
});