window.currTab 	= "tabBalkans";
window.currTabRotate = "tabBalkans";
window.nextTab = "tabCaucasus";
window.auto   	= 1;

function changeTab(tabId,status,currActive){

	/** Roteren staat aan. */	
	if(auto == 1){
		/** Zoek welk tabje actief is. */
		if(document.getElementById(currTabRotate+"-active")){
				currTab = currTabRotate;
		}		
		if(document.getElementById(nextTab+"-active")){
				currTab = nextTab;
		}		
		
		/** Zet het roteren uit. */
		auto = 0;
	}
	/** Wanneer het roteren uit staat. */
	if(auto == 0){	
		
		/** currActive geeft aan of het element is aangeklikt. */
		if (currActive > 0){
			/** Als er een nieuw tabje wordt aangklikt. */
			if ((currTab != tabId) && (currTab != 0)){
				
				/** Zet het huidige actieve tabje op niet actief. */
				if(document.getElementById(currTab+"-active")){
					document.getElementById(currTab+"-active").id = currTab;
				}	
				
				/** Zet het nieuw aangekikte tabje op actief. */
				if(document.getElementById(tabId+"-active")){	
					document.getElementById(tabId+"-active").id = tabId+"-active";						
				}
				
				/** Zet het huisige content vak op onzichtbaar. */
				if(document.getElementById(currTab+"Content")){	
					document.getElementById(currTab+"Content").style.display = "none"; /** Toegevoegt voor het weergeven van de content. Deze regel zet het eerder geklikte element op onzichtbaar */
				}
				
				/** Zet het nieuwe content vak op zichtbaar. */
				document.getElementById(tabId+"Content").style.display = "block";
				
				/** Zet currTab op hetzelfde id als het nieuwe actieve tabje */
				currTab = tabId;
			}
		
		}
		
		
		/* Waneer we te maken hebben met een mouse-over */
		if ((status > 0) && (currTab != tabId)) {
			if(document.getElementById(tabId)){
				document.getElementById(tabId).id = tabId+"-active";
			}else if(document.getElementById(tabId+"-active")){
				document.getElementById(tabId+"-active").id = tabId;
			}	 
		}
		/* Waneer we te maken hebben met een mouse-out */
		else if((currActive < 1) && (currTab != tabId)) {
			if(document.getElementById(tabId)){
				document.getElementById(tabId).id = tabId+"-active";
			}else if(document.getElementById(tabId+"-active")){
				document.getElementById(tabId+"-active").id = tabId;
			}
		}										
	}
}

function rotateTabs(){
	if(auto == 1){
		aTabs = Array();
		
		/** Opbouwen van de tabs */
		aTabs[0] = "tabBalkans";
		aTabs[1] = "tabCaucasus";
		aTabs[2] = "tabCentralAsia";
		aTabs[3] = "tabMiddleEast";
		
		/** Totaal aantal tabs dat in het array zitten*/
		iTabs = aTabs.length; 
		
		/** Loop door de tabs */
		for(a=0; a<iTabs; ++a){
			/** Vind het volgende tabje*/
			b = a + 1;
			/** Als het laatste tabje is bereikt dan het volgende tabje weer op 0 zetten. Dus op het begin*/
			if(b == iTabs){ b = 0;}
			
			/** Vindt het huidige tabje door te kijken welk tabje op actief staat*/
			if(document.getElementById(aTabs[a]+"-active")){ 			
				currTabRotate 	= aTabs[a];
				nextTab 		= aTabs[b];
			}		
		}
		

			/** Zet het huidige tabje op niet actief */
			document.getElementById(currTabRotate+"-active").id = currTabRotate;
			document.getElementById(currTabRotate+"Content").style.display = "none";

		

			/** Zet het huidige tabje op actief */
			document.getElementById(nextTab).id = nextTab+"-active";
			document.getElementById(nextTab+"Content").style.display = "block";

		/** Roep de volgende funtie aan om een pauze in te lassen voor de volgende rotatie */
		setTimeOut();
	}
}

function setTimeOut(){
	/** SetTimeOut is een functie waarmee we een pauze kunnen inlassen. Ik roep de functie rotateTabs aan na X aantal miliseconden */
	setTimeout(rotateTabs, 15000);
}