$j(document).ready(function() {
	
	$j("a.thumbnail").bind("click", function(){
		doAjaxImgReplace(this);
		return false;
	});
	
});


function doAjaxImgReplace(control){

	ShowBlockLoader($j("div#DetailContainer div.image-container"));

	// get the key
	key = stripValue($j(control).attr("class"), "key-", " ");
	
	ajaxAide.invokeDotNetMethod(
		"App_Code",
		"WebsiteUtility",
		"RenderImg",
		"height=332&width=498&uploadId="+ key +"&outputDirectoryUrl=~/_client_cache/images/carousel/",
		function(response){
			$j("div#DetailContainer div.image-container").html(response.value);
			$j("div#DetailContainer div.image-container img").hide();
			
			// check if this plot has a property available so we can prepend the image sash to the image container
			if($j("body.offer-available").size() > 0){
				$j("div#DetailContainer div.image-container").prepend("<div class='offer-sash'><img alt='Offers Available' src='/_client/images/components/offers/main_image_sash.png'/></div>");
				$j('img[@src$=.png]').pngfix();
			}
			
			$j("div#DetailContainer div.image-container img").fadeIn("fast");
			HideBlockLoader($j("div#DetailContainer div.image-container"));
			
		}
	);	
	
}