/* Based on Mootabs 1.2, rewrote for Mootools 1.2 by Eneko */

var Tabs = new Class({
	Implements: [Options, Events],

	options: {
		activeClass:    'active',
		inactiveClass:	'inactive', 
		mouseOverClass:	'',
		activateOnLoad:	'first'
	},
	
	initialize: function(element, options) {
		var self=this;
		self.setOptions(options);
		self.container = $(element);
		self.titles    = self.container.getElements('ul.tabs-title li.tab');
		self.panels    = self.container.getElements('.tabs-panel');

		// Hook tab events
		self.titles.each(function(item) {
			item.addEvent('click', function(event){
				event.preventDefault();
				event.target.blur();
				self.activate(item);
			});
			if (self.options.mouseOverClass) {
				item.addEvent('mouseover', function() {
					if (item != self.activeTitle) item.addClass(self.options.mouseOverClass);
				});
				item.addEvent('mouseout', function() {
					if (item != self.activeTitle) item.removeClass(self.options.mouseOverClass);
				});
			}
		});
		
		self.container.getElements('ul.tabs-title li.back').addEvent('click', function(event){
			event.preventDefault();
			event.target.blur();
			self.previous();
		});
		self.container.getElements('ul.tabs-title li.next').addEvent('click', function(event){
			event.preventDefault();
			event.target.blur();
			self.next();
		});
		
		if (self.options.activateOnLoad != 'none') {
			if (self.options.activateOnLoad == 'first') {
				self.activate(self.titles[0]);
			} else {
				self.activate(self.options.activateOnLoad);
			}
		}
	},
	
	activate: function(tab) {
		tab = $(tab);
		if ($type(tab) == 'element') {
			if (this.activeTitle == tab) return; // Don't do anything if tab is already active
			
			var oldTab   = this.activeTitle;
			var oldPanel = this.activePanel;

			// Hide old panel
			this.titles.removeClass(this.options.activeClass).addClass(this.options.inactiveClass);
			this.panels.removeClass(this.options.activeClass).addClass(this.options.inactiveClass);

			// Show new panel
			this.activeTitle = tab;
			this.activeTitle.removeClass(this.options.mouseOverClass).addClass(this.options.activeClass);
			this.activeIndex = this.activeTitle.getAllPrevious('li.tab').length;
			this.activePanel = this.panels[this.activeIndex];
			this.activePanel.addClass(this.options.activeClass).removeClass(this.options.inactiveClass);

			this.fireEvent('tabchanged', [oldTab, oldPanel, this.activeTitle, this.activePanel]);
		}
	},

	next: function() {
		var tab = (this.activeIndex < (this.titles.length-1))
			? this.titles[this.activeIndex+1]
			: this.titles[0];
		this.activate(tab);
	},

	previous: function() {
		var tab = (this.activeIndex)
			? this.titles[this.activeIndex-1]
			: this.titles[this.titles.length-1];
		this.activate(tab);
	}
});