/*
 *
 * Copyright (c) 2006 Sam Collett (http://www.texotela.co.uk)
 * Licensed under the MIT License:
 * http://www.opensource.org/licenses/mit-license.php
 * 
 */

 
/*
 * jQuery ToolTip Demo. Demo of how to add elements and get mouse coordinates
 *	There is also a ToolTip plugin found at http://interface.eyecon.ro/,
 *	  which uses a CSS class to style the tooltip, but shows it below the input/anchor, rather than where the mouse is
 *
 *
 * @name     ToolTipDemo
 * @param    bgcolour  Background colour
 * @param    fgcolour  Foreground colour (i.e. text colour)
 * @author   Sam Collett (http://www.texotela.co.uk)
 * @example  $("a,input").ToolTipDemo('#fff');
 *
 */
$.fn.ToolTipDemo = function(bgcolour, fgcolour)
{
	this.mouseover(
		function(e)
		{
			if((!this.title && !this.alt) && !this.tooltipset) return;
			// get mouse coordinates
			// based on code from http://www.quirksmode.org/js/events_properties.html
			//var mouseX = e.pageX || (e.clientX ? e.clientX + document.body.scrollLeft : 0);
			//var mouseY = e.pageY || (e.clientY ? e.clientY + document.body.scrollTop : 0);
			//mouseX += 10;
			//mouseY += 10;
			var pos = getElementPos(this);
			bgcolour = bgcolour || "#ccc";
			fgcolour = fgcolour || "#000";
			// if there is no div containing the tooltip
			if(!this.tooltipdiv)
			{
				// create a div and style it				
				var div = document.createElement("div");
				this.tooltipdiv = div;
				$(div).css(
				{
					border: "1px solid #edce7b",
					padding: "4px",
					backgroundColor: bgcolour,
					color: "#000",
					filter:"alpha(opacity=95)",
					position: "absolute"
				})
				// add the title/alt attribute to it
				.html((this.title || this.alt));
				this.title = "";
				this.alt = "";
				$("body").append(div);
				this.tooltipset = true;
			}
			if(!this.tooltopimg)
			{
			    var divimg = document.createElement("div");
				this.tooltopimg = divimg;
				$(divimg).css(
				{				
					position: "absolute"
				})
				.html("<img src=\"../../images/titletopimg.png\" />");
				$("body").append(divimg);
			}
			//alert("²âÊÔ");
			$(this.tooltopimg).show().css({left: pos.x + 10 + "px", top: pos.y + 13 + "px"});
			$(this.tooltipdiv).show().css({left: pos.x + "px", top: pos.y + 18 + "px"});
		}
	).mouseout(
		function()
		{
			if(this.tooltipdiv)
			{
				$(this.tooltipdiv).hide();
				$(this.tooltopimg).hide();
			}
		}
	);
	function getElementPos(elementObj) 
    {   
         var ua = navigator.userAgent.toLowerCase();   
         var isOpera = (ua.indexOf('opera') != -1);   
         var isIE = (ua.indexOf('msie') != -1 && !isOpera); // not opera spoof   
         var el = elementObj;//document.getElementById(elementId);   
         if(el.parentNode === null || el.style.display == 'none') 
         {   
            return false;   
         }         
         var parent = null;   
         var pos = [];        
         var box;        
         if(el.getBoundingClientRect)    //IE   
         {            
              box = el.getBoundingClientRect();   
              var scrollTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop);   
              var scrollLeft = Math.max(document.documentElement.scrollLeft, document.body.scrollLeft);   
              return {x:box.left + scrollLeft, y:box.top + scrollTop};   
         }else if(document.getBoxObjectFor)    // gecko       
         {   
              box = document.getBoxObjectFor(el);    
              var borderLeft = (el.style.borderLeftWidth)?parseInt(el.style.borderLeftWidth):0;    
              var borderTop = (el.style.borderTopWidth)?parseInt(el.style.borderTopWidth):0;    
              pos = [box.x - borderLeft, box.y - borderTop];   
         } else    // safari & opera       
         {   
              pos = [el.offsetLeft, el.offsetTop];     
              parent = el.offsetParent;        
              if (parent != el) {    
               while (parent) {     
                    pos[0] += parent.offsetLeft;    
                    pos[1] += parent.offsetTop;    
                    parent = parent.offsetParent;   
               }     
          }      
          if (ua.indexOf('opera') != -1 || ( ua.indexOf('safari') != -1 && el.style.position == 'absolute' )) {    
               pos[0] -= document.body.offsetLeft;   
               pos[1] -= document.body.offsetTop;            
          }       
         }                 
         if (el.parentNode) {    
             parent = el.parentNode;   
           } else {   
             parent = null;   
           }   
         while (parent && parent.tagName != 'BODY' && parent.tagName != 'HTML') { // account for any scrolled ancestors   
              pos[0] -= parent.scrollLeft;   
              pos[1] -= parent.scrollTop;   
              if (parent.parentNode) {   
                parent = parent.parentNode;   
              } else {   
                parent = null;   
              }   
         }   
     return {x:pos[0], y:pos[1]};   
    }   
	    return this;
    }