var ie = document.all;										// ... IE browser
var ob = document.getElementById && !ie;	// ... other browsers
var smallDir = 'large';										// ... directory where small image is kept
var largeDir = 'x_large';									// ... directory where large image is kept
var largeSrc = '';												// ... source of large image
var largeOffset = 0;											// ... space between small and large image
var scale = 4;														// ... scale of magnification
var zoomW = 86;														// ... width of zoom lens
var zoomH = 86;														// ... height of zoom lens
var smallX = 0;														// ... position of small image from left
var smallY = 0;														// ... position of small image from top
var largeW = 314;													// ... width of large image
var largeH = 321;													// ... height of large image
var pageCenter = 'Yes';										// ... is the page centered Yes/No
var siteW = 945;													// ... width of the site
var justLoaded = 'Yes';										// ... script checks whether page has just loaded

function preLoad() {
	// ... preload loading graphic
	loadingSrc = new Image(86,86);
	loadingSrc.src = 'images/zoom/loading.gif';
	// ... preload large image into cache
	largeSrc = new Image(document.getElementById('SmallImage').width * scale,document.getElementById('SmallImage').height * scale);
	largeSrc.src = document.getElementById('SmallImage').src.replace(smallDir,largeDir);
	//Remove alt text from small image
	document.getElementById('SmallImage').alt = '';
}
function pageLoaded() {
	justLoaded = 'No';
}
function showZoom(e) {
  // ... check browser isn't Opera
	if (window.opera == null) {
		// ... change hint text
		if((document.getElementById('HoverHint') != null) && (document.getElementById('SmallImage') != null)) {
			if(document.getElementById('SmallImage').src.indexOf('noimage') == -1) {
				document.getElementById('HoverHint').innerHTML = 'Roll over image to zoom';
			}
		}
		var obj = ob ? e.target : event.srcElement;
		var ev = e || event;
		if (largeSrc.complete == true) {
			if ((obj.className == 'Hover') && (justLoaded != 'Yes')) {
				// ... check main image source isn't 'noimage'
				if(document.getElementById('SmallImage').src.indexOf('noimage') == -1) {
					// ... check whether large image exists
					if (document.getElementById('LargeImage') == null) {
						// ... create large image
						var largeImg = document.createElement('div');
						largeImg.id = 'LargeImage';
						var coors = findPos();
						// ... set position of large image
						largeImg.style.top = '0px';
						largeImg.style.left = document.getElementById('SmallImage').width + largeOffset + 'px';
						// ... set background for large image
						largeImg.style.background = '#FFF url(' + largeSrc.src + ') 0 0 no-repeat';
						document.getElementById('ProductPicture').appendChild(largeImg);
						// ... create zoom
						var zoom = document.createElement('div');
						zoom.id = 'Zoom';
						zoom.className = 'Hover';
						document.getElementById('MainContent').appendChild(zoom);
						// ... create zoom title
						var zoomTitle = document.createElement('div');
						zoomTitle.id = 'ZoomTitle';
						zoomTitle.style.top = '0px';
						zoomTitle.style.left = document.getElementById('SmallImage').width + largeOffset + largeW - 70 + 'px';
						document.getElementById('ProductPicture').appendChild(zoomTitle);
					} else {
						var largeImg = document.getElementById('LargeImage');
						largeImg.style.background = '#FFF url(' + largeSrc.src + ') 0 0 no-repeat';
					}
					// ... show large image
					document.getElementById('LargeImage').style.display = 'block';
					document.getElementById('DetailPage').className = 'Zoom';
					document.getElementById('LargeImage').style.backgroundPosition = (-1 * (((ev.clientX - smallX) * scale) - (largeW / 2))) + 'px ' + (-1 * ((((((ev.clientY - smallY) - (zoomH / 2) - 10)) + document.documentElement.scrollTop + document.body.scrollTop) * scale) - (largeH / 2))) + 'px'
					// ... show zoom
					document.getElementById('Zoom').style.display = 'block';
					document.getElementById('Zoom').style.top = ((ev.clientY + document.body.scrollTop) - (zoomH + 10)) - document.getElementById('TopNav').offsetHeight - document.getElementById('Top').offsetHeight + document.documentElement.scrollTop + document.body.scrollTop + 'px';
					if (pageCenter == 'Yes') {
						document.getElementById('Zoom').style.left = (((ev.clientX + document.body.scrollLeft) - (zoomW / 2)) - ((document.body.clientWidth - siteW) / 2)) + 'px';
					} else {
						document.getElementById('Zoom').style.left = ((ev.clientX + document.body.scrollLeft) - (zoomW / 2)) + 'px';
					}
					// ... show zoom title
					document.getElementById('ZoomTitle').style.display = 'block';
				}
			} else {
				// ... hide large image
				if (document.getElementById('LargeImage') != null) {
					document.getElementById('LargeImage').style.display = 'none';
					document.getElementById('Zoom').style.display = 'none';
					document.getElementById('ZoomTitle').style.display = 'none';
				}
				if (document.getElementById('Loading') != null) {
					document.getElementById('Loading').style.display = 'none';
				}
				setTimeout("document.getElementById('DetailPage').className = ''", 20);
			}
		} else if (largeSrc.complete != true) {
			if ((obj.className == 'Hover') && (justLoaded != 'Yes')) {
					// ... check main image source isn't 'noimage'
					if(document.getElementById('SmallImage').src.indexOf('noimage') == -1) {
						// check whether loading screen exists
						if (document.getElementById('Loading') == null) {
							// ... create loading
							var loadingScreen = document.createElement('div');
							loadingScreen.id = 'Loading';
							var coors = findPos();
							// ... set position of loading
							loadingScreen.style.top = '0px';
							loadingScreen.style.left = document.getElementById('SmallImage').width + largeOffset + 'px';
							document.getElementById('ProductPicture').appendChild(loadingScreen);
						}
						// ... show loading
						document.getElementById('Loading').style.display = 'block';
						document.getElementById('DetailPage').className = 'Zoom';
					}
			} else {
				// ... hide loading
				if (document.getElementById('Loading') != null) {
					document.getElementById('Loading').style.display = 'none';
				}
				if (document.getElementById('DetailPage') != null) {
					setTimeout("document.getElementById('DetailPage').className = ''", 20);
				}
			}
		}
	}
}
function findPos() {
	// ... find position of small image
	if (document.getElementById('SmallImage').offsetParent) {
		smallX = document.getElementById('SmallImage').offsetLeft;
		smallY = document.getElementById('SmallImage').offsetTop;
		var op = document.getElementById('SmallImage')
		while (op = op.offsetParent) {
			smallX += op.offsetLeft;
			smallY += op.offsetTop;
		}
	}
	return [smallX,smallY];
}
document.onmousemove = showZoom;
window.onresize = findPos;