// ZoomyDiv - By, William Stephens 12/04/2009
//
// A popup div window in the style of early desktop
// applications like the Finder for GS-OS and MacOS.

// User definable global variables (read/write)
var z_margin = '80';
var z_step = '30';
var z_speed = '10';
var z_outcolor = 'black';
var z_backcolor = '#666666';
var z_textcolor = 'white';
var z_family = 'arial';
var z_fontsize = '12px';
var z_targetid = 'zoomydiv';
var z_alttagd = 'None';

// ZoomyDiv global variables (read only)
var z_alttag;
var z_factor;
var z_targ;
var z_cposleft;
var z_cpostop;
var z_cimagex;
var z_cimagey;
var z_deltaposx;
var z_deltaposy;
var z_deltaimagex;
var z_deltaimagey;
var z_theleft;
var z_thetop;
var z_thewidth;
var z_theheight;
var growtimeout;
var shrinktimeout;
var z_n = 1;

function zoomydiv(e){

// Fetch the target element
  if (!e) var e = window.event;
  if (e.target) z_targ = e.target;
  else if (e.srcElement) z_targ = e.srcElement;
  if (z_targ.nodeType == 3) z_targ = z_targ.parentNode;

// Discriminator
  if(z_targ.src) {
    if(z_targ.id.substr(0,2) == 'z:') {

// register onmouseup null handler
      document.onmouseup = znull;

// Fetch the target alt data (description)
      if(document.getElementById(z_targ.id).attributes.getNamedItem("alt") == null) {
        z_alttag = z_alttagd;
      } else {
        z_alttag = document.getElementById(z_targ.id).attributes.getNamedItem("alt").value;
      }

// Find the current window size
      getWindowSize();
      windowx = winSize[0];
      windowy = winSize[1];

// Find the current image position
      getElementPosition(z_targ);
      z_cposleft = elemPos[0];
      z_cpostop = elemPos[1];

// Find the current image size
      var cimg = document.getElementById(z_targ.id)
      z_cimagex = cimg.width;
      z_cimagey = cimg.height;

// Find the actual image size
      var img = new Image();
      img.src = z_targ.src;
      imagex = img.width;
      imagey = img.height;

// Calculate the largest displayable image size.
      if(imagex < (windowx-z_margin) && imagey < (windowy-z_margin)) {
        imagexout = imagex;
        imageyout = imagey;
      }
      if(imagex > (windowx-z_margin) && imagey < (windowy-z_margin)) {
        newimagex = (windowx-z_margin);
        z_factor = (newimagex/imagex);
        imagexout = Math.floor(z_factor*imagex);
        imageyout = Math.floor(z_factor*imagey);
      }
      if(imagex < (windowx-z_margin) && imagey > (windowy-z_margin)) {
        newimagey = (windowy-z_margin);
        z_factor = (newimagey/imagey);
        imagexout = Math.floor(z_factor*imagex);
        imageyout = Math.floor(z_factor*imagey);
      }
      if(imagex > (windowx-z_margin) && imagey > (windowy-z_margin)) {
        if(imagex > imagey) {
          newimagex = (windowx-z_margin);
          z_factor = (newimagex/imagex);
          imagexout = Math.floor(z_factor*imagex);
          imageyout = Math.floor(z_factor*imagey);
          if(imageyout > (windowy-z_margin)) {
            newimagey = (windowy-z_margin);
            z_factor = (newimagey/imageyout);
            imagexout = Math.floor(z_factor*imagexout);
            imageyout = Math.floor(z_factor*imageyout);
          }
        }else{
          newimagey = (windowy-z_margin);
          z_factor = (newimagey/imagey);
          imagexout = Math.floor(z_factor*imagex);
          imageyout = Math.floor(z_factor*imagey);
          if(imagexout > (windowx-z_margin)) {
            newimagex = (windowx-z_margin);
            z_factor = (newimagex/imagexout);
            imagexout = Math.floor(z_factor*imagexout);
            imageyout = Math.floor(z_factor*imageyout);
          }
        }
      }

// Calculate the resultant image position
      var posleft = Math.floor((windowx-imagexout)/2);
      var postop = Math.floor((windowy-imageyout)/2);

// Calculate the position steps
      z_deltaposx = ((posleft-z_cposleft)/z_step);
      z_deltaposy = ((postop-z_cpostop)/z_step);

// Calculate the size steps
      z_deltaimagex = ((imagexout-z_cimagex)/z_step);
      z_deltaimagey = ((imageyout-z_cimagey)/z_step);

/* ------------------ DEBUGGER --------------------------------------- */
// alert(
//   "\nSpeed is "+z_speed+
//   "\n\nTarget id is "+z_targ.id+
//   "\nTarget source is "+z_targ.src+
//   "\nTarget alt tag is "+z_alttag+
//   "\n\nWindow Size "+windowx+"x"+windowy+
//   "\nTarget Size is "+imagex+"x"+imagey+
//   "\n\nCurrent Position is "+z_cposleft+","+z_cpostop+
//   "\nCurrent Size is "+z_cimagex+"x"+z_cimagey+
//   "\n\nMargin "+z_margin+
//   "\nNew Position is "+posleft+","+postop+
//   "\nNew Size is "+imagexout+","+imageyout+
//   "\n\nSteps = "+z_step+
//   "\nPosition steps are ("+z_deltaposx+")("+z_deltaposy+")"+
//   "\n\nSize steps are ("+z_deltaimagex+")("+z_deltaimagey+")"+
//   "\nTimers are ("+growtimeout+")("+shrinktimeout+")"
// );
/* ------------------ DEBUGGER --------------------------------------- */

// Setup and do the grow window routine
      z_theleft = z_cposleft;
      z_thetop = z_cpostop;
      z_thewidth = z_cimagex;
      z_theheight = z_cimagey;
      z_n = 1;
      clearTimeout(growtimeout);
      grow();
    }
  }
}

function znull() {
}

function zclose() {
  if(document.getElementById('description')) {
    document.getElementById('description').style.display = 'none';
  }
}

function grow() {
  document.getElementById(z_targetid).style.display='block';
  document.getElementById(z_targetid).style.border = '2px dashed '+z_outcolor;
  z_theleft = z_theleft+z_deltaposx;
  z_thetop = z_thetop+z_deltaposy;
  z_thewidth = z_thewidth+z_deltaimagex;
  z_theheight = z_theheight+z_deltaimagey;
  document.getElementById(z_targetid).style.left=z_theleft+'px';
  document.getElementById(z_targetid).style.top=z_thetop+'px';
  document.getElementById(z_targetid).style.width=z_thewidth+'px';
  document.getElementById(z_targetid).style.height=z_theheight+'px';
  if(z_n < z_step){z_n++; growtimeout = setTimeout("grow()",z_speed);}else{
    document.getElementById(z_targetid).innerHTML = "<a href='javascript: shrink();'><image src='"+z_targ.src+"' width='"+imagexout+"' height='"+imageyout+"' alt='' style='border-color: "+z_outcolor+"' border='1' /></a><div style='z-index: 1000; position: absolute; top: 3px; left: 3px; font-family: "+z_family+"; font-size: "+z_fontsize+"; background-color: "+z_backcolor+"; color: "+z_textcolor+"' id='description'>"+z_alttag+"</div>";
    document.getElementById(z_targetid).style.border = "0px";
// register onmouseup close description handler
  document.onmouseup = zclose;

  }
}

function shrink() {
// register onmouseup null handler
  document.onmouseup = znull;
  z_n = 1;
  z_deltaposx = -z_deltaposx;
  z_deltaposy = -z_deltaposy;
  z_deltaimagex = -z_deltaimagex;
  z_deltaimagey = -z_deltaimagey;
  document.getElementById(z_targetid).innerHTML = '';
  document.getElementById(z_targetid).style.border = '2px dashed '+z_outcolor;
  clearTimeout(shrinktimeout);
  shrinkit();
}

function shrinkit() {
  z_theleft = z_theleft+z_deltaposx;
  z_thetop = z_thetop+z_deltaposy;
  z_thewidth = z_thewidth+z_deltaimagex;
  z_theheight = z_theheight+z_deltaimagey;
  document.getElementById(z_targetid).style.left=z_theleft+'px';
  document.getElementById(z_targetid).style.top=z_thetop+'px';
  document.getElementById(z_targetid).style.width=z_thewidth+'px';
  document.getElementById(z_targetid).style.height=z_theheight+'px';
  if(z_n < z_step){z_n++; shrinktimeout = setTimeout("shrinkit()",z_speed);}else{
    document.getElementById(z_targetid).style.display = 'none';
    z_n = 1;
// register onmouseup zoomydiv grow handler
    document.onmouseup = zoomydiv;
  }
}

// Get position (left/top) of HTML element
function getElementPosition(obj) {
  elemPos = new Array(2);
  elemPos[0] = findPosX(obj);
  elemPos[1] = findPosY(obj);
  return elemPos;
}
function findPosX(obj) {
  var curleft = 0;
  if(obj.offsetParent)
    while(1) {
      curleft += obj.offsetLeft;
      if(!obj.offsetParent)
        break;
        obj = obj.offsetParent;
  }
  else if(obj.x)
    curleft += obj.x;
  return curleft;
}
function findPosY(obj) {
  var curtop = 0;
  if(obj.offsetParent)
    while(1) {
      curtop += obj.offsetTop;
      if(!obj.offsetParent)
        break;
        obj = obj.offsetParent;
  }
  else if(obj.y)
    curtop += obj.y;
  return curtop;
}

// Get browser window size
function getWindowSize() {
  winSize = new Array(2);
  winSize[0] = getWindowWidth();
  winSize[1] = getWindowHeight();
  return winSize;
}
function getWindowHeight() {
  var viewportheight;
  if (typeof window.innerHeight != 'undefined') {
    viewportheight = window.innerHeight
  }
  else if (typeof document.documentElement != 'undefined' && typeof document.documentElement.clientHeight != 'undefined' && document.documentElement.clientHeight != 0) {
    viewportheight = document.documentElement.clientHeight;
  } else {
    viewportheight = document.getElementsByTagName('body')[0].clientHeight;
  }
  return viewportheight;
}
function getWindowWidth() {
  var viewportwidth;
  if (typeof window.innerWidth != 'undefined') {
    viewportwidth = window.innerWidth;
  }
  else if (typeof document.documentElement != 'undefined' && typeof document.documentElement.clientWidth != 'undefined' && document.documentElement.clientWidth != 0) {
    viewportwidth = document.documentElement.clientWidth;
  } else {
    viewportwidth = document.getElementsByTagName('body')[0].clientWidth;
  }
  return viewportwidth;
}