// JavaScript Document
var zooming = {

   zoomWidth : 400,
   zoomObject : null, 
   step : 10,
   xy_ratio : 1,

   zoom : function(imgElem){
      this.zoomObject = imgElem;
      pos = getElementPosition(this.zoomObject);
      var width = imgElem.offsetWidth;
      var height = imgElem.offsetHeight;           
      
      var zoomDIV = document.getElementById("zoomer");
      
      zoomDIV.innerHTML = "<img id='__tmp_zoom__'  onclick='zooming.unzoom();' />";
      var zoomIMG = document.getElementById("__tmp_zoom__");
      zoomIMG.src = imgElem.src.replace('mini/','normal/');
      
      zoomDIV.style.display = "block";
      zoomDIV.style.left    = pos.x  +"px";
      zoomDIV.style.top     = pos.y  +"px"; 
      zoomDIV.style.width   = width  +"px";
      zoomDIV.style.height  = height +"px";
      
      this.xy_ratio = width / height;
  
      setTimeout("zooming.zoomStep()", 5);      
   },
   
   unzoom : function(){
      setTimeout("zooming.unzoomStep()", 5);      
   },
   
   zoomStep : function(){

       var zoomDIV = document.getElementById("zoomer");       
       pos = getElementPosition(zoomDIV);

       zoomDIV.style.left   = (pos.x-this.step)                              +"px";
       zoomDIV.style.width  = ( delpx(zoomDIV.style.width) + (this.step*2) ) +"px";
       
       zoomDIV.style.top    = (pos.y- this.step / this.xy_ratio)              +"px";
       zoomDIV.style.height = ( delpx(zoomDIV.style.height) + (this.step * 2 / this.xy_ratio)  ) +"px";
       
       if ( delpx(zoomDIV.style.width) < this.zoomWidth )
           setTimeout("zooming.zoomStep()", 5);

       
   },
   
   unzoomStep : function(){
  
       var zoomDIV = document.getElementById("zoomer");       
       pos = getElementPosition(zoomDIV);

       zoomDIV.style.left   = (pos.x + this.step)                              +"px";
       zoomDIV.style.width  = ( delpx(zoomDIV.style.width) - (this.step*2) ) +"px";
       
       zoomDIV.style.top    = (pos.y + this.step / this.xy_ratio)              +"px";
       zoomDIV.style.height = ( delpx(zoomDIV.style.height) - (this.step * 2 / this.xy_ratio)  ) +"px";
       
       
       if ( delpx(zoomDIV.style.width) > this.zoomObject.offsetWidth ){
           setTimeout("zooming.unzoomStep()", 5);
       } else {
           zoomDIV.style.display = "none";
       }    

       
   }

}



function delpx(str){
    return parseInt(str.replace(/px/, ""));
}

/**
 * Ziska pozici elementu pres offsety rodice, rekurzivne. 
 * Vraci strukturu (x,y) s pozici.
 */
function getElementPosition(elem){
  var position = {x:0, y:0};
  
  /* Dokud element existuje, pripocteme offset a prejde na rodice */
  for (;elem != null; elem = elem.offsetParent)
  {
      position.x += elem.offsetLeft;
      position.y += elem.offsetTop;
  }

  return position;
} /* getElementPosition() */