loader = new Image();
loader.src = "assets/images/loader.gif";

$(document).ready(function() {
	$(".gshow .thumbs a").each(function() {
		$(this).click(function() {
			$(".gshow #gshocontainer img").attr("src", "");
			$(".gshow #gshocontainer").css("background", "url(" + loader.src + ") no-repeat center center");
			
			newImage = new Image();
			ahref = $(this).attr("href").split("&");
			
			imgsrc = $(this).attr("href");
			
			newImage.onload = function() {
				$(".gshow #gshocontainer img").attr("src", this.src);
				
				if (ahref.length < 2)
					$(".gshow #gshocontainer a").attr("href", "show_image.php?filename=gallery/" + imgsrc + "&option=zoom");
				else
					$(".gshow #gshocontainer a").attr("href", "show_image.php?filename=gallery/" + ahref[0] + "&option=zoom");
					
				$(".gshow #gshocontainer").css("background", "none");
			}
			
			newImage.src = "show_image.php?filename=gallery/" + imgsrc;
			
			$(".gshow #inner #title").html($(this).attr("title") + "| <span>" + $(this).attr("rel") + "</span>");
			return false;
		});
	});	
	
	backHeight = Math.round($(document).height()/2);
	backWidth = Math.round($(document).width()/2);

	$("body").prepend('<div style="display: none; position: absolute; top: 0; left: 0; background: white; height: 10px; width: 10px;" id="mTB_container"></div>');
	$("body #mTB_container").click(function() {
		hideTB();
	});
	imgHeight = 5;
	imgWidth = 5;
	leftPos = backWidth - imgWidth;
	topPos = backHeight - imgHeight;
	$("body #mTB_container").css({"marginLeft" : leftPos + "px", "marginTop" : topPos + "px"});
	
	$("body").prepend('<div id="imageLoader" style="position: absolute; top: 0; left: 0; display: none;"><img src="' + loader.src + '" border="0" /></div>');	
	
	imgHeight = Math.round(loader.height/2);
	imgWidth = Math.round(loader.width/2);	
	leftPos = backWidth - imgWidth;
	topPos = backHeight - imgHeight;	
	$("body #imageLoader").css({"marginLeft" : leftPos + "px", "marginTop" : topPos + "px"});
	$("body #imageLoader").click(function() {
		hideTB();
	});
	
	$("body").prepend('<div style="width:'+$(document).width()+'px; height:'+$(document).height()+'px; display: none; position: absolute; top: 0; left: 0" id="mTB_back"></div>');
	$("body #mTB_back").css( {"opacity" : 0.5, "background" : "#666666"});

	$("body #mTB_back").click(function() {
		hideTB();
	});
	
	
	$(".gshow #gshocontainer a").click(function() {
		showTB($(this));
		return false;
	});
});					

function hideTB() {
	$("body #mTB_container a").remove();
	$("body #mTB_container").hide();
	$("body #imageLoader").hide();
	$("body #mTB_back").hide();	
}

function showLoader() {
	$("body #imageLoader").show();
}

function showTB(a) {	
	newImage = new Image();
	$("body #mTB_back").show();	
	$("body #imageLoader").show();	
	
	
	newImage.onload = function() {
		$("body #imageLoader").hide();
		$("body #mTB_container").html("");
		
		$("body #mTB_container").html('<a href="#" style="display: none;"><img src="' + a.attr("href") + '" border="0" /></a>');		
		
		backHeight = Math.round($("body #mTB_back").height()/2);
		backWidth = Math.round($("body #mTB_back").width()/2);
		
		imgHeight = Math.round(newImage.height/2);
		imgWidth = Math.round(newImage.width/2);
		
		leftPos = backWidth - imgWidth;
		topPos = backHeight - imgHeight;		
		
		$("body #mTB_container").animate({"height": newImage.height + "px", "width" : newImage.width + "px", "marginLeft" : leftPos + "px", "marginTop" : topPos + "px"}, "fast", "linear", 
		function(){
			$(this).find("a").css("display","");
		}
		);

		$("body #mTB_container a").click(function() {
			hideTB();
			return false;
		});
	}	
	
	newImage.src = a.attr("href");
}
/* --------------------------------------------------------------------------- */