//
//  tabs.js
//

var TabSet = Class.create({
  initialize: function (ul, div) {
    this.ul   = ul;
    this.div  = div;
    this.tabs = this.ul.select("li").map(function (li) {
      return new Tab(this, li, $(li.className));
    }.bind(this));
    this.showTabAtIndex(0);
  },
  
  showTabAtIndex: function (index) {
    this.tabs[index].show();
  },
  
  hideAllTabs: function () {
    this.tabs.each(function (tab) { 
      tab.hide();
    });
  }
});

var Tab = Class.create({
  initialize: function (tabSet, li, div) {
    this.tabSet = tabSet;
    this.li     = li;
    this.div    = div;
    this.observeElements();
  },
  
  observeElements: function () {
    this.li.down("a").onclick = function () {
      this.show();
      return false;
    }.bind(this);
  },
  
  getID: function () {
    return this.div.id;
  },
  
  show: function () {
    this.tabSet.hideAllTabs();
    this.li.addClassName("on");
    this.div.show();
  },
  
  hide: function () {
    this.li.removeClassName("on");
    this.div.hide();
  }
});

Event.observe(window, "load", function () {
  $$("ul.tabs-links").each(function (ul) {
    new TabSet(ul, $("tabs-" + ul.getAttribute("id").split("-").last()));
  });
});