var mootabs = new Class({
	
	initialize: function(element, options) {
		this.options = Object.extend({
			width:				'300px',
			height:				'200px',
			changeTransition:	Fx.Transitions.Bounce.easeOut,
			duration:			1000,
			mouseOverClass:		'active',
			activateOnLoad:		'first',
			useAjax: 			false,
			ajaxUrl: 			'',
			ajaxOptions: 		{method:'get'},
			ajaxLoadingText: 	'<strong>Harap tunggu&hellip;</strong>'
		}, options || {});
		
		this.el = $(element);
		this.elid = element;
		
		this.titles = $$('#' + this.elid + ' .indoTabMenu-theMenu div');
		this.panelHeight = this.el.getSize().size.y - (this.titles[0].getSize().size.y + 4);
		this.panels = $$('#' + this.elid + ' .indoTabMenu-theContent div');
		this.panelContainer = $$('#' + this.elid + ' .indoTabMenu-theContent');
			
		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 + ' .indoTabMenu-theMenu div').filterByAttribute('title', '=', tab)[0];
			tab = myTab;
		}
		
		if($type(tab) == 'element')
		{
			var newTab = tab.getProperty('title');
			this.panels.setStyle('display', 'none');
			this.panels.empty();
			
			this.activePanel = this.panels.filterById(newTab)[0];
			
			this.activePanel.setStyle('display', 'block');
			
			if(this.options.changeTransition != 'none' && skipAnim==false)
			{
				var changeEffect = new Fx.Elements(this.panelContainer, {duration: this.options.duration, transition: this.options.changeTransition});
				changeEffect.start({
					'0': {
						'opacity': [0, 1]
					}
				});
			}
			
			this.titles.removeClass('activeTab');
			
			tab.addClass('activeTab');
			
			this.activeTitle = tab;
			
			if(this.options.useAjax)
			{
				this._getContent();
			}
		}
	},
	
	_getContent: function(){
		this.activePanel.addClass('ajax-loading2');
		var newOptions = {
			update: this.activePanel.getProperty('id'), 
			onComplete: this._fn, 
			evalScripts: true
		};
		this.options.ajaxOptions = Object.extend(this.options.ajaxOptions, newOptions || {});
		
		var foo = new Date; // Generic JS date object
		var unixtime_ms = foo.getTime(); // Returns milliseconds since the epoch
		var unixtime = parseInt(unixtime_ms / 1000);
		
		var url = this.options.ajaxUrl + '/' + this.activeTitle.getProperty('title') + '/' + unixtime;
		
		var tabRequest = new Ajax(
				url, 
				this.options.ajaxOptions
		);
		tabRequest.request();
	},
	
	_fn: function(){
		var panels = $$('#indoTabMenu .indoTabMenu-theContent div');
		panels.removeClass('ajax-loading2');
	}
});
