/* ================================ +
		     Studio Parkers
     	      carrousel.js
 + ================================ */



/* 
** Made by: Thomas Lievestro
** Email:	info@lievestro.com
** Website:	www.lievestro.com
*/



/* ================================ +
               CARROUSEL
+  ================================ */


//Begin item
var	rotateId = 1;

//Wacht 10 seconden tussen de items
var	CarrouselTimeoutTime = 6000;

//Carrousel Aan/Uit zetten
var	CarrouselOn = true;


function initCarrousel(){
	
	//Maak 4 items onzichtbaar
	setOpacity("carrousel_menu_item_container1_hover",0);
	setOpacity("carrousel_menu_item_container2_hover",0);
	setOpacity("carrousel_menu_item_container3_hover",0);
	setOpacity("carrousel_menu_item_container4_hover",0);

	currItemId = -1;
	fadeIncrement = 0;
	
	//Laat het start item zien	
 	showItem(3);
 	
 	if(CarrouselOn){
		//Start de carrousel
		startRotate();
	}
}

function setOpacity(obj,value){
	$(obj).style.opacity = value/10;
	$(obj).style.filter = 'alpha(opacity=' + value*10 + ')';
}

function autoRotate(){
	if(doRotate){
		if(rotateId>4){
			rotateId=1;
		}
		showItem(rotateId);
		rotateId++;
		rotateTimer=setTimeout("autoRotate()",CarrouselTimeoutTime);
	}
	else{
		clearTimeout(rotateTimer);
	}
}

function startRotate(){
	doRotate=true;
	rotateTimer=setTimeout("autoRotate()",CarrouselTimeoutTime/10);

}

function stopRotate(){
	doRotate=false;
	if(typeof rotateTimer != 'undefined'){
		clearTimeout(rotateTimer);
	}
}

function fadeTab(id){
	
	//Zorgt er voor dat in 10 stappen wordt ingefade na 11 stop deze timer
	if(fadeIncrement!=11){
		setOpacity("carrousel_menu_item_container"+id+"_hover",fadeIncrement);
		setOpacity("carrousel_menu_item_container"+id+"",(5-fadeIncrement)); 
		setOpacity("carrousel_item"+id,fadeIncrement);
		fadeIncrement++;
		fadeTimer=setTimeout("fadeTab("+id+")",20);
	}
	else{
		clearTimeout(fadeTimer);
	}
}

function showItem(id){
	if(typeof currItemId == 'undefined' || id!=currItemId){
		if(typeof currItemId != 'undefined' && currItemId != -1){
			
			//DEACTIVATE
			
			//Maak onzichtbaar
			setOpacity("carrousel_menu_item_container"+currItemId+"_hover",0);
			setOpacity("carrousel_menu_item_container"+currItemId+"",10);
			// clear fadeTimer
			clearTimeout(fadeTimer);
			//Verander claasName
			var iTab="carrousel_menu_item"+currItemId;
			$(iTab).className="carrousel_menu_item_inact"+currItemId;
			//Maak item ontzichtbaar
			var iContent="carrousel_item"+currItemId;
			$(iContent).style.display="none";
			$(iContent).style.visibility="hidden";
		}
  
		//ACTIVATE
		
		//Verander classname
		var aTab="carrousel_menu_item"+id;
		$(aTab).className="carrousel_menu_item_act";
		//Maak item zichtbaar
		var aContent="carrousel_item"+id;
		$(aContent).style.display="block";
		$(aContent).style.visibility="visible";
		//reset fadeIncrement
		fadeIncrement=0;
		//Laat het item infade
		fadeTab(id)
		//Verander het currNewsId in het nieuwe id
		currItemId=id;
		//Verander het rotateId in het nieuwe id
		rotateId=id;
	}
}



var CarrouselRules = {

	'#carrousel' : function(el) {
			el.onmouseover = function() {
					stopRotate()
					return false;
				}
			el.onmouseout = function() {
			 		if(CarrouselOn){
						//Start de carrousel
						startRotate();
					}
					return false;
				}
			}
	,
	'#carrousel_menu_item1' : function(el) {
			el.onmouseover = function() {
					showItem(1);
					return false;
				}
			}
	,
	'#carrousel_menu_item2' : function(el) {
			el.onmouseover = function() {
					showItem(2);
					return false;
				}
			}
	,
	'#carrousel_menu_item3' : function(el) {
			el.onmouseover = function() {
					showItem(3);
					return false;
				}
			}
	,
	'#carrousel_menu_item4' : function(el) {
			el.onmouseover = function() {
					showItem(4);
					return false;
				}
			}
	,
	'#carrousel_menu_item5' : function(el) {
			el.onmouseover = function() {
					showItem(5);
					return false;
				}
			}
}

Behaviour.register(CarrouselRules);


Behaviour.addLoadEvent(function(){ 
	initCarrousel(); 
});