var iZoomed=0;

var sImgWaitURL = "/designpics_preload.gif";

var sImgURL="";
var sLastLoadedImgURL="none";

var vZmDiv, vZmDivText, vZmDivNewA, vZmDivNewAText, vZmDivImgWait, vZmDivImg, vImgURLNode;

iZoomedDivMaxHorMargin=100;
iZoomedDivMaxVerMargin=50;

// To unzoom when scrolled
var iOriginalScrollTop;
var iScrollInterval;

var vPreloadWait = new Image;
vPreloadWait.src = sImgWaitURL;

var vPreloadImg = new Image();
vPreloadImg.onload = function()
  {
   vZmDivImg.src = vPreloadImg.src;
  }

var iStylized=0;
window.onload = fnStylizeZoom;

function fnStylizeZoom()
{
if( !document.getElementById )
  { return; }

vBkgrDiv = document.createElement("div");
vBkgrDiv.className="ZoomedBkgr";
//vBkgrDiv.style.left = 2; 
//vBkgrDiv.style.top = 2;
vBkgrDiv.style.width=document.body.clientWidth;
vBkgrDiv.style.height=document.body.clientHeight;
vBkgrDiv.style.display='none';
vBkgrDiv.onclick=fnUnzoom;
document.body.appendChild(vBkgrDiv);

vZmDiv = document.createElement("div");
vZmDiv.className = 'Zoomed';
vZmDiv.onclick = fnUnzoom;
vZmDiv.style.top = document.body.scrollTop+50;
vZmDiv.style.left = 100;
vZmDiv.style.display='none';
vZmDiv.setAttribute( "align", "center" );
document.body.appendChild(vZmDiv);

vZmDivWaitImg = document.createElement("img"); //document.createElement("img");
vZmDivWaitImg.style.display='none';
vZmDiv.appendChild(vZmDivWaitImg);

vZmDivImg = document.createElement("img"); //document.createElement("img");
vZmDivImg.style.display='none';
vZmDiv.appendChild(vZmDivImg);

vZmDivText = document.createTextNode( "Untitled" );
vZmDiv.appendChild(vZmDivText);

vZmDivNewA = document.createElement( "a" );
vZmDivNewA.setAttribute( "target", "_blank" );
vZmDivNewAText = document.createTextNode( "[ + ]" );
vZmDivNewA.appendChild(vZmDivNewAText);
vZmDiv.appendChild(vZmDivNewA);

vZmDivWaitImg.onload = fnWaitOnLoad;

vZmDivImg.onload = fnImgOnLoad;

aObjs = document.getElementsByTagName("a");
for( i = 0 ; i < aObjs.length ; i++ )
  {
   vObj = aObjs[i];
   if( vObj.className != 'StylizeZoom' )
     { continue; }
   vObj.onclick = fnZoom;
  }

iStylized=1;
}

function fnWaitOnLoad()
{
if( iZoomed == 0 )
  { return; }
if( sImgURL == sLastLoadedImgURL )
  { return; }
vZmDiv.style.display='block';
vZmDivImg.style.display='none';
vZmDivWaitImg.style.display='block';
fnPositionZoomedDiv( 1 );
}



function fnImgOnLoad()
{
if( iZoomed == 0 )
  { return; }
sLastLoadedImgURL = sImgURL;
vZmDiv.style.display='block';
vZmDivWaitImg.style.display='none';
vZmDivImg.style.display='block';
fnPositionZoomedDiv( 0 );
}


function fnZoom()
{
if( iZoomed == 1 || iStylized == 0 )
  { return; }
iZoomed=1;

vImgURLNode = this.getAttributeNode("href"); // Getting the URL of the image to zoom
sImgURL = vImgURLNode.value;
vImgURLNode.value = 'javascript:void(0);'; // Changing the target to prevent opening it's URL
sTitle = new String("");
sTitle = this.title;
if( !(sTitle.length > 0) )
  {
   if( vNode = this.firstChild.getAttributeNode("alt") )
     {  sTitle = vNode.value; }
  }
//sTitle = this.firstChild.getAttributeNode("alt").value;
if( sTitle.length > 0 )
  { sTitle += " - "; }

vZmDivText.nodeValue = sTitle;
vZmDivNewA.setAttribute( "href", sImgURL );

vBkgrDiv.style.left=0;
vBkgrDiv.style.top=document.body.scrollTop;
vBkgrDiv.style.display='block';

vPreloadImg.src = sImgURL;
if( sImgURL == sLastLoadedImgURL )
  { fnImgOnLoad(); }
else
  { vZmDivWaitImg.src = sImgWaitURL; } // setAttribute( "src", sImgWaitURL );

// To unzoom when scrolled...
iOriginalScrollTop = document.body.scrollTop;
iScrollInterval = setInterval( fnScrollInterval, 100 );
}


function fnUnzoom()
{
// alert( " imagewidth=" + vZmDivImg.width + " imageheight=" + vZmDivImg.height );
vZmDiv.style.display='none';
vBkgrDiv.style.display='none';

vImgURLNode.value = sImgURL;

iZoomed=0;
}


function fnPositionZoomedDiv( iWait )
{
iCWidth = document.body.clientWidth;
iCHeight = document.body.clientHeight;
if( iWait == 1 )
  { 
   iIWidth = vPreloadWait.width;
   iIHeight = vPreloadWait.height;
  }
else
  { 
   iIWidth = vPreloadImg.width;
   iIHeight = vPreloadImg.height;
  }

//alert( "cwidth=" + iCWidth + " cheight=" + iCHeight + " imagewidth=" + iIWidth + " imageheight=" + iIHeight );

if( iCWidth - iZoomedDivMaxHorMargin*2 < iIWidth || iCHeight - iZoomedDivMaxVerMargin*2 < iIHeight )
  {
   fCRatio = iCWidth/iCHeight;
   fIRatio = iIWidth/iIHeight;
   if( fIRatio > fCRatio ) // The image is less fittable in width
     { iIWidth = iCWidth - iZoomedDivMaxHorMargin*2;
       iIHeight = iIWidth / fIRatio; }
   else
     { iIHeight = iCHeight - iZoomedDivMaxVerMargin*2;
       iIWidth = iIHeight * fIRatio; }
  }
if( !(iWait == 1) )
  { vZmDivImg.width = iIWidth;
    vZmDivImg.height = iIHeight; }

vZmDiv.style.left = (iCWidth - iIWidth)/2;
vZmDiv.style.top = document.body.scrollTop + (iCHeight - iIHeight)/2;
//vZmDiv.style.width = iIWidth+10;
//vZmDiv.style.height = iIHeight+10;
}


function fnScrollInterval()
{
if( iOriginalScrollTop != document.body.scrollTop )
  { clearInterval(iScrollInterval);
    fnUnzoom(); }
}