/*
Class: TabContainer
	Simple tabbed container
	
Arguments:
	tabSelector - css string representing the group of elements that will be used as the tabs
	paneSelector - css string representing the group of elements that will be used as the panes
	
Options:
	initial - index of the tab/pane to start with
	onSwap  - function to call when this.swap is called
*/
var TabContainer = new Class({
	version:'1.1',

	options: {
		initial : 0,
		activeClass : 'active',
		onSwap  : Class.empty
	},

	initialize: function(tabSelector, paneSelector, options){
		this.setOptions(options);
		this.tabs  = $$(tabSelector);
		this.panes = $$(paneSelector);
		
		this.tabs.each(function(e, i){
			e.addEvent('mousedown', function(){this.swap(i)}.bind(this) );
		}.bind(this));
		
		this.swap(this.options.initial);
	},
	
	swap: function(index){
		this.tabs.removeClass(this.options.activeClass)[index].addClass(this.options.activeClass);
		this.panes.each(function(e, i){ i == index ? e.show() : e.hide(); }.bind(this));
		this.fireEvent('onSwap', this.tabs[index]);
	}
	
});

TabContainer.implement(new Events);
TabContainer.implement(new Options);