/*
 * MojoZoom 0.1.4 - JavaScript Image Zoom
 * Copyright (c) 2008 Jacob Seidelin, jseidelin@nihilogic.dk, http://blog.nihilogic.dk/
 * Licensed under the MPL License [http://www.nihilogic.dk/licenses/mpl-license.txt]
 */
var MojoZoom = (function() {

	var dc = function(tag) {return document.createElement(tag);};

    //show scrolling zoom-images with this size
	var defaultWidth = 300; 
	var defaultHeight = 200; 
    //show images smaller than minZoomWidth or Height without scrolling
    var minZoomWidth = 360;
    var minZoomHeight = 240;
 
	function makeZoomable(img, zoomSrc, zoomImgCtr, zoomWidth, zoomHeight, alwaysShow) {
		// make sure the image is loaded, if not then add an onload event and return
		if (!img.complete && !img.__mojoZoomQueued) {
			$(img).load(function() {
				img.__mojoZoomQueued = true;
				setTimeout(function() {
				makeZoomable(img, zoomSrc, zoomImgCtr, zoomWidth, zoomHeight, alwaysShow);
				}, 1);
			});
			return;
		}
		img.__mojoZoomQueued = false;

		// Wrap everything in a timeout.
		// this fixes a problem where, if makeZoomable is called a second time after changing the src,
		// FF would not have figured out the new offsetHeight of the image yet. A small timeout helps though it's rather hackish.
		setTimeout(function(){

		var w = img.offsetWidth;
		var h = img.offsetHeight;

		var oldParent = img.parentNode;
		if (oldParent.nodeName != "A") {
			var linkParent = dc("div");
			oldParent.replaceChild(linkParent, img);
			linkParent.appendChild(img);
		} else {
			var linkParent = oldParent;
		}

		linkParent.style.position = "relative";
		//fix for IE6 - free the space of hidden images
		if ($(img).css('visibility')=='hidden') {
			$(linkParent).css({display:"none"});
		} else {
			$(linkParent).css({display:"block"});
		}
		linkParent.style.width = w+"px";
		linkParent.style.height = h+"px";

		var imgLeft = img.offsetLeft;
		var imgTop = img.offsetTop;

		var zoom = dc("div");
		zoom.className = "mojozoom_marker";

		var zoomImg = dc("img");
		zoomImg.className = "mojozoom_img";

		zoomImg.style.position = "absolute";
		zoomImg.style.left = "-9999px";
		zoomImg.style.top = "-9999px";
		document.body.appendChild(zoomImg);

		var parent = img.parentNode;

		var ctr = dc("div");
		with (ctr.style) {
			position = "absolute";
			left = imgLeft+"px";
			top = imgTop+"px";
			width = w+"px";
			height = h+"px";
			overflow = "hidden";
			display = "none";
		}

		ctr.appendChild(zoom);
		parent.appendChild(ctr);

		var zoomInput = parent;

		// clear old overlay
		if (img.__mojoZoomOverlay)
			parent.removeChild(img.__mojoZoomOverlay);
		img.__mojoZoomOverlay = ctr;

		// clear old high-res image
		if (img.__mojoZoomImage && img.__mojoZoomImage.parentNode)
			img.__mojoZoomImage.parentNode.removeChild(img.__mojoZoomImage);
		img.__mojoZoomImage = zoomImg;

		var useDefaultCtr = false;

        //limit position of zoom-image to visible area

		visArea = new Object;
		visArea.x = $(document).scrollLeft();
		visArea.y = $(document).scrollTop();
		visArea.w = $(document).width();
		visArea.h = $(document).height();
		
        imgPos = new Object;
		imgPos.x = $(img).offset().left;
		imgPos.y = $(img).offset().top;
        if ((imgPos.x+w/2) > (visArea.x+visArea.w/2)) {
            var posOffset_x = -(zoomWidth ? zoomWidth : defaultWidth) - w - 40;
        } else {
            var posOffset_x = 0;
        }
        if (((imgPos.y+h/2)-(zoomHeight ? zoomHeight : defaultHeight)/2)<visArea.y) {
            var posOffset_y = -imgPos.y+visArea.y;
         } else {
            if ((imgPos.y+h/2+(zoomHeight ? zoomHeight : defaultHeight)/2) > (visArea.y+visArea.h)) {
                var posOffset_y = -imgPos.y + visArea.y + visArea.h - (zoomHeight ? zoomHeight : defaultHeight);
            } else {
                var posOffset_y = h/2-(zoomHeight ? zoomHeight : defaultHeight)/2;
            }
        }
            
		if (!zoomImgCtr) {
			zoomImgCtr = dc("div");
			zoomImgCtr.className = "mojozoom_imgctr";
			zoomImgCtr.style.left = w + imgPos.x + posOffset_x+"px";
			zoomImgCtr.style.top = imgPos.y + posOffset_y+"px";

			zoomImgCtr.style.width = (zoomWidth ? zoomWidth : defaultWidth) +"px";
			zoomImgCtr.style.height = (zoomHeight ? zoomHeight : defaultHeight) +"px";

			document.body.appendChild(zoomImgCtr);
			useDefaultCtr = true;
		}
		zoomImgCtr.style.overflow = "hidden";

		if (!alwaysShow) {
			zoomImgCtr.style.visibility = "hidden";
		}
		$(zoomImg).load(function() {
			//use timeout to fix a problem with webkit-browsers (zoomImg sometimes not accesible direct after load)
			setTimeout(function(){
				// bail out if img has been removed from dom
				if (!zoomImg.parentNode) return;
				var time_elapsed;
				var mouse_out_timer = 0;

				var zoomWidth = zoomImg.offsetWidth;
				var zoomHeight = zoomImg.offsetHeight;

				var ctrWidth = zoomImgCtr.offsetWidth;
				var ctrHeight = zoomImgCtr.offsetHeight;

				var ratioW = zoomWidth / w;
				var ratioH = zoomHeight / h;

				var markerWidth = Math.round(ctrWidth / ratioW);
				var markerHeight = Math.round(ctrHeight / ratioH);

				document.body.removeChild(zoomImg);
				zoomImgCtr.appendChild(zoomImg);

				var zoomBorder = dc("div");
				zoomBorder.className = "mojozoom_border";    
				zoom.appendChild(zoomBorder);
				var zoomFill = dc("div");
				zoomFill.className = "mojozoom_fill";
				zoom.appendChild(zoomFill);            
				zoom.style.width = (markerWidth-2)+"px";
				zoom.style.height = (markerHeight-2)+"px";


				if (alwaysShow) {
					zoom.style.left = "0px";
					zoom.style.top = "0px";
		
					zoomImg.style.left = "0px";
					zoomImg.style.top = "0px";
				}
				var isInImage = false;
				if (!alwaysShow) {
					$(zoomInput).mouseleave(
						function(e) {
							if (!e.target) return;
							var relTarget = e.relatedTarget;
							if (!relTarget) return;
							while (relTarget != e.target && relTarget.nodeName != "BODY" && relTarget.parentNode) {
								relTarget = relTarget.parentNode;
							}
							ctr.style.display = "none";
							zoomImgCtr.style.visibility = "hidden";	 
						}
					);
				}
				//prevent zooming into a image already full displayed
				if ((w < zoomWidth) && (h < zoomHeight)) {
					$(zoomInput).mousemove(
						function(e) { 
						//limit position of zoom-image to visible area
							visArea = new Object;
							visArea.x = $(document).scrollLeft()
							visArea.y = $(document).scrollTop();
							visArea.w = $(document).width();
							visArea.h = $(document).height();
							imgPos = new Object;
							imgPos.x = $(img).offset().left;
							imgPos.y = $(img).offset().top;
						isInImage = true;
						//resize for images smaller than zoomSize
						if (zoomWidth <= minZoomWidth) {
							ctrWidth = zoomWidth;
							markerWidth = 0;
							zoom.style.width = (w-2)+"px";
						}
						if (zoomHeight <= minZoomHeight) {
							ctrHeight = zoomHeight;
							markerHeight = 0;
							zoom.style.height = (h-2)+"px";
						}
						if ((imgPos.x+w/2) > (visArea.x+visArea.w/2)) {
							var posOffset_x = -ctrWidth - w - 40;
						} else {
							var posOffset_x = 0;
						}
						if (((imgPos.y+h/2)-ctrHeight/2)<visArea.y) {
							var posOffset_y = -imgPos.y +visArea.y+2;
						 } else {
							if ((imgPos.y+h/2+ctrHeight/2) > (visArea.y+visArea.h)) {
								var posOffset_y = -imgPos.y + visArea.y + visArea.h - ctrHeight-2;
							} else {
								var posOffset_y = h/2-ctrHeight/2;
							}
						}
						if (useDefaultCtr) {
							zoomImgCtr.style.left = w + imgPos.x + posOffset_x +"px";
							zoomImgCtr.style.top = imgPos.y + posOffset_y + "px";
							zoomImgCtr.style.width = ctrWidth + "px";
							zoomImgCtr.style.height = ctrHeight + "px";
						}
						ctr.style.display = "block";
						zoomImgCtr.style.visibility = "visible";
						
						pos = new Object;
						pos.x = e.pageX - $(zoomInput).offset().left;
						pos.y = e.pageY - $(zoomInput).offset().top;

						var x = markerWidth/2;
						var y = markerHeight/2;

						if (pos.x < x) pos.x = x;
						if (pos.x > (w-x)) pos.x = w-x;
						if (pos.y < y) pos.y = y;
						if (pos.y > (h-y)) pos.y = h-y;

						var left = ((pos.x - x)|0);
						var top = ((pos.y - y)|0);
						//don't move at images smaller or equal to zoomSize
						if (zoomWidth==ctrWidth && zoomHeight==ctrHeight) {
							zoom.style.visibility = "hidden";
						}
						if (zoomWidth==ctrWidth) {
							zoomImg.style.left = 0;
						} else {
							zoom.style.left = left + "px";
							zoomImg.style.left = -((pos.x*ratioW - ctrWidth/2)|0)+"px";
						}
						if (zoomHeight==ctrHeight) {
							zoomImg.style.top = 0;
						} else {
							zoom.style.top = top + "px";
							zoomImg.style.top = -((pos.y*ratioH - ctrHeight/2)|0)+"px";
						}
					});
				};
			}, 1);	
		});		
		$(zoomImg).attr("src",zoomSrc);
		}, 1);
	}
	function init() {
		var images = document.getElementsByTagName("img");
		for (var i=0;i<images.length;i++) {
			var img = images[i];
			var zoomSrc = img.getAttribute("data-zoomsrc");
			if (zoomSrc) {
				makeZoomable(img, zoomSrc, document.getElementById(img.getAttribute("id") + "_zoom"), null, null, img.getAttribute("data-zoomalwaysshow")=="true");
			}
		}
	}
	return {
		init : init,
		makeZoomable : makeZoomable
	};
})();

function viewlayer(va,onoff) {
	if(onoff) {
		$("#"+va).css({visibility:'visible'});
		$("#"+va).parent().css({display:'block'});
	}
	else 
	{
		$("#"+va).css({visibility:'hidden'});
		$("#"+va).parent().css({display:'none'});	
	}
}
function select_img( va, num, w) {
	$("#"+va + "_img_nav").css({width: w + 'px'});
    if ($("#"+va + '1')) {
        viewlayer(va+ '1', num==1);
        if (num==1) {
			$("#"+va + '_img1').css({opacity:1,filter:'Alpha(opacity= 100)',border:'1px solid #CCCCCC'});
        } else {
			$("#"+va + '_img1').css({opacity:0.5,filter:'Alpha(opacity=50)',border:'0px'});
        }
    }
    if ($("#"+va + '2')) {
        viewlayer(va + '2', num==2);
        if (num==2) {
			$("#"+va + '_img2').css({opacity:1,filter:'Alpha(opacity= 100)',border:'1px solid #CCCCCC'});
        } else {
			$("#"+va + '_img2').css({opacity:0.5,filter:'Alpha(opacity=50)',border:'0px'});
        }
    }
    if ($("#"+va + '3')) {
        viewlayer(va + '3', num==3);
        if (num==3) {
			$("#"+va + '_img3').css({opacity:1,filter:'Alpha(opacity= 100)',border:'1px solid #CCCCCC'});
        } else {
			$("#"+va + '_img3').css({opacity:0.5,filter:'Alpha(opacity=50)',border:'0px'});
        }
    }
    if ($("#"+va + '4')) {
        viewlayer(va + '4', num==4);
        if (num==4) {
			$("#"+va + '_img4').css({opacity:1,filter:'Alpha(opacity= 100)',border:'1px solid #CCCCCC'});
        } else {
			$("#"+va + '_img4').css({opacity:0.5,filter:'Alpha(opacity=50)',border:'0px'});
        }
    }
    if ($("#"+va + '5')) {
        viewlayer(va + '5', num==5);
        if (num==5) {
			$("#"+va + '_img5').css({opacity:1,filter:'Alpha(opacity= 100)',border:'1px solid #CCCCCC'});
        } else {
			$("#"+va + '_img5').css({opacity:0.5,filter:'Alpha(opacity=50)',border:'0px'});
        }
    }    
}
$(document).ready(function() {
  MojoZoom.init();
});