// large image container id
var imageDivId = "largeImageContainer";
var thumbnailHighlightClass = "highlight";
var thumbnailClass = "thumb";

// catch clicking on thumbnails
$(document).ready(function(){
	$(".thumb").click(function(){
		$("#debug").empty();
		// get the image src
		imageSrc = $(this).children("a").children("img").attr("rel");
		imageAlt = $(this).children("a").children("img").attr("alt");
		// fade the image out
		$("#"+imageDivId).children("p").css({display:"none"});
		$("#"+imageDivId).children("div").children("img").fadeOut("normal", function(){
			// set the desc.
			$("#"+imageDivId).children("p").empty();
			$("#"+imageDivId).children("p").append(imageAlt);
			// show the loading animation
			$("#loading").css({display: "block"});
				// set the src
				$("#"+imageDivId).children("div").children("img").attr("src",imageSrc);
				// once it"s loaded fade it back in
				$("#"+imageDivId).children("div").children("img").load(function(){
					// fade the show animation out
					$("#loading").css({display: "none"});
					$("#"+imageDivId).children("div").children("img").css({display: "block"});
					$("#"+imageDivId).children("p").css({display:"block"});
				})
		})
				
		return false;
	})
})