var Tooltip = Class.create(
{
	initialize: function(tooltipClassName)
	{
		this.prepareImgs();
		this.setObservers($$('.'+tooltipClassName));
	},
	
	prepareImgs: function() // Dette metodekallet forbereder DOM'en med bakgrunnsbilder til tooltip.
	{
		var top = new Image();
		top.src='/sitefiles/1/design/tooltipTop.png';
		var bottom = new Image();
		bottom.src='/sitefiles/1/design/toolTipBottom.png';
		var content = new Image();
		content.src='/sitefiles/1/design/toolTipCenter.png';
		var background = new Image();
		background.src='/sitefiles/1/design/toolTipBg.png';
	},
	
	setObservers: function(elemArray)
	{
		var self = this;
		var elemsInfo = new Array();
		elemArray.each(function(elem)
		{
			if(!$(elem)) { return false;}
			
			if($(elem).alt)
			{
				elemsInfo[elem] = $(elem).alt;
			}
			else if($(elem).title)
			{
				elemsInfo[elem] = $(elem).title;
			}
			else
			{
				elemsInfo[elem] = '';
			}
			$(elem).removeAttribute('title');
			
			$(elem).observe('mouseover', function()
			{
				
				self.showTooltip(this, elemsInfo[elem]);
			});
			$(elem).observe('mouseout', function()
			{
				self.removeTooltip();
			
			});
		});
		
	},
	
	removeTooltip: function()
	{
		if($('tooltipCont'))
		{
			$('tooltipCont').remove();
		}
	},
	
	showTooltip: function(element, elemInfo)
	{
		if($('tooltipCont')) { return false; }
		if(elemInfo == '') { return false; }
		var Body = document.getElementsByTagName('body')[0];

		
		var toolTipContainer = new Element('div', { className: 'tooltipContainer', id: 'tooltipCont' });
		var toolTipTop = new Element('div', { className: 'toolTop'});
		var toolTipInfo = new Element('div', { id: 'tooltipContent' });
		var toolTipBottom = new Element('div', { className: 'toolBottom'});
		
		$(toolTipContainer).setStyle(
		{
			position: 'absolute',
			width: '201px',
			display: 'none'
		});
		
		toolTipContainer.appendChild(toolTipTop);
		toolTipContainer.appendChild(toolTipInfo);
		toolTipContainer.appendChild(toolTipBottom);
		Body.appendChild(toolTipContainer);
		
		infoArray = new Array();
		infoArray = elemInfo.split("::",2);
		
		$(toolTipTop).innerHTML = infoArray[0];
		$(toolTipInfo).innerHTML = infoArray[1];
		
		var toolTipMouseFollow = new elementFollowMouse('tooltipCont');
		new Effect.Appear(toolTipContainer,
		{
			duration:0.2,
			queue:	{ position:'end', scope:'tooltip' }
		});
		
	}
});
Event.observe(window, 'load', function()
{
	var Tooltips = new Tooltip('toolTips');
});