<!--

// Zoom In/Zoom Out
// by Vic Phillips http://www.vicsjavascripts.org.uk
//
// Click or MouseOver the Thumbnail or any element to progressively Zoom In.
// Click again or MouseOut to progressively Zoom Out.
// The Thumbnail Image may be swapped for the Large Image WHILE Zooming.
// The Zoom may be applied to Elements other than Images.
// The Zoom can be applied concurrently to any number of Thumbnails on the same page.
// The Zoom In size is specified in the Zoom function call.

//copyright save protection:
/*
//apply zoom functionality plus download protection as follows:
<img src="image(c).jpg" border="0" width="140" height="200" onmouseover='ZMZoom(this,280,400);' onmouseOut='ZMZoom(this);' onmouseDown='ZMprotect(this);' onmouseUp='ZMprotect(this);'>

onmouseUp prevents right click saving, and right click hold & release over zoomed-in image trick
onmouseDown prevents dragging of zoomed-in image to window url
filename hidden from html body code lookup
filename obscured from javascript lvl 1 users
no safety against print screen, unless add pixelization watermark.
*/



var ZMzoomspeed = 4;	//default zoom speed. Not too fast, to allow time for loading.
var ZMAddCursor=false;  // true to add a 'hand'/'pointer' cursor to the Zoom Image, false for no cursor
var ZMCursor=document.all?'hand':'pointer';

var ZMZIndex=0;         // the base Z-Index for the images
ZMZIndex=ZMZIndex||1;
var ZMZIndx=ZMZIndex;   //all this shuffling with Z-Index is necessary to zoom and overlap multiple thumbnails correctly.

var ZMDelay=10;         //  the global zoom speed may be specified in addition to the call
ZMDelay=ZMDelay||10;

var ZMOOPCnt=0;


function ZMPos(ZM){	//gets left and top coordinate of input image
 ZMObjLeft=ZM.offsetLeft;
 ZMObjTop=ZM.offsetTop;
 while(ZM.offsetParent!=null){
  ZMObjParent=ZM.offsetParent;
  ZMObjLeft+=ZMObjParent.offsetLeft;
  ZMObjTop+=ZMObjParent.offsetTop;
  ZM=ZMObjParent;
 }
 return [ZMObjLeft,ZMObjTop];
}


function ZMZoom(ZMobj,ZMmw,ZMmh,ZMph,ZMspd){
 if (typeof(ZMobj)=='string') { ZMobj=document.getElementById(ZMobj); }
 var ZMphoto;
 if (ZMobj.tagName.toUpperCase()=='IMG'){ //if the object to zoom is an image;
  ZMphoto = ZMph || ZMobj.src; ZMphoto = ZMphoto.replace("(c).","[]."); //convert filename
  //you could've just print screened to get the image.
 }
 var ZMspd=ZMspd||ZMzoomspeed;
 if (!ZMobj.ZMoop) {  //create new zooming image/div/object:
  ZMobj.ZMoop = new ZMOOPZoom(ZMobj,ZMphoto,ZMmw,ZMmh,ZMspd);
 }
 clearTimeout(ZMobj.ZMoop.to);
 ZMobj.ZMoop.inc *= -1;
 if (ZMobj.ZMoop.large.load){ ZMobj.src = ZMobj.ZMoop.large.src; } //if large image already loaded previously, instant swap.
 ZMZIndx++;
 ZMStyle(ZMobj,{zIndex:(ZMZIndx+'')});
 ZMobj.ZMoop.zoom();
}


function ZMOOPZoom(ZMobj,ZMph,ZMmw,ZMmh,ZMspd) { //creates a new image/div and copies values of original.
 this.obj=ZMobj;
 this.objS=ZMobj.style;
 this.clone=ZMobj.cloneNode(true);
 this.ZMspd=ZMspd;
 this.ZMtop=ZMPos(ZMobj)[1];
 this.ZMleft=ZMPos(ZMobj)[0];
 //set new image's position to absolute!! at original image's left and top
 ZMStyle(this.obj,{position:'absolute',zIndex:(ZMZIndex*1+1+''),width:ZMobj.offsetWidth+'px',height:ZMobj.offsetHeight+'px',left:this.ZMleft+'px',top:this.ZMtop+'px'});
 if (ZMAddCursor){ ZMStyle(this.obj,{cursor:ZMCursor}); }
 this.minw=ZMobj.offsetWidth;
 this.minh=ZMobj.offsetHeight;
 this.maxw=ZMmw;
 this.maxh=ZMmh||ZMmw*this.minh/this.minw;
 this.thumb=ZMobj.src;
 this.large=new Image();
 this.large.obj=this.obj;
 if (ZMph){
  //set function to swap preview image with large image when large image has (pre)loaded:
  this.large.onload = function(){ this.load=true; this.obj.src=this.src; };
  //(pre)load large image:
  this.large.src = ZMph;
 }
 ZMobj.parentNode.insertBefore(this.clone,ZMobj);
 this.inc=((this.maxw-this.minw)/100);
 this.inc=-this.inc*this.ZMspd;
 this.ratio=(this.maxh/this.maxw);
 this.ref='ZM'+ZMOOPCnt;
 window[this.ref]=this;
 this.to=null;
 ZMOOPCnt++;
}

function ZMStyle(ZMele,ZMstyle){ //sets an element's style attributes.
 for (key in ZMstyle){ ZMele.style[key]=ZMstyle[key]; }
}


ZMOOPZoom.prototype.setTimeOut = function(ZMf,ZMd){ this.to=setTimeout("window."+this.ref+"."+ZMf,ZMd); }


ZMOOPZoom.prototype.zoom = function() {
//determine new size:
if (this.inc < 0) {this.w=this.minw; this.h=this.minh;} //instant zoom-out
else {
 //scale image gradually:
 this.w = parseInt(this.objS.width)+this.inc;
 this.h=parseInt(this.objS.width)*this.ratio;
 ZMStyle(this.obj,{width:(this.w)+'px',height:(this.h)+'px'});
 this.w = parseInt(this.objS.width); this.h=parseInt(this.objS.height);
}

 //keep the zoom-in image centered:
 ZMStyle(this.obj,{top:(this.ZMtop-(this.h-this.minh)/2)+'px',left:(this.ZMleft-(this.w-this.minw)/2)+'px'});

 //continue zooming in until max size reached (if this.inc negative, zooms out):
 if (this.inc > 0 && this.w < this.maxw) { this.setTimeOut('zoom();',ZMDelay); } 
 else {
  if (this.inc > 0) {
   ZMStyle(this.obj,{width:this.maxw+'px',height:this.maxh+'px'});
  } else {
   ZMStyle(this.obj,{zIndex:ZMZIndex,width:this.minw+'px',height:this.minh+'px',top:(this.ZMtop)+'px',left:(this.ZMleft)+'px'});
   ZMZIndx--;
   this.obj.src = this.thumb;
  }
 }
}


function ZMprotect(ZMobj) {
//activated on (right) mouseup. only works for images that have zoom onmouseover.
//Instantly resizes:
ZMStyle(ZMobj.ZMoop.obj,{zIndex:ZMZIndex,width:ZMobj.ZMoop.minw+'px',height:ZMobj.ZMoop.minh+'px',top:(ZMobj.ZMoop.ZMtop)+'px',left:(ZMobj.ZMoop.ZMleft)+'px'});
ZMZIndx--;
//instantly swaps zoom-in image for original thumbnail image to protect zoom-in image from "save as"
ZMobj.ZMoop.obj.src = ZMobj.ZMoop.thumb;
}


//-->