var uTip = Class.create();

uTip.prototype = {
  initialize: function(elemento, tip) {
    var opciones = Object.extend(
    	{
      	default_css: true,
      	margin: "0px",
	    	padding: "0px",
	    	backgroundColor: "#d6d6fc",
	    	min_distance_x: 15,
      	min_distance_y: 15,
      	delta_x: 0,
      	delta_y: 0,
      	zindex: 1000
    	}, arguments[2] || {});

    this.elemento = $(elemento);
    this.opciones = opciones;
    
    // use the supplied tooltip element or create our own div
   // if ($(tip)) 
    {
      this.tip = $(tip);
    } 
    /*else 
    {
      this.tip = $(document.createElement("div")); 
      document.body.appendChild(this.tip);
      this.tip.addClassName("uTip");
      this.tip.appendChild(document.createTextNode(tip));
    }*/

    // hide the tool-tip by default
    this.tip.hide();
	
		this.eMostrar = this.Mostrar.bindAsEventListener(this);
		this.eOcultar = this.Ocultar.bindAsEventListener(this);
		this.eMover = this.Mover.bindAsEventListener(this);
		
		this.RegistrarEventos();		
  },

	RegistrarEventos: function() {
    Event.observe(this.elemento, "mouseover", this.eMostrar);
    Event.observe(this.elemento, "mouseout", this.eOcultar);
    Event.observe(this.elemento, "mousemove", this.eMover);
	},
	
  Destruir: function() {
    Event.stopObserving(this.elemento, "mouseover", this.eMostrar);
    Event.stopObserving(this.elemento, "mouseout", this.eOcultar);
    Event.stopObserving(this.elemento, "mousemove", this.eMover);
  },
  

  Mover: function(event){
	  Event.stop(event);
	  // get Mouse position
    var mouse_x = Event.pointerX(event);
	  var mouse_y = Event.pointerY(event);
	
	  // decide if wee need to switch sides for the tooltip
	  var dimensions = Element.getDimensions( this.tip );
	  var element_width = dimensions.width;
	  var element_height = dimensions.height;
	
	  if ( (element_width + mouse_x) >= ( this.getWindowWidth() - this.opciones.min_distance_x) ){ // too big for X
		  mouse_x = mouse_x - element_width;
		  // apply min_distance to make sure that the mouse is not on the tool-tip
		  mouse_x = mouse_x - this.opciones.min_distance_x;
	  } else {
		  mouse_x = mouse_x + this.opciones.min_distance_x;
	  }
	
	  if ( (element_height + mouse_y) >= ( this.getWindowHeight() - this.opciones.min_distance_y) ){ // too big for Y
		  mouse_y = mouse_y - element_height;
	    // apply min_distance to make sure that the mouse is not on the tool-tip
		  mouse_y = mouse_y - this.opciones.min_distance_y;
	  } else {
		  mouse_y = mouse_y + this.opciones.min_distance_y;
	  } 
	
	  // now set the right styles
	  this.setStyles(mouse_x, mouse_y);
  },
	
		
  Mostrar: function(event) {
    Event.stop(event);
    this.Mover(event);
	  new Element.show(this.tip);
  },
  
  setStyles: function(x, y){
    // set the right styles to position the tool tip
	  Element.setStyle(this.tip, { position:'absolute',
	 								    top:y + this.opciones.delta_y + "px",
	 								    left:x + this.opciones.delta_x + "px",
									    zindex:this.opciones.zindex
	 								  });
	
	  // apply default theme if wanted
	  if (this.opciones.default_css){
	  	  Element.setStyle(this.tip, { margin:this.opciones.margin,
		 		  						                    padding:this.opciones.padding,
		                                      backgroundColor:this.opciones.backgroundColor,
										                      zindex:this.opciones.zindex
		 								    });	
	  }	
  },

  Ocultar: function(event){
	  new Element.hide(this.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;	
  }

}