// ****************get the image size *******************
var h;// = getHW(imageURL,"h");
var w;// = getHW(imageURL,"w");
var MaxWidth=500;
var xShift=20//this is use to adjust for the shift of the image container
var yShift=100;//this is use to adjust for the shift of the image container


function getDocWidth(){return(document.all?getTrueBody().scrollLeft+getTrueBody().clientWidth:pageXOffset+window.innerWidth-15);}
function getDocHeight(){return(document.all?Math.min(getTrueBody().scrollHeight,getTrueBody().clientHeight):Math.min(window.innerHeight));}
function getTrueBody()
     {
          return((!window.opera&&document.compatMode&&document.compatMode!="BackCompat")||window.opera)?document.documentElement:document.body
     }
function debugOnClickEventHandler(e)
     {
     	s=typeof e+": \n";
     	s+='type = '+e.type+"\n";
     	s+='target = '+e.target+"\n";
     	s+='layerX = '+e.layerX+"\n";
     	s+='layerY = '+e.layerY+"\n";
     	s+='pageX = '+e.pageX+"\n";
     	s+='pageY = '+e.pageY+"\n";
     	s+='screenX = '+e.screenX+"\n";
     	s+='screenY = '+e.screenY+"\n";
     	s+='which = '+e.which+"\n";
     	s+='modifiers = '+e.modifiers+"\n";
     	alert(s);
     }
var offsetfrommouse=[15, 15];
var displayduration=0;
var currentimageheight=270;

if(document.getElementById||document.all)
{
	document.write('<div id="trailimageid">');
	document.write('</div>');
}

function oFollow()
     {
          if(document.getElementById)
               return document.getElementById("trailimageid").style
          else if(document.all)
               return document.all.trailimagid.style
     }
function oFollownostyle()
     {if(document.getElementById)
          return document.getElementById("trailimageid")
     else if(document.all)
          return document.all.trailimagid
     }

function truebody(){return(!window.opera&&document.compatMode&&document.compatMode!="BackCompat")?document.documentElement:document.body}

//get image size (only works for preloaded images)
function getHW(imgURL, hwSpecs)
              {
              var newImg = new Image();
              newImg.src = imgURL;
              if (hwSpecs=="h")
                  return (newImg.height);
              else
                  return (newImg.width);
              }


function showPOPUP(imageURL,title)
     {
          document.onmousemove=followmouse;
          popupImage='';
          newHTML='<DIV>';
              // ****************get the image size *******************
              //get global variables values
              h = getHW(imageURL,"h");
              w = getHW(imageURL,"w");
               //make all images 500w x h*(?)
               //must compute h first because 'w' will change
               h=h*(MaxWidth/w);w=MaxWidth;

          //newHTML=newHTML+'<div style="padding: 5px; background-color: #FFF; border: 1px solid #888;">';
          newHTML=newHTML+'<div style="padding: 0px; background-color: #FFF; border: 0px solid #888; width:'+ (w+6) + 'px;">';
          //newHTML=newHTML+'<div style="margin: 0px; border: 1px solid #ddd; width:'+ (w+4) + 'px; height:'+ (h+32) + 'px;">';
          //newHTML=newHTML+'<div style="margin: 0px; border: 1px solid #ddd; width:'+ (w+4) + 'px; height:'+ (h+32) + 'px;">';
          newHTML=newHTML+'<div style="margin: 0px; border: 1px solid #ddd; width:'+ (w+1) + 'px; height:'+ (h+26) + 'px;">';
          newHTML=newHTML+'<div style="margin: 0px; border: 1px solid #ddd; width:'+ (w+1) + 'px; height:'+ (h+26) + 'px;">';
          //newHTML=newHTML+'<div id="ttlH2">'+title+ ' | height: ' + getHW(imageURL,"h")+ ' ... width: ' + getHW(imageURL,"w") + '</div>';
          newHTML=newHTML+'<div id="ttlH2">'+title+ '</div>';
          //newHTML=newHTML+'<div align="center" style="padding: 10px 5px 3px 3px;">';
          newHTML=newHTML+'<img src="'+imageURL+'"';

            if(h>0&&w>0){
                  var xcoord=offsetfrommouse[0]
                  var ycoord=offsetfrommouse[1]
                  var docwidth=document.all?truebody().scrollLeft+truebody().clientWidth:pageXOffset+window.innerWidth-15
                  var docheight=document.all?Math.min(truebody().scrollHeight,truebody().clientHeight):Math.min(window.innerHeight)

                  newHTML=newHTML+' height="'+ h +'" width="'+w+'"';
                  }
                  
          newHTML=newHTML+' border="0" /></div>';
          newHTML=newHTML+'</div>';
              newHTML=newHTML+'<DIV id="paper_shadow" align=right>';
                  newHTML=newHTML+'<IMG height=30 src="http://www.modernfalconry.com/images/paper_shadow.jpg" width=100%>';
              newHTML=newHTML+'</DIV>';
          newHTML=newHTML+'</DIV> <!-- end large_shadow -->';
          oFollownostyle().innerHTML=newHTML;
          oFollow().display="inline";
     }

function hidePOPUP()
    {
        oFollow().innerHTML=" ";oFollow().display="none"
        document.onmousemove=""
        oFollow().left="-9000px"
    }

function followmouse(e)
     {
          var xcoord=offsetfrommouse[0]
          var ycoord=offsetfrommouse[1]
          var docwidth=document.all?truebody().scrollLeft+truebody().clientWidth:pageXOffset+window.innerWidth-15
          var docheight=document.all?Math.min(truebody().scrollHeight,truebody().clientHeight):Math.min(window.innerHeight)
          if(typeof e!="undefined")//none IE browser
               {
                  //this shifts the image left if right screen is too narrow
                  if(docwidth>=w)
                         {
                              if(docwidth-e.pageX>=w) {xcoord=e.pageX+xShift;
                                   }
                              else {xcoord = e.pageX - w-xShift;}
                         }
                  else {
                         xcoord = docwidth/2;}

                  //always show images below the cursor...
                  //if((docheight-e.pageY)<h)
                  //    {
                            ycoord+=e.pageY;
                  //    }
                 // else{ycoord+=e.pageY;}
                 // else{ycoord+=e.pageY;}
              }
          else if(typeof window.event!="undefined")//IE
                  {
                       if(docwidth>=w)
                              {
                                   //alert("1" + "\n" + docwidth + "\n" + w)
                                   if(docwidth-event.clientX>=w) xcoord=event.clientX+xShift;
                                   else if(event.clientX>w ){xcoord = event.clientX -w - (xShift*4);}
                                   //else if(docwidth-event.clientX<w){xcoord = event.clientX - (event.clientX +w - docwidth)-xShift*1.5;}
                                   else if(docwidth-event.clientX<w){xcoord = event.clientX - w -(xShift*4);}
                                   else xcoord = docwidth/2;
                              }
                         else
                              {
                                  // if(docwidth-event.clientX<w){xcoord = event.clientX - (event.clientX +w - docwidth)-xShift*1.5;}
                                   if(docwidth-event.clientX<w){xcoord = event.clientX - w -xShift;}
                                   else xcoord = docwidth/2;


                                   }
                       if(docheight-event.clientY<(h))
                            {ycoord+=event.clientY+truebody().scrollTop-Math.max(0,(h+event.clientY-docheight))-yShift;}
                       //else{ycoord+=truebody().scrollTop+event.clientY;}
                       else if(docheight - event.clientY<h)
                              {ycoord+=event.clentY+15; h=h*event.clientY/docheight-yShift;
                                        w=w*event.clientY/docheight;}
                       else{ycoord+=truebody().scrollTop+event.clientY-yShift;}
                 }
          if(ycoord<0){ycoord=ycoord*-1;}
          oFollow().left=xcoord+"px"
          oFollow().top=ycoord+"px"
     }