var _toolTipCacheOn = true;
var toolTipCache = new Hash();
var cssToolTipLoaded = false;
var cssToolTipLoadedET = false;

var timeoutTooltip;

document.observe("dom:loaded", function() {
	initToolTips( );
});

function initToolTips( )
{
	$$( '.p10ToolTip' ).each( function( element )
	{
		$( element ).observe( 'mouseover', doToolTip1 );
		$( element ).observe( 'mouseout', cerrarDespuesDeTimeout );
	} );
	
	$$( '.p10ToolTip2' ).each( function( element )
	{
		$( element ).observe( 'mouseover', doToolTip2 );
		$( element ).observe( 'mouseout', cerrarDespuesDeTimeout );
	} );
}

function loadCSS( path )
{
	var docHead = document.getElementsByTagName( 'head' )[ 0 ];
	
	var toolTipCss = $( document.createElement( 'LINK' ) );
	toolTipCss.writeAttribute( 'href', path );
	toolTipCss.writeAttribute( 'rel', 'stylesheet' );
	toolTipCss.writeAttribute( 'type', 'text/css' );
	docHead.appendChild( toolTipCss );
}

function doToolTip1( event )
{
	abortarTimeout( );
	
	doToolTip( "/master/js/toolTips/toolTips.asp", event );
}

function doToolTip2( event )
{
	abortarTimeout( );
	
	doToolTip( "/scripts/net/tooltips/toolTips.aspx", event );
}

function abortarTimeout()
{
	clearTimeout( timeoutTooltip );
}

function cerrarDespuesDeTimeout( e )
{
	if (!e) var e = window.event;
	var tg = (window.event) ? e.srcElement : e.target;
	tg = $( tg );
	
	if ( !tg.hasClassName( '.p10ToolTip' ) && !tg.hasClassName( '.p10ToolTip2' ) && tg == p10ToolTip )
	{
		return;
	}
	
	var reltg = (e.relatedTarget) ? e.relatedTarget : e.toElement;
	
	if ( reltg )
	{
		reltg = $( reltg );
		
		if ( reltg.descendantOf( p10ToolTip ) )
		{
			return;
		}
	}
	
	timeoutTooltip = setTimeout( "hideToolTip()", 500 );
}

function doToolTip( urlAjax, event )
{
	abortarTimeout( );
	
	if ( ! cssToolTipLoaded )
	{
		loadCSS ( '/master/js/toolTips/p10ToolTipTbl.css' );
		cssToolTipLoaded = true;
	}
	
	var element = Event.element( event );
	
	var maxParents = 3;
	var parentIndex = 0;
	while ( ! element.readAttribute( 'ttid' ) && parentIndex < maxParents )
	{
		element = element.parentNode;
		parentIndex++;
	}
	
	var id = element.readAttribute( 'ttid' );
	if ( id == null )
	{
		alert( 'Falta setear el atributo \'ttid\' para el elemento con contenido \'' + element.innerHTML + '\'' );
		return;
	}
	
	var key = element.readAttribute( 'ttkey' );
	if ( key == null )
	{
		alert( 'Falta setear el atributo \'ttkey\' para el elemento con contenido \'' + element.innerHTML + '\'' );
		return;
	}
	
	var hashKey = key + '_' + id;
	
	var toolTipHtmlContent = toolTipCache.get( hashKey );
	
	if ( _toolTipCacheOn && toolTipHtmlContent != undefined )
	{
		renderToolTip( element, key, id, toolTipHtmlContent );
	}
	else
	{
		loadToolTipFromServer( urlAjax, element, key, id );
	}
}

function loadToolTipFromServer( urlAjax, element, key, id )
{
	var url = urlAjax + '?ttk=' + key + '&tti=' + id;
	
	new Ajax.Request( url, {
		method: 'get',
		onSuccess: function( transport ) {
			var response = transport.responseText;
			var hashKey = key + '_' + id;
			if ( _toolTipCacheOn )
			{
				toolTipCache.set( hashKey, response );
			}
			renderToolTip( element, key, id, response );
		}
	});
}

var p10ToolTip = false;
var tt_midRightCenter = false;

function createToolTipElement( )
{
	p10ToolTip = createDiv( 'p10ToolTip' );
	p10ToolTip.style.position = 'absolute';
	p10ToolTip.style.display = 'none';
	document.body.appendChild( p10ToolTip );
	
	$( p10ToolTip ).observe( 'mouseover', abortarTimeout );
	
	$( p10ToolTip ).observe( 'mouseout', cerrarDespuesDeTimeout );
	
	var tabla, tr;
	tabla = createTable( p10ToolTip, 'tt_tbl' );
	
	tr = tabla.insertRow( tabla.rows.length );
	insertCell( tr, 'tt_topLeft', 0 );
	insertCell( tr, 'tt_topCenter', 1 );
	insertCell( tr, 'tt_topRight', 2 );
	
	tr = tabla.insertRow( tabla.rows.length );
	insertCell( tr, 'tt_midLeft', 0 );
	tt_midRightCenter = insertCell( tr, 'tt_midCenter', 1 );
	insertCell( tr, 'tt_midRight', 2 );
	
	tr = tabla.insertRow( tabla.rows.length );
	insertCell( tr, 'tt_botLeft', 0 );
	insertCell( tr, 'tt_botCenter', 1 );
	insertCell( tr, 'tt_botRight', 2 );
}

function createTable( parent, id )
{
	var tabla = document.createElement( 'TABLE' );
	tabla = $( tabla );
	tabla.writeAttribute( 'id', id );
	tabla.writeAttribute( 'cellpadding', '0' );
	tabla.writeAttribute( 'cellspacing', '0' );
	tabla.writeAttribute( 'border', '0' );
	parent.appendChild( tabla );
	return tabla;
}

function insertCell( row, id, index )
{
	var td = row.insertCell( index );
	$( td ).writeAttribute( 'id', id );
	return td;
}

function setHtml( div, content ) 
{ 
	var search = content; 
	var script; 
	
    while( script = search.match(/(<script[^>]+javascript[^>]+>\s*(<!--)?)/i)) 
    { 
      search = search.substr(search.indexOf(RegExp.$1) + RegExp.$1.length);
       
      if (!(endscript = search.match(/((-->)?\s*<\/script>)/))) break; 
       
      block = search.substr(0, search.indexOf(RegExp.$1)); 
      search = search.substring(block.length + RegExp.$1.length);
      
    	var jScript = document.createElement( "script" );
		jScript.setAttribute( "type", "text/javascript" );
		jScript.text = block;
		document.getElementsByTagName("head")[0].appendChild( jScript );
    } 
    
    $( div ).innerHTML = content; 
}

function renderToolTip( element, key, id, response )
{
	if ( !p10ToolTip )
	{
		createToolTipElement( );
	}
	
	// Esta forma de setear el contenido evalua el javascript
	setHtml( tt_midRightCenter, response );
	
	p10ToolTip.style.display = 'block';
	
	var positionClassName = positionToolTip( p10ToolTip, tt_midRightCenter, element );
	
	var extendedTooltip = $( p10ToolTip );
	extendedTooltip.className = positionClassName;
}

function createDiv( id, parent )
{
	var newDiv = document.createElement( 'DIV' );
	newDiv.id = id;
	if ( parent != undefined )
	{
		parent.appendChild( newDiv );
	}
	return newDiv;
}

function positionToolTip( toolTipElement, toolTipContentElement, inputElement )
{
	var positionClassName = 'tt_tbl_tl';
	
	var leftPos = (p10ToolTipLeftPos(inputElement) + inputElement.offsetWidth) + 3;
	var topPos = p10ToolTipTopPos(inputElement) + 20;
	
	if ( document.viewport.getHeight( ) > 150 &&
		topPos > 155 &&
		( topPos + 140 ) > ( document.viewport.getScrollOffsets( ).top + document.viewport.getHeight( ) ) )
	{
		topPos -= 147;
		positionClassName = 'tt_tbl_bl';
	}
	
	toolTipElement.style.left = leftPos + 'px';
	toolTipElement.style.top = topPos + 'px';	
	
	return positionClassName;
}

function p10ToolTipTopPos( inputElement )
{		
  var returnValue = inputElement.offsetTop;
  while( ( inputElement = inputElement.offsetParent ) != null )
  {
  	if( inputElement.tagName != 'HTML' )
  	{
  		returnValue += inputElement.offsetTop;
  	}
  }
  return returnValue;
}

function p10ToolTipLeftPos(inputElement)
{
  var returnValue = inputElement.offsetLeft;
  while ( ( inputElement = inputElement.offsetParent ) != null )
  {
  	if ( inputElement.tagName != 'HTML' )
  	{
  		returnValue += inputElement.offsetLeft;
  	}
  }
  return returnValue;
}

function hideToolTip( )
{
	if ( p10ToolTip )
	{
		p10ToolTip.style.display = 'none';
	}
}
