//addLoadEvent(TooltipSetup);


/* 	Tooltip Class */

var Tooltip = Class.create();
Tooltip.prototype = ({
	initialize: function (str_tiplayer_id, int_offset_top, int_offset_left)
	{
		this.elemId			= str_tiplayer_id;
		this.offsetTop		= int_offset_top;
		this.offsetLeft 	= int_offset_left;
		
		this.tip			= this.createElem();
		this.arr_targets	= this.getTargets();
		
		this.image_path		= "images/artworks/"
		
		this.handleEventsObserver=this.handleEvents.bindAsEventListener(this);
		
		this.attachTriggers();
	},
	
	createElem: function()
	{
		if (this.elemId)
		{
			//does tip elem exist
			var tip_elem = $(this.elemId) ? $(this.elemId) : false;
			
			//tip elem not found so add to body
			if(!tip_elem)
			{
				tool_tip_layer 						= document.createElement( 'div' );
				tool_tip_layer.id 					= this.elemId;
				tool_tip_layer.onmouseover			= function(){Element.show(this);};
				tool_tip_layer.onmouseout			= function(){Element.hide(this);};
				
				var tip_elem = document.body.insertBefore(tool_tip_layer, document.body.firstChild );
				
				tip_elem.innerHTML 		= "<table height='280' width='280' border='1' cellspacing='0' cellpadding='0'><tr><td align='center' valign='middle'><img src='#'style='margin:0;padding:0;'/></td></tr></table>";
//				tip_elem.innerHTML 		= "<img src='#' />";
				Element.hide(tip_elem);
			}
			//tip elem found or successfully added to body				
			return tip_elem;
		}
	},
	
	handleEvents: function(event)
	{
		this.target		= Event.element(event);
	
		if(this.target.nodeName != 'A')
		{
			this.target	= this.target.parentNode;
		}
		
		if(event.type=='mouseover')
		{			
			//rewrite tooltip image src
//			this.tip.childNodes[0].src 	= this.image_path+this.target.id+".jpg";
			this.tip.innerHTML = "<table height='280' width='280' cellspacing='0' cellpadding='0'><tr><td align='center' valign='middle'><img src='"+this.image_path+this.target.id+".jpg"+"' style='margin:0;padding:0;' /></td></tr></table>"
			
			this.positionTip();
		}
		else if(event.type=='mouseout')
		{
			Element.hide(this.tip);
		}
	},
	
	getTargets: function()
	{
		var targets = document.getElementsBySelector('.tooltip');
		return targets;
	},
	
	attachTriggers: function ()
	{
		if(!this.arr_targets)
			this.arr_targets = this.getTargets();
								
		for (var i=0; i<this.arr_targets.length; i++)
		{
			Event.observe(this.arr_targets[i], 'mouseover', this.handleEventsObserver);
			Event.observe(this.arr_targets[i], 'mouseout', this.handleEventsObserver);
		}
	},
	
	removeTriggers: function ()
	{
		for (var i=0; i<this.arr_targets.length; i++)
		{
			Event.stopObserving(this.arr_targets[i], 'mouseover', this.handleEventsObserver);
			Event.stopObserving(this.arr_targets[i], 'mouseout', this.handleEventsObserver);
		}
		this.arr_targets = false;
	},
	
	positionTip: function()
	{
		var int_x_pos = 120;
		var int_y_pos = 300;
/*
		//get position of mouseover element
		var arr_offsets = Position.cumulativeOffset(this.target);
		var int_x_pos = arr_offsets[0] + this.target.offsetWidth + this.offsetLeft;
		var int_y_pos = arr_offsets[1] + this.offsetTop;
		//keep tip within visible page area
		var tip_dimensions 	= Element.getDimensions(this.tip);

		var tip_position	= new Object();	
		tip_position.x=Number(int_x_pos+tip_dimensions.width)
		tip_position.y=Number(int_y_pos+tip_dimensions.height);
		
		//if all of tip is visible then both x and y will have negative values
		var visibility = this.isVisible(tip_position);
		
		//off screen width
		if(visibility.x > 0)
		{
			if (!this._bool_use_cursor)
			{
				int_x_pos -= this.target.offsetWidth;
				int_x_pos -= tip_dimensions.width;
			}
			else
			{
				int_x_pos -= tip_dimensions.width;
				int_x_pos -= 2*this.offsetLeft;
			}
		}
		//off screen height
		if(visibility.y > 0)
		{
			if (!this._bool_use_cursor)
			{
				int_y_pos -= visibility.y;
			}
			else 
			{
				int_y_pos -= tip_dimensions.height;
				int_y_pos -= 2*this.offsetTop;
			}
		}
*/
		if(int_x_pos && int_x_pos)
		{	
			this.tip.style.left		= int_x_pos +'px';
			this.tip.style.top		= int_y_pos + 'px';

			Element.show(this.tip);
		}
	},

	isVisible: function(elem)
	{
		var xdiff;
		var ydiff;
		
		var real_area	= new Object();
		
		var viewable 	= this.viewableArea();
		var scroll_area	= this.scrollArea();
		
		real_area.x		= viewable.x+scroll_area.x;
		real_area.y		= viewable.y+scroll_area.y;

		//subtract viewport height and width from tooltip bottom and right coords
		xdiff	 = elem.x - real_area.x;
		ydiff	 = elem.y - real_area.y;
	
		return {x:xdiff,y:ydiff};
	},

	viewableArea: function()
	{
		var x,y;
		
		if (self.innerHeight) // all except Explorer
		{
			x = self.innerWidth;
			y = self.innerHeight;
		}
		else if (document.documentElement && document.documentElement.clientHeight)
			// Explorer 6 Strict Mode
		{
			x = document.documentElement.clientWidth;
			y = document.documentElement.clientHeight;
		}
		else if (document.body) // other Explorers
		{
			x = document.body.clientWidth;
			y = document.body.clientHeight;
		}
		return {x:x,y:y};
	},
	
	scrollArea: function()
	{
		var x,y;
		
		if (this.pageYOffset) // all except Explorer
		{
			x = this.pageXOffset;
			y = this.pageYOffset;
		}
		else if (document.documentElement && document.documentElement.scrollTop)
			// Explorer 6 Strict
		{
			x = document.documentElement.scrollLeft;
			y = document.documentElement.scrollTop;
		}
		else if (document.body) // all other Explorers
		{
			x = document.body.scrollLeft;
			y = document.body.scrollTop;
		}
		return {x:x,y:y};
	}
});