function _CoolImageViewPort()
{
  this.handle;
  this.loading;
  this.image;
  this.mask;
  this.opacity=0;
  this.make_opacity = function()
  {
    if ((document.all) && (!window.opera))
      this.mask.style.filter = "progid:DXImageTransform.Microsoft.Alpha(opacity="+this.opacity+");";
    else
      this.mask.style.opacity = this.opacity/100;
    this.opacity -= 10;
    if (this.opacity == -10)
    {
      this.mask.style.display = "none";
    }
    else
      setTimeout("CoolImageViewer.viewport.make_opacity()",20);
  }
  this.image_loaded = function()
  {
    CoolImageViewer.viewport.remove_loading();
    if (CoolImageViewer.handle.style.visibility = "visible")
      CoolImageViewer.viewport.image.style.visibility = "visible";
    CoolImageViewer.viewport.mask.style.width = CoolImageViewer.viewport.image.offsetWidth;
    CoolImageViewer.viewport.mask.style.height = CoolImageViewer.viewport.image.offsetHeight;
    CoolImageViewer.viewport.mask.style.top = -CoolImageViewer.viewport.image.offsetHeight;
    CoolImageViewer.viewport.mask.style.left = 0;
    CoolImageViewer.viewport.opacity = 90;
    CoolImageViewer.viewport.make_opacity();
  }
  this.set_image = function(img,w,h)
  {
    this.image = document.createElement("IMG");
    this.image.style.visibility = "hidden";
    this.handle.appendChild(this.image);
    this.image.onclick = function() {CoolImageViewer.close();};
    if (h > (document.body.clientHeight - 110))
    {
      var old_h=h;
      h = document.body.clientHeight - 110;
      w = Math.round(h / old_h * w);
    }
    if (w > (document.body.clientWidth - 110))
    {
      var old_w=w;
      w = document.body.clientWidth - 110;
      h = Math.round(w / old_w * h);
    }
    this.image.style.width = w;
    this.image.style.height = h;
    CoolImageViewer.viewarea.style.width = w;
    CoolImageViewer.viewarea.style.height = h;
    CoolImageViewer.handle.style.width=w + 20;
    CoolImageViewer.handle.style.height=h + 20;
    CoolImageViewer.pos();
    this.set_loading();
    this.image.onload = CoolImageViewer.viewport.image_loaded;
    this.image.src = img;
  }
  this.create_self = function()
  {
    this.handle = document.createElement("DIV");
    this.handle.style.position = "relative";
    this.handle.style.zIndex = "110";
    this.handle.style.left = "0";
    this.handle.style.top = "0";
    CoolImageViewer.viewarea.appendChild(this.handle);
    this.mask = document.createElement("DIV");
    this.mask.style.position = "relative";
    this.mask.style.zIndex = "200";
    this.mask.style.left = "0";
    this.mask.style.top = "0";
    this.mask.style.width = 0;
    this.mask.style.height = 0;
    this.mask.style.backgroundColor = "#ffffff";
    CoolImageViewer.viewarea.appendChild(this.mask);
  }
  this.create_loading = function()
  {
    this.loading = document.createElement("IMG");
    this.loading.style.position = "relative";
    this.loading.style.zIndex = "120";
    this.loading.style.display = "none";
    this.loading.src = "/img/loading.gif";
    CoolImageViewer.viewarea.appendChild(this.loading);
  }
  this.remove_loading = function()
  {
    this.loading.style.display = "none";
  }
  this.set_loading = function()
  {
    this.loading.style.left = (CoolImageViewer.viewarea_width() - 44) / 2;
    this.loading.style.top = (CoolImageViewer.viewarea_height() - 44) / 2;
    this.loading.style.display = "block";
  }
  this.load = function(url,w,h)
  {
    if (this.handle)
    {
      CoolImageViewer.viewarea.removeChild(this.handle);
      delete this.handle;
      CoolImageViewer.viewarea.removeChild(this.mask);
      delete this.mask;
    }
    this.create_self();
    if (!this.loading)
      this.create_loading();
    this.set_loading();
    this.set_image(url,w,h);
  }
}

function _CoolImageViewer()
{
  this.handle;
  this.viewarea;
  this.layer;
  this.close_button;
  this.viewport;
  this.viewarea_width = function()
  {
    return this.viewarea.offsetWidth;
  }
  this.viewarea_height = function()
  {
    return this.viewarea.offsetHeight;
  }
  this.pos = function()
  {
    if (!CoolImageViewer.handle)
      return;
    CoolImageViewer.handle.style.top = (document.body.clientHeight - CoolImageViewer.handle.offsetHeight) / 2 + document.body.scrollTop;
    CoolImageViewer.handle.style.left = (document.body.clientWidth - CoolImageViewer.handle.offsetWidth) / 2;
    CoolImageViewer.close_button.style.left = CoolImageViewer.handle.offsetLeft + CoolImageViewer.handle.offsetWidth - 10;
    CoolImageViewer.close_button.style.top = CoolImageViewer.handle.offsetTop - 30;
    CoolImageViewer.close_button.style.visibility= "visible";
  }
  this.dark_all = function()
  {
    var els=document.getElementsByTagName("OBJECT");
    for (var k=0;k<els.length;k++)
      els.item(k).style.visibility="hidden";
    if (!this.layer)
    {
      this.layer = document.createElement("DIV");
      this.layer.style.position = "absolute";
      this.layer.style.zIndex = "90";
      this.layer.style.backgroundColor = "#000000";
      if ((document.all) && (!window.opera))
        this.layer.style.filter = "progid:DXImageTransform.Microsoft.Alpha(opacity=50);";
      else
        this.layer.style.opacity = 0.5;
      document.body.appendChild(this.layer);
    }
    this.layer.style.left = "0";
    this.layer.style.top = "0";
    this.layer.style.width = document.body.clientWidth;
    this.layer.style.height = document.body.scrollHeight;
  }
  this.light_all = function()
  {
    this.layer.style.left = "0";
    this.layer.style.top = "0";
    this.layer.style.width = "0";
    this.layer.style.height = "0";
    var els=document.getElementsByTagName("OBJECT");
    for (var k=0;k<els.length;k++)
      els.item(k).style.visibility="visible";
  }
  this.create_self = function()
  {
    this.handle = document.createElement("DIV");
    this.handle.style.position = "absolute";
    this.handle.style.zIndex = "100";
    this.handle.style.left=0;
    this.handle.style.top=0;
    this.handle.style.backgroundColor = "#FFFFFF";
    this.handle.style.border = "1px solid #2d549c";
    this.handle.visibility = "hidden";
    document.body.appendChild(this.handle);
    this.close_button = document.createElement("IMG");    
    this.close_button.src = "/img/high.gif";
    this.close_button.style.background = "url('/img/close.png')";
    this.close_button.className = "png";
    this.close_button.style.position = "absolute";
    this.close_button.style.zIndex = 200;
    this.close_button.style.width = "40px";
    this.close_button.style.height = "40px"; 
    this.close_button.style.cursor = "pointer";   
    this.close_button.onclick = function() {CoolImageViewer.close();this.style.display="none";};
    this.close_button.style.visibility = "hidden";
    document.body.appendChild(this.close_button);
    this.viewarea = document.createElement("DIV");
    this.viewarea.style.margin = "10px";
    this.viewarea.style.overflow = "hidden";
    this.viewarea.style.width="200px";
    this.viewarea.style.height="200px";
    this.handle.appendChild(this.viewarea);    
    this.handle.style.width=this.viewarea.offsetWidth + 20;
    this.handle.style.height=this.viewarea.offsetHeight + 20;
  }
  this.show = function(url,w,h)
  {
    if (!this.handle)
      this.create_self();
    this.dark_all();
    this.pos();
    this.close_button.style.display="block";
    this.handle.style.visibility = "visible";
    if (!this.viewport)
      this.viewport=new _CoolImageViewPort();
    this.viewport.load(url,w,h);
  }
  this.close = function()
  {
    document.body.removeChild(this.handle);
    document.body.removeChild(this.close_button);
    delete this.handle;
    delete this.viewarea;
    delete this.viewport;
    this.light_all();
  }
}
var CoolImageViewer = new _CoolImageViewer();
window.onresize = CoolImageViewer.pos;
window.onscroll = CoolImageViewer.pos;