
function tt_Position(x, y)
{
	this.x = x;
	this.y = y;
}



function tt_Tooltip(sDivID, sFrmID, sControlID, iHorizontalMargin, iVerticalMargin)
{
	this.div = document.getElementById(sDivID);
	this.frm = document.getElementById(sFrmID);
	this.ctrl = document.getElementById(sControlID);
	this.tipContainer = document.body;
	this.horizontalMargin = iHorizontalMargin;
	this.verticalMargin = iVerticalMargin;
	this.baseAbsPos = new tt_Position(0,0);
	this.basePos = new tt_Position(0,0);
	
	this.init();

}
tt_Tooltip.prototype.init = 
	function()
	{
		if ( this.ctrl )
		{
			this.ctrl.tt_tooltip = this;
			this.div.tt_tooltip = this;
			this.frm.tt_tooltip = this;
			this.ctrl.onmouseenter = tt_ctrl_mouseenter;
			//this.ctrl.onmousemove = tt_ctrl_mousemove;
			this.ctrl.onmouseout = tt_ctrl_mouseout;
			this.div.onmouseout = tt_div_mouseout;
			this.tipContainer = this.getTipContainer();

			//Zorg dat de DIV dimensies heeft voor het gebruiken van de offsetWidth
			this.div.style.visibility = 'hidden';
			this.div.style.display = 'inline';

			//Make sure the dimensions of the frame and te div are set (not auto)
			this.frm.style.pixelWidth = this.div.offsetWidth;
			this.frm.style.pixelHeight = this.div.offsetHeight;
			this.div.style.pixelWidth = this.div.offsetWidth;
			this.div.style.pixelHeight = this.div.offsetHeight;

			//Zet de visibility en de display weer terug
			this.div.style.display = 'none';
			this.div.style.visibility = 'visible';
		}
	}
tt_Tooltip.prototype.getTipContainer =
	function()
	{
		//Bepaalt welk element de tooltip bevat waarbinnen de tooltip getoond wordt ondanks de "position absolute"
		//eigenschap van de tooltip. Dit is het eerste parentElement van de tooltip waarvan de overflowX of de
		//overflowY niet visible is.
		var parentElement = this.div.parentElement;
		
		while ( parentElement != null && parentElement != document.body &&
				parentElement.currentStyle.overflowX == 'visible' && 
				parentElement.currentStyle.overflowY == 'visible')
		{
			parentElement = parentElement.parentElement;
		}
		if (parentElement == null)
		{
			parentElement = document.body;
		}
		
		return parentElement;
		
	}
/*
tt_Tooltip.prototype.positionTooltipByMouseEvent =
	function()
	{

		var left = this.basePos.x;
		var top = this.basePos.y;

		if (window.event)
		{
			left += window.event.offsetX;
			top += window.event.offsetY;
		}

		if ( this.horizontalMargin )
		{
			left += this.horizontalMargin;
		}
		if ( this.verticalMargin )
		{
			top += this.verticalMargin;
		}
	
		this.positionTooltip(left, top);
	}
*/
tt_Tooltip.prototype.positionTooltip =
	function()
	{
		var absLeft = this.baseAbsPos.x + this.horizontalMargin;
		var absTop = this.baseAbsPos.y + this.ctrl.offsetHeight + this.verticalMargin;
		var left = this.basePos.x + this.horizontalMargin;
		var top = this.basePos.y + this.ctrl.offsetHeight + this.verticalMargin;
		
		//Zorg dat de DIV dimensies heeft voor het gebruiken van de offsetWidth
		this.div.style.visibility = 'hidden';
		this.div.style.display = 'inline';

		if ((left + this.div.offsetWidth) > (this.tipContainer.clientWidth))
		{
			absLeft -= ((left + this.div.offsetWidth) - (this.tipContainer.clientWidth));
		}
		if ((top + this.div.offsetHeight) > (this.tipContainer.clientHeight))
		{
			//Toon tooltip boven item
			absTop = absTop - this.verticalMargin - this.ctrl.offsetHeight - this.div.offsetHeight;
		}

		//Zet de visibility en de display weer terug
		this.div.style.display = 'none';
		this.div.style.visibility = 'visible';

		
		this.frm.style.left = absLeft;
		this.div.style.left = absLeft;
		this.frm.style.top = absTop;
		this.div.style.top = absTop;
	}

tt_Tooltip.prototype.getBasePositionForTooltip = 
	function (bCalculateForAbsolutePositioning)
	{
		//Bepaalt de absolute position voor de tooltip om uitgelijnd te worden met de linkerbovenhoek van
		//de control waarvoor de tooltip getoond wordt.
		var pos = new tt_Position(0,0);
		var absoluteOffsetParent = null;
		var offsetParentElement = null;

		if (typeof(this.ctrl.offsetTop) == 'number')
		{
			//Reken je eigen border niet mee (reken alleen de offset)
			pos.y = this.ctrl.offsetTop;
		}
		if (typeof(this.ctrl.offsetLeft) == 'number')
		{
			//Reken je eigen border niet mee (reken alleen de offset)
			pos.x = this.ctrl.offsetLeft;
		}
		offsetParentElement = this.ctrl.offsetParent;
		
		//De absolute position wordt vanaf het eerste parent (niet de offsetParent!!) element van de tooltip
		//gerekend dat geen overflow 'visible' heeft. Vandaar dat er gekeken wordt of de offsetParent
		//het de tipContainer is.
		while ( offsetParentElement && 
				( !bCalculateForAbsolutePositioning ||
				(offsetParentElement.currentStyle.overflowX == 'visible' && 
				offsetParentElement.currentStyle.overflowY == 'visible') ||
				offsetParentElement != this.tipContainer))
		{
			if (typeof(offsetParentElement.offsetTop) == 'number')
			{
				pos.y += offsetParentElement.offsetTop;
			}
			if (typeof(offsetParentElement.clientTop) == 'number')
			{
				pos.y += offsetParentElement.clientTop;
			}
			if (typeof(offsetParentElement.scrollTop) == 'number')
			{
				pos.y -= offsetParentElement.scrollTop;
			}
			if (typeof(offsetParentElement.offsetLeft) == 'number')
			{
				pos.x += offsetParentElement.offsetLeft;
			}
			if (typeof(offsetParentElement.clientLeft) == 'number')
			{
				pos.x += offsetParentElement.clientLeft;
			}
			if (typeof(offsetParentElement.scrollLeft) == 'number')
			{
				pos.x -= offsetParentElement.scrollLeft;
			}

			absoluteOffsetParent = offsetParentElement;
			offsetParentElement = offsetParentElement.offsetParent;
		}

		//Absolute positioning wordt gerekend VANAF de absoluteOffsetParent.clientTop
		if (absoluteOffsetParent && typeof(absoluteOffsetParent.clientTop) == 'number')
		{
			pos.y -= absoluteOffsetParent.clientTop;
		}
		if (absoluteOffsetParent && typeof(absoluteOffsetParent.clientLeft) == 'number')
		{
			pos.x -= absoluteOffsetParent.clientLeft;
		}

		return pos;
	}	

tt_Tooltip.prototype.show = 
	function()
	{
		this.basePos = this.getBasePositionForTooltip(false);
		this.baseAbsPos = this.getBasePositionForTooltip(true);
		this.positionTooltip();


		//show elements
		this.frm.style.display = 'inline';
		this.div.style.display = 'inline';
	}
tt_Tooltip.prototype.hide = 
	function()
	{
		this.frm.style.display = 'none';
		this.div.style.display = 'none';
	}

function tt_ctrl_mouseenter()
{
	if ( this.tt_tooltip )
	{
		this.tt_tooltip.show();
	}
}
function tt_ctrl_mouseout()
{
	if ( this.tt_tooltip )
	{
		if (window.event.toElement != this.tt_tooltip.div && window.event.toElement != this.tt_tooltip.frm)
		{
			this.tt_tooltip.hide();
		}
	}
}
/*
function tt_ctrl_mousemove()
{
	if ( this.tt_tooltip && window.event )
	{
		this.tt_tooltip.positionTooltipByMouseEvent();
	}
}
*/
function tt_div_mouseout()
{
	if ( this.tt_tooltip )
	{
		this.tt_tooltip.hide();
	}
}


