/**********************************************************************************
 The following tab rollover code is adapted by John Sidles from Danny Goodman's 
 "Recipe for Super-Efficient Image Rollovers"
   Home Page: fttp://www.dannyg.com
  JavaScript: http://www.oreillynet.com/pub/a/javascript/2003/07/01/bonusrecipe.html
 **********************************************************************************/

function initTabs() {
  if (document.getElementById) {
    var mapIds = initTabs.arguments;			// pass string IDs of containing map elements
    var i, j, area, areas;
    for (i = 0; i < mapIds.length; i++) {
      areas = document.getElementById(mapIds[i]).getElementsByTagName("area");
  
      for (j = 0; j < areas.length; j++) {	// loop thru img elements
        area = areas[j];
        area.onmousedown = tabsSwap;			// set event handlers
        area.onmouseout = tabsSwap;
        area.onmouseover = tabsSwap;
        area.onmouseup = tabsSwap;
      }
    }
  }
}


// image swapping event handling
function tabsSwap(evt) {
  evt = (evt) ? evt : event;
  var elem = (evt.target) ? evt.target : evt.srcElement;
  var imgClass = elem.parentNode.name;  // "apollo" or "gemini"
  var coords = elem.coords.split(",");
  var clipVal = "rect(" + coords[1] + "px " +
                          coords[2] + "px " +
                          coords[3] + "px " +
                          coords[0] + "px)"  ;
  var tabName = elem.id;  // imgClass+"TopTab" or imgClass+"LowerTab"
  var topImageState = document.getElementById(imgClass + "TopImage").style.visibility; // "Visible" or "Hidden"
  var imgStyle;
  var visibleLayer;

  switch(topImageState) {
    case "visible" :
      visibleLayer = "Top";
      break;
    case "hidden" :
      visibleLayer = "Lower";
      break;
  }
  // invoke handler iff the event's tab is associated with a "hidden" 
  // layer that is potentially to be made "visible", and in any case
  // is to be hilited as the mouse passes over it.
  if( tabName == imgClass+"LowerTab" && visibleLayer != "Lower" || 
      tabName == imgClass+"TopTab"   && visibleLayer != "Top" ) {
    switch (evt.type) {
      case "mousedown" :   // make "Down" hilite visible
        imgStyle = document.getElementById(imgClass + visibleLayer + "Down").style;
        imgStyle.clip = clipVal;
        imgStyle.visibility = "visible";
        break;
      case "mouseout" :    // hide all hilights
        document.getElementById(imgClass + visibleLayer + "Over").style.visibility = "hidden";
        document.getElementById(imgClass + visibleLayer + "Down").style.visibility = "hidden";
        break;
      case "mouseover" :  // make "Over" hilite visible
        imgStyle = document.getElementById(imgClass + visibleLayer + "Over").style;
        imgStyle.clip = clipVal;
        imgStyle.visibility = "visible";
        break
      case "mouseup" :   // swap visible layers
        switch(tabName) {
          case (imgClass+"TopTab") :
            if(topImageState != "visible"){
              document.getElementById( imgClass + "TopImage"   ).style.visibility = "visible";
              document.getElementById( imgClass + "TopUp"      ).style.visibility = "visible";
              document.getElementById( imgClass + "TopOver"    ).style.visibility = "hidden";
              document.getElementById( imgClass + "TopDown"    ).style.visibility = "hidden";
              document.getElementById( imgClass + "LowerImage" ).style.visibility = "hidden";
              document.getElementById( imgClass + "LowerUp"    ).style.visibility = "hidden";
              document.getElementById( imgClass + "LowerOver"  ).style.visibility = "hidden";
              document.getElementById( imgClass + "LowerDown"  ).style.visibility = "hidden";
            }
            break;
          case (imgClass+"LowerTab") :
            if(topImageState != "hidden"){
              document.getElementById( imgClass + "LowerImage" ).style.visibility = "visible";
              document.getElementById( imgClass + "LowerUp"    ).style.visibility = "visible";
              document.getElementById( imgClass + "LowerOver"  ).style.visibility = "hidden";
              document.getElementById( imgClass + "LowerDown"  ).style.visibility = "hidden";
              document.getElementById( imgClass + "TopImage"   ).style.visibility = "hidden";
              document.getElementById( imgClass + "TopUp"      ).style.visibility = "hidden";
              document.getElementById( imgClass + "TopOver"    ).style.visibility = "hidden";
              document.getElementById( imgClass + "TopDown"    ).style.visibility = "hidden";
            }
            break;
        }
        // guarantee click in IE
        if (elem.click) {
          elem.click();
        }
        break;
    }
  }
  evt.cancelBubble = true;
  return false;
}