// Herramienta para mostrar tooltips

// Evento que se lanza al pasar el ratón sobre el elemento padre del tooltip
function tooltipOnMouseOver(e) {

        var tts = this._tooltipElement.style;

	if (this._visible) {
     	  	return;
	}

        this._parentElement.stopObserving('mouseout');
        this._parentElement.stopObserving('mouseover');

        // Mitad del ancho y alto del cntenedor, para saber la dirección de
        // despliegue del tooltip
        var bw_dimensions = this._boxElement.getDimensions();
        var bw = bw_dimensions.width / 2;
        var bh = bw_dimensions.height / 2;

        // Coordenadas del ratón
	var x = Event.pointerX(e);
        var y = Event.pointerY(e);



	/* Si el contenedor global esta como absolute, quitamos el margen izquierdo*/
	if (this._boxElement.getStyle("position")=='absolute') {
	    x = x - this._boxElement.offsetLeft;
	}

        var dimensions = this._tooltipElement.getDimensions();
/*
	window.status = "x=" + x + ", y=" + y + ", dimensions.width=" + dimensions.width;
*/
        // Posicionar el tooltip horizontalmente
        if (x < bw) {
	   tts.left = x;
	} else {
	    /*
	     * Si la posicion x calculada es menor que el ancho del tooltip, sustituimos
	     * la posicion por dicho ancho
	     */
 	    if (x < dimensions.width) {
 	      y = y + 10;
	      tts.left = 0;
 	    } else {
	      tts.left = x - dimensions.width;
	    }
        }

        // Posicionar el tooltip verticalmente
        if (y < bh) {
           tts.top = y;
        } else {
           tts.top = y - dimensions.height;
        }

	tts.display = 'block';
        this._visible = true;

        Event.observe(this._parentElement, 'mouseout', this.onMouseOut.bind(this));
        Event.observe(this._parentElement, 'mouseover', this.onMouseOver.bind(this));

//        Effect.Appear(this._tooltipElement.id);
}

function tooltipOnMouseOut(e) {

	 var tts = this._tooltipElement.style;

	if (!this._visible) {
	   return;
	}

        this._parentElement.stopObserving('mouseout');
        this._parentElement.stopObserving('mouseover');

        // Mitad del ancho y alto del cntenedor, para saber la dirección de
        // despliegue del tooltip
        var bw_dimensions = this._boxElement.getDimensions();
        var bw = bw_dimensions.width / 2;
        var bh = bw_dimensions.height / 2;

        // Coordenadas del ratón
        var x = Event.pointerX(e);
        var y = Event.pointerY(e);

        var dimensions = this._tooltipElement.getDimensions();

        // Posicionar el tooltip horizontalmente
        if (x < bw) {
           tts.left = x;
        } else {
           tts.left = x - dimensions.width;
        }

        // Posicionar el tooltip verticalmente
        if (y < bh) {
           tts.top = y;
        } else {
           tts.top = y - dimensions.height;
        }

	tts.display = 'none';
        this._visible = false;

        Event.observe(this._parentElement, 'mouseout', this.onMouseOut.bind(this));
        Event.observe(this._parentElement, 'mouseover', this.onMouseOver.bind(this));
}

function IrisTooltip(boxElement, parentElement, tooltipElement) {
    this._parentElement = $(parentElement);
    this._tooltipElement = $(tooltipElement);
    this._boxElement = $(boxElement);
    this.onMouseOver = tooltipOnMouseOver;
    this.onMouseOut = tooltipOnMouseOut;

    this._tooltipElement.style.display = 'none';
    this._tooltipElement.style.position = 'absolute';
    this._tooltipElement.style.left = -100;
    this._tooltipElement.style.top = -100;
    this._tooltipElement.style.zIndex = 10000;
    this._visible = false;

    Event.observe(this._parentElement, 'mouseout', this.onMouseOut.bind(this));
    Event.observe(this._parentElement, 'mouseover', this.onMouseOver.bind(this));
}

function createTooltip(boxElement, parentElement, tooltipElement) {
    Event.observe(window, 'load', function() {
	new IrisTooltip(boxElement, parentElement, tooltipElement);
    });
}