var isDOM = (document.getElementById ? true : false); 
var isIE4 = ((document.all && !isDOM) ? true : false);
var isNS4 = (document.layers ? true : false);
var isDyn = (isDOM || isIE4 || isNS4);
var isNav = (navigator.appName.indexOf("Netscape") !=-1);
var isIE=document.all;

function getRef(id)
{
 if (isDOM) return document.getElementById(id);
 if (isIE4) return document.all[id];
 if (isNS4) return document.layers[id];
}

function getSty(id)
{
 return (isNS4 ? getRef(id) : getRef(id).style);
} 

if(isIE4){
    h=".pixelLeft=";
    v=".pixelTop";
    }
else {
    h=".left=";
    v=".top=";
    z=".zIndex=";
}

var l_m;
var t_m;
var dragging = false;
var dragStartTop;
var dragStartLeft;

function viewImage(img_name,e){
if(isNav){
    l_m=screen.width/2-120;
    t_m=e.pageY-200;
}
else{
    l_m=screen.width/2-120;
    t_m=event.clientY + document.body.scrollTop-200;
}

      var desc = "<table cellspacing=0 cellpadding=1 style='background-color: #F9AC53;'><tr><td>";
      desc +="<table cellspacing=0 cellpadding=0 style='background-color: #F9AC53;'><tr><td style='width:100%;'></td><td><a href='javascript: hideLayer()'>&nbsp;X&nbsp;</a></td></tr>";
      desc +="<tr><td colspan=2><img src='"+img_name+"'></td></tr></table></td></tr></table>";

      var output = getRef('img_layer');

      if(isNS4)
      { 
        document.img_layer.document.write(desc);
        document.img_layer.document.close();
      }
      else
          output.innerHTML = desc;
    
      w = document.images[0].width;
      h = document.images[0].height;
      document.getElementById('img_layer').style.left=l_m;
      document.getElementById('img_layer').style.top=t_m;
      document.getElementById('img_layer').style.width=w;
      init();
}

function hideLayer(){
   if(isNS4)
       eval("document.img_layer.top=-1000");
   if (isDOM && document.getElementById('img_layer'))
      document.getElementById('img_layer').style.top = -1000;
}

function stripPx(value) {
  if (value == "") return 0;
  return parseFloat(value.substring(0, value.length - 2));
}

function init() {

var outerDiv = document.getElementById("main");
    outerDiv.onmousedown = startMove;
    outerDiv.onmousemove = processMove;
    outerDiv.onmouseup = stopMove;

    outerDiv.ondragstart = function() { return false; }
}

function startMove(event) {
// necessary for IE
if (!event) event = window.event;

dragStartLeft = event.clientX;
dragStartTop = event.clientY;
var innerDiv = document.getElementById("img_layer");
innerDiv.style.cursor = "-moz-grab";

dragging = true;
return false;
}

function processMove(event) {
if (!event) event = window.event;  // for IE
var innerDiv = document.getElementById("img_layer");

if (dragging) {
   innerDiv.style.top = t_m + (event.clientY - dragStartTop);
   innerDiv.style.left = l_m + (event.clientX - dragStartLeft);
}
}

function stopMove() {
var innerDiv = document.getElementById("img_layer");
t_m = innerDiv.style.top;
l_m = innerDiv.style.left;
innerDiv.style.cursor = "";
dragging = false;
}