﻿var iz = {};

iz.leftTrim = 0;
iz.topTrim = 0;
iz.leftClickTrim = -3
iz.topClickTrim = -2;
iz.speed = 2;
iz.zoomableImageId = 'izZoomableImage';
iz.zoomedImageId   = 'izZoomedImageLink';
iz.dragMsgId       = 'izDragMsg';
iz.zoomLinkId      = 'izZoomLink';
iz.imageZoomAreaId = 'izImageZoomArea';
iz.loadingOverlayId = 'zoomLoading';
iz.storeHeight		 = 0;
iz.hoverText == '';

iz.dragging = false;
iz.zooming = false;
iz.zoomedImage;
iz.zoomableImage;
iz.imageZoomArea;
iz.mousePos;
iz.initialXPos;
iz.initialYPos;
iz.zoomedImageSrc;
iz.clickXPos;
iz.clickYPos;
iz.dragMsg;
iz.thumbselected;
iz.dontKill = true;
iz.initialized = false;
iz.positionsSet = false;

iz.initialise = function(iThumbSelected, sZoomedImage){
	iz.thumbselected = iThumbSelected; /* relates to the id izThumbs(n) currently selected */

    this.zoomableImage = document.getElementById(this.zoomableImageId);
    this.zoomedImage = document.getElementById(this.zoomedImageId);
    this.imageZoomArea = document.getElementById(this.imageZoomAreaId);
    this.loadingOverlay = document.getElementById(this.loadingOverlayId);
    this.dragMsg = document.getElementById(this.dragMsgId);
    if(this.zoomableImage){
        if(this.zoomedImage)this.zoomedImageSrc = this.zoomedImage.href
    }
    if (sZoomedImage == ''){
			document.getElementById('izZoomLink').style.visibility = 'hidden';
    }
    setTimeout('iz.killAllButLast(\'MagicZoomPup\')', 1000);
    setTimeout('iz.killAllButLast(\'MagicZoomBigImageCont\')', 1000);
    this.initialized = true;
}

iz.setPositions = function(){
    var zoomableHeight = iz.zoomableImage.offsetHeight;

    if(zoomableHeight > 0){

        iz.imageZoomArea.style.height = zoomableHeight + 'px';
        document.getElementById('izThumbs').style.top = zoomableHeight + 51 + 'px';
        document.getElementById('prodImageZoom').style.height = zoomableHeight + (document.getElementById('izZoomLink').offsetHeight) + 1 + 'px';
        document.getElementById('izZoomLink').style.top = ((zoomableHeight + 43)-document.getElementById('izZoomLink').offsetHeight) + 'px';

	    iz.maskHeight = zoomableHeight;
    }
    iz.positionsSet = true;
}

iz.selectImg = function(webImageUrl, zoomedImageUrl, thumbId){
  if(this.thumbselected == thumbId || !this.initialized || !this.positionsSet) return;

  this.hideLoading();
  MagicZoom_stopZooms();
  this.killMagicZoomOverlays();
  iz.storeHeight = 0;
  
  this.clickXPos = null;
  this.clickYPos = null;
  if(this.zooming)this.zoom();

  var zoomableParent = this.zoomableImage.parentNode;
  var newZoomableImage;

  zoomableParent.removeChild(this.zoomableImage);

this.loadingOverlay = document.getElementById(this.loadingOverlayId);

if (this.loadingOverlay)  zoomableParent.removeChild(this.loadingOverlay);
  newZoomableImage = document.createElement("img");

  newZoomableImage.setAttribute("id", this.zoomableImageId);
  newZoomableImage.setAttribute("src", webImageUrl);
 
  zoomableParent.appendChild(newZoomableImage);
if (this.loadingOverlay)  zoomableParent.appendChild(this.loadingOverlay);
  this.zoomableImage = document.getElementById(this.zoomableImageId);
  this.zoomableImage.style.width = '320px';
  
  this.loadingOverlay = document.getElementById(this.loadingOverlayId);

  //if no zoomedImageURL variable is passed because there is no high res image then do not display the Zoom button.
	if (zoomedImageUrl == '') { 
		document.getElementById('izZoomLink').style.visibility = 'hidden';
	}
	else {
		document.getElementById('izZoomLink').style.visibility = 'visible';
	}

	this.zoomedImageSrc = zoomedImageUrl;
	if(this.zoomedImage){
		this.zoomedImage.href = this.zoomedImageSrc;
    }
    iz.selectThumb(thumbId);
    iz.checkHeightChange((zoomedImageUrl != ''));
}

iz.checkHeightChange = function(IsImgZoomable){
	if (iz.storeHeight == parseInt(iz.zoomableImage.offsetHeight + '') && iz.storeHeight > 10){
		iz.setPositions();
    	iz.storeHeight = parseInt(iz.zoomableImage.offsetHeight + '');
    	if(IsImgZoomable) MagicZoom_findZooms();
	}
	else{
		iz.setPositions();
    	iz.storeHeight = parseInt(iz.zoomableImage.offsetHeight + '');
		setTimeout('iz.checkHeightChange(' + IsImgZoomable + ');',500);
	}
}

iz.selectThumb = function(thumbId){
    var thumb;
    var i=1;
    while(thumb = document.getElementById('izThumbs' + i)){
        if(i == thumbId){
            thumb.style.display = 'block';
            iz.thumbselected = i;
        }
        else thumb.style.display = 'none';
        i++;
    }
}

iz.changecolourselector = function(obj){
	if (obj.className == 'selector')
		obj.className='selector selected';
	else
		obj.className='selector';
}

iz.killMagicZoomOverlays = function(){
    //Magic Zoom leaves the hover glass div and zoom div behind when images are swapped
    //This kills them of, which is necessary to avoid display problems 
    this.killMZOverlay('MagicZoomPup');
    this.killMZOverlay('MagicZoomBigImageCont');
}
iz.killMZOverlay = function(areaToKill){
    try{
        pup = iz.getElementsByClassName(document.getElementById('izZoomedImageLink'), areaToKill);
        for(var i=0;i<pup.length;i++){
            pup[i].parentNode.removeChild(pup[i]);
        }
    }
    catch(e){}
}

iz.killAllButLast = function(areaToKill){
    try{
        pup = iz.getElementsByClassName(document.getElementById('izZoomedImageLink'), areaToKill);
        for(var i=0;i<pup.length-1;i++){
            pup[i].parentNode.removeChild(pup[i]);
        }
        setTimeout('iz.killAllButLast(\'' + areaToKill + '\')', 1000);
    }
    catch(e){}
}


iz.hideLoading = function(){
    try{
        pup = iz.getElementsByClassName(document.getElementById('izZoomedImageLink'), 'MagicZoomLoading');
        for(var i=0;i<pup.length;i++){
            pup[i].style.display = 'none';
        }
    }
    catch(e){}
}

iz.getElementsByClassName = function(node, className) {
  var children = node.getElementsByTagName('*');
  var elements = new Array();

  for (var i = 0; i < children.length; i++) {
    var child = children[i];
    var classNames = child.className.split(' ');
    for (var j = 0; j < classNames.length; j++) {
      if (classNames[j] == className) {
        elements.push(child);
        break;
      }
    }
  }
  return elements;
}

function addOnLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      oldonload();
      func();
    }
  }
}

iz.trace = function(str){
    document.getElementById('trace').innerHTML += str + ', ';
}