function _ImageViewPort()
{
  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";
      ImageViewer.set_nav();
    }
    else
      setTimeout("ImageViewer.viewport.make_opacity()",20);
  }
  this.image_loaded = function()
  {
    ImageViewer.viewport.remove_loading();
    if (ImageViewer.handle.style.visibility = "visible")
      ImageViewer.viewport.image.style.visibility = "visible";
    ImageViewer.viewport.mask.style.width = ImageViewer.viewport.image.offsetWidth;
    ImageViewer.viewport.mask.style.height = ImageViewer.viewport.image.offsetHeight;
    ImageViewer.viewport.mask.style.top = -ImageViewer.viewport.image.offsetHeight;
    ImageViewer.viewport.mask.style.left = 0;
    ImageViewer.viewport.opacity = 90;
    ImageViewer.viewport.make_opacity();
  }
  this.set_image = function(img,w,h,prev_id,next_id)
  {
    this.image = document.createElement("IMG");
    this.image.style.visibility = "hidden";
    this.handle.appendChild(this.image);
    this.image.onclick = function() {ImageViewer.close();};
    var dh=0;
    if (h > (document.documentElement.clientHeight - (dh + 110)))
    {
      var old_h=h;
      h = document.documentElement.clientHeight - (dh + 110);
      w = Math.round(h / old_h * w);
    }
    if (w > (document.documentElement.clientWidth - (dh + 110)))
    {
      var old_w=w;
      w = document.documentElement.clientWidth - (dh + 110);
      h = Math.round(w / old_w * h);
    }
    this.image.style.width = w+"px";
    this.image.style.height = h+"px";
    ImageViewer.viewarea.style.width = w+"px";
    ImageViewer.viewarea.style.height = h+"px";
    ImageViewer.handle.style.width=w*1 + 10 + "px";
    ImageViewer.handle.style.height=h*1 + 10 + "px";
    ImageViewer.pos();
    ImageViewer.prev_id=prev_id;
    ImageViewer.next_id=next_id;
    this.set_loading();
    this.image.onload = ImageViewer.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";
    ImageViewer.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";
    ImageViewer.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";
    ImageViewer.viewarea.appendChild(this.loading);
  }
  this.remove_loading = function()
  {
    this.loading.style.display = "none";
  }
  this.set_loading = function()
  {
    this.loading.style.left = ((ImageViewer.viewarea_width() - 44) / 2)+"px";
    this.loading.style.top = ((ImageViewer.viewarea_height() - 44) / 2)+"px";
    this.loading.style.display = "block";
  }
  this.load = function(mid,iid)
  {
    if (this.handle)
    {
      ImageViewer.viewarea.removeChild(this.handle);
      delete this.handle;
      ImageViewer.viewarea.removeChild(this.mask);
      delete this.mask;
    }
    this.create_self();
    if (!this.loading)
      this.create_loading();
    this.set_loading();
    var a=eval("images"+mid);
    this.set_image(a[iid]["url"],a[iid]["width"],a[iid]["height"],0,0);
  }
}

function _ImageViewer()
{
  this.handle;
  this.viewarea;
  this.layer;
  this.close_button;
  this.prev_button;
  this.next_button;
  this.viewport;
  this.prev_id;
  this.next_id;
  this.prev_image = function()
  {
    this.prev_button.style.visibility="hidden";
    this.next_button.style.visibility="hidden";
    this.viewport.load(this.prev_id);
  }
  this.next_image = function()
  {
    this.prev_button.style.visibility="hidden";
    this.next_button.style.visibility="hidden";
    this.viewport.load(this.next_id);
  }
  this.set_nav = function ()
  {
    if (this.prev_id>0)
    {
      this.prev_button.style.left = (this.handle.offsetLeft - 30)+"px";
      this.prev_button.style.top = (this.handle.offsetTop + this.handle.offsetHeight / 2 + 14)+"px";
      this.prev_button.style.visibility="visible";
    }
    else
      this.prev_button.style.visibility="hidden";
    if (this.next_id>0)
    {
      this.next_button.style.left = (this.handle.offsetLeft + this.handle.offsetWidth)+"px";
      this.next_button.style.top = (this.handle.offsetTop + this.handle.offsetHeight / 2 + 14)+"px";
      this.next_button.style.visibility="visible";
    }
    else
      this.next_button.style.visibility="hidden";
  }
  this.viewarea_width = function()
  {
    return this.viewarea.offsetWidth;
  }
  this.viewarea_height = function()
  {
    return this.viewarea.offsetHeight;
  }
  this.pos = function()
  {
    if (!ImageViewer.handle)
      return;
    if (window.innerHeight)
      ImageViewer.handle.style.top = ((window.innerHeight - ImageViewer.handle.offsetHeight) / 2 + (document.documentElement.scrollTop?document.documentElement.scrollTop:document.body.scrollTop))+"px";
    else
      ImageViewer.handle.style.top = ((document.documentElement.clientHeight - ImageViewer.handle.offsetHeight) / 2 + document.documentElement.scrollTop)+"px";
    ImageViewer.handle.style.left = ((document.documentElement.clientWidth - ImageViewer.handle.offsetWidth) / 2)+"px";
    ImageViewer.close_button.style.left = (ImageViewer.handle.offsetLeft + ImageViewer.handle.offsetWidth - 10)+"px";
    ImageViewer.close_button.style.top = (ImageViewer.handle.offsetTop - 30)+"px";
    ImageViewer.close_button.style.visibility= "visible";
  }
  this.dark_all = function()
  {
    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.documentElement.clientWidth+"px";
    this.layer.style.height = document.documentElement.scrollHeight+"px";
  }
  this.light_all = function()
  {
    this.layer.style.left = "0";
    this.layer.style.top = "0";
    this.layer.style.width = "0";
    this.layer.style.height = "0";
  }
  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.margin=0;
    this.handle.style.padding=0;
    this.handle.style.backgroundColor = "#FFFFFF";
    this.handle.style.border = "1px solid #aa0000";
    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() {ImageViewer.close();this.style.display="none";};
    this.close_button.style.visibility = "hidden";
    document.body.appendChild(this.close_button);
    this.prev_button = document.createElement("IMG");
    this.prev_button.src = "img/high.gif";
    this.prev_button.style.background = "url('img/nav_prev.png')";
    this.prev_button.className = "png";
    this.prev_button.style.position = "absolute";
    this.prev_button.style.zIndex = 200;
    this.prev_button.style.width = "30px";
    this.prev_button.style.height = "28px";
    this.prev_button.style.cursor = "pointer";
    this.prev_button.onclick = function() {ImageViewer.prev_image();};
    this.prev_button.style.visibility = "hidden";
    document.body.appendChild(this.prev_button);
    this.next_button = document.createElement("IMG");
    this.next_button.src = "img/high.gif";
    this.next_button.style.background = "url('img/nav_next.png')";
    this.next_button.className = "png";
    this.next_button.style.position = "absolute";
    this.next_button.style.zIndex = 200;
    this.next_button.style.width = "29px";
    this.next_button.style.height = "28px";
    this.next_button.style.cursor = "pointer";
    this.next_button.onclick = function() {ImageViewer.next_image();};
    this.next_button.style.visibility = "hidden";
    document.body.appendChild(this.next_button);
    this.viewarea = document.createElement("DIV");
    this.viewarea.style.margin = "5px";
    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 + 10;
    this.handle.style.height=this.viewarea.offsetHeight + 10;
  }
  this.show = function(mid,iid)
  {
    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 _ImageViewPort();
    this.viewport.load(mid,iid);
  }
  this.close = function()
  {
    document.body.removeChild(this.handle);
    document.body.removeChild(this.prev_button);
    document.body.removeChild(this.next_button);
    document.body.removeChild(this.close_button);
    delete this.handle;
    delete this.viewarea;
    delete this.viewport;
    this.light_all();
  }
}
var ImageViewer = new _ImageViewer();
window.onresize = ImageViewer.pos;
window.onscroll = ImageViewer.pos;