// -------------------------------------------------------------
//                      BubbleTooltips.js
//
// Author: Alessandro Fulciniti - http://pro.html.it - http://web-graphics.com 
//         (thank you, Alessandro)
// Changes: 5/22/07 - JTG - comments and fomatting changes to tooltip
//
// -------------------------------------------------------------

function enableTooltips(id){
  var links,i,h;
  // if DHTML not available, exit
  if(!document.getElementById || !document.getElementsByTagName) return;
  // load the .css file listed in AddCss
  AddCss();
  // the base <span> tag for the page
  h=document.createElement("span");
  // set id and css id attribute for the base <span>
  h.id="btc";
  h.setAttribute("id","btc");
  h.style.position="absolute";
  // attach base <span> to body of document
  document.getElementsByTagName("body")[0].appendChild(h);
  // list <a> tags for whole document
  if(id==null) links=document.getElementsByTagName("a");
  // list <a> tags for designated element id
  else links=document.getElementById(id).getElementsByTagName("a");
  // initialize each <a> tag
  for(i=0;i<links.length;i++){
    Prepare(links[i]);
  }
}

// -------------------------------------------------------------
// Function -                   Prepare
// Purpose -
// Remarks - 
// -------------------------------------------------------------
function Prepare(el){
  var tooltip, t, b, l1, l2, c1, c2;
  // "title" attribute has the 1st line of text for tooltip (in .html)
  t=el.getAttribute("title");
  // if no text in title, remove the "title" attribute
  if(t==null || t.length==0) t="link:";
  el.removeAttribute("title");

  //
  // create tooltip <span> element
  //
  tooltip=CreateEl("span","tooltip");

  //
  // create top <b> child element to tooltip
  //
  b=CreateEl("b","top");
  // add text to top <b> element
  b.appendChild(document.createTextNode(t));
  tooltip.appendChild(b);

  //
  // create line1 <span> element
  //
  l1=CreateEl("span","line1");
  // get the comment text from link (el) element
  c1=el.getAttribute("line1");
  // add text to input1 <span> element
  l1.appendChild(document.createTextNode(c1));
  // add input1 <span> element to the tooltip
  tooltip.appendChild(l1);

  //
  // create line2 <span> element
  //
  l2=CreateEl("span","line2");
  // get the comment text from link (el) element
  c2=el.getAttribute("line2");
  // add text to input2 <span> element
  l2.appendChild(document.createTextNode(c2));
  // add input2 <span> element to the tooltip
  tooltip.appendChild(l2);

  // set the level of opacity in setOpacity
  setOpacity(tooltip);
  // create/set link tooltip property
  el.tooltip=tooltip;
  // set event handlers for the link
  el.onmouseover=showTooltip;
  el.onmouseout=hideTooltip;
  el.onmousemove=Locate;
}

function showTooltip(e){
  // attach the tooltip property for this <a> element to the base <span> element
  document.getElementById("btc").appendChild(this.tooltip);
  // position the tooltip
  Locate(e);
}

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

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

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","bt.css");
  l.setAttribute("media","screen");
  document.getElementsByTagName("head")[0].appendChild(l);
}

// -------------------------------------------------------------
// Function -                    Locate
// Purpose - position the tooltip
// Remarks - The event object contains properties that describe 
//           a JavaScript event, and is passed as an argument to
//           an event handler when the event occurs.
// -------------------------------------------------------------
function Locate(e){
  var posx=0,posy=0;
  // if event isn't captured, capture it
  if(e==null){
    e=window.event;
  }
  // Returns the coordinates of the event relative to the page.
  if(e.pageX || e.pageY){
    posx=e.pageX; posy=e.pageY;
  }
  // Returns the coordinates within the application's client area
  else if(e.clientX || e.clientY){
    if(document.documentElement.scrollTop){
      posx=e.clientX+document.documentElement.scrollLeft;
      posy=e.clientY+document.documentElement.scrollTop;
    }
    else{
      posx=e.clientX+document.body.scrollLeft;
      posy=e.clientY+document.body.scrollTop;
    }
  }
  // position the base <span> element relative to event
  document.getElementById("btc").style.top=(posy-25)+"px";
  document.getElementById("btc").style.left=(posx+30)+"px";
}