/* SimpleTabs - Unobtrusive Tabs with Ajax for MooTools 1.1 - (c) 2007 Harald Kirschner <mail [at] digitarald.de> - MIT License style */
var SimpleTabs = new Class({

	options: {
		show: 0,
		entrySelector: '.tab-entry',
		classWrapper: 'tab-wrapper',
		classMenu: 'tab-menu',
		classContainer: 'tab-container',
		onShow: function(toggle, container, index) {
			toggle.addClass('tab-selected');
			container.setStyle('display', '');
		},
		onHide: function(toggle, container, index) {
			toggle.removeClass('tab-selected');
			container.setStyle('display', 'none');
		},
		onRequest: function(toggle, container, index) {
			container.addClass('tab-ajax-loading');
		},
		onComplete: function(toggle, container, index) {
			container.removeClass('tab-ajax-loading');
		},
		onFailure: function(toggle, container, index) {
			container.removeClass('tab-ajax-loading');
		},
		getContent: null
	},

	initialize: function(el, options) {
		this.setOptions(options);
		this.element = $(el);
		this.selected = null;
		this.build();
	},

	build: function() {
		this.entries = [];
		this.menu = new Element('ul', {'class': this.options.classMenu});
		this.wrapper = new Element('div', {'class': this.options.classWrapper});
		this.element.getElements(this.options.entrySelector).each(function(el) {
			var content = el.href || (this.options.getContent ? this.options.getContent.call(this, el) : el.getNext());
			this.addTab(el.innerHTML, el.title || el.innerHTML, content);
		}, this);
		this.element.empty().adopt(this.menu).adopt(this.wrapper);
		if (this.entries.length) this.select(this.options.show);
	},


	addTab: function(text, title, content) {
		if ($type(content) == 'string' && !$(content)) var url = content;
		var container = $(content) || new Element('div');
		this.entries.push({
			container: container.setStyle('display', 'none').addClass(this.options.classContainer).inject(this.wrapper),
			toggle: new Element('li').adopt(new Element('a', {
				href: '#',
				title: title,
				events: {
					click: this.onClick.bindWithEvent(this, [this.entries.length])
				}
			}).setHTML(text)).inject(this.menu),
			url: url || null
		});
		return this;
	},

	onClick: function(evt, index) {
		evt.stop();
		this.select(index);
	},

	/**
	 * Select the tab via tab-index
	 * 
	 * @param {Number} Tab-index
	 */
	select: function(index) {
		if (this.selected === index || !this.entries[index]) return this;
		var entry = this.entries[index];
		var params = [entry.toggle, entry.container, index];
		if (this.selected !== null) {
			var current = this.entries[this.selected];
			if (this.ajax && this.ajax.running) this.ajax.cancel();
			params.concat([current.toggle, current.container, this.selected]);
			this.fireEvent('onHide', [current.toggle, current.container, this.selected]);
		}
		this.fireEvent('onShow', params);
		if (entry.url && !entry.loaded) {
			this.ajax = new Ajax(entry.url, $merge({
				onRequest: this.fireEvent.pass(['onRequest', params], this),
				onFailure: this.fireEvent.pass(['onFailure', params], this),
				onComplete: function(resp) {
					entry.loaded = true;
					entry.container.empty().setHTML(resp);
					this.fireEvent('onComplete', params);
				}.bind(this)
			}, this.options.ajaxOptions)).request();
		}
		this.selected = index;
		return this;
	}

});

SimpleTabs.implement(new Events, new Options);