
/**
 * Qball tabulator class
 * 
 * @copyright 	Qball Internet B.V.
 * 
 * @author 		$Author: Sven $
 * @since 		$Date: 2009-03-05 14:37:40 +0100 (Thu, 5 Mar 2009) $
 * @version 	1.2.5
 * 
 * This class requires Mootools 1.2
 *
 * @param Object parameters
 * 		exemple: new QTabulator({
 *			'wrapper': 			'id', 				//[required] Id of the element that wraps the tabulator, all the content elements there id should begin with this name and apended with _ and there unique id, exemple: id_1
 *			'contentElements': 	'#id .classname', 	//[required] CSS selector to select all content elements
 *			'buttons': 			['#id .classname a'],//[required] Array with CSS selectors to select all the buttons that activate a screen, uses the element his name parameter as an id to display a screen element
 *			'activeClass': 		'active', 			//[optional] Default is 'active' this is the name of the class that will be added to a tab that is active and linked to the content that is shown
 *			'autoswitch': 		true, 				//[optional] Default is false, makes him loop automatic through tabs
 *			'rolloverDelay': 	500, 				//[optional] Default is 0, miliseconds before he activates the tab
 *			'autoDelay': 		3000 				//[optional] Default is 100 (0 could make a slow pc go nuts), miliseconds before he activates the next tab if autoswitch is set true
 *			'display':			'block'				//[optional] Default block, can give another display type to switch through when hiding and showing content
 *		}
 * 
 * @return Object
 */
var QTabulator = function(parameters)
{
	this.version = '1.2.5';
	
	if (!parameters || !parameters.wrapper || !parameters.buttons || !parameters.contentElements)
		return false;
	if (typeof(parameters.buttons) == 'string')
		parameters.buttons = [parameters.buttons];
	this.wrapper			= parameters.wrapper;
	this.contentElements	= $$(parameters.contentElements);
	this.buttons 			= parameters.buttons.map(function(item, index){
	    						return $$(item);
							});
	
	/*Optionals*/
	this.activeClass		= parameters.activeClass ? parameters.activeClass : 'active';
	this.autoswitch			= parameters.autoswitch ? parameters.autoswitch : false;
	this.rolloverDelay		= parameters.rolloverDelay ? parameters.rolloverDelay : 0;
	this.autoDelay			= parameters.autoDelay ? parameters.autoDelay : 100;
	this.display			= parameters.display ? parameters.display : 'block';

	/*Holds the timer*/
	this.timer = null;
	
	this.activeElement = null;
	this.activeIndex = null;

	this.addEventsButtons();
	//Start with first buttons element
	this.switchTab(this.buttons[0][0], 0);
};

QTabulator.prototype.addEventsButtons = function()
{
	inst = this;
	this.buttons.each(function(buttons){
		buttons.each(function(button, index){
			button.addEvents({
				'mouseenter': function(){
					$clear(inst.timer);
					inst.timer = inst.switchTab.delay(inst.rolloverDelay, inst, [this, index, true]);
				},
				'mouseleave': function(){
					$clear(inst.timer);
					if (inst.autoswitch)
						inst.timer = inst.switchTab.delay(inst.autoDelay, inst, [inst.activeElement, inst.activeIndex, false]);
				}
			});
		});
	});
};

QTabulator.prototype.switchTab = function(buttonElement, index, mouseover)
{
	inst = this;
	
	this.activeElement = buttonElement;
	this.activeIndex = index;
	/*Show content*/
	$$(this.contentElements).setStyles({'display':'none'});
	$(this.wrapper+'_'+buttonElement.get('name')).setStyles({'display':this.display});
	/*Make button active*/
	$$(this.buttons).removeClass(this.activeClass);
	this.buttons.each(function(buttons){
		buttons.each(function(button, activeindex){
			if (activeindex == index)
				button.addClass(inst.activeClass);
		});
	});

	if (!mouseover && this.autoswitch){
		
		this.buttons[0].each(function(item, index) {
			if (item.get('class') == inst.activeClass)
			{
				$clear(inst.timer);
				if (index < inst.buttons[0].length-1)
					inst.timer = inst.switchTab.delay(inst.autoDelay, inst, [inst.buttons[0][index+1], index+1, false]);
				else
					inst.timer = inst.switchTab.delay(inst.autoDelay, inst, [inst.buttons[0][0], 0, false]);
			}
		});
	}
};