/*
	Objeto Tooltip.
	Desarrollado por Tecknosfera DBNET.
	Desarrollador: Francisco Javier Martínez.
*/

// Variable que define si el Tooltip está activado o NO
var tooltip_ACTIVO = true;
// Variable que define si queremos opacidad en el Tooltip o no
var tooltip_OPACIDAD = true;

var direccion_X_tooltip = "derecha";
var direccion_Y_tooltip = "abajo";

// Variables Globales que controlan la posición del Raton
var X;
var Y;

var t1,t2; // Pra los setTimeOut

// Variable para controlar el tiempo que tarda en cargar el Tooltip
var tiempo_espera = 1; //600

/*
	Constructor, que agrega al final del documento el elemento DIV correspondiente al TOOLTIP
*/
	
	document.write("<div id='tooltip' style='position:absolute;top:345px;left:32px;visibility:hidden;border:1px solid #888;background-color:#FFF;padding:0.5em; z-index:100;'><span id='mensajeTooltip'></span></div>");

	// Iframe que va continuamente debajo del Tooltip, para que se pueda mostrar por encima de los Select y TextAreas
	document.write("<iframe id='iframe_oculto' src='' scrolling='no' frameborder='0' style='position:absolute; top:0px; left:0px; display:none;'></iframe>");


// Función encargada hacer que aparezca o desaparezca el tooltip respecto a la posición del Raton
function mostrar_tooltip(evt, nulo, rutaimagen)
{	
	// Capturamos el Evento
	var e = (window.event) ? window.event : evt;

	// Definimos que Objeto produjo el Evento
	var elem = (e.target) ? e.target : ((e.srcElement) ? e.srcElement : null);
	
	// Agregamos en tiempo de Ejecución un Evento
	elem = agregar_evento_dinamico(elem,"mouseout","desactivar_tooltip")

	// Comprobamos si está activa la funcionalidad de Tooltip
	if(tooltip_ACTIVO == true)
	{
		if (t1)
		{
			clearTimeout(t1);
		}
		if (t2)
		{
			clearTimeout(t2);
		}
		
		capa = document.getElementById("tooltip");
		obj_iframe_oculto = document.getElementById('iframe_oculto');
		
		altura_desde_puntero = 23;
		diferencia_x = 5;

		X = e.clientX + document.documentElement.scrollLeft + document.body.scrollLeft;
		Y = e.clientY + document.documentElement.scrollTop + document.body.scrollTop;

		Y = Y + altura_desde_puntero; // Se divide por el índice 1.01 porque en Netscape hay diferencia de unidades en la ALTURA del raton

		X = X + diferencia_x;
		

		document.getElementById("tooltip").style.width = null;

		// Ponemos en la capa de Información el mensaje correspondiente
		document.getElementById("mensajeTooltip").innerHTML = mensaje_segun_elemento(rutaimagen);

		//comprovamos, que la capa no se salga de los límites del documento. Si es asi.. le hacemos salir por el lado opuesto (arriba o izquierda)
		var ancho_tooltip = document.getElementById("tooltip").clientWidth;
		var alto_tooltip = document.getElementById("tooltip").clientHeight;
		var posicion_ratonX = X;
		var posicion_ratonY = Y;
		var ancho_pantalla =  document.body.clientWidth;
		var alto_pantalla = document.body.clientHeight + document.documentElement.scrollTop + document.body.scrollTop;		
		
//		document.getElementById("informacion").bgColor = "#000000";
//		document.getElementById("informacion").innerHTML = "X = " + posicion_ratonX + " anchoPantalla = " + ancho_pantalla + " AnchoTooltip = " + ancho_tooltip + "<br>X + Ancho_toolTip = " + (posicion_ratonX + ancho_tooltip) + "<br><br>Y = " + posicion_ratonY + " altoPantalla " + alto_pantalla + " AnchoTooltip = " + alto_tooltip + "<br>Y + AltoTooltip = " + (posicion_ratonY + alto_tooltip);

		var ancho_tooltip = document.getElementById("tooltip").clientWidth;
		//document.getElementById("tooltip").style.width = ancho_tooltip+"px";

		// Posicionamos la capa de la información en las coordenadas calculadas
		capa.style.left = X+"px";
		capa.style.top = Y+"px";
		
		if(tooltip_OPACIDAD == true)
		{
			capa.style.filter='alpha(opacity=95)'; // Opacidad para IE
			capa.style.opacity='0.95'; // Ocapacidad para Netscape
		}
		
		// si el Tooltip se va a salir por la derecha de la pantalla ... hacemos que salga a la izquierda del raton
		if(direccion_X_tooltip == "derecha" && ((posicion_ratonX + ancho_tooltip) >= ancho_pantalla))
		{
			capa.style.left = (posicion_ratonX - ancho_tooltip)+"px";
		}
		
		// si el Tooltip se va a salir por la izquierda de la pantalla... hacemos que salga a la derecha del raton
		if(direccion_X_tooltip == "izquierda" && ((posicion_ratonX - ancho_tooltip) <= 0))
		{
			capa.style.left = (posicion_ratonX + ancho_tooltip)+"px";
		}
		
		// si el Tooltip se va a salir por arriba de la pantalla ... hacemos que salga abajo del raton
		if(direccion_Y_tooltip == "arriba" && ((posicion_ratonY - alto_tooltip) <= 0))
		{
			capa.style.top = (posicion_ratonY + alto_tooltip + altura_desde_puntero)+"px";
		}

		// si el Tooltip se va a salir por abajo de la pantalla ... hacemos que salga arriba del raton
		if(direccion_Y_tooltip == "abajo" && ((posicion_ratonY + alto_tooltip) >= alto_pantalla))
		{
			capa.style.top = (posicion_ratonY - alto_tooltip - altura_desde_puntero - 5)+"px";
		}
	
		// Posicionamos debajo del Tooltip el IFRAME que nos ayudará a que el tooltip sea visible sobre SELECT y TEXTAREA
	    capa.style.display = "block";
	    obj_iframe_oculto.style.width = parseInt(capa.offsetWidth)+"px";
	    obj_iframe_oculto.style.height = parseInt(capa.offsetHeight)+"px";
	    obj_iframe_oculto.style.top = parseInt(capa.style.top)+"px";
	    obj_iframe_oculto.style.left = parseInt(capa.style.left)+"px";
	    obj_iframe_oculto.style.zIndex = capa.style.zIndex - 1;
	    obj_iframe_oculto.style.opacity='0.0';
		obj_iframe_oculto.style.filter='alpha(opacity=0)'; // Opacidad para IE

//	    obj_iframe_oculto.style.display = "block";
//	    obj_iframe_oculto.style.visibility = "visible";
	
		// Hacemos que sea visible la capa
		t1 = setTimeout("capa.style.visibility='visible';",tiempo_espera);
		t2 = setTimeout("obj_iframe_oculto.style.display = 'block';",tiempo_espera);
	}
}

// Función para desactivar el Tooltip
function desactivar_tooltip()
{
	// Comprovamos si la funcionalidad TOOLTIP está activa
	if(tooltip_ACTIVO == true)
	{
		// Hacemos desaparecer el Tooltip
//		t2 = setTimeout("capa.style.visibility='hidden'",tiempo_espera);
		capa.style.visibility = "hidden";
		// Hacemos desaparecer el IFRAME que hay debajo del Tooltip, el cual nos ayuda a que el Tooltip se vea sobre elementos SELECT y Textarea
	    obj_iframe_oculto.style.display = "none";
		if (t1)
		{
			clearTimeout(t1);
		}
		if (t2)
		{
			clearTimeout(t2);
		}
	}
}

 /*
 	Función que recorre un conjunto de Argumentos (pasados desde la función de Apertura del tooltip).
	Ésta función monta le mensaje de salida del tooltip
 */
 function mensaje_segun_elemento(argumentos_referenciados)
 {
 	var el_mensajeTooltip = "";
 	if (argumentos_referenciados != "") {
		el_mensajeTooltip+= "<img src='"+argumentos_referenciados+"' alt='Preview' class='left' />";
	}	
	return(el_mensajeTooltip);
 }

 
 /*
	Función que asigna dinamicamente un evento
	Parametro 1: El objeto al que se le asignará el evento
	Parametro 2: Evento que asignamos (Como SOLO IE tiene ON en sus eventos, la cadena no ha de llevar el ON. Si lo tiene, la función se lo quitará).
	Parámetro 3: Función que asignamos al objeto en ese evento
*/
function agregar_evento_dinamico (el_objeto, el_evento, la_funcion)
{
	if(el_evento.substr(0,2).toLowerCase() == "on")
	{
		el_evento = el_evento.substr(2,el_evento.length)
	}
	// Agregamos en tiempo de Ejecución el evento MouseOut del Boton
	if (window.addEventListener) // Si El navegador tiene un EventListener (Firefox y Netscape)
	{
		el_objeto.addEventListener(el_evento,eval(la_funcion),true);
	}
	else // Si no es Netscape ni Firefox
	{
		// Si el navegador es IE 5+
		if (window.attachEvent)
		{
			var cadena_evento = "on" + el_evento;
			el_objeto.attachEvent(cadena_evento,eval(la_funcion));
		}
		else // Si no es IE 5+
		{
			if (document.getElementById)
			{
				el_objeto.onmouseout = eval(la_funcion);
			}
		}
	}
	return(el_objeto);
}