var __mytooltip;
var __tipvisible = false;
var __FADEPATH = 20;
var __FADETIME = 100;

document.addEvent('domready', function()
{
	__mytooltip = createTip();
	$(document.body).adopt(__mytooltip.container);
	
	$$('.tipper').each(function(element)
	{
		element.addEvent('mouseenter', showTip.bind(element));
		element.addEvent('mouseleave', hideTip.bind(element));
	});
});

function createTip()
{
	var container = new Element('div').set({
		'class':'ToolTips',
		'styles':{ 
			'position':'absolute',
			'top':0,
			'left':0,
			'opacity':0,
			'z-index':'100000' 
		},
		'morph':{
			duration:__FADETIME, 
			link:'cancel', 
			transition:Fx.Transitions.Sine.easeOut
		}
	});

	var header = new Element('div', {'class':'dockTopHeader'});
	var message = new Element('div', {'class':'message'});
	var footer = new Element('div', {'class':'dockTopFooter'});

	container.adopt(header, message, footer);

	return {'container':container,'header':header,'message':message,'footer':footer,'close':null};		
}

function showTip()
{
	__tipvisible = true;
	new Request.HTML({ url: this.get('rel'), onSuccess: showAjaxTip.bind(this) }).get();
}

function showAjaxTip(responseTree, responseElements, responseHTML, responseJavaScript)
{
	if(!__tipvisible)
	{
		hideTip.run(null, this);
		return;
	}

	__mytooltip.message.set({'html':responseHTML});

	var elSize = this.getCoordinates();
	var tipSize = __mytooltip.container.getCoordinates();
	var top = elSize.top - tipSize.height;

	__mytooltip.container.setStyles({'display':'block','opacity':0,'left':elSize.left-60,'z-index':100000});
	__mytooltip.container.morph({'opacity':1,'top':top});
}

function showStaticTip(element, content)
{	
	__mytooltip = createTip();

	__mytooltip.message.set({'html':content});

	var elSize = element.getCoordinates();
	var tipSize = __mytooltip.container.getCoordinates();
	var top = elSize.top - tipSize.height;

	__mytooltip.container.setStyles({'display':'block','opacity':0,'left':elSize.left-60,'z-index':100000});
	__mytooltip.container.morph({'opacity':1,'top':top});
}

function hideTip()
{
	__tipvisible = false;
	var elSize = this.getCoordinates();
	var tipSize = __mytooltip.container.getCoordinates();
	var top = elSize.top - tipSize.height - __FADEPATH;
	__mytooltip.container.morph({'opacity':0,'top':top});
}