/**
 * eCommunities ECMS Tooltip Class 
 * @author Kevin Farley
 * @version 2.0
 * @requires ECMS.ECORE.geometry
 */

// Declare the required ECMS namespaces if they do not already exist
if (ECMS == null || typeof(ECMS) != "object") { var ECMS = new Object(); }

if (ECMS.ECORE == null || typeof(ECMS.ECORE) != "object") { ECMS.ECORE = new Object(); }
if (ECMS.ECORE.tooltip == null || typeof(ECMS.ECORE.tooltip) != "object") { ECMS.ECORE.tooltip = new Object(); }

ECMS.ECORE.tooltip = {

	// The following values are used like constants but are writeable so that you can override these default values.
	X_OFFSET: 10,  // Pixels to the right of the mouse pointer
	Y_OFFSET: 10,  // Pixels below the mouse pointer
	DELAY: 500,    // Milliseconds after mouseover
	CLASS_SHADOW: "ECMS_tooltipShadow",
	CLASS_CONTENT: "ECMS_tooltipContent",
	
	container: null,
	content: null,
	
	build: function () {  // The constructor function for the Tooltip class
		this.container = document.createElement("div"); // create div for shadow
		this.container.style.position = "absolute";     // absolutely positioned
		this.container.style.visibility = "hidden";     // starts off hidden
		this.container.className = this.CLASS_SHADOW;     // so we can style it
	
		this.content = document.createElement("div"); // create div for content
		this.content.style.position = "relative";     // relatively positioned
		this.content.style.zIndex = "999";    		  
		this.content.className = this.CLASS_CONTENT;    // so we can style it
	
		this.container.appendChild(this.content);       // add content to shadow
	},
	
	// Set the content and position of the tooltip and display it
	show: function(text, x, y) {
		this.build();
		this.content.innerHTML = text;             // Set the text of the tooltip.
		this.container.style.left = x + "px";        // Set the position.
		this.container.style.top = y + "px";
		this.container.style.visibility = "visible"; // Make it visible.
	
		// Add the tooltip to the document if it has not been added before
		if (this.container.parentNode != document.body) {
			document.body.appendChild(this.container);
		}
	},
	
	// Hide the tooltip
	hide: function() {
		if (this.container) {
			this.container.style.visibility = "hidden";  // Make it invisible.
		}
	},
	
	/**
	 * This method schedules a tooltip to appear over the specified target
	 * element Tooltip.DELAY milliseconds from now. The argument e should
	 * be the event object of a mouseover event. This method extracts the
	 * mouse coordinates from the event, converts them from window
	 * coordinates to document coordinates, and adds the offsets above.
	 * It determines the text to display in the tooltip by querying the
	 * "tooltip" attribute of the target element. This method
	 * automatically registers and unregisters an onmouseout event handler
	 * to hide the tooltip or cancel its pending display.
	 */
	schedule: function(target, e) {
		// Initialize the Geometry Class to ensure tooltips are placed properly.
		ECMS.ECORE.geometry.init();
		
		// Get the text to display.  If none, we don't do anything
		var text = target.getAttribute("tooltip");
		if (!text) return;
	
		// The event object holds the mouse position in window coordinates
		// We convert these to document coordinates using the Geometry module
		var x = e.clientX + ECMS.ECORE.geometry.horizontalScroll;
		var y = e.clientY + ECMS.ECORE.geometry.verticalScroll;
	
		// Add the offsets so the tooltip doesn't appear right under the mouse
		x += this.X_OFFSET;
		y += this.Y_OFFSET;
	
		// Schedule the display of the tooltip
		var self = this;  // We need this for the nested functions below
		var timer = window.setTimeout(function() { self.show(text, x, y); },this.DELAY);
	
		// Also, register an onmouseout handler to hide a tooltip or cancel
		// the pending display of a tooltip.
		if (target.addEventListener) target.addEventListener("mouseout", mouseout,
															 false);
		else if (target.attachEvent) target.attachEvent("onmouseout", mouseout);
		else target.onmouseout = mouseout;
	
		// Here is the implementation of the event listener
		function mouseout() {
			self.hide();                // Hide the tooltip if it is displayed,
			window.clearTimeout(timer); // cancel any pending display,
			// and remove ourselves so we're called only once
			if (target.removeEventListener) 
				target.removeEventListener("mouseout", mouseout, false);
			else if (target.detachEvent) target.detachEvent("onmouseout",mouseout);
			else target.onmouseout = null;
		}
	}
}