<!--
/*
IMPORTANT: Put script after tooltip div or put tooltip div just before </BODY>. 
usage:
  <A HREF="foo.html" ONMOUSEOVER="showTip(event,'foo.gif')" ONMOUSEOUT="hideTip()">Foo</A>
*/

// Do you want tip to move when mouse moves over link?
var tipFollowMouse = false;  

// globals
var dom = (document.getElementById) ? true : false;
var ns5 = ((navigator.userAgent.indexOf("Gecko")>-1) && dom) ? true: false;
var ie5 = ((navigator.userAgent.indexOf("MSIE")>-1) && dom) ? true : false;
var t1,t2;  // for setTimeouts
var tipOn = false;  // check if over tooltip link
var tooltip, tipcss;

/////////////////////////////////////////////////
function initTip()
{
  tooltip = document.getElementById('tipDiv');
  tipcss = tooltip.style;

  if (tipFollowMouse && document.getElementById('tipDiv')) {
		document.onmousemove = trackMouse;
	}
}

window.onload = initTip;

/////////////////////////////////////////////////
// Todo: create version with width, height, html as arguments
// Todo: load img first to use image width & height to set tipcss.width...
/////////////////////////////////////////////////
function showTip(event,imgsrc) {
  if (!tooltip) return;

	if (t1) clearTimeout(t1);	if (t2) clearTimeout(t2);
	tipOn = true;

  tipcss.width           = "500px";
  tipcss.height          = "430px";
  tipcss.borderColor     = "#000000";
  tipcss.borderWidth     = "2px";
  tipcss.borderStyle     = "ridge";
  tipcss.padding         = "1px";
  tipcss.backgroundColor = "#FFFFFF"; 
//  tipcss.fontFamily      = "Verdana, arial, helvetica, sans-serif";
//  tipcss.fontSize        = "8pt";
//  tipcss.color           = "#000000";

  tooltip.innerHTML = '<img src="' + imgsrc + '" border="0">';

	if (!tipFollowMouse) positionTip(event);
	else t1=setTimeout("tipcss.visibility='visible'",100);
}

function trackMouse(event) {
	if (tipOn) positionTip(event);
}

/////////////////////////////////////////////////
function positionTip(event) {
  var offX = 25;    // how far from mouse to show tip
  var offY = 15; 
	
  if (ie5) {
    // mouse position
    var mouseX = window.event.clientX + document.body.scrollLeft;
    var mouseY = window.event.clientY + document.body.scrollTop;
    // tooltip width and height
    var tipWd = tooltip.clientWidth;
    var tipHt = tooltip.clientHeight;
    // document area in view
    var winWd = document.body.clientWidth +document.body.scrollLeft-10;
    var winHt = document.body.clientHeight+document.body.scrollTop-10;
  } else if (ns5) {
    // mouse position
    var mouseX = event.pageX;
    var mouseY = event.pageY;
    // tooltip width and height
    var tipWd = tooltip.offsetWidth;
    var tipHt = tooltip.offsetHeight;
    // document area in view (subtract scrollbar width for ns)
    var winWd = window.innerWidth -20+window.pageXOffset;
    var winHt = window.innerHeight-20+window.pageYOffset;
  }  
  
	// check mouse position against tip and window dimensions and position the tooltip 
  tipcss.left = (mouseX<(winWd/2)) ? mouseX+offX+"px" : mouseX-tipWd-offX+"px";
  tipcss.top = ((mouseY+offY+tipHt)>winHt) ? winHt-tipHt+"px" : mouseY+offY+"px";

////////////////////////
// FOR DEBUGGING //
//  tooltip.innerHTML = 'tip.left='+tipcss.left + ', tip.top=' + tipcss.top + '<BR>mouseX='+mouseX+', mouseY='+mouseY+'<BR>tipWd='+tipWd+', tipHt='+tipHt+'<BR><img src="images/space.gif" border="0" HEIGHT=450>';
////////////////////////    
  
	if (!tipFollowMouse) t1=setTimeout("tipcss.visibility='visible'",100);
}

/////////////////////////////////////////////////
function hideTip() {
	if (!tooltip) return;
	t2=setTimeout("tipcss.visibility='hidden'",100);
	tipOn = false;
}

//-->
