var Tabs=Class.create()
Object.extend(Tabs.prototype,{
  initialize:function(tab_container){
    this.tab_container=tab_container;
    this.tab_links=$A(this.tab_container.getElementsByClassName('tab-link'));
    this.tab_links_container=this.tab_container.down('div.tab-links');
    this.tab_contents=$A(this.tab_container.getElementsByClassName('tab-content'));
    
    this.curr_tab_index=0;
    this.init();
  },
  
  init:function(){
    var self =this;
    this.tab_links.each(function(tlink){
      Event.observe(tlink,'click',self.showTab.bindAsEventListener(self));
    })
  },
  
  showTab:function(event){
    Event.stop(event);
    clicked_tab=event.findElement('a.tab-link');
    tab_index=this.tab_links.indexOf(clicked_tab);
    this.tab_contents.invoke('hide');
    this.tab_contents[tab_index].show();
    this.tab_links_container.setStyle({backgroundPosition:(tab_index*-340)+'px 0'});
    this.tab_links.invoke('removeClassName','selected');
    clicked_tab.addClassName('selected');
  }
  
});

document.observe('dom:loaded',function(){
  $$('.tab-container').each(function(t){
    new Tabs(t);
  })

})