/**
 * Javascript tooltip class
 */
function Tooltip(id, body)
{	
	this.ttId = id;
	this.body = body;

	this.ui = document.createElement("DIV");
	this.ui.id = id;
	this.ui.style.visibility = 'hidden';
	document.body.appendChild(this.ui);
};


Tooltip.prototype.show = function(e)
{
	var ui = document.getElementById(this.ttId);

	var posx=0,posy=0;
	if(e==null) e=window.event;
	if(e.pageX || e.pageY)
	{
		posx=e.pageX;
		posy=e.pageY;
	}
	else if(e.clientX || e.clientY)
	{
		if(document.documentElement.scrollTop)
		{
			posx=e.clientX+document.documentElement.scrollLeft;
			posy=e.clientY+document.documentElement.scrollTop;
		}
		else
		{
			posx=e.clientX+document.body.scrollLeft;
			posy=e.clientY+document.body.scrollTop;
		}
	}

	posy = posy - 15;
	posx = posx - 5;
	ui.style.right = (screen.width - posx) + 'px';
	ui.style.top = posy + 'px';
	
	
	ui.style.visibility = 'visible';
	ui.style.display = 'block';	
	ui.style.position = 'absolute';
	ui.innerHTML = '<div>' + this.render()  + '</div>';

	ui.style.visibility = 'visible';	
};

Tooltip.prototype.hide = function()
{
	document.getElementById(this.ttId).style.visibility = 'hidden';
};

Tooltip.prototype.render = function()
{
	var out = '<table border=0 cellspacing=0 cellpadding=0>'
		+ '<tr>'
			+ '<td style="width: 15px; height: 15px; background-image: url(\'/jslib/Tooltip/tl.gif\'); background-repeat: no-repeat; background-position: top left;"></td>'
			+ '<td style="height: 15px; background-image: url(\'/jslib/Tooltip/t.gif\'); background-repeat: repeat-x"></td>'
			+ '<td style="width: 15px; height: 15px; background-image: url(\'/jslib/Tooltip/tr.gif\'); background-repeat: no-repeat; background-position: top right;"></td>'
			+ '<td></td>'
		+ '</tr>'

		+ '<tr>'
         + '<td bgcolor=#FFFFE7 style="width: 15px; background-image: url(\'/jslib/Tooltip/rl.gif\'); background-repeat: repeat-y"></td>'			
			+ '<td valign=top bgcolor=#FFFFE7 class=body1>' + this.body + '</td>'
		   + '<td bgcolor=#FFFFE7></td>'
			+ '<td width=28 valign=top style="background-image: url(\'/jslib/Tooltip/rr.gif\'); background-repeat: repeat-y"><img src="/jslib/Tooltip/rarrow.gif"></td>'			
		+ '</tr>'

		+ '<tr>'
			+ '<td style="width: 15px; height: 15px; background-image: url(\'/jslib/Tooltip/bl.gif\'); background-repeat: no-repeat; background-position: bottom left;"></td>'
			+ '<td style="height: 15px; background-image: url(\'/jslib/Tooltip/b.gif\'); background-repeat: repeat-x"></td>'
			+ '<td style="width: 15px; height: 15px; background-image: url(\'/jslib/Tooltip/br.gif\'); background-repeat: no-repeat; background-position: bottom right;"></td>'
			+ '<td></td>'
		+ '</tr>'						
		+ '</table>';
		
	return out;
};