// Tabby is a creation of Jenna "Blueberry" Fox! Who releases it as public domain
// as of the 9th of July, 2007. More info and up to date downloads and demo's at:
// http://creativepony.com/journal/scripts/tabby/

// Basic version of Tabby which works off local data
var Tabby = new Class({
	options: {
		tabsElement: '.tabs', // css expression to find tabs
		contentElement: '.insert-data', // css expression to find place to insert data
		data: {} // the data itself for each tab as link id + html content pairs
	},
	
	tabBuffer: {},
	
	// creates a new Tabby :)
	initialize: function(container, options) {
		this.container = $(container);
		this.setOptions(options);
		this.tabsElement = this.container.getElement(this.options.tabsElement);
		this.contentElement = this.container.getElement(this.options.contentElement);
		
		// set up tabs to actually work
		this.tabsElement.getChildren().each(function (child) {
			child.addEvent('click', function(event) {
				this.display(child.id);
			}.bindWithEvent(this));
			
			// put a hand cursor up so people know its clickable
			child.setStyle('cursor', 'pointer');
			
			// stop link from firing if it was where the click happened
			child.getElement('a').addEvent('click', function(event) {
				event.preventDefault();
			}.bindWithEvent());
		}.bind(this));
	},
	
	// display specified tab by id
	display: function(tabID) {
		this.tabBuffer[this.getSelected().id] = this.contentElement;
		var previousButton = this.getSelected();
		var previousBody = this.contentElement;
		
		if ($defined(this.tabBuffer[tabID]) == false) {
			if ($type(this.options.data[tabID]) == 'string') {
				this.tabBuffer[tabID] = this.contentElement.clone(false);
				this.tabBuffer[tabID].setHTML(this.options.data[tabID]);
			} else {
				this.tabBuffer[tabID] = this.options.data[tabID];
			}
		}
		
		this.tabBuffer[tabID].setStyle('visibility', 'hidden');
		this.contentElement = this.contentElement.replaceWith(this.tabBuffer[tabID]);
		
		// change which tab is selected in the dom
		this.tabsElement.getElement('.selected').removeClass('selected');
		$(tabID).addClass('selected');
		
		// fire off onChanged event
		this.fireEvent('onChanged', [this, this.getSelected(), this.contentElement, previousButton, previousBody]);
		this.contentElement.setStyle('visibility', 'visible');
	},
	
	// returns currently selected tab id
	getSelected: function() {
		return this.tabsElement.getElement('.selected');
	}
});

Tabby.implement(new Events, new Options);


// Remote version of Tabby which loads over Ajax
Tabby.Remote = Tabby.extend({
	initialize: function(container, options) {
		this.options.urls = {};
		this.parent.apply(this, arguments);
	},
	
	display: function(tabID) {
		if (tabID == this.getSelected().id) return;
		
		if ($defined(this.options.data[tabID]) || $defined(this.tabBuffer[tabID])) {
			this.fireEvent('onLoading');
			this.parent(tabID);
			this.fireEvent('onLoaded');
		} else {
			// if already trying to load something, stop it
			if ($defined(this.ajax) && this.ajax.running) { this.ajax.cancel(); }
			
			// fire event for animations and such
			this.fireEvent('onLoading');
			
			// load tab remotely
			this.ajax = new Ajax(this.options.urls[tabID], {
				method: 'get',
				onComplete: function () {
					this.options.data[tabID] = this.ajax.response.text;
					this.display(tabID);
					this.fireEvent('onLoaded');
				}.bind(this)
			}).request();
		}
	},
	
	clearCache: function() {
		this.options.data = {};
		this.tabBuffers = {};
	}
});