var InlineTabs = new Class({

	Implements: [Events, Options],

	options: {
		tabContainer: 'inlineTabTabs clearfix',
		elements: '#bottomBar .inlineTab',
		onlyOneTab: true,
		defaultTab: 0,
		onOpen: function(tabContent, tab) {
			tabContent.setStyle('display', 'block');
			tab.addClass('act');
		},
		onClose: function(tabContent, tab) {
			tabContent.setStyle('display', 'none');
			tab.removeClass('act');
		}

	},
	
	initialize: function(container, options) {
		this.tabs = [];
		this.tabsContent = [];
		this.container = $(container);
		this.setOptions(options);
		
		if( $$( this.options.elements ).length < 1 )
			return;
		
		this.build();
		this.openTab( this.options.defaultTab );
	},
	
	build: function() {
		this.tabsContainer = new Element('div', {
			'class' : this.options.tabContainer
		});
		this.container.grab( this.tabsContainer, 'top' );
		$$( this.options.elements ).each( function(el, index) {
			var tab = el.getElement('h3');
			this.tabsContent.push(el);
			this.tabsContainer.grab( tab );
			this.tabs.push( tab );
			tab.addEvent('click', function(e) { e.stop(); 
				this.openTab(index);
			}.bind(this) );
		}.bind(this) );
	},
	
	openTab: function(index) {
		this.fireEvent('onOpen', [ this.tabsContent[index], this.tabs[index] ] );
		if ( this.options.onlyOneTab ) {
			this.tabsContent.each( function(el, allIndex) {
			  if (allIndex != index) 
					this.closeTab(allIndex)
			}.bind(this) );
		}
	},
	
	closeTab: function(index) {
		this.fireEvent('onClose', [ this.tabsContent[index], this.tabs[index] ] );
	}

});
