var tabberdivid = 'greyBoxTabs';
var currentTabDigit = 1;

function setButtonsVisibility(current, length) {
  $('greyBoxPrevButton').className = (current == 1) ? "hidden" : "";
  $('greyBoxNextButton').className = (current == length) ? "hidden" : "";
  return true;
}

function hideTabsContent(theClass){
  var arrElements = $$('div.'+theClass);
  for(var i=0; i<arrElements.length; i++){
    oElement = arrElements[i];
    $(oElement).setStyle({
      display: 'none'
    });
  }
}

function setTabsVisibility (targetId) {
  var ancestors = $(targetId).ancestors();
  var parentDiv = ancestors[0]; // back up to get the li of link clicked
  var brotherDivs = parentDiv.immediateDescendants(); //all the brother li of the link clicked
  setButtonsVisibility (currentTabDigit, brotherDivs.length);
  hideTabsContent('greyBoxTabContent');
  $(targetId).setStyle({ display: 'inline' });
  return true;
}

function thisTab(obj) {
  var splitResultHref = obj.href.split("#");
  var targetId = splitResultHref[1];
  var ancestors = $(obj).ancestors();
  var parentLi = ancestors[0]; // back up to get the li of link clicked
  var parentUl = ancestors[1]; //going back up the get the ul of the tabs
  var brotherLis = parentUl.immediateDescendants(); //all the brother li of the link clicked
  for(var i=0; i<brotherLis.length; i++){
    bro = brotherLis[i];
    bro.className = "tab"; //set all brothers to tab class. Later we will change the one clicked to the current tab.
  }
  $(parentLi).className = "currentTab";
  hideTabsContent('greyBoxTabContent');
  $(targetId).setStyle({ display: 'inline' });
  return false;
}

function changeTab(t) {
  var tabberdivid = 'greyBoxTabs';
  var tabber = $(tabberdivid);
  var kids = tabber.childNodes;
  for (var k=0; k<kids.length; k++) {
    if (kids[k].nodeName == "UL") {
      tabberUl = kids[k];
      break;
    }
  }
  var tabberlistitems = tabberUl.childNodes;
  for (var i=0; i<tabberlistitems.length; i++) {
    if (tabberlistitems[i].id == "tab_"+t) {
      tabberlistitems[i].className = "currentTab";
    } else {
      tabberlistitems[i].className = "tab";
    }
  }

  var parent = $(t).parentNode;
  var contentdivs = parent.childNodes;
  for(var j=0; j<contentdivs.length; j++){
    checkdiv = contentdivs[j];
    if (checkdiv.id == t) {
      checkdiv.setStyle({ display: 'inline' });
    } else {
      checkdiv.setStyle({ display: 'none' });
    }
  }
  return false;
}

function spellDigit(digit) {
  var spelledNumbers = [
    'zero', 'one', 'two', 'three', 'four', 'five',
    'six', 'seven', 'eight', 'nine', 'ten',
    'eleven', 'twelve', 'thirteen', 'fourteen', 'fifteen',
    'sixteen', 'seventeen', 'eighteen', 'nineteen', 'twenty'
  ];
  return spelledNumbers[digit];
}

function nextTab(){
  currentTabDigit++;
  var targetId = spellDigit(currentTabDigit);
  setTabsVisibility (targetId);
  return false;
}

function prevTab(){
  currentTabDigit--;
  var targetId = spellDigit(currentTabDigit);
  setTabsVisibility (targetId);
  return false;
}


function hideGreyTabsContent(){
  hideTabsContent('greyBoxTabContent');
  if ($('one') != null) $('one').setStyle({ display: 'inline' });
}

Event.observe(window, 'load', hideGreyTabsContent);
