﻿// OPEN ZOOM PRO V.1.0
// 2010.10.13
// Docs @ openzoompro@gmail.com 
// News @ http://openzoompro.wordpress.com/

function OZPzoomswitch(obj) {
 OZPon[obj]=((OZPon[obj])?(0):(1));
 return OZPon[obj];
}

function OZPzoomif(obj,highres) {
 if(OZPon[obj]) {OZPzoom(obj,highres);}
}

function OZPzoom(obj,highres) {
 OZPzoomratio=OZPzoomheight/OZPzoomwidth;
 if(OZPzoomoffsetx > 1) {
  OZPzoomoffset='dumb';
  OZPzoomoffsetx=OZPzoomoffsetx/OZPzoomwidth;
  OZPzoomoffsety=OZPzoomoffsety/OZPzoomheight;
 }
 if(!obj.style.width) {
  if(obj.width > 0) {
   //educated guess
   obj.style.width=obj.width+'px';
   obj.style.height=obj.height+'px';
  }
 }
 if(typeof(highres) != typeof('')) {highres=obj.src}
 var OZPstage=document.createElement("div");
 OZPstage.style.width=obj.style.width;
 OZPstage.style.height=obj.style.height;
 OZPstage.style.overflow='hidden';
 OZPstage.style.position='absolute';
 if(typeof(OZPstage.style.filter) != typeof(nosuchthing)) {
  //hi IE
  if(navigator.appVersion.indexOf('Mac') == -1) { //hi Mac IE
   OZPstage.style.filter='alpha(opacity=0)';
   OZPstage.style.backgroundColor='#ffffff';
  }
 } else {
  //hi decent gentlemen
  OZPstage.style.backgroundImage='transparent';
 }
 OZPstage.setAttribute('onmousemove','OZPhandlemouse(event,this);');
 OZPstage.setAttribute('onmousedown','OZPhandlemouse(event,this);');
 OZPstage.setAttribute('onmouseup','OZPhandlemouse(event,this);');
 OZPstage.setAttribute('onmouseout','OZPhandlemouse(event,this);');
 if(navigator.userAgent.indexOf('MSIE')>-1) {
  OZPstage.onmousemove = function() {OZPhandlemouse(event,this);}
  OZPstage.onmousedown = function() {OZPhandlemouse(event,this);}
  OZPstage.onmouseup = function() {OZPhandlemouse(event,this);}
  OZPstage.onmouseout = function() {OZPhandlemouse(event,this);}
 }
 obj.parentNode.insertBefore(OZPstage,obj);
 
 OZPwin=document.createElement("div");
 OZPwin.style.width='0px';
 OZPwin.style.height='0px';
 OZPwin.style.overflow='hidden';
 OZPwin.style.position='absolute';
 OZPwin.style.display='none';
 tw1='<div style="position:absolute;overflow:hidden;margin:';
 OZPwin.innerHTML= 
 tw1+OZPshadowthick+'px 0 0 '+OZPshadowthick+'px; background-color:'+OZPbordercolor+'; width:'+(OZPzoomwidth-OZPshadowthick*2)+'px;height:'+(OZPzoomheight-OZPshadowthick*2)+'px"></div>' +
 tw1+(OZPshadowthick+OZPborderthick)+'px 0 0 '+(OZPshadowthick+OZPborderthick)+'px; width:'+(OZPzoomwidth-OZPshadowthick*2-OZPborderthick*2)+'px;height:'+(OZPzoomheight-OZPshadowthick*2-OZPborderthick*2)+'px;"><img src="'+obj.src+'" style="position:absolute;margin:0;padding:0;border:0; width:'+(OZPzoomamount*parseInt(obj.style.width))+'px;height:'+(OZPzoomamount*parseInt(obj.style.height))+'px;" />'+((obj.src!=highres)?('<img src="'+highres+'" style="position:absolute;margin:0;padding:0;border:0; width:'+(OZPzoomamount*parseInt(obj.style.width))+'px;height:'+(OZPzoomamount*parseInt(obj.style.height))+'px;" onload="if(this.parentNode) {this.parentNode.parentNode.getElementsByTagName(\'div\')[2].style.display=\'none\';}" />'):(''))+'</div>';
 if(highres != obj.src) {
  OZPwin.innerHTML+='<div style="position:absolute; margin:'+(OZPshadowthick+OZPborderthick)+'px 0 0 '+(OZPshadowthick+OZPborderthick)+'px;">'+OZPloading+'</div>';
 }
 if(OZPshadowthick>0) {
  st1='<span style="position:absolute; display:inline-block; margin: ';
  st2='filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=\'scale\',src='
  st3='filter:alpha(opacity=0);margin:0;padding:0;border:0;"/></span>';
  OZPwin.innerHTML+=
  st1+'0 0 0 0    ; width:'+OZPshadowthick*2+'px; height:'+OZPshadowthick*2+'px;'+st2+'\''+OZPshadow+'nw.png\')"><img src="'+OZPshadow+'nw.png" style="width:'+OZPshadowthick*2+'px; height:'+OZPshadowthick*2+'px;'+st3 +
  st1+'0 0 0 '+(OZPzoomwidth-OZPshadowthick*2)+'px; width:'+OZPshadowthick*2+'px; height:'+OZPshadowthick*2+'px;'+st2+'\''+OZPshadow+'ne.png\')"><img src="'+OZPshadow+'ne.png" style="width:'+OZPshadowthick*2+'px; height:'+OZPshadowthick*2+'px;'+st3 +
  st1+''+(OZPzoomheight-OZPshadowthick*2)+'px 0 0 0px; width:'+OZPshadowthick*2+'px; height:'+OZPshadowthick*2+'px;'+st2+'\''+OZPshadow+'sw.png\',sizingMethod=\'scale\')"><img src="'+OZPshadow+'sw.png" style="width:'+OZPshadowthick*2+'px; height:'+OZPshadowthick*2+'px;'+st3 +
  st1+''+(OZPzoomheight-OZPshadowthick*2)+'px 0 0 '+(OZPzoomwidth-OZPshadowthick*2)+'px; width:'+OZPshadowthick*2+'px; height:'+OZPshadowthick*2+'px;'+st2+'\''+OZPshadow+'se.png\',sizingMethod=\'scale\')"><img src="'+OZPshadow+'se.png" style="width:'+OZPshadowthick*2+'px; height:'+OZPshadowthick*2+'px;'+st3 +
  
  st1+'0 0 0 '+(OZPshadowthick*2)+'px; width:'+(OZPzoomwidth-OZPshadowthick*4)+'px; height:'+OZPshadowthick*2+'px;'+st2+'\''+OZPshadow+'n.png\',sizingMethod=\'scale\')"><img src="'+OZPshadow+'n.png" style="width:'+(OZPzoomwidth-OZPshadowthick*4)+'px; height:'+OZPshadowthick*2+'px;'+st3 +
  st1+''+(OZPshadowthick*2)+'px 0 0 0; width:'+(OZPshadowthick*2)+'px; height:'+(OZPzoomheight-OZPshadowthick*4)+'px;'+st2+'\''+OZPshadow+'w.png\',sizingMethod=\'scale\')"><img src="'+OZPshadow+'w.png" style="width:'+(OZPshadowthick*2)+'px; height:'+(OZPzoomheight-OZPshadowthick*4)+'px;'+st3 +
  st1+''+(OZPshadowthick*2)+'px 0 0 '+(OZPzoomwidth-OZPshadowthick*2)+'px; width:'+(OZPshadowthick*2)+'px; height:'+(OZPzoomheight-OZPshadowthick*4)+'px;'+st2+'\''+OZPshadow+'e.png\',sizingMethod=\'scale\')"><img src="'+OZPshadow+'e.png" style="width:'+(OZPshadowthick*2)+'px; height:'+(OZPzoomheight-OZPshadowthick*4)+'px;'+st3 +
  st1+''+(OZPzoomheight-OZPshadowthick*2)+'px 0 0 '+(OZPshadowthick*2)+'px; width:'+(OZPzoomwidth-OZPshadowthick*4)+'px; height:'+OZPshadowthick*2+'px;'+st2+'\''+OZPshadow+'s.png\',sizingMethod=\'scale\')"><img src="'+OZPshadow+'s.png" style="width:'+(OZPzoomwidth-OZPshadowthick*4)+'px; height:'+OZPshadowthick*2+'px;'+st3;
 }
 ;
 //marker - zoomer
 obj.parentNode.insertBefore(OZPwin,OZPstage);

 OZPresize(obj);
}

function OZPresize(obj) {
 sbr=0; sbl=0;
 if(OZPzoomwidth-2*OZPborderthick-3*OZPshadowthick < 22) {sbr=1}
 if(OZPzoomheight-2*OZPborderthick-3*OZPshadowthick < 22) {sbr=1}
 if(OZPzoomwidth > parseFloat(obj.style.width)) {sbl=1;}
 if(OZPzoomheight > parseFloat(obj.style.height)) {sbl=1}
 
 if(sbr==1 && sbl == 1) {
  OZPzoomwidth=parseFloat(obj.style.width)/2;
  OZPzoomheight=parseFloat(obj.style.height)/2;
  OZPzoomratio=OZPzoomheight/OZPzoomwidth;
 }

 if(sbr==1) {
  if(OZPzoomwidth<OZPzoomheight) {
   OZPzoomheight=OZPzoomheight/OZPzoomwidth*(22+2*OZPborderthick+3*OZPshadowthick); OZPzoomwidth=22+2*OZPborderthick+3*OZPshadowthick;
  } else {
   OZPzoomwidth=OZPzoomwidth/OZPzoomheight*(22+2*OZPborderthick+3*OZPshadowthick); OZPzoomheight=22+2*OZPborderthick+3*OZPshadowthick;
  }
 }
 

 if(sbl==1) {
  if(parseFloat(obj.style.width)/parseFloat(obj.style.height) > OZPzoomwidth/OZPzoomheight) {
   OZPzoomheight=parseFloat(obj.style.height);
   OZPzoomwidth=OZPzoomheight/OZPzoomratio;
  } else {
   OZPzoomwidth=parseFloat(obj.style.width);
   OZPzoomheight=OZPzoomratio*OZPzoomwidth;
  }
 }

 OZPzoomwidth=Math.floor(OZPzoomwidth/2)*2;
 OZPzoomheight=Math.floor(OZPzoomheight/2)*2;

 ww=obj.parentNode.getElementsByTagName('div')[0];
 ww.style.width=OZPzoomwidth+'px';
 ww.style.height=OZPzoomheight+'px';
 w=ww.getElementsByTagName('div')[0];
 w.style.width=OZPzoomwidth-OZPshadowthick*2+'px';
 w.style.height=OZPzoomheight-OZPshadowthick*2+'px';
 w=ww.getElementsByTagName('div')[1];
 w.style.width=OZPzoomwidth-OZPshadowthick*2-OZPborderthick*2+'px';
 w.style.height=OZPzoomheight-OZPshadowthick*2-OZPborderthick*2+'px';
 if(OZPshadowthick > 0) {
  w=ww.getElementsByTagName('span')[1]; w.style.margin='0 0 0 '+(OZPzoomwidth-OZPshadowthick*2)+'px';
  w=ww.getElementsByTagName('span')[2]; w.style.margin=(OZPzoomheight-OZPshadowthick*2)+'px 0 0 0px';
  w=ww.getElementsByTagName('span')[3]; w.style.margin=(OZPzoomheight-OZPshadowthick*2)+'px 0 0 '+(OZPzoomwidth-OZPshadowthick*2)+'px';

  w=ww.getElementsByTagName('span')[6]; w.style.margin=(OZPshadowthick*2)+'px 0 0 '+(OZPzoomwidth-OZPshadowthick*2)+'px';
  w=ww.getElementsByTagName('span')[7]; w.style.margin=(OZPzoomheight-OZPshadowthick*2)+'px 0 0 '+(OZPshadowthick*2)+'px';

  www=(OZPzoomwidth-OZPshadowthick*4)+'px';
  w=ww.getElementsByTagName('span')[4]; w.style.width=www;
  w=w.getElementsByTagName('img')[0]; w.style.width=www;
  w=ww.getElementsByTagName('span')[7]; w.style.width=www;
  w=w.getElementsByTagName('img')[0]; w.style.width=www;
  
  www=(OZPzoomheight-OZPshadowthick*4)+'px';
  w=ww.getElementsByTagName('span')[5]; w.style.height=www;
  w=w.getElementsByTagName('img')[0]; w.style.height=www;
  w=ww.getElementsByTagName('span')[6]; w.style.height=www;
  w=w.getElementsByTagName('img')[0]; w.style.height=www;
 }
}

function OZPfindposy(obj) {
 var curtop = 0;
 if(!obj) {return 0;}
 if (obj.offsetParent) {
  while (obj.offsetParent) {
   curtop += obj.offsetTop
   obj = obj.offsetParent;
  }
 } else if (obj.y) {
  curtop += obj.y;
 }
 return curtop;
}

function OZPfindposx(obj) {
 var curleft = 0;
 if(!obj) {return 0;}
 if (obj && obj.offsetParent) {
  while (obj.offsetParent) {
   curleft += obj.offsetLeft
   obj = obj.offsetParent;
  }
 } else if (obj.x) {
  curleft += obj.x;
 }
 return curleft;
}


function OZPhandlemouse(evt,obj) {
 var evt = evt?evt:window.event?window.event:null; if(!evt) { return false; }
 if(evt.pageX) {
  nowx=evt.pageX-OZPfindposx(obj)-OZPadjustx;
  nowy=evt.pageY-OZPfindposy(obj)-OZPadjusty;
 } else {
  if(document.documentElement && document.documentElement.scrollTop) {
   nowx=evt.clientX+document.documentElement.scrollLeft-OZPfindposx(obj)-OZPadjustx;
   nowy=evt.clientY+document.documentElement.scrollTop-OZPfindposy(obj)-OZPadjusty;
  } else {
   nowx=evt.x+document.body.scrollLeft-OZPfindposx(obj)-OZPadjustx;
   nowy=evt.y+document.body.scrollTop-OZPfindposy(obj)-OZPadjusty;
  }
 }
 if(evt.type == 'mousemove') {
  OZPsetwin(obj,nowx,nowy);
 } else if(evt.type == 'mousedown') {
  OZPmouse=1; //left: 1, middle: 2, right: 3
  OZPmousey=nowy;
  OZPmousex=nowx;
 } else if(evt.type =='mouseup') {
  OZPmouse=0;
 } else if(evt.type =='mouseout') {
  OZPmouse=0;
  if(navigator.appVersion.indexOf('Mac') == -1 || navigator.appVersion.indexOf('MSIE') == -1) { //hi Mac IE
   x=obj.parentNode;
   x.removeChild(x.getElementsByTagName('div')[0]);
   x.removeChild(x.getElementsByTagName('div')[0]);
  }
 }
}


// OPEN ZOOM PRO V.1.0
// Docs @ openzoompro@gmail.com 
// News @ http://openzoompro.wordpress.com/


function OZPsetwin(obj,nowx,nowy) {
 obj.parentNode.getElementsByTagName('div')[0].style.display='block';
 if(OZPzoomoffset=='smart') {
  OZPzoomoffsetx=.1+.8*nowx/parseFloat(obj.style.width);
  OZPzoomoffsety=.1+.8*nowy/parseFloat(obj.style.height);
 }

 stage=obj.parentNode.getElementsByTagName('div')[0];
 if(OZPmouse == 1) {
  if(Math.abs(nowy-OZPmousey) >= 1) {
   OZPzoomamount*=((nowy>OZPmousey)?(0.909):(1.1));
   OZPmousey=nowy;
   if(OZPzoomamount < OZPzoomamountmin) {OZPzoomamount=OZPzoomamountmin;}
   if(OZPzoomamount > OZPzoomamountmax) {OZPzoomamount=OZPzoomamountmax;}
   stage.getElementsByTagName('div')[1].getElementsByTagName('img')[0].style.width=  parseInt(obj.style.width)*OZPzoomamount+'px';
   stage.getElementsByTagName('div')[1].getElementsByTagName('img')[0].style.height=  parseInt(obj.style.height)*OZPzoomamount+'px';
   if(stage.getElementsByTagName('div')[1].getElementsByTagName('img')[1]) {
    stage.getElementsByTagName('div')[1].getElementsByTagName('img')[1].style.width= stage.getElementsByTagName('div')[1].getElementsByTagName('img')[0].style.width;
    stage.getElementsByTagName('div')[1].getElementsByTagName('img')[1].style.height= stage.getElementsByTagName('div')[1].getElementsByTagName('img')[0].style.height;
   }
  }
  if(Math.abs(nowx-OZPmousex) >= 12 && OZPzoomwindowlock==0) {
   OZPzoomwidth*=((nowx>OZPmousex)?(1.1):(0.909));
   OZPzoomheight=OZPzoomwidth*OZPzoomratio;
   OZPresize(obj);
   OZPmousex=nowx;
  }
 }
 stage.style.marginLeft=nowx-(OZPzoomwidth -2*OZPborderthick-2*OZPshadowthick)*OZPzoomoffsetx-OZPborderthick-OZPshadowthick+'px';
 stage.style.marginTop= nowy-(OZPzoomheight-2*OZPborderthick-2*OZPshadowthick)*OZPzoomoffsety-OZPborderthick-OZPshadowthick+'px';
 clip1=0; clip2=OZPzoomwidth; clip3=OZPzoomheight; clip4=0;
 nwidth=OZPzoomwidth; nheight=OZPzoomheight;
 tmp=(1-2*OZPzoomoffsetx)*(OZPborderthick+OZPshadowthick);
 
 if(nowx-OZPzoomwidth*OZPzoomoffsetx < tmp) {
  clip4=OZPzoomwidth*OZPzoomoffsetx-nowx + tmp;
 } else if(parseFloat(nowx-OZPzoomwidth*OZPzoomoffsetx+OZPzoomwidth) > parseFloat(obj.style.width)+tmp) {
  clip2= OZPzoomwidth*OZPzoomoffsetx - nowx + parseFloat(obj.style.width)+tmp;
  nwidth=OZPzoomwidth*OZPzoomoffsetx-nowx+parseInt(obj.style.width)+OZPborderthick+OZPshadowthick;
 }
 
 tmp=(1-2*OZPzoomoffsety)*(OZPborderthick+OZPshadowthick);
 
 if(nowy-OZPzoomheight*OZPzoomoffsety < tmp) {
  clip1=OZPzoomheight*OZPzoomoffsety-nowy+tmp;
 } else if(parseFloat(nowy-OZPzoomheight*OZPzoomoffsety+OZPzoomheight) > parseFloat(obj.style.height)+tmp) {
  clip3= OZPzoomheight*OZPzoomoffsety - nowy + parseFloat(obj.style.height)+tmp;
  nheight=OZPzoomheight*OZPzoomoffsety - nowy + parseFloat(obj.style.height)+OZPborderthick+OZPshadowthick;
 }
 stage.style.width=nwidth+'px';
 stage.style.height=nheight+'px';

 stage.style.clip='rect('+clip1+'px,'+clip2+'px,'+clip3+'px,'+clip4+'px)';

 if(nowy-OZPzoomoffsety*(OZPzoomheight-2*OZPborderthick-2*OZPshadowthick) < 0) { t=-(nowy-OZPzoomoffsety*(OZPzoomheight-2*OZPborderthick-2*OZPshadowthick))} 
 else if(nowy-OZPzoomoffsety*(OZPzoomheight-2*OZPborderthick-2*OZPshadowthick) > parseFloat(obj.style.height)-OZPzoomheight+OZPborderthick*2+OZPshadowthick*2) { t=-OZPzoomamount*parseFloat(obj.style.height)+OZPzoomheight-OZPborderthick*2-OZPshadowthick*2-((nowy-OZPzoomoffsety*(OZPzoomheight-2*OZPborderthick-2*OZPshadowthick))-(parseFloat(obj.style.height)-OZPzoomheight+OZPborderthick*2+OZPshadowthick*2)); }
 else { t=(-OZPzoomamount*parseFloat(obj.style.height)+OZPzoomheight-OZPborderthick*2-OZPshadowthick*2)/(parseFloat(obj.style.height)-OZPzoomheight+OZPborderthick*2+OZPshadowthick*2)*(nowy-OZPzoomoffsety*(OZPzoomheight-2*OZPborderthick-2*OZPshadowthick)) }
 stage.getElementsByTagName('div')[1].getElementsByTagName('img')[0].style.marginTop=t+'px';

 if(stage.getElementsByTagName('div')[1].getElementsByTagName('img')[1]) {
  stage.getElementsByTagName('div')[1].getElementsByTagName('img')[1].style.marginTop=t+'px';
 }

 if(nowx-OZPzoomoffsetx*(OZPzoomwidth-2*OZPborderthick-2*OZPshadowthick) < 0) { t=-(nowx-OZPzoomoffsetx*(OZPzoomwidth-2*OZPborderthick-2*OZPshadowthick))} 
 else if(nowx-OZPzoomoffsetx*(OZPzoomwidth-2*OZPborderthick-2*OZPshadowthick) > parseFloat(obj.style.width)-OZPzoomwidth+OZPborderthick*2+OZPshadowthick*2) { t=-OZPzoomamount*parseFloat(obj.style.width)+OZPzoomwidth-OZPborderthick*2-OZPshadowthick*2-((nowx-OZPzoomoffsetx*(OZPzoomwidth-2*OZPborderthick-2*OZPshadowthick))-(parseFloat(obj.style.width)-OZPzoomwidth+OZPborderthick*2+OZPshadowthick*2)); }
 else { t=(-OZPzoomamount*parseFloat(obj.style.width)+OZPzoomwidth-OZPborderthick*2-OZPshadowthick*2)/(parseFloat(obj.style.width)-OZPzoomwidth+OZPborderthick*2+OZPshadowthick*2)*(nowx-OZPzoomoffsetx*(OZPzoomwidth-2*OZPborderthick-2*OZPshadowthick)) }
 stage.getElementsByTagName('div')[1].getElementsByTagName('img')[0].style.marginLeft=t+'px';

 if(stage.getElementsByTagName('div')[1].getElementsByTagName('img')[1]) {
  stage.getElementsByTagName('div')[1].getElementsByTagName('img')[1].style.marginLeft=t+'px';
 }
}

function OZPinit() {
 OZPadjustx=0; OZPadjusty=0;
 if(navigator.userAgent.indexOf('MSIE')>-1) {OZPadjustx=2;OZPadjusty=2;}
 if(navigator.userAgent.indexOf('Opera')>-1) {OZPadjustx=0; OZPadjusty=0;}
 if(navigator.userAgent.indexOf('Safari')>-1) {OZPadjustx=1; OZPadjusty=2;}
}

// configuration - do not modify the following, instead read the behaviors.html file in the tutorial!
var OZPon=new Array();
var OZPadjustx,OZPadjusty;
var OZPmouse=0; var OZPmousey; var OZPmousex;
var OZPloading='<div style="background-color: #ffeb77; color: #333333; padding:2px; font-family: verdana,arial,helvetica; font-size: 10px;">Loading...</div>';

var OZPzoomwidth=160;
var OZPzoomheight=120;
var OZPzoomratio;
var OZPzoomwindowlock=0;

var OZPzoomoffsetx=.5;
var OZPzoomoffsety=.5;
var OZPzoomoffset;

var OZPzoomamount=2;
var OZPzoomamountmax=3;
var OZPzoomamountmin=1;

var OZPborderthick=2;
var OZPbordercolor='#888888';

var OZPshadowthick=8;
var OZPshadow='dropshadow/';

OZPinit();

// OPEN ZOOM PRO V.1.0
// Docs @ openzoompro@gmail.com 
// News @ http://openzoompro.wordpress.com/

