﻿function showImage(image, w, h, bg, imgCtrl, box)
{ document.getElementById(bg).style.display = "block"; document.getElementById(imgCtrl).src = image; center(box, w ,h, bg); return false; }

function hideBox(box, bg)
{ document.getElementById(box).style.display = "none";  document.getElementById(bg).style.display = "none"; return false; }

function center(element, w, h, bg)
{
  boxImage = document.getElementById(element);    
  
  var my_width  = 0;
  var my_height = 0;
  
  if ( typeof( window.innerWidth ) == 'number' )
  {
    my_width  = window.innerWidth;
    my_height = window.innerHeight;
  }
  else if ( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) )
  {
    my_width  = document.documentElement.clientWidth;
    my_height = document.documentElement.clientHeight;
  }
  else if ( document.body && ( document.body.clientWidth || document.body.clientHeight ) )
  {
    my_width  = document.body.clientWidth;
    my_height = document.body.clientHeight;
  }

  boxImage.style.position = 'absolute';
  boxImage.style.zIndex   = 10000000;

  var scrollY = 0;

  if ( document.documentElement && document.documentElement.scrollTop )
  {
    scrollY = document.documentElement.scrollTop;
  }
  else if ( document.body && document.body.scrollTop )
  {
    scrollY = document.body.scrollTop;
  }
  else if ( window.pageYOffset )
  {
    scrollY = window.pageYOffset;
  }
  else if ( window.scrollY )
  {
    scrollY = window.scrollY;
  }
   
  var setX = ( my_width  - w  ) / 2;
  var setY = ( my_height - h ) / 2 + scrollY;        
  
  document.getElementById(bg).style.top = "0px";
  
  setX = ( setX < 0 ) ? 0 : setX;
  setY = ( setY < 0 ) ? 0 : setY;
  
  boxImage.style.left = setX + "px";
  boxImage.style.top  = setY + "px";        
  boxImage.style.display  = 'block';
}
