
var tab = Class.create();
tab.prototype = {

	//
	//  Setup the Variables
	//
	showTab : null,
	currentTab : null,
	
	//  
	//  Initialize the tabs
	//
	initialize: function(container, options) {
	  if (!$(container)) {
	    throw(container+" doesn't exist!");
	    return false;
	  }
	  
		this.options = Object.extend({
			classNames : {
				tab : 'tab',
				tabActive : 'tab_active',
				content : 'tab_content'
			},
			defaultSize : {
				height : null,
				width : null
			},
			onEvent : 'click'
		}, options || {});
		
		var tabs = $$('#'+container+' .'+this.options.classNames.tab);
		i = 0;
		tabs.each(function(tab) {
			++i;
			Event.observe(tab, this.options.onEvent, this.activate.bind(this, $(this.options.classNames.content + i)), false);
			if (this.options.onEvent == 'click') {
			  tab.onclick = function() {return false;};
			}
			
			this.currentTab = $(this.options.classNames.content + i);
		}.bind(this));
		
	},
	
	//
	//  Activate an tab
	//
	activate : function(tab) {
		this.currentTab = tab;
//		$(this.options.classNames.tab + tab.id.replace(/.*([0-9]+)/,"$1")).addClassName(this.options.classNames.tabActive);
		$(this.options.classNames.tab + tab.id.replace(/[^0-9]+/,"") ).addClassName(this.options.classNames.tabActive);
		
		$('first').setStyle({display:'none'});
		
		this.currentTab.setStyle({
			display: 'inline'
		});		
		
		this.currentTab.addClassName(this.options.classNames.tabActive);

		if (this.currentTab == this.showTab) {
		} else {
		  this._handleTab();
		}
	},
	// 
	// Deactivate an active tab
	//
	deactivate : function() {
//		$(this.options.classNames.tab + this.showTab.id.replace(/.*([0-9]+)/,"$1")).removeClassName(this.options.classNames.tabActive);
		$(this.options.classNames.tab + this.showTab.id.replace(/[^0-9]+/,"") ).removeClassName(this.options.classNames.tabActive);
		this.showTab.removeClassName(this.options.classNames.tabActive);
	},

  //
  // Handle the open/close actions of the tab
  //
	_handleTab : function() {

		if (this.showTab) {
//			$(this.options.classNames.tab + this.showTab.id.replace(/.*([0-9]+)/,"$1")).removeClassName(this.options.classNames.tabActive);
			$(this.options.classNames.tab + this.showTab.id.replace(/[^0-9]+/,"") ).removeClassName(this.options.classNames.tabActive);
			this.showTab.removeClassName(this.options.classNames.tabActive);

			this.showTab.setStyle({
				display: 'none'
			});				
		}
		$(this.currentTab).setStyle({
		//  height: 'auto'
		});
		this.showTab = this.currentTab;

	}
}
	
