/*
PShelper.com
Single Product Zoom
Written and maintained by Derek Decker
Requires jQuery library
*************

Make the product detail image a lightbox style popup
	
*************

@parameters
	curtainOpacity : the opacity of the background curtain when a thumbnail is clicked
*/
$(document).ready(function(){
	var curtainOpacity = '50';

	if($('#imgMedium').length > 0)
	{				
		$('#imgMedium').hover(function(){$(this).css({'cursor':'pointer'});});
		
		//function handles the generation of a css lightwindow
		$('#imgMedium').click(function(){
			fullSizeImage = $('#imgMedium').attr('src');
			
			//create a new image wrapped in an absolute div inserted into the body
			//try zoom the image, and fade the curtain in
			$blackOutDiv = $(document.createElement("div"));
			$("body").append($blackOutDiv);
			blackOutDivCSS = {'position':'absolute','top':'0','left':'0','width':'100%','height':'100%','opacity':'0.'+curtainOpacity,'filter':'alpha(opacity='+curtainOpacity+')','background-color':'#000000','z-index':200};
			$blackOutDiv.attr({'id':'blackCurtain'});
			
			$lightImageDiv = $(document.createElement("div"));
			lightImageDivCSS = {'position':'absolute','top':'20%','left':'0','width':'100%','text-align':'center','z-index':205,'vertical-align':'middle'};
			$lightImageDiv.attr({'id':'fullImageView'});
			$lightImageDiv.css(lightImageDivCSS);
			
			$lightImage = $(document.createElement("img"));
			lightImageCSS = {'z-index':210,'margin':'0 auto','cursor':'pointer','border-right':'4px solid #3d3d3d','border-bottom':'4px solid #3d3d3d'};
			$lightImage.css(lightImageCSS);
			$lightImage.attr({'src':fullSizeImage});
			$lightImage.click(function(){
				$('#blackCurtain').remove();
				$('#fullImageView').remove();
			});
			
			$blackOutDiv.hide().css(blackOutDivCSS).fadeIn("def",function(){
				$("body").append($lightImageDiv);
				$lightImageDiv.append($lightImage).hide().fadeIn();
			});
		});			
	}	
});