/*------------------------------------------------------*\
 *
 *  helpWin()
 *  ---------
 * Sistema para mostrar texto alternativo em caixa personalizada
 *
 * Autor: Cau Guanabara <caugb@ibest.com.br>
 * Data: 2005-01-12
 *
 * Para usar:
 * Configure a variavel 'imgsUrl' abeixo;
 * Em sua página, ponha isso:
	 <script language="Javascript" type="text/javascript" src="url/to/help_win.js"></script>
	 <... onClick="helpWin(title,text,position);"> ou
	 <... onMouseOver="helpWin(title,text,position);" onMouseOut="boxOff();">
 *
 * var position pode ter os seguintes valores:
	'lt' -> left, top
	'rt' -> right, top (default)
	'lb' -> left, bottom
	'rb' -> right, bottom
	...ou...
	'et' -> esquerda, topo
	'dt' -> direita, topo (padrão)
	'eb' -> esquerda, base
	'db' -> direita, base
 * 
 * ** Este sistema foi testado em IE6.0 e Netscape7.2
\*------------------------------------------------------*/

// URL para a pasta das imagens do sistema
// Atualize se for necessário (é melhor o caminho absoluto)
var imgsUrl = "imgs/";

// Isso não foi necessário...
//	if(!document.all) document.captureEvents(Event.MOUSEMOVE);
// ...apenas isso
document.onmousemove = setXY;

// Fechar a caixa no Esc
document.onkeypress  = closeOnEsc;

// X e Y do mouse
var myX = 0;
var myY = 0;

// preload images, não tenho certeza se isso funciona...
preload(imgsUrl+'imgs/c_db.gif', imgsUrl+'imgs/c_dt.gif', imgsUrl+'imgs/c_eb.gif',
				imgsUrl+'imgs/c_et.gif', imgsUrl+'imgs/p_db1.gif', imgsUrl+'imgs/p_db.gif',
				imgsUrl+'imgs/p_dt1.gif', imgsUrl+'imgs/p_dt.gif', imgsUrl+'imgs/eb1.gif',
				imgsUrl+'imgs/eb.gif', imgsUrl+'imgs/et1.gif', imgsUrl+'imgs/et.gif',
				imgsUrl+'imgs/fecha.gif', imgsUrl+'imgs/l_baixo.gif', imgsUrl+'imgs/l_top.gif',
				imgsUrl+'imgs/l_esq.gif', imgsUrl+'imgs/l_dir.gif', imgsUrl+'imgs/l_top1.gif',
				imgsUrl+'imgs/l_baixo1.gif',	imgsUrl+'imgs/fundo.jpg');

function preload() { 
var args = preload.arguments; 
	if(!document.images) return;
	if(!document.myImages) document.myImages = new Array();
var mil = document.myImages.length;
		for(var i = 0; i < args.length; i++) {
		document.myImages[mil] = new Image; 
		document.myImages[mil++].src = args[i];
		}
};

function setXY(e) {
  if(document.all) {
	myX = event.clientX + document.body.scrollLeft;
	myY = event.clientY + document.body.scrollTop;
  } else {
	myX = e.pageX;
	myY = e.pageY;
  }  
myX = myX < 0 ? 0 : myX;
myY = myY < 0 ? 0 : myY;
};

function boxOff() {
gid("alt_table").style.display = 'none';
};

function closeOnEsc(e) {
	if(!e)
		e = window.event;
	if(e.keyCode == 27) {
	boxOff();
	return false;
	}
return true;
};

function helpWin(titulo,texto,direcao) {
var imgs = {'et1': imgsUrl+'c_et.gif', 'et': imgsUrl+'l_top.gif', 
            'eb1': imgsUrl+'c_eb.gif', 'eb': imgsUrl+'l_baixo.gif', 
            'db1': imgsUrl+'c_db.gif', 'db': imgsUrl+'l_baixo.gif', 
						'dt1': imgsUrl+'c_dt.gif', 'dt': imgsUrl+'l_top.gif'}

create(titulo,texto,imgs);
var atab = gid("alt_table");
var ach = atab.clientHeight;
atab.style.display = 'none';

// X e Y da caixa
var _x = 0;
var _y = 0;

	switch(direcao) {
		case "rb": case "br": case "db": case "bd":
		imgs.et1 = imgsUrl+"p_et1.gif";
		imgs.et = imgsUrl+"p_et.gif";
		_x = myX;
		_y = myY;
			break;
		case "lb": case "bl": case "eb": case "be":
		imgs.dt1 = imgsUrl+"p_dt1.gif";
		imgs.dt = imgsUrl+"p_dt.gif";
		_x = myX - 300;
		_y = myY;
			break;
		case "lt": case "tl": case "et": case "te":
		imgs.db1 = imgsUrl+"p_db1.gif";
		imgs.db = imgsUrl+"p_db.gif";
		_x = myX - 300;
		_y = myY - ach;
			break;
		case "rt": case "tr": case "dt": case "td": default:
		imgs.eb1 = imgsUrl+"p_eb1.gif";
		imgs.eb = imgsUrl+"p_eb.gif";
		_x = myX;
		_y = myY - ach;
			break;
	}

create(titulo,texto,imgs);
var atab = gid("alt_table");
atab.style.left = _x + "px";
atab.style.top = _y + "px";
atab.style.cssText = atab.style.cssText.replace(/opacity: ?0/,'opacity: 100');
};

function create(titulo,texto,imgs) {
var bod = document.getElementsByTagName("body")[0];
var sp = gid("alt_table") ? gid("alt_table") : document.createElement("span");
sp.id = "alt_table";
sp.style.cssText = '-moz-opacity:0;filter:alpha(opacity:0);position:absolute;z-index:1000;width:300px;height:auto;';
sp.innerHTML = '<table width="300" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="10"><img src="'+imgs.et1+'" name="et1" width="10" height="38" id="et1"></td> <td width="34" background="'+imgsUrl+'l_top.gif">		<img src="'+imgs.et+'" name="et" width="30" height="38" id="et"></td> <td width="212" background="'+imgsUrl+'l_top.gif"><img src="'+imgsUrl+'l_top1.gif" width="212" height="38"></td> <td width="34" align="right" background="'+imgsUrl+'l_top.gif" style="text-align:right;"><img src="'+imgs.dt+'" name="dt" width="30" height="38" id="dt"></td> <td width="10"><img src="'+imgs.dt1+'" name="dt1" width="10" height="38" id="dt1"></td> </tr> <tr> <td width="10" background="'+imgsUrl+'l_esq.gif">&nbsp;</td> <td colspan="3" background="'+imgsUrl+'fundo.jpg" style="font-family:verdana;font-size:11px;padding:0px;"><table width="280" border="0" cellspacing="0" cellpadding="0" style="font-family:verdana;font-size:11px;padding:0px;"> <tr> <td width="100%" id="alt_title" style="font-weight:bold;padding:8px;">'+titulo+'</td> <td  align="right" valign="top" style="padding-top:0px;padding-right:0px;width:23;height:31;"></td> </tr> <tr> <td colspan="2" style="padding:8px;"><p id="alt_text">'+texto+'</p></td> </tr> </table>		</td> <td width="10" background="'+imgsUrl+'l_dir.gif">&nbsp;</td> </tr> <tr> <td width="10"><img src="'+imgs.eb1+'" name="eb1" width="10" height="39" id="eb1"></td> <td width="34" background="'+imgsUrl+'l_baixo.gif">		<img src="'+imgs.eb+'" name="eb" width="30" height="39" id="eb"></td> <td width="212" background="'+imgsUrl+'l_baixo.gif" style="width:212;"><img src="'+imgsUrl+'l_baixo1.gif" width="212" height="39"></td> <td width="34" align="right" background="'+imgsUrl+'l_baixo.gif" style="text-align:right;"><img src="'+imgs.db+'" name="db" width="30" height="39" id="db"></td> <td width="10"><img src="'+imgs.db1+'" name="db1" width="10" height="39" id="db1"></td> </tr></table>';
bod.appendChild(sp);
};

function gid(id) { return document.getElementById(id); }