// global variables and settings
var path = "http://images.urbanoutfitters.com/is/image/UrbanOutfitters/";
var detailLinkPath = "/urban/catalog/productdetail.jsp";
var mainSuffix = "?$detailMain$";
var thumbSuffix = "?detailthumb$";
var zoomSuffix = "?$zoom$";
var zoomDetailLink = false;
var zoomType = "outside";

// preload scene 7 zoom image
//Start: Added changes for the trac 4220
function updateZoomCard(img,pProductId) {
	try {
		if (img.indexOf("http:")>=0) {
			// strip out the product id, color code and view code
			img = img.substring(img.lastIndexOf("/"), img.indexOf("?"));
		}
		// set original image source
		var mainImage = new Image();
		mainImage.src = path + img + mainSuffix;
		$("detailMain"+pProductId).src = mainImage.src;
		// set zoom image source
		var zoomedImg = new Image();
		zoomedImg.src = path + img + zoomSuffix;
		if (zoomType == "inside") {
			if ($("detailMainZoomInside"+pProductId)) {
				$("detailMainZoomInside"+pProductId).src = zoomedImg.src;
			}	
		} else {
			if ($("detailMainZoomOutside"+pProductId)) {
				$("detailMainZoomOutside"+pProductId).src = zoomedImg.src;
			}
		}
		// set product detail page link
		if (zoomDetailLink) {
			var productId = img.substring(0, img.indexOf("_"));
			$("zoomWrapper"+pProductId).href = detailLinkPath + "?id=" + productId + "&color="+curColor+"&itemdescription=true&navAction=jump";
		}
	} catch (e) {
		// debug
		alert("updateZoomCard: " + e);
	}
}

// launch zoom
function loadZoomCard(zType, zDetailLink,pProductId)  {
	// set zoomType
	zoomType = zType;
	// set boolean for detail page click through link
	zoomDetailLink = zDetailLink;
	// preload scene 7 image to zoom	
	var img = $("detailMain"+pProductId).src.substring($("detailMain"+pProductId).src.lastIndexOf("/")+1,$("detailMain"+pProductId).src.indexOf("?"));
	// load scene 7 zoom image
	updateZoomCard(img,pProductId);
}

// hide zoom
function hideZoomCard(pProductId) {
	try {
		if (zoomType == "outside") {
			$("zoomImgOutside"+pProductId).style.display = "none";
		} else {
			$("zoomImgInside"+pProductId).style.display = "none";
		}
		$("zoomViewer"+pProductId).style.display = "none";
	} catch (e) {
		// debug
		alert("hideZoomCard: " + e);
	}
}

// display zoom viewer outside image
function zoomInsideCard(pProductId) {
	try {
		// show zoomed image
		$("zoomImgInside"+pProductId).style.height = $("zoomViewer"+pProductId).style.height;
		$("zoomImgInside"+pProductId).style.width = $("zoomViewer"+pProductId).style.width;
		$("zoomImgInside"+pProductId).style.display = "block";
		// display zoom viewer
		$("zoomViewer"+pProductId).style.display = "block";
	} catch (e) {
		// debug
		alert("zoomInsideCard: " + e);
	}
}

// display zoom viewer inside image
function zoomOutsideCard(pProductId) {
	try {
		// show zoomed image
		$("zoomImgOutside"+pProductId).style.height = $("zoomViewer"+pProductId).style.height;
		$("zoomImgOutside"+pProductId).style.width = $("zoomViewer"+pProductId).style.width;
		$("zoomImgOutside"+pProductId).style.display = "block";
		// display zoom viewer
		$("zoomViewer"+pProductId).style.display = "block";
	} catch (e) {
		// debug
		alert("zoomOutsideCard: " + e);
	}
}

// get mouse move coordinates
function getZoomCoordinatesCard(e,pProductId) {
	
	try {
		var scrollX = document.body.scrollLeft || document.documentElement.scrollLeft;
		var scrollY = document.body.scrollTop || document.documentElement.scrollTop;
		if (!e) {
			var e = window.event;
		}
		var x = e.clientX + scrollX;
		var y = e.clientY + scrollY;
		var offsetX = $("detailMainContent"+pProductId).offsetLeft;
		var offsetY = $("detailMainContent"+pProductId).offsetTop;
		// lock zoom viewer to center of mouse
		$("zoomViewer"+pProductId).style.left = x - offsetX - Math.floor(parseInt($("zoomViewer"+pProductId).style.width)/2) + "px";
		$("zoomViewer"+pProductId).style.top = y - offsetY - Math.floor(parseInt($("zoomViewer"+pProductId).style.height)/2) + "px";
		// check which type of zoom to display
		if (zoomType == "inside") {
			// open zoom viewer inside photo
			zoomInsideCard(+pProductId);
			// set styles for inside zoom
			$("zoomViewer"+pProductId).style.opacity = "1.0";
			$("zoomViewer"+pProductId).style.filter = "alpha(opacity=100)";
			$("zoomViewer"+pProductId).style.background = "none";
			$("zoomViewer"+pProductId).style.border = "solid 1px #ffffff";
			// lock zoomed image to zoomViewer
			$("zoomImgInside"+pProductId).style.left = $("zoomViewer"+pProductId).style.left;
			$("zoomImgInside"+pProductId).style.top = $("zoomViewer"+pProductId).style.top;
			// calculate zoom ratio
			var zoomRatio = parseInt($("detailMainZoomInside"+pProductId).width) / parseInt($("detailMain"+pProductId).width);
			zoomRatio = roundNumber(zoomRatio, 2);
			// calculate coordinates of zoomed image
			var topCoord = -zoomRatio * parseInt($("zoomViewer"+pProductId).style.top);
			topCoord = Math.floor(topCoord) - parseInt($("zoomViewer"+pProductId).style.height) + Math.floor(parseInt($("zoomViewer"+pProductId).style.height)/zoomRatio);
			var leftCoord = -zoomRatio * parseInt($("zoomViewer"+pProductId).style.left);
			leftCoord = Math.floor(leftCoord) - parseInt($("zoomViewer"+pProductId).style.width);
			// set limits
			if (topCoord > Math.ceil(parseInt($("zoomViewer"+pProductId).style.height)/zoomRatio)) {
				topCoord = Math.ceil(parseInt($("zoomViewer"+pProductId).style.height)/zoomRatio);				
			}
			// set zoomed image coordinates
			$("detailMainZoomInside"+pProductId).style.top = topCoord + "px";
			$("detailMainZoomInside"+pProductId).style.left = leftCoord + "px";
		} else {
			// open zoom viewer outside photo
			zoomOutsideCard(pProductId);
			// set styles for outside zoom
			$("zoomViewer"+pProductId).style.opacity = "0.6";
			$("zoomViewer"+pProductId).style.filter = "alpha(opacity=60)";
			$("zoomViewer"+pProductId).style.background = "#ffffff";
			$("zoomViewer"+pProductId).style.border = "none";
			// calculate zoom ratio
			var zoomRatio = parseInt(document.images["detailMainZoomOutside"+pProductId].width) / parseInt(document.images["detailMain"+pProductId].width);
			zoomRatio = Math.floor(zoomRatio);
			// set dimensions of viewable zoomed area
			$("zoomImgOutside"+pProductId).style.height = zoomRatio * parseInt($("zoomViewer"+pProductId).style.height) + "px";
			$("zoomImgOutside"+pProductId).style.width = zoomRatio * parseInt($("zoomViewer"+pProductId).style.width) + "px";
			// calculate coordinates of zoomed image
			var topCoord = -zoomRatio * parseInt($("zoomViewer"+pProductId).style.top);
			topCoord = Math.floor(topCoord) - parseInt($("zoomViewer"+pProductId).style.height);
			var leftCoord = -zoomRatio * parseInt($("zoomViewer"+pProductId).style.left);
			leftCoord = Math.floor(leftCoord) - parseInt($("zoomViewer"+pProductId).style.width) + Math.floor(parseInt($("zoomViewer"+pProductId).style.width)/zoomRatio);
			// set limits
			if (topCoord < -parseInt(document.images["detailMainZoomOutside"+pProductId].height) + parseInt($("zoomViewer"+pProductId).style.height)*2) {
				topCoord = -parseInt(document.images["detailMainZoomOutside"+pProductId].height) + parseInt($("zoomViewer"+pProductId).style.height)*2;
			}
			if (leftCoord > 0) {
				leftCoord = 0;
			} else if (leftCoord < -(parseInt(document.images["detailMainZoomOutside"+pProductId].width) - parseInt($("zoomViewer"+pProductId).style.height)*2)) {
				leftCoord = -(parseInt(document.images["detailMainZoomOutside"+pProductId].width) - parseInt($("zoomViewer"+pProductId).style.height)*2);
			}
			// set zoomed image coordinates
			$("detailMainZoomOutside"+pProductId).style.top = topCoord + "px";
			$("detailMainZoomOutside"+pProductId).style.left = leftCoord + "px";				
		}
	} catch (e) {
		// debug
		//alert("getZoomCoordinates: " + e);
	}
}

//End: Added changes for the trac 4220


//preload scene 7 zoom image
function updateZoom(img) {
	try {
		if (img.indexOf("http:")>=0) {
			// strip out the product id, color code and view code
			img = img.substring(img.lastIndexOf("/"), img.indexOf("?"));
		}
		// set original image source
		var mainImage = new Image();
		mainImage.src = path + img + mainSuffix;
		$("detailMain").src = mainImage.src;
		// set zoom image source
		var zoomedImg = new Image();
		zoomedImg.src = path + img + zoomSuffix;
		if (zoomType == "inside") {
			if ($("detailMainZoomInside")) {
				$("detailMainZoomInside").src = zoomedImg.src;
			}	
		} else {
			if ($("detailMainZoomOutside")) {
				$("detailMainZoomOutside").src = zoomedImg.src;
			}
		}
		// set product detail page link
		if (zoomDetailLink) {
			var productId = img.substring(0, img.indexOf("_"));
			$("zoomWrapper").href = detailLinkPath + "?id=" + productId + "&color="+curColor+"&itemdescription=true&navAction=jump";
		}
	} catch (e) {
		// debug
		alert("updateZoom: " + e);
	}
}

// launch zoom
function loadZoom(zType, zDetailLink)  {
	// set zoomType
	zoomType = zType;
	// set boolean for detail page click through link
	zoomDetailLink = zDetailLink;
	// preload scene 7 image to zoom
	var img = $("detailMain").src.substring($("detailMain").src.lastIndexOf("/")+1,$("detailMain").src.indexOf("?"));
	// load scene 7 zoom image
	updateZoom(img);
}

// hide zoom
function hideZoom() {
	try {
		if (zoomType == "outside") {
			$("zoomImgOutside").style.display = "none";
		} else {
			$("zoomImgInside").style.display = "none";
		}
		$("zoomViewer").style.display = "none";
	} catch (e) {
		// debug
		alert("hideZoom: " + e);
	}
}

// display zoom viewer outside image
function zoomInside() {
	try {
		// show zoomed image
		$("zoomImgInside").style.height = $("zoomViewer").style.height;
		$("zoomImgInside").style.width = $("zoomViewer").style.width;
		$("zoomImgInside").style.display = "block";
		// display zoom viewer
		$("zoomViewer").style.display = "block";
	} catch (e) {
		// debug
		alert("zoomInside: " + e);
	}
}

// display zoom viewer inside image
function zoomOutside() {
	try {
		// show zoomed image
		$("zoomImgOutside").style.height = $("zoomViewer").style.height;
		$("zoomImgOutside").style.width = $("zoomViewer").style.width;
		$("zoomImgOutside").style.display = "block";
		// display zoom viewer
		$("zoomViewer").style.display = "block";
	} catch (e) {
		// debug
		alert("zoomOutside: " + e);
	}
}

// utility function to return number rounded "dec" number of decimal places
function roundNumber(num, dec) {
	var result = Math.round(num*Math.pow(10,dec))/Math.pow(10,dec);
	return result;
}

// get mouse move coordinates
function getZoomCoordinates(e, parentElem) {
	try {
		var scrollX = document.body.scrollLeft || document.documentElement.scrollLeft;
		var scrollY = document.body.scrollTop || document.documentElement.scrollTop;
		if (!e) {
			var e = window.event;
		}
		var x = e.clientX + scrollX;
		var y = e.clientY + scrollY;
		var offsetX = $(parentElem).offsetLeft;
		var offsetY = $(parentElem).offsetTop;
		// lock zoom viewer to center of mouse
		$("zoomViewer").style.left = x - offsetX - Math.floor(parseInt($("zoomViewer").style.width)/2) + "px";
		$("zoomViewer").style.top = y - offsetY - Math.floor(parseInt($("zoomViewer").style.height)/2) + "px";
		// check which type of zoom to display
		if (zoomType == "inside") {
			// open zoom viewer inside photo
			zoomInside();
			// set styles for inside zoom
			$("zoomViewer").style.opacity = "1.0";
			$("zoomViewer").style.filter = "alpha(opacity=100)";
			$("zoomViewer").style.background = "none";
			$("zoomViewer").style.border = "solid 1px #ffffff";
			// lock zoomed image to zoomViewer
			$("zoomImgInside").style.left = $("zoomViewer").style.left;
			$("zoomImgInside").style.top = $("zoomViewer").style.top;
			// calculate zoom ratio
			var zoomRatio = parseInt($("detailMainZoomInside").width) / parseInt($("detailMain").width);
			zoomRatio = roundNumber(zoomRatio, 2);
			// calculate coordinates of zoomed image
			var topCoord = -zoomRatio * parseInt($("zoomViewer").style.top);
			topCoord = Math.floor(topCoord) - parseInt($("zoomViewer").style.height) + Math.floor(parseInt($("zoomViewer").style.height)/zoomRatio);
			var leftCoord = -zoomRatio * parseInt($("zoomViewer").style.left);
			leftCoord = Math.floor(leftCoord) - parseInt($("zoomViewer").style.width);
			// set limits
			if (topCoord > Math.ceil(parseInt($("zoomViewer").style.height)/zoomRatio)) {
				topCoord = Math.ceil(parseInt($("zoomViewer").style.height)/zoomRatio);				
			}
			// set zoomed image coordinates
			$("detailMainZoomInside").style.top = topCoord + "px";
			$("detailMainZoomInside").style.left = leftCoord + "px";
		} else {
			// open zoom viewer outside photo
			zoomOutside();
			// set styles for outside zoom
			$("zoomViewer").style.opacity = "0.6";
			$("zoomViewer").style.filter = "alpha(opacity=60)";
			$("zoomViewer").style.background = "#ffffff";
			$("zoomViewer").style.border = "none";
			// calculate zoom ratio
			var zoomRatio = parseInt(document.images["detailMainZoomOutside"].width) / parseInt(document.images["detailMain"].width);
			zoomRatio = Math.floor(zoomRatio);
			// set dimensions of viewable zoomed area
			$("zoomImgOutside").style.height = zoomRatio * parseInt($("zoomViewer").style.height) + "px";
			$("zoomImgOutside").style.width = zoomRatio * parseInt($("zoomViewer").style.width) + "px";
			// calculate coordinates of zoomed image
			var topCoord = -zoomRatio * parseInt($("zoomViewer").style.top);
			topCoord = Math.floor(topCoord) - parseInt($("zoomViewer").style.height);
			var leftCoord = -zoomRatio * parseInt($("zoomViewer").style.left);
			leftCoord = Math.floor(leftCoord) - parseInt($("zoomViewer").style.width) + Math.floor(parseInt($("zoomViewer").style.width)/zoomRatio);
			// set limits
			if (topCoord < -parseInt(document.images["detailMainZoomOutside"].height) + parseInt($("zoomViewer").style.height)*2) {
				topCoord = -parseInt(document.images["detailMainZoomOutside"].height) + parseInt($("zoomViewer").style.height)*2;
			}
			if (leftCoord > 0) {
				leftCoord = 0;
			} else if (leftCoord < -(parseInt(document.images["detailMainZoomOutside"].width) - parseInt($("zoomViewer").style.height)*2)) {
				leftCoord = -(parseInt(document.images["detailMainZoomOutside"].width) - parseInt($("zoomViewer").style.height)*2);
			}
			// set zoomed image coordinates
			$("detailMainZoomOutside").style.top = topCoord + "px";
			$("detailMainZoomOutside").style.left = leftCoord + "px";				
		}
	} catch (e) {
		// debug
		//alert("getZoomCoordinates: " + e);
	}
}