// JavaScript Document for tooltips for Phototext

var Geometry = {};

if (window.screenLeft) { // IE and others
    Geometry.getWindowX = function() { return window.screenLeft; };
    Geometry.getWindowY = function() { return window.screenTop; };
}
else if (window.screenX) { // Firefox and others
    Geometry.getWindowX = function() { return window.screenX; };
    Geometry.getWindowY = function() { return window.screenY; };
}

if (window.innerWidth) { // All browsers but IE
    Geometry.getViewportWidth = function() { return window.innerWidth; };
    Geometry.getViewportHeight = function() { return window.innerHeight; };
    Geometry.getHorizontalScroll = function() { return window.pageXOffset; };
    Geometry.getVerticalScroll = function() { return window.pageYOffset; };
}
else if (document.documentElement && document.documentElement.clientWidth) {
    // These functions are for IE6 when there is a DOCTYPE
    Geometry.getViewportWidth =
        function() { return document.documentElement.clientWidth; };
    Geometry.getViewportHeight = 
        function() { return document.documentElement.clientHeight; };
    Geometry.getHorizontalScroll = 
        function() { return document.documentElement.scrollLeft; };
    Geometry.getVerticalScroll = 
        function() { return document.documentElement.scrollTop; };
}
else if (document.body.clientWidth) {
    // These are for IE4, IE5, and IE6 without a DOCTYPE
    Geometry.getViewportWidth =
        function() { return document.body.clientWidth; };
    Geometry.getViewportHeight =
        function() { return document.body.clientHeight; };
    Geometry.getHorizontalScroll =
        function() { return document.body.scrollLeft; };
    Geometry.getVerticalScroll = 
        function() { return document.body.scrollTop; };
}

function Tooltip() {  // The constructor function for the Tooltip class
    this.tooltip = document.createElement("div"); // create div for shadow
    this.tooltip.style.position = "absolute";     // absolutely positioned
    this.tooltip.style.visibility = "hidden";     // starts off hidden
    this.tooltip.className = "tooltipShadow";     // so we can style it

    this.content = document.createElement("div"); // create div for content
    this.content.style.position = "relative";     // relatively positioned
    this.content.className = "tooltipContent";    // so we can style it

    this.tooltip.appendChild(this.content);       // add content to shadow
    
}

// Set the content and position of the tooltip and display it
Tooltip.prototype.show = function(text, x, y) {
	 if (!text || Tooltip.CANCEL==true) return;
    this.content.innerHTML = text;             // Set the text of the tooltip.
    this.tooltip.style.left = x + "px";        // Set the position.
    this.tooltip.style.top = y + "px";
    this.tooltip.style.visibility = "visible"; // Make it visible.

    // Add the tooltip to the document if it has not been added before
    if (this.tooltip.parentNode != document.body)
        document.body.appendChild(this.tooltip);
};

// Hide the tooltip
Tooltip.prototype.hide = function() {
    this.tooltip.style.visibility = "hidden";  // Make it invisible.
};

// The following values are used by the schedule() method below.
Tooltip.X_OFFSET = 25;  // Pixels to the right of the mouse pointer
Tooltip.Y_OFFSET = 15;  // Pixels below the mouse pointer
Tooltip.DELAY = 500;    // Milliseconds after mouseover
Tooltip.CANCEL=false;

var text;
Tooltip.prototype.schedule = function(target, e) {
    // Get the text to display.  If none, we don't do anything
    //var text = target.getAttribute("tooltip");
    var id=target.getAttribute('id');
    //var letter=id.substring(0,1);									// change to include digits, etc.
    if (tooltipdata[id]) {
	 	text=tooltipdata[id];
	 } else {
	 	$.ajax({
		 	url:'php/ttdata.php?action=getdescription&id=' + id,
		 	success:function(msg){tooltipdata[id]=id + ": " + msg;}
		 });
	 	/*//var url='php/datafunctions.php?action=getdescription&id=' + id;
	 	var url='php/ttdata.php?action=getdescription&id=' + id;
		var callback=function(req) {
			tooltipdata[id]=id + ": " + req.responseText;
		}
	 	sendRequest(url,callback);*/
	 	var timeout=window.setTimeout(function(){text=tooltipdata[id];}, 500);
	 }

    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 + Geometry.getHorizontalScroll();
    var y = e.clientY + Geometry.getVerticalScroll();
	 
    // Add the offsets so the tooltip doesn't appear right under the mouse
    x += Tooltip.X_OFFSET;
    y += Tooltip.Y_OFFSET;
	 
	 // if going to be off the screen on the right, move over
	 if ((x+280)>Geometry.getViewportWidth()) x-=350;
    // 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); }, Tooltip.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;
    }
}

// Define a single global Tooltip object for general use
Tooltip.tooltip = new Tooltip();

Tooltip.schedule = function(target, e) { Tooltip.tooltip.schedule(target, e); };

// global object to hold the tooltip data coming from AJAX call
var tooltipdata=new Object();

function ttcallback(req) {
	alert(req.responseText);
//	alert('id: '+id);
//	tooltipdata[id]=req.responseText;	
}