// JScript File

function addEvent(node, type, handler) {
    // Assign the event handler in a way our browser understands
    if (node.addEventListener) {
        node.addEventListener(type, handler, false);
    } 
    else if (node.attachEvent) {
        node.attachEvent('on'+type, handler);
    } 
    else if (node['on'+type]) {
        node['on'+type] = handler;
    }
}

/**
* Cross browser event handling function.
* @param {Element} node The dom node to attach the event handler to
* @param {String} type The type of event, e.g. 'mousedown', 'mousemove', 'resize'
* @param {Function} handler The function to be called when the event happens. It gets passed an event object e, as well as a target node.
*/
function removeEvent(node, type, handler) {
    // Assign the event handler in a way our browser understands
    if (node.addEventListener) {
        node.removeEventListener(type,handler);
    } 
    else if (node.attachEvent) {
        node.detachEvent('on'+type, handler);
    } 
    else if (node['on'+type]) {
        node['on'+type] = "";
    }
} 

function getWindowDim() {
  var myWidth = 0, myHeight = 0;
  if( typeof( window.innerWidth ) == 'number' ) {
    //Non-IE
    myWidth = window.innerWidth;
    myHeight = window.innerHeight;
  } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
    //IE 6+ in 'standards compliant mode'
    myWidth = document.documentElement.clientWidth;
    myHeight = document.documentElement.clientHeight;
  } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
    //IE 4 compatible
    myWidth = document.body.clientWidth;
    myHeight = document.body.clientHeight;
  }
  
  var scrollHeight = (document.documentElement && document.documentElement.scrollHeight) ?
    document.documentElement.scrollHeight : document.body.scrollHeight;
  var scrollWidth = (document.documentElement && document.documentElement.scrollWidth) ?
    document.documentElement.scrollWidth : document.body.scrollWidth;
  var scrollLeft = (document.documentElement && document.documentElement.scrollLeft) ?
    document.documentElement.scrollLeft : document.body.scrollLeft;
  var scrollTop = (document.documentElement && document.documentElement.scrollTop) ?
    document.documentElement.scrollTop : document.body.scrollTop;


  return { width : scrollWidth,height : scrollHeight,left : scrollLeft,top : scrollTop,windowWidth : myWidth,windowHeight : myHeight };
}  

function centerEle(ele)
{
    var windowDimensions = getWindowDim();
       
    var left = Math.floor((windowDimensions.windowWidth-ele.offsetWidth)/2.0)+windowDimensions.left;
    var top = Math.floor((windowDimensions.windowHeight-ele.offsetHeight)/2.0)+windowDimensions.top;
    
    ele.style.left = left+"px";
    ele.style.top = top+"px";
}

function DisplayImageManager(displayEleId)
{
    this.displayEleId = displayEleId;
    this.showed = false;
}

DisplayImageManager.prototype = {
    ensureInitialized : function() {
        if(this.displayEle)
            return true;
            
        this.displayEle = document.getElementById(this.displayEleId);
        
        
        if(this.displayEle)
            return true;
        else
            return false;
    },
    
    show : function(url,width,height) {
        if(this.showed)
            this.hide();
        
        if(!this.ensureInitialized())
            return;
        
        //try {
        //vytvorime si img element ktery bude zobrazovat detail image
        var img = document.createElement("IMG");
        img.alt = "detail obrázku";
        img.style.cursor = 'pointer';
        img.style.display = 'block';
        img.onclick=hideImageDetail;
        
        img.src = url;
        img.style.width = width+"px";
        img.style.height = height+"px";
        
        //pridame nove vytvoreny img element do dialogu
        var count = this.displayEle.childNodes.length;
        for(var i = 0; i < count; i++)
            this.displayEle.removeChild(this.displayEle.childNodes[0]);
            
        this.displayEle.appendChild(img);
        
        //vycentrujeme dialog
        this.displayEle.style.visibility = "hidden";
        this.displayEle.style.display = "block";
        centerEle(this.displayEle);
        this.displayEle.style.visibility = "visible";
        
        this.showed = true;
        
        var t = this;
        this.scrollHandler = function() { centerEle(t.displayEle); };
        addEvent(window,"scroll",this.scrollHandler);
        //}
        //catch(e) { alert(e); }
    },
    
    hide : function() {
        this.displayEle.style.display = "none";
        
        this.showed = false;
        removeEvent(this.scrollHandler);
    }
}

function showImageDetail(detailUrl,width,height)
{
    if(displayImageManager)
    {
        displayImageManager.show(detailUrl,width,height);
    }
}

function hideImageDetail()
{
    if(displayImageManager)
        displayImageManager.hide();
}