function __$(id){
    return document.getElementById(id);
}


function __addEvent(elm, evType, fn) {
    var old_fn=elm['on' + evType];
    if(typeof old_fn=='function'){
        elm['on' + evType]=function(e){
            old_fn(e);                        
            fn(e);            
        }
    }else elm['on' + evType] = fn;
}






function  __getPageSize(){
    var xScroll=0, yScroll=0, pageWidth=0,pageHeight=0;
    
    if(window.innerWidth && window.scrollMaxX) xScroll=window.innerWidth + window.scrollMaxX;   
    if(window.innerHeight && window.scrollMaxY) yScroll=window.innerHeight + window.scrollMaxY;
    
    if(document.body.scrollWidth && document.body.scrollWidth>xScroll) xScroll=document.body.scrollWidth;
    if(document.body.scrollHeight && document.body.scrollHeight>yScroll) yScroll=document.body.scrollHeight;
    
    if(document.body.offsetWidth && document.body.offsetWidth>xScroll) xScroll=document.body.offsetWidth;
    if(document.body.offsetHeight && document.body.offsetHeight>yScroll) yScroll=document.body.offsetHeight;
    
    if(document.documentElement.scrollWidth && document.documentElement.scrollWidth>xScroll) xScroll=document.documentElement.scrollWidth;
    if(document.documentElement.scrollHeight && document.documentElement.scrollHeight>yScroll) yScroll=document.documentElement.scrollHeight;
    
             
    var windowWidth=0, windowHeight=0;
    if (self.innerHeight) { // all except Explorer
        windowWidth = self.innerWidth;
        windowHeight = self.innerHeight;
    } else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
        windowWidth = document.documentElement.clientWidth;
        windowHeight = document.documentElement.clientHeight;
    } else if (document.body) { // other Explorers
        windowWidth = document.body.clientWidth;
        windowHeight = document.body.clientHeight;
    }
    
        
    // for small pages with total height less then height of the viewport
    if(yScroll < windowHeight){
        pageHeight = windowHeight;
    } else {
        pageHeight = yScroll;
    }

    // for small pages with total width less then width of the viewport
    if(xScroll < windowWidth){
        pageWidth = windowWidth;
    } else {
        pageWidth = xScroll;
    }
    
    return [pageWidth,pageHeight,windowWidth,windowHeight];
}


           
            


function __pageXOffset(){
    var x=0;               
    if(typeof window.pageXOffset!="undefined") x=window.pageXOffset;
    else if(document.body && typeof document.body.scrollLeft!="undefined"){
        x=document.body.scrollLeft;
        if(document.body.parentNode && typeof document.body.parentNode.scrollLeft!="undefined") x+=document.body.parentNode.scrollLeft;
    } 
    return x;
}


function __pageYOffset(){
    var x=0;
    if(typeof window.pageYOffset!="undefined") x=window.pageYOffset;
    else if(document.body && typeof document.body.scrollTop!="undefined"){
        x=document.body.scrollTop;
        if(document.body.parentNode && typeof document.body.parentNode.scrollTop!="undefined") x+=document.body.parentNode.scrollTop;
    }
    return x;
}


function __windowInnerWidth(){
    if(window.innerWidth){
        return window.innerWidth;
    }else if(document.body && document.body.parentElement.clientWidth){
        return document.body.parentElement.clientWidth;
    }else if(document.body && document.body.clientWidth){
        return document.body.clientWidth;
    }
    return 0;
}




function __setElementOpacity(elem, nOpacity)
{
  var opacityProp = __getOpacityProperty();

  if (!elem || !opacityProp) return; 
  
  if (opacityProp=="filter") 
  {
    nOpacity *= 100;
    

    var oAlpha = elem.filters['DXImageTransform.Microsoft.alpha'] || elem.filters.alpha;
    if (oAlpha) oAlpha.opacity = nOpacity;
    else elem.style.filter += "progid:DXImageTransform.Microsoft.Alpha(opacity="+nOpacity+")";
  }
  else 
    elem.style[opacityProp] = nOpacity;
}

function __getOpacityProperty()
{
  if (typeof document.body.style.opacity == 'string') 
    return 'opacity';
  else if (typeof document.body.style.MozOpacity == 'string')
    return 'MozOpacity';
  else if (typeof document.body.style.KhtmlOpacity == 'string')
    return 'KhtmlOpacity';
  else if (document.body.filters && navigator.appVersion.match(/MSIE ([\d.]+);/)[1]>=5.5) 
    return 'filter';

  return false; 
}




function __windowInnerHeight(){   
    if(window.innerWidth){
        return window.innerHeight;
    }else if(document.body && document.body.parentElement.clientHeight){
        return document.body.parentElement.clientHeight;
    }else if(document.body && document.body.clientHeight){
        return document.body.clientHeight;
    }
    return 0;
}


function __getStyle(obj, style){
    var ind=0;
    var _style=style;
    var buf;
    while((ind=_style.indexOf('-',ind))!=-1){        
        if(buf=_style.charAt(ind+1)){
            buf=buf.toUpperCase();
            _style=_style.substring(0,ind)+buf+_style.substr(ind+2);
            ind++;
        }else break;
    }
    
    if(obj.currentStyle){
        return obj.currentStyle[_style];
    }else if(window.getComputedStyle){
        var compStyle=window.getComputedStyle(obj, '');
        return compStyle.getPropertyValue(style);
    }
    return "";
}



function __setLargeImgOverlayPosition(){
    var buf=__getPageSize();
    var pageWidth=buf[0];   
    var pageHeight=buf[1];       // alert(pageWidth+' '+pageHeight); 
    __largeImageOverlay.style.width=pageWidth+'px';
    __largeImageOverlay.style.height=pageHeight+'px';    
}

function __setLargeImgPosition(){
    var buf=__getPageSize();
    var windowWidth=buf[2];
    var windowHeight=buf[3];
    var scrollX=__pageXOffset();
    var scrollY=__pageYOffset();     
    var w=__largeImageDiv.offsetWidth;                                                                        
    var h=__largeImageDiv.offsetHeight;          
    var left=(windowWidth-w)/2; if(left<0) left=0;
    var top=(windowHeight-h)/2; if(top<0) top=0;
    left+=scrollX;
    top+=scrollY;                      
    left=parseInt(left);top=parseInt(top);
    __largeImageDiv.style.left=left+'px';
    __largeImageDiv.style.top=top+'px';    
}



function __hideLargeImageItems(){
    __largeImageOverlay.style.display='none'; 
    __largeImageDiv.style.display='none';   
}

function __showLargeImageItems(){
    __largeImageOverlay.style.display='block'; 
    __largeImageDiv.style.display='block';   
}

function __resetLargeImagePositions(){
    __largeImageDiv.style.left='0px';
    __largeImageDiv.style.top='0px';      
    __largeImageOverlay.style.width='0px';
    __largeImageOverlay.style.height='0px';  
}


var __largeImageOverlay;
var __largeImageDiv;
     
__addEvent(window, 'load', function(){         
    __largeImageOverlay=document.createElement('div');
    __largeImageOverlay.style.position="absolute";
    __largeImageOverlay.style.display="none";
    __largeImageOverlay.style.left="0px";
    __largeImageOverlay.style.zIndex="100";
    __largeImageOverlay.style.top="0px";
    __largeImageOverlay.style.margin="0px";
    __largeImageOverlay.style.padding="0px";
    __largeImageOverlay.style.cursor='pointer';
    __largeImageOverlay.style.backgroundColor='black'; 
    __addEvent(__largeImageOverlay, 'click', __hideLargeImageItems);
    document.body.appendChild(__largeImageOverlay); 
    __setElementOpacity(__largeImageOverlay, 0.7); 
        
    __largeImageDiv=document.createElement('div');      
    __largeImageDiv.style.position="absolute";
    __largeImageDiv.style.cursor='pointer';
    __largeImageDiv.style.margin="0px";
    __largeImageDiv.style.padding="0px";
    __largeImageDiv.style.zIndex="101";
    __largeImageDiv.style.display="none";    
    document.body.appendChild(__largeImageDiv);    
    __addEvent(__largeImageDiv, 'click', __hideLargeImageItems);
                   
    
    __addEvent(window, 'resize', function(){if(__largeImageDiv.style.display=='block'){__largeImageOverlay.style.display='none'; __setLargeImgPosition();setTimeout(__setLargeImgOverlayPosition,1);setTimeout(function(){__largeImageOverlay.style.display='block';},1); } });           
});



function showLargeImg(objId, contentConteinerId){      
    __addEvent(window, 'load', function(){
        var obj=__$(objId);      
        var __content=__$(contentConteinerId).innerHTML;   
        __addEvent(obj, 'click', function(e){ 
            __resetLargeImagePositions();
            __showLargeImageItems();
            __largeImageDiv.innerHTML=__content;
            __setLargeImgPosition();                       
            __setLargeImgOverlayPosition();                        
        });
    });
}