
/* Load the Mootabs */
window.addEvent('domready', init);
function init() {
	var myTabs1 = new mootabs('tabs_frontpage', {});
}

/* All the transistion options below */
/*
'none'
Fx.Transitions.linear
Fx.Transitions.Quad.easeIn
Fx.Transitions.Quad.easeOut
Fx.Transitions.Quad.easeInOut
Fx.Transitions.Cubic.easeIn
Fx.Transitions.Cubic.easeOut
Fx.Transitions.Cubic.easeInOut
Fx.Transitions.Quart.easeIn
Fx.Transitions.Quart.easeOut
Fx.Transitions.Quart.easeInOut
Fx.Transitions.Quint.easeIn
Fx.Transitions.Quint.easeOut
Fx.Transitions.Quint.easeInOut
Fx.Transitions.Sine.easeIn
Fx.Transitions.sine.easeOut
Fx.Transitions.Sine.easeInOut
Fx.Transitions.Expo.easeIn
Fx.Transitions.Expo.easeOut
Fx.Transitions.Expo.easeInOut
Fx.Transitions.Circ.easeIn
Fx.Transitions.Circ.easeOut
Fx.Transitions.Circ.easeInOut
Fx.Transitions.Bounce.easeIn
Fx.Transitions.Bounce.easeOut
Fx.Transitions.Bounce.easeInOut
Fx.Transitions.Back.easeIn
Fx.Transitions.Back.easeOut
Fx.Transitions.Back.easeInOut
Fx.Transitions.Elastic.easeIn
Fx.Transitions.Elastic.easeOut
Fx.Transitions.Elastic.easeInOut
*/

var mootabs = new Class({	
	initialize: function(element, options) {
		this.options = Object.extend({
			//width:					'921px',
			//height:					'190px', //'215px',
			changeTransition:		Fx.Transitions.Quad.easeOut,
			duration:				500,
			mouseOverClass:			'over',
			activateOnLoadDefault:	3, // this will be the default tab to show onLoad, if activateOnLoad is 'cookie', (ex.: no. array options, 0 to max number of tabs used)
			activateOnLoad:			'cookie', // options: 'none', 0, 1, 2, etc. or use a 'cookie'
			useAjax: 				false,
			ajaxUrl: 				base_url + 'scripts/php/tabs_frontpage_controller.php',
			ajaxOptions: 			{method:'post'},
			ajaxLoadingText: 		'Loading...'
		}, options || {});
		//alert(this.options.ajaxUrl);
		
		this.el = $(element);
		this.elid = element;
		
		this.el.setStyles({
			//height: this.options.height,
			//width: this.options.width
		});
		
		this.titles = $$('#' + this.elid + ' ul.mootabs_title li');
		this.panelHeight = this.el.getSize().size.y - (this.titles[0].getSize().size.y + 4);
		this.panels = $$('#' + this.elid + ' .mootabs_panel');
		
		this.panels.setStyle('height', this.panelHeight);
		
		this.titles.each(function(item) {
			//alert(item.id);
			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($type(this.options.activateOnLoad) == 'number') {
				this.activate(this.titles[this.options.activateOnLoad], true);
			} else if(this.options.activateOnLoad == 'cookie') {	
				// get cookie that was saved in the this.activate() function (during the previous session)
				this.cookieTab = Cookie.get("savedTab"); //returns savedTab
				if(this.cookieTab) // if cookie is set ... 
					this.activate(this.cookieTab, true); // ... then activate saved tab
				else // if not then get whatever the default tab should be
					this.activate(this.titles[this.options.activateOnLoadDefault], true); // default to this.options.activateOnLoadDefault (if !this.cookieTab)
			} else {
				this.activate(this.options.activateOnLoad, true);	
			}
		}
	},
	
	activate: function(tab, skipAnim){
		if(! $defined(skipAnim)) {
			skipAnim = false;
		}
		
		if($type(tab) == 'string') {
			/*if(!_access)*/ var myTab = $$('#' + this.elid + ' ul li').filterByAttribute('title', '=', tab)[0];
			//else var myTab = $$('#' + this.elid + ' ul li').filterByAttribute('title', '=', tab);
			tab = myTab;
		}
		
		if($type(tab) == 'element') {
			var newTab = tab.getProperty('title');
			this.panels.removeClass('active');
						
			if(this.options.activateOnLoad == 'cookie') 
				Cookie.set('savedTab', newTab, {duration: 0}); // save cookie, until the browser closes
			
			this.activePanel = this.panels.filterById(newTab)[0];
            // DISABLED
			if(_access) {
				//alert(newTab + ', ' + tab.id + ', ' + this.activePanel);
				//alert($$('#' + this.elid + ' ul li').filterByAttribute('title', '=', tab).length);
				for(var q=0; q<=$$('#' + this.elid + ' ul li').filterByAttribute('title', '=', tab).length; q++){
					//alert(newTab+', '+tab.id+', '+this.activePanel+', '+this.panels.filterById(newTab)[q]);
				}
			}
			
			this.activePanel.addClass('active');
			
			if(this.options.changeTransition != 'none' && skipAnim==false) {
				this.panels.filterById(newTab).setStyle('height', 0);
				var changeEffect = new Fx.Elements(this.panels.filterById(newTab), {duration: this.options.duration, transition: this.options.changeTransition});
				changeEffect.start({
					'0': {
						'height': [0, this.panelHeight]
					}
				});
			}
			
			this.titles.removeClass('active');
			
			tab.addClass('active');
			
			this.activeTitle = tab;
			
			if(this.options.useAjax) this._getContent();
		}
	},
	
	_getContent: function(){
		this.activePanel.setHTML('<div align="center">' + this.options.ajaxLoadingText + '</div>');
		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': 'mootabs_panel'
		});
		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 + ' .mootabs_panel').filterById(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);
	}
});
