if (Prototype.Browser.IE) {
  Prototype.Browser.IEVersion = parseFloat(navigator.appVersion.split(';')[1].strip().split(' ')[1]);
  Prototype.Browser.IE6 =  Prototype.Browser.IEVersion == 6;
  Prototype.Browser.IE7 =  Prototype.Browser.IEVersion == 7;
}

var tooltipIndex = 0;
var Tooltip = Class.create();
Tooltip.prototype = {

  initialize: function(element, tool_tip) {
    var options = Object.extend({
		default_css: false,
		margin: "0px",
		padding: "5px",
		backgroundColor: "#d6d6fc",
		min_distance_x: 5,
		min_distance_y: 5,
		delta_x: 0,
		delta_y: 0,
		zindex: 1000
	}, arguments[2] || {});

    this.element      = $(element);
	this.elementWidth = 0;
	this.elementHeight = 0;
    this.options      = options;
    
    // use the supplied tooltip element or create our own div
    if($("tooltip"+tooltipIndex)) {
		this.tool_tip = $("tooltip"+tooltipIndex);
	} else {
		this.tool_tip = new Element("div", {id:"tooltip"+tooltipIndex});
		this.tool_tip.addClassName("tooltip");
		document.body.appendChild(this.tool_tip);
		var html = tool_tip.replace(new RegExp('\\+','g'),' ');
		html = unescape(html);
		this.tool_tip.innerHTML = html;
		tooltipIndex++;
    }

    // hide the tool-tip by default
    this.tool_tip.hide();

    this.eventMouseOver = this.showTooltip.bindAsEventListener(this);
    this.eventMouseOut   = this.hideTooltip.bindAsEventListener(this);
    this.eventMouseMove  = this.moveTooltip.bindAsEventListener(this);

    this.registerEvents();
  },

  destroy: function() {
    Event.stopObserving(this.element, "mouseover", this.eventMouseOver);
    Event.stopObserving(this.element, "mouseout", this.eventMouseOut);
    Event.stopObserving(this.element, "mousemove", this.eventMouseMove);
  },

  registerEvents: function() {
    Event.observe(this.element, "mouseover", this.eventMouseOver);
    Event.observe(this.element, "mouseout", this.eventMouseOut);
    Event.observe(this.element, "mousemove", this.eventMouseMove);
  },

  moveTooltip: function(event){
	Event.stop(event);
	var mouse_x = Event.pointerX(event);
	var mouse_y = Event.pointerY(event);
	if((this.elementWidth + mouse_x) >= ( this.getWindowWidth() - this.options.min_distance_x) ){ // too big for X
		mouse_x = mouse_x - this.elementWidth;
		mouse_x = mouse_x - this.options.min_distance_x;
	} else {
		mouse_x = mouse_x + this.options.min_distance_x;
	}
	this.setStyles(mouse_x +this.options.min_distance_x, mouse_y + this.options.min_distance_y);
  },
	
		
  showTooltip: function(event) {
	var dimensions = Element.getDimensions(this.tool_tip);
	this.elementWidth = Prototype.Browser.IE6 ? 150 : dimensions.width;
	this.elementHeight = dimensions.height;
	Event.stop(event);
    this.moveTooltip(event);
		new Element.show(this.tool_tip);
  },
  
  setStyles: function(x, y){
    // set the right styles to position the tool tip
	Element.setStyle(this.tool_tip, { position:'absolute',
		top:y + this.options.delta_y + "px",
		left:x + this.options.delta_x + "px",
		zindex:this.options.zindex
	});
	
	  // apply default theme if wanted
	if (this.options.default_css){
	  	Element.setStyle(this.tool_tip, { margin:this.options.margin,
			padding:this.options.padding,
			backgroundColor:this.options.backgroundColor,
			zindex:this.options.zindex
		});	
	}	
  },

  hideTooltip: function(event){
	  new Element.hide(this.tool_tip);
  },

  getWindowHeight: function(){
    var innerHeight;
	  if (navigator.appVersion.indexOf('MSIE')>0) {
		  innerHeight = document.body.clientHeight;
    } else {
		  innerHeight = window.innerHeight;
    }
    return innerHeight;	
  },
 
  getWindowWidth: function(){
    var innerWidth;
	  if (navigator.appVersion.indexOf('MSIE')>0) {
		  innerWidth = document.body.clientWidth;
    } else {
		  innerWidth = window.innerWidth;
    }
    return innerWidth;	
  }

}

function initTooltips() {
	$$(".tip").each(function(node) {
		new Tooltip(node, node.title);
		node.removeAttribute("title");
	});
};
Event.observe(window,"load", initTooltips);