AddNamespace('NPR.onready');

NPR.onready.enlarge = function() {
	
	var zoomStatus = 0;
	
    var zoomHtml = '<div id="zoom_overlay"></div> \
				<div id="zoom" style="position:absolute; left:-5000px;"> \
                	<div id="zoom_content"></div> \
                  	<a href="javascript:;" title="Close" id="zoom_close"></a> \
				  	<a href="javascript:;" title="Close" class="closezoom">close</a> \
                </div>';
				
	$('body').append(zoomHtml);
	
	doImageEnlargement = function (e) {
		
		var yCoord = e.pageY - 150;
		
		// get the width of the image
		var content_div = $(this).parents('.bucketwrap').children('.enlarge_html');
		var measure_div = $(this).parents('.bucketwrap').children('.enlarge_measure');
		var imgWidth = $(measure_div).width();
		var imgHeight = $(measure_div).height();
		
		
		// constrain to max width of 650px or max height of 500px
		if (imgWidth > imgHeight) {
			if (imgWidth > 650) {imgWidth=650}
		} else {
			if (imgHeight > 650) {imgHeight=650}
			$(measure_div).children('img:first').css("height", imgHeight+"px");
			imgWidth = $(measure_div).width();
		}
		
		// put the enlargement HTML into #zoom_content and constrain width
		$('#zoom_content').html($(measure_div).html() + $(content_div).html()).css("width", imgWidth+"px");
		$('#zoom_content').children('img:first').css("width", imgWidth+"px");
		
		//console.log($("#zoom").height());
		//console.log($("#zoom").width());
		
		loadZoomBg();
		centerZoom(yCoord);
		
		NPR.metrics.pageEvent(NPR.metrics.constants.IMAGE_ENLARGEMENT);
		
	};

	$('a.enlargeicon, img.enlarge').click(doImageEnlargement);


	
	$('#zoom_overlay, #zoom').click(function () {
		disableZoom();
	});
	

	function loadZoomBg() {
		//loads popup only if it is disabled
		if(zoomStatus==0){
			$("#zoom_overlay").show();
			zoomStatus = 1;
		}
	}
	
	function disableZoom() {
		//disables popup only if it is enabled
		if(zoomStatus==1){
			$("#zoom_overlay").hide();
			$("#zoom").css({"left": -5000});
			zoomStatus = 0;
		}
	}
	
	//centering popup
	function centerZoom(yCoord) {
		
		//request data for centering
		var windowWidth = document.documentElement.clientWidth;
		var windowHeight = document.documentElement.clientHeight;
		var zoomHeight = $("#zoom").height();
		var zoomWidth = $("#zoom").width();
		
		
		var width       = window.innerWidth || (window.document.documentElement.clientWidth || window.document.body.clientWidth);
		var height      = window.innerHeight || (window.document.documentElement.clientHeight || window.document.body.clientHeight);
		var x           = window.pageXOffset || (window.document.documentElement.scrollLeft || window.document.body.scrollLeft);
		var y           = window.pageYOffset || (window.document.documentElement.scrollTop || window.document.body.scrollTop);
		var window_size = {'width':width, 'height':height, 'x':x, 'y':y}

		var width              = zoomWidth + 0;
		var height             = zoomHeight + 0;
		var d                  = window_size;
		
		// ensure that newTop is at least 0 so it doesn't hide close button
		var newTop             = Math.max((d.height/2) - (height/2) + y, 0);
		var newLeft            = (d.width/2) - (width/2);
		
		var fromTop = y + ((d.height/2) - (height/2));
		
		//centering
		$("#zoom").css({
		"position": "absolute",
		"top": fromTop,
		"left": newLeft
		});
		
		//only need force for IE6
		$("#zoom_overlay").css({
		"position": "absolute",
		"top": "0px",
		"height": $(document).height(),
		"left": "0px"
		});
	
	}
	
	
	
};