/* vim: set expandtab tabstop=4 shiftwidth=4: */
// +----------------------------------------------------------------------+
// | dhd24 / deine-tierwelt.de Tooltip Bubbles                                                   |
// +----------------------------------------------------------------------+
// | based on javascript for Bubble Tooltips by Alessandro Fulciniti      |
// |          http://pro.html.it - http://web-graphics.com                |
// +----------------------------------------------------------------------+

//id    = elementid (<a id="foo"...)
//head  = ueberschrift
//text  = text ;)
//links = relative position von links, bezogen auf id-anker (kann null sein)
//oben  = relative position von oben, bezogen auf id-anker (kann null sein)
//ti    = startverzoegerung (kann 0 sein)
//to    = timeout (nach dieser zeit schließt die bubble automatisch)
//flip  = dreht die bubble um
function enableTooltip(id, head, text, links, oben, ti, to, flip){
	var el,i,h;
	var tooltip,b,s;

	if(!document.getElementById || !document.getElementsByTagName || id==null) return;
	AddCss();
	h=document.createElement("span");
	h.id="btc"+id;
	h.setAttribute("id","btc"+id);
	h.style.position="absolute";
	document.getElementsByTagName("body")[0].appendChild(h);
	el=document.getElementById(id);

  	tooltip=CreateEl("span","tooltip");
	if (flip == 1) {
		s=CreateEl("span","top_r");
	} else {
		s=CreateEl("span","top");
	}
//	c=CreateEl("span","close");
//	s.appendChild(c);
	s.appendChild(document.createTextNode(head));
	tooltip.appendChild(s);
	b=CreateEl("span","bottom");
	b.appendChild(document.createTextNode(text));
	tooltip.appendChild(b);
	setOpacity(tooltip);
	tooltip.id="x"+id;
	tooltip.setAttribute("id","x"+id);
	tooltip.onclick=hideHandler;
	el.tooltip=tooltip;
	aktiv   = window.setTimeout("showTooltip('"+id+"', "+links+", "+oben+", "+flip+")", ti);
	inaktiv = window.setTimeout("hideTooltip('"+id+"')", (ti+to));
}

function hideHandler(e) {
	hideTooltip(this.id.substr(1,(this.id.length-1)));
}
function showTooltip(id, links, oben, flip){
	el=document.getElementById(id);
	//try {
		document.getElementById("btc"+id).appendChild(el.tooltip);
		Locate(el, links, oben, id, flip);
/*
	} catch (e) {
		alert(document.getElementById(id).id);
	}
	*/
}

function hideTooltip(id){
	var d=document.getElementById("btc"+id);
	if(d.childNodes.length>0) d.removeChild(d.firstChild);
}

function setOpacity(el){
	el.style.filter="alpha(opacity:93)";
	el.style.KHTMLOpacity="0.93";
	el.style.MozOpacity="0.93";
	el.style.opacity="0.93";
}

function CreateEl(t,c){
	var x=document.createElement(t);
	x.className=c;
	x.style.display="block";
	return(x);
}

function AddCss(){
	var l=CreateEl("link");
	l.setAttribute("type","text/css");
	l.setAttribute("rel","stylesheet");
	l.setAttribute("href","/css/bubbles.css");
	l.setAttribute("media","screen");
	document.getElementsByTagName("head")[0].appendChild(l);
}


function Locate(e, links, oben, id, flip){
    var left = 0;
    var top  = 0;

//	if (links == null || oben == null) {
//	    while (e.offsetParent) {
//	        left += e.offsetLeft;
//	        top  += e.offsetTop;
//	        e     = e.offsetParent;
//	    }
//
//	    left += e.offsetLeft;
//	    top  += e.offsetTop;
//	} else {
//		left = links;
//		top  = oben;
//	}

    while (e.offsetParent) {
        left += e.offsetLeft;
        top  += e.offsetTop;
        e     = e.offsetParent;
    }
	
	if (links != null) {
		left += links;
	}
	if (oben != null) {
		top += oben;
	}
	
    left += e.offsetLeft;
    top  += e.offsetTop;

	if (flip == 1) {
		document.getElementById("btc"+id).style.top=(top+5)+"px";
		document.getElementById("btc"+id).style.left=(left-200)+"px";
	} else {
		document.getElementById("btc"+id).style.top=(top+5)+"px";
		document.getElementById("btc"+id).style.left=(left-20)+"px";
	}
}