var TabbedContent = new Class({

    Implements: [Options, Events],
    
    options: {
        selectors: {
            tabs: '.tabs a',
            content: '.content'
        },
        selectedClass: 'selected',
        defaultIndex: 0
    },
    
    selectedIndex: null,
    
    initialize: function(container, options) {
        this.setOptions(options);
        this.container = $(container);
        this.tabs = this.container.getElements(this.options.selectors.tabs);
        this.content = this.container.getElements(this.options.selectors.content);
        
        this.tabs.each(function(tab, index) {
            tab.addEvent('click', function(e) {
                e.stop();
                this.select(index);
            }.bind(this));
        }, this);
        this.content.setStyle('display', 'none');
        
        this.select(this.options.defaultIndex);
    },
    
    select: function(index) {
        if (this.selectedIndex !== null) {
            this.tabs[this.selectedIndex].removeClass(this.options.selectedClass);
            this.content[this.selectedIndex].setStyle('display', 'none');
        }
        this.tabs[index].addClass(this.options.selectedClass);
        this.content[index].setStyle('display', 'block');
        this.selectedIndex = index;
        this.fireEvent('select', index);
    }

});