var intDelay = 400; // msec
var intTermYOffset = 23;

// create the definition layer
document.write('<div id=\"DefinitionLayer\" onload=\"\" onmouseover=\"showDefinition(this)\" onmouseout=\"hideDefinition(this)\"></div>');

// finds the position of this div relative to the root node (the HTML tag)
function findPosX(obj)
{
	var curleft = 0;
	while (obj.offsetParent) // move up through the parents until you reach the HTML element.
	{
		curleft += obj.offsetLeft
		obj = obj.offsetParent;
	}
	return curleft;
}

function findPosY(obj)
{
	var curtop = 0;
	while (obj.offsetParent)
	{
		curtop += obj.offsetTop
		obj = obj.offsetParent;
	}
	return curtop;
}

function move(element, intXPos, intYPos)
{
	elementStyle = element.style;
	elementStyle.xpos = parseInt(intXPos);
	elementStyle.ypos = parseInt(intYPos);
	elementStyle.left = elementStyle.xpos + 'px';
	elementStyle.top = elementStyle.ypos + 'px';
}

function delay(gap) // gap is in millisecs
{
	var then = new Date().getTime()
	var now = then;

	while ((now - then) < gap)
	{
		now = new Date().getTime();
	}
}

function showDefinition(definition)
{
	definition.style.visibility = 'visible';
}

function hideDefinition(definition)
{
	delay(intDelay);
	definition.style.visibility = 'hidden';
}

function showDefinitionForTerm(e, element, strText)
{
	if (!e)
		var e = window.event;

	delay(intDelay);
	var layerHandle = document.getElementById('DefinitionLayer');
	layerHandle.innerHTML = strText;

	var intXPos = findPosX(element);
	var intYPos = findPosY(element);
	if (intXPos + layerHandle.clientWidth > document.body.clientWidth)
		intXPos = document.body.clientWidth - layerHandle.clientWidth - 5; // the 5 pixel value here ensures that the term is not flush with the right hand side of the window

	move(layerHandle, intXPos, intYPos + intTermYOffset);
	layerHandle.style.visibility = 'visible';
}

function hideDefinitionForTerm(element)
{
	delay(intDelay); // delay it so it's not so touchy
	var layerHandle = document.getElementById('DefinitionLayer');
	layerHandle.style.visibility = 'hidden';
}
