// requires - prototype     : http://www.prototypejs.org
//          - scriptaculous : http://script.aculo.us

Effect.Tooltip = Class.create();

Object.extend(Object.extend(Effect.Tooltip.prototype, Effect.Base.prototype), {

	initialize:function(activator, tooltip)
	{
		this.activator = $(activator);
		this.tooltip = $(tooltip);

		if(!this.activator || !this.tooltip) throw(Effect._elementDoesNotExistError);

		var options = Object.extend(arguments[2] || {});

		this.start(options);
	},

	setup:function()
	{
		// add observers
		this.activator.observe('mousedown', this.showTip.bind(this));
		//this.activator.observe('mouseout', this.hideTip.bind(this));
	},

	showTip:function(event)
	{
		// 1 - Hide all previous tooltip
		$$('div.tooltip').invoke('hide');

		// 2 - Position right tip
		this.positionTip(event);

		// 3 - Show the tooltip with effect
		new Effect.Appear(this.tooltip, { duration: 0.4 });
	},

	hideTip:function(event)
	{
		//this.tooltip.hide();

		//this.tooltip.observe('mouseover', alert('jojo'));

		// Hide using effect
		//new Effect.Fade(this.tooltip, { duration: 0.4 });
	},

	positionTip:function(event)
	{
		// Position tooltip above mouse click
		var activatorX = Event.pointerX(event)-(this.tooltip.getWidth()/2);
		var activatorY = Event.pointerY(event)-this.tooltip.getHeight();

		// Apply position
		this.tooltip.setStyle({
			left : activatorX + 'px',
			top : activatorY + 'px'
		});
	}
});