/*
====================================================

  http://www.GlobalWebCart.com - Version 2

  Copyright 2009 Internet Specialty Services, LLC.

  ANY UN-AUTHORIZED USE OR DISTRIBUTION OF THIS
  FILE OR IT'S CONTENTS IS STRICTLY PROHIBITED

====================================================
*/
/*
	version: 2.2.1
	date: 2011-03-10 14:13
*/
var arrList = new Array();

var kZoomImg = function(sID, sSmallSrc, sBigSrc){
	this.initialize(sID, sSmallSrc, sBigSrc);
}

kZoomImg.prototype.initialize = function(sID, sSmallSrc, sBigSrc){
	this.smallImg = document.getElementById(sID);
	if (this.smallImg){
		this.smallID = sID;
		if (sSmallSrc){
			this.smallImg.src = sSmallSrc;
		}
		
		var iOldLen = arrList.length;
		arrList[iOldLen] = new Array(2);
		arrList[iOldLen][0] = this.smallID;
		arrList[iOldLen][1] = this;
	}else{
		alert("Can't find the image!");
		return;
	}
	var _this = this;
	this.bigLoaded = false;
	this.bigLoading = false;
	this.bActX = window.ActiveXObject;
	this.bEvt = window.event;
	
	this.browser = this.getBrowser();
	
	this.parentEle = this.smallImg.parentElement;
	if (!this.parentEle){
		this.parentEle = this.smallImg.parentNode;
	}
	this.sRelValue = this.smallImg.attributes.getNamedItem("rel").value;
	
	this.bigImg = new Image();
	this.bigImg.id = "bigpic_" + this.smallID;
	if (this.browser == "opera"){
		callback = function(){_this.operaLoadBigImg();};
		this.oInterval3 = window.setInterval(callback, 1000);
	}
	this.bigImg.src = sBigSrc ? sBigSrc : this.GetValueFromRel(this.sRelValue, "bigImage");
	this.bigImg.style.border = 0;
	
	// start to zoom in after click on the small image
	this.zoomAfterClick = false;
	this.clicked = false;
	var sZoomAfterClick = this.GetValueFromRel(this.sRelValue, "zoomAfterClick");
	if (sZoomAfterClick.length > 0 && sZoomAfterClick.toLowerCase() == "true"){
		this.zoomAfterClick = true;
		callback = function(e){ _this.clkSmlImg(e); };
		this.smallImg.onclick = callback;
	}
	
	// zoom self
	this.zoomSelf = false;
	var sZoomSelf = this.GetValueFromRel(this.sRelValue, "zoomSelf");
	if (sZoomSelf.length > 0 && sZoomSelf.toLowerCase() == "true"){
		this.zoomSelf = true;
	}
	
	// width and hieght for small image
	this.smallImgWidth = this.smallImg.width;
	this.smallImgHeight = this.smallImg.height;
	var sSmallImageWidth = this.GetSmallImageWidth(this.sRelValue);
	if (sSmallImageWidth.length > 0){
		this.smallImgWidth = parseInt(sSmallImageWidth);
		this.smallImgHeight = this.smallImgHeight * smallWidth / this.smallImgWidth;
	}
	this.smallImg.style.width = this.smallImgWidth + "px";
	this.smallImg.style.height = this.smallImgHeight + "px";
	
	// big box
	this.bigBox = document.createElement("div"); 
	this.bigBox.id = "bigbox_" + this.smallID;
	this.bigBox.className = "bigbox";
	this.bigBox.style.borderWidth = '2px';
	this.bigBox.appendChild(this.bigImg);
	
	// bigboxContainer
	this.bigBoxContainer = document.createElement("div"); 
	this.bigBoxContainer.id = "bigboxContainer_" + this.smallID;
	this.bigBoxContainer.className = "bigboxContainer";
	this.bigBoxContainer.style.zIndex = 10000;
	this.bigBoxContainer.appendChild(this.bigBox);
	
	// set bigbox object's position
	this.bigBoxContainer.style.position = "absolute";
	this.SetBigBoxPosition(this.sRelValue);
	if (!this.zoomSelf){
		this.SetBigBoxTitle(this.sRelValue);
	}
	this.parentEle.appendChild(this.bigBoxContainer);
	
	// Reverse opacity
	this.reOpacity = false;
	if (this.GetValueFromRel(this.sRelValue, "reverseOpacity").toLowerCase() == "true"){
		this.reOpacity = true;
		
		this.cover = document.createElement("div");
		this.cover.id = "imgZoomCover_" + this.smallID;
		this.cover.className = "cover";
		this.cover.style.position = "absolute";
		
		var smallImgPsn = this.getPosition(this.smallImg);
		this.cover.style.left = smallImgPsn.left + "px";
		this.cover.style.top = smallImgPsn.top + "px";
		this.cover.style.height = smallImgPsn.height + "px";
		this.cover.style.width = smallImgPsn.width + "px";
		
		this.SetOpacity(this.cover, "viewOpacity");
		this.SetBackColor(this.cover, "viewBackColor");
		
		this.parentEle.appendChild(this.cover);
		
		callback = function(e){ _this.clkSmlImg(e); };
		this.cover.onclick = callback;
	}
	
	this.imgView = document.createElement("div");
	this.imgView.id = "imgZoomView___" + this.smallID;
	this.imgView.className = "view";
	this.imgView.style.position = "absolute";
	if (!this.reOpacity){
		this.SetOpacity(this.imgView, "viewOpacity");
		this.SetBackColor(this.imgView, "viewBackColor");
	}else{
		// add a new image, with small image
		this.SetOpacity(this.imgView, "viewOpacity", 30);
		this.opacityImg = new Image();
		this.opacityImg.src = this.smallImg.src;
		this.imgView.appendChild(this.opacityImg);
	}
	this.parentEle.appendChild(this.imgView);
	
	// onmousemove and onmouseout event
	callback1 = function(e){ _this.move(e); };
	callback2 = function(e){ _this.out(e); };
	var oObj = this.smallImg;
	if (this.reOpacity){
		oObj = this.cover;
	}
	if (window.addEventListener && this.browser != "opera"){
		oObj.addEventListener('mousemove', callback1, false);
		oObj.addEventListener('mouseout', callback2, false);
		this.imgView.addEventListener('mousemove', callback1, false);
		this.imgView.addEventListener('mouseout', callback2, false);
		if (this.zoomSelf){
			this.bigBoxContainer.addEventListener('mousemove', callback1, false);
			this.bigBoxContainer.addEventListener('mouseout', callback2, false);
		}
	}else if (window.attachEvent || this.browser == "opera") {
		oObj.onmousemove = callback1;
		oObj.onmouseout = callback2;
		this.imgView.onmousemove = callback1;
		this.imgView.onmouseout = callback2;
		if (this.zoomSelf){
			this.bigBoxContainer.onmousemove = callback1;
			this.bigBoxContainer.onmouseout = callback2;
		}
	}
	this.bigBoxContainer.style.display = "none";
	this.imgView.style.display = "none";
	
	this.oInterval = null;
	this.oInterval2 = null;
	this.loadingDiv = null;
	
	this.iBigBoxOpacity = 0;
}

kZoomImg.prototype.operaLoadBigImg = function(){
	if (this.bigImgReady()){
		if (this.oInterval3){
			window.clearInterval(this.oInterval3);
			this.oInterval3 = null;
			
			this.setSize();
			this.bigBoxContainer.style.display = "none";
			
			this.bigLoaded = true;
		}
	}
}

kZoomImg.prototype.GetSmallImageWidth = function(sRelValue){
	return this.GetValueFromRel(sRelValue, "smallImageWidth");
}

kZoomImg.prototype.checkLoading = function(){
	if (this.bigImgReady()){
		this.bigLoaded = true;
		window.clearInterval(this.oInterval);
		this.oInterval = null;
		
		this.setBigLoading(0);
	}
}
/*
	set the size of the view window and the big image window
*/
kZoomImg.prototype.setSize = function(){
	var bRlt = false;
	if (this.bigImg.width <= 0 || this.bigImg.height <= 0){
		return false;
	}
	if (this.browser == "opera"){
		this.bigBoxContainer.style.display = "block";
	}
	this.bigImgWidth = this.bigImg.width;
	this.bigImgHeight = this.bigImg.height;
	
	//this.bigImg.style.width = this.bigImgWidth + "px";
	//this.bigImg.style.height = this.bigImgHeight + "px";
	
	this.scaleX = this.bigImgWidth / this.smallImgWidth;
	this.scaleY = this.bigImgHeight / this.smallImgHeight;
	
	var bigWidth = this.smallImgWidth; 
	var bigHeight = this.smallImgHeight; 
	if (!this.zoomSelf){
		var sBigWidth = this.GetValueFromRel(this.sRelValue, "zoomWidth");
		var sBigHeight = this.GetValueFromRel(this.sRelValue, "zoomHeight");
		if (sBigWidth.length > 0){
			bigWidth = parseInt(sBigWidth);
		}
		if (sBigHeight.length > 0){
			bigHeight = parseInt(sBigHeight);
		}
		if (bigWidth > this.bigImgWidth){
			bigWidth = this.bigImgWidth * 0.7;
		}
		if (bigHeight > this.bigImgHeight){
			bigHeight = this.bigImgHeight * 0.7;
		}
	}
	
	this.containerWidth = bigWidth;
	this.containerHeight = bigHeight;
	
	this.bigBox.style.width = this.containerWidth + "px";
	this.bigBox.style.height = this.containerHeight + "px";
	this.bigBoxContainer.style.width = this.containerWidth + "px";
	
	// set the size of the view window
	this.viewWidth = this.smallImgWidth / this.bigImgWidth * this.containerWidth;
	this.viewHeight = this.smallImgHeight / this.bigImgHeight * this.containerHeight;//debugger
	this.imgView.style.width = this.viewWidth + "px";
	this.imgView.style.height = this.viewHeight + "px";
	this.imgView.style.overflow = "hidden";
	
	if (this.browser == "opera"){
		this.bigBoxContainer.style.display = "none";
	}
	if (typeof(this.viewWidth) == "undefined" || typeof(this.viewHeight) == "undefined"){
	}else{
		bRlt = true;
	}
	return bRlt;
}

kZoomImg.prototype.bigImgReady = function(){
	var bResult = false;
	if (this.browser.indexOf("IE") <= 0){
		if (this.bigImg.complete == true){
			if (this.bigImg.width > 0 && this.bigImg.height > 0){
				bResult = true;
			}
		}
	}else{
		if (this.bigImg.readyState == "complete"){
			if (this.bigImg.width > 0 && this.bigImg.height > 0){
				bResult = true;
			}
		}
	}
	return bResult;
}

kZoomImg.prototype.clkSmlImg = function(e){//debugger
	this.clicked = true;
	this.move(e);
}
kZoomImg.prototype.setBigLoading = function(i){
	if (i == 0){
		if (this.loadingDiv){
			this.parentEle.removeChild(this.loadingDiv);
		}
	}else{
		this.loadingDiv = document.createElement("div");
		this.loadingDiv.innerHTML = "loading";
		this.loadingDiv.style.position = "absolute";
		var smallImgPsn = this.getPosition(this.smallImg);
		this.loadingDiv.style.left = smallImgPsn.left + "px";
		this.loadingDiv.style.top = smallImgPsn.top + "px";
		this.parentEle.appendChild(this.loadingDiv);
				
		var _this = this;
		callback = function(){_this.checkLoading();}
		this.oInterval = window.setInterval(callback, 10);
	}
}
kZoomImg.prototype.move = function(e){//debugger
	if (this.zoomAfterClick && !this.clicked){
		return;
	}
	if (!this.bigLoaded){
		if (this.bigImgReady()){
			if (this.setSize() == false){
				return;
			}
			this.bigLoaded = true;
		}else{
			if (!this.bigLoading){
				this.bigLoading = true;
				
				this.setBigLoading(1);
				//this.parentEle.removeChild(this.loadingDiv);
				//this.loadingDiv = null;
				
				//if (this.setSize() == false){
					return;
				//}
			}else{
				return;	
			}
		}
	}
	if (typeof(this.viewWidth) == "undefined" || typeof(this.viewHeight) == "undefined"){
		if (this.setSize() == false){
			return;
		}
	}
	var e = this.bEvt ? window.event : e;
	var iebug = 0;
	var _this = this;
	if (this.bigBoxContainer.style.display != "block"){
		this.bigBoxContainer.style.display = "block";
		this.HideElements(this.bigBoxContainer);
		var sFadeIn = this.GetValueFromRel(this.sRelValue, "fadeIn");
		if (sFadeIn.length > 0 && sFadeIn == "true")
		{
			this.SetBigBoxOpacity(0);
			this.iBigBoxOpacity = 0;
			if (this.oInterval2 == null)
				callback = function(){_this.IntervalSetBigBoxOpacity();};
				this.oInterval2 = window.setInterval(callback, 50);
		}
	}
	if (!this.zoomSelf){
		this.imgView.style.display = "block";
		this.imgView.style.cursor = "move";
	}else{
		this.imgView.style.display = "none";
		this.bigBoxContainer.style.cursor = "move";
	}
	var border = 2;
	
	if (this.bEvt && this.browser != "opera"){
		var topAdd = 0;
		var leftAdd = 0;
		if (this.bActX){
			topAdd = document.documentElement.scrollTop;
			leftAdd = document.documentElement.scrollLeft;
		}else{
			topAdd = document.body.scrollTop;
			leftAdd = document.body.scrollLeft;
		}
       var vX = e.clientX + leftAdd - this.viewWidth / 2 
	   			- this.smallImg.offsetLeft - border;
       var vY = e.clientY + topAdd - this.viewHeight / 2 
	   			- this.smallImg.offsetTop - border;
    } else {
       var vX = e.pageX - this.viewWidth / 2 - this.smallImg.offsetLeft - border;
       var vY = e.pageY - this.viewHeight / 2 - this.smallImg.offsetTop - border;
       iebug = 2;
    }
	
	this.SetBigBoxPosition(this.sRelValue);
	
    if (vX < 0) vX = 0;
    if (vY < 0) vY = 0;
    if (vX > this.smallImgWidth - this.viewWidth - iebug) 
		vX = this.smallImgWidth - this.viewWidth - iebug;
    if (vY > this.smallImgHeight - this.viewHeight - iebug) 
		vY = this.smallImgHeight - this.viewHeight - iebug;
	
    this.bigImg.style.marginLeft = - vX * this.scaleX + 'px';
    this.bigImg.style.marginTop = - vY * this.scaleY + 'px';
	
	if (this.reOpacity){
		this.opacityImg.style.marginLeft = - vX + 'px';
		this.opacityImg.style.marginTop = - vY + 'px';
	}

    if (this.bEvt){
		this.imgView.style.left = vX + (this.smallImg.offsetLeft) - 1 + "px";
        this.imgView.style.top = vY + (this.smallImg.offsetTop) - 1 + "px";
    }else{
        this.imgView.style.left = (vX + this.smallImg.offsetLeft) + 'px';
        this.imgView.style.top = (vY + this.smallImg.offsetTop) + 'px';    
    }
}

kZoomImg.prototype.HideElements = function(el){
    if (!window.__temp__) window.__temp__ = new Array();
    var o = ["select","iframe","applet","object"];
    for (var i=0; i<o.length; i++) {
        var elms = document.getElementsByTagName(o[i]);
        for (var j=0; j<elms.length; j++) {
            var p = this.getPosition(elms[j]);
            var e = this.getPosition(el);
            if (e.left + e.width > p.left && e.left < p.left + p.width &&
                e.top + e.height > p.top && e.top < p.top + p.height) {
                window.__temp__[j] = elms[j];
                elms[j].style.visibility = "hidden";
            }
        }
    }
}

kZoomImg.prototype.ShowElements = function(){
    var t = window.__temp__;
    if (t) {
        for (var i=0; i<t.length; i++) {
			if (t[i]){
            	t[i].style.visibility = "visible";
			}
        }
    }
}

kZoomImg.prototype.SetBigBoxOpacity = function(iBigBoxOpacity){
	if (this.bActX){
		this.bigImg.style.filter = "alpha(opacity=" + iBigBoxOpacity + ")";
	}else{
		this.bigImg.style.opacity = iBigBoxOpacity / 100.0;
	}
}
kZoomImg.prototype.IntervalSetBigBoxOpacity = function(){
	this.iBigBoxOpacity += 5;
	if (this.iBigBoxOpacity > 100){
		window.clearInterval(this.oInterval2);
		this.oInterval2 = null;
	}else{
		this.SetBigBoxOpacity(this.iBigBoxOpacity);
	}
}

kZoomImg.prototype.getScrollInfo = function(){//debugger
	var top = document.body.scrollTop ? document.body.scrollTop : 0;
	var left = document.body.scrollLeft ? document.body.scrollLeft : 0;
	if (top <= 0){
		top = document.documentElement.scrollTop ? document.documentElement.scrollTop : 0;
		if (top <= 0){
			top = window.pageYOffset ? window.pageYOffset : 0;
		}
	}
	if (left <= 0){
		left = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : 0;
		if (left <= 0){
			left = window.pageXOffset ? window.pageXOffset : 0;
		}
	}
	return{
		"scrollTop" : top,
		"scrollLeft" : left
	};
}

kZoomImg.prototype.out = function(e){//debugger
	var e = this.bEvt ? window.event : e;
	var msCoord = this.mouseCoords(e);
	// position of small image
	var sip = this.getPosition(this.smallImg);
	var bInSmallImage = false;
	if (msCoord.x > sip.left && msCoord.x < (sip.left + sip.width) 
			&& msCoord.y > sip.top && msCoord.y < (sip.top + sip.height)){
		bInSmallImage = true;
	}//alert('in smaill image:' + bInSmallImage);
	if (bInSmallImage == false){
		if (this.bigBoxContainer){
			this.bigBoxContainer.style.display = "none";
			this.ShowElements();
		}
		if (this.imgView){
			this.imgView.style.display = "none";
			if (!this.zoomSelf){
				this.imgView.style.cursor = "";
			}else{
				this.bigBoxContainer.style.cursor = "";
			}
		}
		if (this.zoomAfterClick && this.clicked){
			this.clicked = false;
		}
	}
}

kZoomImg.prototype.SetOpacity = function(oObj, sItem, dValue){
	// the opacity of view window
	var vo = dValue ? dValue : this.GetValueFromRel(this.sRelValue, sItem);
	if (vo.length > 0){
		if (this.bActX){
			oObj.style.filter = "alpha(opacity=" + vo + ")";
		}else{
			oObj.style.opacity = vo / 100.0;
		}
	}
}
kZoomImg.prototype.SetBackColor = function(oObj, sItem){
	// background color of view window
	var vbc = this.GetValueFromRel(this.sRelValue, sItem);
	if (vbc.length > 0){
		oObj.style.backgroundColor = vbc;
	}
}

kZoomImg.prototype.SetBigBoxPosition = function(sRelValue){
	var iTop = 0, iLeft = 0;
	var iZoomSelfX = 0, iZoomSelfY = 0;
	if (this.zoomSelf){
		iZoomSelfX = 0, iZoomSelfY = -1;
	}
	if (!this.zoomSelf){
		iTop = this.smallImg.offsetTop;
		iLeft = this.smallImg.offsetLeft;
		// opsition of zoom window
		var zp = this.GetValueFromRel(sRelValue, "zoomPosition");
		if (zp == "top"){
			iTop -=  this.smallImgHeight - 10;
		}else if (zp == "bottom"){
			iTop +=  this.smallImgHeight + 10;
		}else if (zp == "left"){
			iLeft -= this.smallImgWidth - 10;
		}else if (zp.indexOf(",") >= 0){
			// set as your user defined  position
			var aPosition = zp.split(",");
			iTop = aPosition[0];
			iLeft = aPosition[1];
		}else{
			//default is "right"
			iLeft += this.smallImgWidth + 10;
		}
	}else{
		var smallImgPsn = this.getPosition(this.smallImg);
		iTop = smallImgPsn.top;
		iLeft = smallImgPsn.left;
	}
	this.bigBoxContainer.style.top = (iTop + iZoomSelfY) + "px";
	this.bigBoxContainer.style.left = (iLeft + iZoomSelfX) + "px";
}
kZoomImg.prototype.SetBigBoxTitle = function(sRelValue){
	// title string
	var st = this.GetValueFromRel(sRelValue, "zoomTitle");
	if (st.length > 0){
		// the title object
		var ot = document.createElement("div");
		ot.innerHTML = st;
		ot.style.textAlign = "center";
		ot.style.backgroundColor = "#92B719";
		this.bigBoxContainer.insertBefore(ot, this.bigBox);
	}
}

kZoomImg.prototype.GetValueFromRel = function(sRelValue, sParameterName){
	var oResult = "";
	var aRel = 	sRelValue.split(";");
	for (var i = 0;i < aRel.length;i++){
		var aItem = aRel[i].split(":");
		if (aItem.length >= 1 && aItem[0] == sParameterName){
			oResult = aRel[i].substring(aRel[i].indexOf(":") + 1, aRel[i].length);
			break;
		}else{
			continue;
		}
	}
	return oResult;
}

kZoomImg.prototype.getPosition = function(el){
	var e = el.offsetParent, x = el.offsetLeft, y = el.offsetTop;
	while (e) {
		x += e.offsetLeft;
		y += e.offsetTop;
		e = e.offsetParent;
	}
	return {
		"left":		x,
		"top":		y,
		"width":		el.offsetWidth,
		"height":	el.offsetHeight
	}
}

kZoomImg.prototype.mouseCoords = function(ev){
	var ev = this.bEvt ? window.event : ev;
	if(ev.pageX || ev.pageY){
		return {x:ev.pageX, y:ev.pageY};
	}
	var scrollInfo = this.getScrollInfo();
	return {
		x:ev.clientX + scrollInfo.scrollLeft,
		y:ev.clientY + scrollInfo.scrollTop
	};
}
// of course, we can use this function of the global.js
kZoomImg.prototype.getBrowser = function() {
	var sResult = "other";
	var s = navigator.userAgent.toLowerCase();
	var a = new Array("msie", "firefox", "safari", "opera", "netscape");
	for(var i = 0; i < a.length; i ++) {
		if(s.indexOf(a[i]) != -1) {
			sResult = a[i];
		}
	}
	if (sResult == "msie") {
		sResult = "IE6";
		if (window.XMLHttpRequest) {
			sResult = "IE7";
		}
	}
	return sResult;
}

function changeImage(sOldID, sSmallSrc, sBigSrc){
	for (var i = 0;i < arrList.length; i++){
		if (arrList[i][0] == sOldID){
			arrList[i][1].initialize(sOldID, sSmallSrc, sBigSrc);
			break;
		}
	}
}

function CheckZIbody() {
	//var bdy = document.getElementById("PageDiv").innerHTML;
	var bdy = document.getElementById("MainCell").innerHTML;
	if (bdy.indexOf("imageZoom")!=-1) {
		var oai = document.getElementsByTagName("img");
		for (var i = 0;i < oai.length;i++) {
			if (oai.item(i).className == "imageZoom") {
				new kZoomImg(oai.item(i).id);
			}
		}
	}
}

if (window.addEventListener){
	window.addEventListener('load',CheckZIbody, false);
}else if (window.attachEvent) {
	window.attachEvent('onload',CheckZIbody);
}