/*	This script displays a tooltip like box to any HTML element on a page
* Written by ChY - 3/21/06 with reference to:
* http://lixlpixel.org/javascript-tooltips/ for general structure
* http://www.quirksmode.org/js/events_properties.html#position for correct detection of mouse coordinates
*
* How to use? 
*		Call tooltip() from your js file. Normally bind it to the onMouseOver event for your HTML element.
*		Call exitTooltip() at onMouseOut event, if appropriate.
*/

// mouse coordinates
var mousex;
var mousey;

// position of the tooltip relative to the mouse in px
var offsetx;
var offsety = 8;

var myElem;
var isGecko = (navigator.userAgent.toLowerCase().indexOf("gecko") != -1);

/* Arguments: 
*		tip =>the tooltip text 
*		oElem => the HTML element object
*/
function tooltip(tip, oElem){
	myElem = oElem;
	
	if(!document.getElementById('tooltip')){ 
		NewElement('tooltip');
	}

	var oToolTipBox = document.getElementById('tooltip');
	oToolTipBox.innerHTML = tip;
	
	if (tip.length > 0 && parseInt(oToolTipBox.style.top) > (GetElemPositionTop(oElem) - 25)) {
		oToolTipBox.style.display = 'block';
	}
	
	document.onmousemove = GetMousePosition;
}

// creates a div box for the tooltip
function NewElement(newid){ 
    if(document.createElement)
    { 
        var el = document.createElement('div'); 
        el.id = newid;     
        with(el.style)
        { 
            display = 'none';
            position = 'absolute';
        } 
        el.innerHTML = ' '; 
        document.body.appendChild(el); 
    } 
} 

// find the top position of the element we display tooltip for:
function GetElemPositionTop(o){
	var oElem = o;
	var nTop = 0;
	while(oElem){
		nTop += oElem.offsetTop;
		oElem = oElem.offsetParent;
	}
	return nTop;
}

function GetElemPositionLeft(o){
	var oElem = o;
	var nTop = 0;
	while(oElem){
		nTop += oElem.offsetLeft;
		oElem = oElem.offsetParent;
	}
	return nTop;
}

// find the mouse coordinates
function GetMousePosition(e){
	mousex = 0;
	mousey = 0;
	if (!e) var e = window.event;
	if (e.pageX || e.pageY)
	{
		mousex = e.pageX;
		mousey = e.pageY;
	}
	else if (e.clientX || e.clientY)
	{
		mousex = e.clientX + document.body.scrollLeft;
		mousey = e.clientY + document.body.scrollTop;
	}
	
	var oToolTipBox = document.getElementById('tooltip');
	if (isGecko) { 
		offsetx = 2;
	}else{ 
		offsetx = -8;
	}
    oToolTipBox.style.left = (GetElemPositionLeft(myElem) + parseInt(myElem.style.width) + offsetx) + 'px'; // (mousex+offsetx+16) + 'px';
    oToolTipBox.style.top = (mousey+offsety) + 'px';

}

// normally bind this function to the onMouseOut event of your HTML element
function exitTooltip(){
    document.getElementById('tooltip').style.display = 'none';
}