/**
 * This event handler positions the JavaScript tooltip layer with id 'id' at the 
 * location of the mouse when the event 'event' was fired (mouse clicked).
 *
 * By default, select boxes are hidden while the tooltip is displaying in IE to 
 * account for its layering bug.
 *
 * @param event the JavaScript mouseclick event object
 * @param id the id of the tooltip layer to display
 * 
 * @author: Gerard Uffelman
 * 
 */
function showTooltip(event, id) 
{
	/* Register event handlers */
	document.getElementById(id).onmouseout = hideTooltip;
	document.getElementById(id).onclick = forceClose;

    var x;
    var y;
	var el = document.getElementById(id);
	
	if(window.event)
	{
		x = window.event.clientX + 
		    document.documentElement.scrollLeft + 
		    document.body.scrollLeft;
		    
		y = window.event.clientY + 
		    document.documentElement.scrollTop + 
		    document.body.scrollTop;
	}
	else
	{
		x = event.clientX + window.scrollX;
		y = event.clientY + window.scrollY;
	}

    /* Position the layer 8px to the left and above the mouse pointer */
	x -= 8; y -= 8;

	/* Modification - Rob Giresi.  This is to handle when tooltip
	displays past the right edge of the page */
	var tooltipWidth = 300;
	var winWidth = document.documentElement.clientWidth;
	
	if (x + tooltipWidth > winWidth)
	{
		var horizontalOffset = winWidth - (x + tooltipWidth);
		x += horizontalOffset;
	}

	el.style.left = x + "px";
	el.style.top  = y + "px";
	el.style.visibility = "visible";
	el.style.display = "block";
	el.style.position = "fixed";
	el.style.position = "";

    /* If microsoft browser, hide the select boxes */
	if(window.event)
	{
		hideSelectBoxes();
	}
}

/**
 * This JavaScript event handler positions the JavaScript hover tooltip layer 
 * with id 'id' at the location of the mouse when the event 'event' was fired 
 * (mouse hover).  
 *
 * Select boxes are hidden while the tooltip is displaying in a microsoft 
 * browser to account for its layering bug.
 *
 * @param event the JavaScript onmouseover event object
 * @param id the id of the tooltip layer to display
 * 
 */
function showHoverTooltip(event, id) 
{
	document.getElementById(id).onclick = forceClose;
    
    var x;
    var y;
	var el = document.getElementById(id);
	
	if(el.style.visibility == "visible")
	{
		return;
	}
	
	if(window.event)
	{
		x = window.event.clientX + 
		    document.documentElement.scrollLeft + 
		    document.body.scrollLeft;
		    
		y = window.event.clientY + 
		    document.documentElement.scrollTop + 
		    document.body.scrollTop;
	}
	else
	{
		x = event.clientX + window.scrollX;
		y = event.clientY + window.scrollY;
	}
	
    /* Position the layer 8px to the left and 2px above the mouse pointer */
	x -= 8; y -= 2;
	
	el.style.left = x + "px";
	el.style.top  = y + "px";
	el.style.visibility = "visible";
	el.style.display = "block";
	el.style.position = "fixed";
	el.style.position = "";
}

/**
 * Closes the Tooltip Layer, and redisplays the select boxes if the client is a
 * Microsoft browser.
 */
function forceClose(event)
{
	var current = this;
	current.style.visibility = "hidden";
	
	if(window.event)
	{
		showSelectBoxes();
	}
}

/**
 * Check if the mouse moved outside the tooltip layer (and not onto one of its 
 * children) and hide the tooltip layer.
 */
function hideTooltip(event) 
{
    var current, related;

    if(window.event)
    {
        current = this;
        related = window.event.toElement;
    }
    else
    {
        current = event.currentTarget;
        related = event.relatedTarget;
    }

    if (current != related && !contains(current, related))
    {
		current.style.visibility = "hidden";
		if(window.event)
		{
			showSelectBoxes();
		}
	}
}

/** 
 * Recursively check if node 'b' is a child of node 'a'. This kind of recursive
 * check will throw an exception if a SELECT element is encountered.  Permission
 * to get this is forbidden in many cases. The exception is caught and ignored 
 * if it occurs.
 *  
 * @param a the parent node that might contain the child node 'b'.
 * @param b the child node to checking.
 * 
 * @return true, if node 'b' is a child of node 'a', otherwise false.
 */
function contains(a, b) 
{
    try
    {
        while (b.parentNode)
        {
            b = b.parentNode;
            
            if (b == a)
            {
                return true;
            }
        }
        return false;
    }
    catch(e)
    {}
}

/**
 * Hide the hover tooltip if the mouse has moved outside the tooltip layer 
 * corresponding to the passed tooltipLayerId. 
 * 
 * In addition, check if mouse moved over the associated anchor tag 
 * corresponding to the passed anchorId.  If that is the case, do not hide the 
 * tooltipLayer.  A null value for anchorId, will cancel this test.
 * 
 * @param event, the event fired (onmouseout).
 * @param tooltipLayerId, the id of the tooltip layer to hide.
 * @param anchorId, the id of the anchor associated with the tooltipLayer. Set 
 *        to null to cancel the test.
 * 
 */
function hideHoverTooltip(event, tooltipLayerId, anchorId )
{
	var related;
	var tooltipLayer;

    if(window.event)
    {
		tooltipLayer = document.getElementById(tooltipLayerId);
     	related = window.event.toElement;
    }
    else
    {
        tooltipLayer = document.getElementById(tooltipLayerId);
        related = event.relatedTarget;
    }

	if(anchorId != null)
	{
		var anchorElement = document.getElementById(anchorId);

		if(anchorElement.id == related.id)
		{
			return;
		}
	}
	
    if(tooltipLayer != related && !contains(tooltipLayer, related))
    {
 		tooltipLayer.style.visibility = "hidden";
	}
}

/**
 * Hide all the select boxes on the page (for internet explorer only).
 */
function hideSelectBoxes()
{
	var selectBoxList = document.getElementsByTagName("select");
	for(var iter = 0; iter < selectBoxList.length; iter++)
	{
		selectBoxList[iter].style.visibility = "hidden";
	}
}

/**
 * Show all the select boxes on the page (for internet explorer only).
 */
function showSelectBoxes()
{
	var selectBoxList = document.getElementsByTagName("select");
	for(var iter = 0; iter < selectBoxList.length; iter++)
	{
		selectBoxList[iter].style.visibility = "visible";
	}
}