var aSpans = new Array();

// This function must be run in the pages onLoad event in order to
// a) create the buttons for the characters and
// b) populate the aSpans array for use by the hide and show functions.
function makebuttons() {
   aSpans = document.getElementsByTagName("span");
   for (i=0; i<aSpans.length; i++) {
      if (aSpans[i].className && aSpans[i].className=='char') {
         aSpans[i].innerHTML = aSpans[i].innerHTML + " <input type=\"button\" value=\"+/-\" onclick=\"showhide('" + aSpans[i].parentNode.id + "');\">";
      }
   }
   
   //Some browsers (Firefox 2) after opening the page to an internal anchor
   //and running the above code, will then jump to a slightly different spot.
   //This code compensates for that.
   if (window.location.href.indexOf('#') > -1) {
      anc = window.location.href.substring(window.location.href.indexOf('#'));
      //alert(anc);
      window.location = anc;
   }
}

function showhide(id) {
   var ele = document.getElementById(id);
   var eleSpans = ele.getElementsByTagName("span");
   for (var i = 0; i < eleSpans.length; i++)
   {
      if (eleSpans[i].className && eleSpans[i].className == "chron")
      {
         if (eleSpans[i].style.display == 'none') {
            eleSpans[i].style.display = 'inline';
         } else {
            eleSpans[i].style.display = 'none';
         }
      }
   }
}

function hide() {
   for (i=0; i<aSpans.length; i++) {
      if (aSpans[i].className && aSpans[i].className=='chron') {
         aSpans[i].style.display='none';
      }
   }
}

function show() {
   for (i=0; i<aSpans.length; i++) {
      if (aSpans[i].className && aSpans[i].className=='chron') {
         aSpans[i].style.display='inline';
      }
   }
}