/*javascript for Bubble Tooltips by Alessandro Fulciniti
   - http://pro.html.it and http://web-graphics.com 
   - modified by Brad Garner, USGS (bdgarner@usgs.gov)
*/

function bubbleTooltipShow(e) {
    var btc = $("btc");

    btc.style.display = 'none';
    btc.appendChild(this.tooltip);
    Effect.Appear(btc, { duration:0.2, from:0.0, to:1.0 });    

    bubbleTooltipLocate(e);
}

function bubbleTooltipHide(e) {
    var btc = $("btc");
    if (btc.childNodes.length > 0) {
	btc.removeChild(btc.firstChild);
    }
}

function bubbleTooltipLocate(e) {
    var posx = 0;
    var posy = 0;

    if (e == null) {
	e=window.event;
    }

    if (e.pageX || e.pageY) {
	posx = e.pageX; 
	posy = e.pageY;

    } 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;
        }
    }

    $('btc').style.top = (posy + 10) + "px";
    $('btc').style.left = (posx - 20) + "px";
}

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

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 bubbleTooltipHookElement(el) {

    // Get relevant info from element
    var titleText = el.getAttribute("title");
    var altText = el.getAttribute("alt");
    el.removeAttribute("title"); // And delete attributes since we're handling them now.
    el.removeAttribute("alt");

    // Handle old-style imagemaps.  Delete the old handler, extract text from the old JavaScript statement.
    var oldOnmouseover = el.getAttribute("onmouseover");
    el.removeAttribute("onmouseover");
    el.removeAttribute("onmouseout");
    if (oldOnmouseover != null) {
	oldOnmouseover = oldOnmouseover.toString();
	var textStart = oldOnmouseover.indexOf("up('") + 4;
	var textEnd = oldOnmouseover.indexOf("');");
	titleText = oldOnmouseover.substr(textStart, textEnd-textStart);
    }    

    // Do some surgery on the element-extracted text
    if (titleText==null || titleText.length==0) {
	titleText = altText;
	altText = null;
    }
    if (altText != null && altText.length > 200) {
	altText = altText.substr(0, 200) + "...";
    }
    if (titleText==altText) {
	altText = ""; // Avoid duplicate info
    }

    // Create and attach a HTML element to the DOM, of the format
    // <span class="tooltip">
    //  <span class="top">text</span>
    //  <strong class="bottom">text</span>
    // </span>
    var top = CreateEl("span", "top");
    var bottom = CreateEl("strong", "bottom");

    if (titleText != null) {
	top.appendChild(document.createTextNode(titleText));
    }

    if (altText != null) {
	bottom.appendChild(document.createTextNode(altText));
    }

    var tooltip = CreateEl("span", "tooltip");
    tooltip.appendChild(top);
    tooltip.appendChild(bottom);

    setOpacity(tooltip);

    el.tooltip = tooltip;

    // Register event handlers
    el.onmouseover = bubbleTooltipShow;
    el.onmouseout = bubbleTooltipHide;
    el.onmousemove = bubbleTooltipLocate;
}

function getAssociatedImgForArea(areaEl) {
   var mapEl = areaEl.parentNode; // every area tag should have a parent map tag
   var mapId = mapEl.getAttribute("id");
   if (mapId == null || mapId.length == 0) {
      mapId = mapEl.getAttribute("name");
      if (mapId == null) {
         return null; // Shouldn't ever happen.  Every map should have an id or name.
      }
   }

   // search every img tag in document for matching usemap="" attribute
   var imgEls = document.getElementsByTagName("img");
   for (var i=0; i<imgEls.length; i++) {
      var imgUsemap = imgEls[i].getAttribute("usemap"); 

      // Does this img's usemap attribute match the map's id?
      if ((imgUsemap != null) && (imgUsemap.match(mapId) != null)) {
         return imgEls[i]; // yes.  Return it.
      }
   }

   return null; // Shouldn't happen.  Every map id should correlate to a img's usemap attribute somewhere.
}

// ----
// isNeedToKillImgAltAttribute() 
//  Returns: TRUE if browser incorrectly displays img's alt attribute as a tooltip, FALSE otherwise
//  Requires: Prototype 1.x or later
//  Author: Brad Ganer
// ----
function isNeedToKillImgAltAttribute() {
   // If it's IE, it has a bug of diaplying img's alt attribute as a tooltip.  Visually very annoying.
   //
   // Note: Rumor is that IE 8 fixes this.  It's still in beta (3/2009), so err on side of caution.

   return (Prototype.Browser.IE);
}

function bubbleTooltipInit() {
    // add Bubble to DOM
    var h = document.createElement("span");
    h.id = "btc";
    h.setAttribute("id", "btc");
    h.style.position = "absolute";
    document.getElementsByTagName("body")[0].appendChild(h); // attach to DOM

    // Do surgery on each link in the map
    var links = document.getElementsByTagName('area');
    for (var i=0; i<links.length; i++) {
	bubbleTooltipHookElement(links[i]);

        // Workaround for IE7 and earlier -- kill alt attribute of img so annoying tooltip doesn't appear.
        if (isNeedToKillImgAltAttribute()) {
  	   var imgEl = getAssociatedImgForArea(links[i]);
           if (imgEl != null) {
              imgEl.removeAttribute("alt");
           }
        }
    }
}


// On-page-load event registration
Event.observe(window, 'load', bubbleTooltipInit);