var mootabs = new Class({
	
	Implements: [Events, Options],
	
	options: {
		width: 300,
		height:	200,
		changeTransition: Fx.Transitions.Bounce.easeOut,
		duration: 1000,
		mouseOverClass: 'over',
		activeClass: 'active',
		activateOnLoad: 'first',
		proform: false,
		formname: 'form1',
		useAjax: false,
		ajaxUrl: '',
		ajaxOptions: {
			method:'get'
		},
		tab: 'mootab',
		showTab: 'mootabs_panel',
		ajaxLoadingText: 'Loading...'
	},
	
	initialize: function(element, options) {
		this.setOptions(options);			
		this.el = $(element);
		this.elid = element;
		this.titles = $$('#' + this.elid + ' ul.'+this.options.tab+' li');
		this.panelHeight = this.el.getCoordinates().height - (this.titles[0].getCoordinates().height + 4);
		this.panels = $$('#' + this.elid + ' .' + this.options.showTab);
		this.titles.each(function(item) {
			item.addEvent('click', function(){
					item.removeClass(this.options.mouseOverClass);
					this.activate(item);
			}.bind(this));
			
			item.addEvent('mouseover', function() {
				if(item != this.activeTitle){
					item.addClass(this.options.mouseOverClass);
				}
			}.bind(this));
			
			item.addEvent('mouseout', function() {
				if(item != this.activeTitle){
					item.removeClass(this.options.mouseOverClass);
				}
			}.bind(this));
		}.bind(this));
		
		
		if(this.options.activateOnLoad != 'none'){
			if(this.options.activateOnLoad == 'first'){
				this.activate(this.titles[0], true);
			}else{
				this.activate(this.options.activateOnLoad, true);	
			}
		}
	},
	
	activate: function(tab, skipAnim){		
		if(! $defined(skipAnim)){ skipAnim = false; }
		
		if($type(tab) == 'string') {
			myTab = $$('#' + this.elid + ' ul.' + this.options.tab + ' li');
			myTab.each(function(el){
				if( el.getProperty('title') == tab)	{ tab = el; }
			}.bind(this));
		}
		
		if($type(tab) == 'element'){
			var newTab = tab.getProperty('title');
			this.panels.removeClass(this.options.activeClass);
			//this.activePanel = this.panels.filter(newTab);
			this.activePanel = $(newTab);
			this.activePanel.addClass(this.options.activeClass);
			
			if(this.options.changeTransition != 'none' && skipAnim == false){
				var changeEffect = new Fx.Elements(this.panels.filter(newTab), {
					duration: this.options.duration,
					transition: this.options.changeTransition
				});
			}
			
			this.titles.removeClass(this.options.activeClass);
			tab.addClass(this.options.activeClass);
			this.activeTitle = tab;
			if(this.options.useAjax){ this._getContent(); }

			if(this.options.proform)
				new Proform( $(newTab), {selectText: 'select', classes: 'member-', hover_color: '#EBE4C3' });
		}
	},
	
	_getContent: function(){
		this.activePanel.setHTML(this.options.ajaxLoadingText);
		var newOptions = {update: this.activePanel.getProperty('id')};
		this.options.ajaxOptions = Object.extend(this.options.ajaxOptions, newOptions || {});
		var tabRequest = new Ajax(this.options.ajaxUrl + '?tab=' + this.activeTitle.getProperty('title'), this.options.ajaxOptions);
		tabRequest.request();
	},
	
	addTab: function(title, label, content){
		//the new title
		var newTitle = new Element('li', {
			'title': title
		});
		newTitle.appendText(label);
		this.titles.include(newTitle);
		$$('#' + this.elid + ' ul').adopt(newTitle);
		newTitle.addEvent('click', function() {
			this.activate(newTitle);
		}.bind(this));
		
		newTitle.addEvent('mouseover', function() {
			if(newTitle != this.activeTitle)
			{
				newTitle.addClass(this.options.mouseOverClass);
			}
		}.bind(this));
		newTitle.addEvent('mouseout', function() {
			if(newTitle != this.activeTitle)
			{
				newTitle.removeClass(this.options.mouseOverClass);
			}
		}.bind(this));
		//the new panel
		var newPanel = new Element('div', {
			'style': {'height': this.options.panelHeight},
			'id': title,
			'class': this.options.showTab
		});
		if(!this.options.useAjax)
		{
			newPanel.setHTML(content);
		}
		this.panels.include(newPanel);
		this.el.adopt(newPanel);
	},
	
	removeTab: function(title){
		if(this.activeTitle.title == title)
		{
			this.activate(this.titles[0]);
		}
		$$('#' + this.elid + ' ul li').filterByAttribute('title', '=', title)[0].remove();
		
		$$('#' + this.elid + ' .' + this.options.showTab).filter(title)[0].remove();
	},
	
	next: function(){
		var nextTab = this.activeTitle.getNext();
		if(!nextTab) {
			nextTab = this.titles[0];
		}
		this.activate(nextTab);
	},
	
	previous: function(){
		var previousTab = this.activeTitle.getPrevious();
		if(!previousTab) {
			previousTab = this.titles[this.titles.length - 1];
		}
		this.activate(previousTab);
	}
});