function toggleDisplay(e,divId) {
  if (!e) e = window.event;
  var div = document.getElementById(divId);
  div.style.display = (div.style.display=="block" ? "none" : "block");
  if(div.style.display=="block"){
      div.style.left=e.clientX+50;
      div.style.top=e.clientY-10;
  }
}

function showPan(img,desc) {
    if(img==0){
     document.getElementById("showPan").style.visibility='hidden';
     document.getElementById("showPan").style.display='none';
     document.getElementById("flasheader").style.visibility='visible';
     document.getElementById("flasheader").style.display='block';
    }else{
     document.getElementById("panFrame").style.width="200px";
     document.getElementById("panFrame").style.height="100px";
     document.getElementById("panDesc").innerHTML='';
     document.getElementById("panDesc").style.visibility='hidden';
     document.getElementById("panDesc").style.display='none';
     document.getElementById("flasheader").style.visibility='hidden';
     document.getElementById("flasheader").style.display='none';
     document.getElementById("showPan").style.visibility='visible';
     document.getElementById("showPan").style.display='block';
      var newImg;
      newImg = new Image();
      newImg.src = img;
      document.getElementById("pan").innerHTML="<img name='imgPan' src='/images/spacer.gif' border=0 width='50' height='50' onclick='showPan(0,0);' alt='Click here to Close'>";
      newImg.onload = function()
      {
       w = newImg.width;
       h = newImg.height;
       document.getElementById("panFrame").style.width=w+20+"px";
       document.getElementById("panFrame").style.height=h+20+"px";
       document.getElementById("pan").innerHTML="<img name='imgPan' src='"+img+"' border=0 width='"+w+"' height='"+h+"' onclick='showPan(0,0);' alt='Click here to Close'>";
       document.getElementById("panDesc").style.visibility='hidden';
       document.getElementById("panDesc").style.display='none';
       document.getElementById("panDesc").innerHTML=desc;
      }
      if (newImg.complete) {
       w = newImg.width;
       h = newImg.height;
       document.getElementById("panFrame").style.width=w+20+"px";
       document.getElementById("panFrame").style.height=h+20+"px";
       //document.getElementById("pan").innerHTML="<img name='imgPan' src='"+img+"' border=0 width='"+w+"' height='"+h+"' onclick='showPan(0,0);' alt='Click here to Close'>";
       document.getElementById("pan").innerHTML="<img name='imgPan' src='"+img+"' border=0 width='0' height='0' onclick='showPan(0,0);' alt='Click here to Close'>";
       document.getElementById("panDesc").innerHTML=desc;
       document.getElementById("panDesc").style.visibility='visible';
       document.getElementById("panDesc").style.display='block';
       zoomImg('imgPan', 1, 1, w, h);
      }
    }
}


function zoomImg(imgname, total, steps, maxx, maxy)	{
// convert the total from seconds to miliseconds
total = total * 1000;
objref = eval("document.getElementById('"+imgname+"')");
currentx = imgPan.width;
currenty = imgPan.height;
//currentx = objref.width;
//currenty = objref.height;
// work out how much we need to increase the image by each step
// devide image sizes by number of steps to get the amount we need to change each step
stepx = maxx / steps;
stepy = maxy / steps;
// devide the total time (in ms) by the number of steps to get the interval time
inttime = total / steps;
// set the interval to increase the size of the image by the required pixels 
functionRef = "resizeImg('imgPan', "+stepx+", "+stepy+", "+maxx+", "+maxy+")";
ival = setInterval(functionRef, inttime);
}
function resizeImg(imgname, dx, dy, maxx, maxy) {
objref = eval("document.getElementById('"+imgname+"')");
currentx = imgPan.width;
currenty = imgPan.height;
if ((currentx<maxx-dx) && (currenty<maxy-dy)) {
imgPan.height = currenty + dy;
imgPan.width = currentx + dx;
}
else {
clearInterval(ival);
imgPan.height = maxy;
imgPan.width = maxx;
   }
}
