function popLetter(id){
	document.getElementById(id).style.marginTop="0px";
}	

function clearLetters(){
	document.getElementById('p').style.marginTop="5px";
	document.getElementById('u').style.marginTop="5px";
	document.getElementById('z').style.marginTop="5px";
	document.getElementById('l').style.marginTop="5px";
}

function selectTab(id, bgcolor, hide1, hide2, hide3, hide4){
	
	//alert(id);
	
	if(id == 'step0'){
		document.getElementById('tab_step2').innerHTML='<img src="step2_icon.gif" alt="oplossen" border="0" />Oplossen';
		document.getElementById('tab_step3').innerHTML='<img src="step3_icon.gif" alt="uitdagen" border="0" />Uitdagen';
		document.getElementById('tab_step4').innerHTML='<img src="step4_icon.gif" alt="uitwisselen" border="0" />Uitwisselen';
	}
	
	if((id== 'step1')){
		document.getElementById('tab_step2').innerHTML='<a href="#" class="headlinkg" onclick="lockPuzl();copyPuzl();"><img src="step2_icon.gif" alt="oplossen" border="0" />Oplossen</a>';
		document.getElementById('tab_step3').innerHTML='<img src="step3_icon.gif" alt="uitdagen" border="0" />Uitdagen';
		document.getElementById('tab_step4').innerHTML='<img src="step4_icon.gif" alt="uitwisselen" border="0" />Uitwisselen';
	}
	
	if(id == 'step1'){
		document.getElementById('challangetext').style.display='none';
	}
	
	if((id == 'step2')){
		document.getElementById('tab_step1').innerHTML='<a href="#" class="headlinkr" onclick="selectTab(\'step1\',\'cfc\',\'step0\',\'step2\',\'step3\',\'step4\');enableGrid();clearGrid();clearGridStates();"><img src="step1_icon.gif" alt="creatie" border="0" />Cre&euml;ren</a>';
		document.getElementById('tab_step2').innerHTML='<a href="#" class="headlinkg" onclick="selectTab(\'step2\',\'fcc\',\'step4\',\'step1\',\'step3\',\'step4\');"><img src="step2_icon.gif" alt="oplossen" border="0" />Oplossen</a>';
		document.getElementById('tab_step3').innerHTML='<a href="#" class="headlinkb" onclick="pauseTimer();validatePuzl();"><img src="step3_icon.gif" alt="Uitdagen" border="0" />Uitdagen</a>';
		document.getElementById('tab_step4').innerHTML='<a href="#" class="headlinkz" onclick="selectTab(\'step4\',\'ccf\',\'step0\',\'step1\',\'step2\',\'step3\');"><img src="step3_icon.gif" alt="Uitwisselen" border="0" />Uitwisselen</a>';
		
	}
	
	if (document.getElementById(id).style.display == 'none'){
	
		//document.getElementById('step0').style.display='none';	
		document.getElementById(id).style.display='';
		document.getElementById(id).style.backgroundColor= '#' + bgcolor;
		document.getElementById('tab_' + id).style.backgroundColor= '#' + bgcolor;
		document.getElementById('tab_' + id).style.borderBottom='#' + bgcolor + ' solid 2px';
		hideTabs(new Array(hide1,hide2,hide3,hide4));
	}else{
		//document.getElementById('step0').style.display='none';	
		document.getElementById(id).style.display='none';	
		document.getElementById('tab_' + id).style.borderBottom='#aaa dotted 2px';
		document.getElementById('tab_' + id).style.backgroundColor= '#fff' ;
	}
	
	
	
}
	
function hideTabs(elementnames){
	for(x=0; x < elementnames.length; x++){
		document.getElementById(elementnames[x]).style.display='none';
		document.getElementById('tab_' + elementnames[x]).style.borderBottom='#aaa dotted 2px';
		document.getElementById('tab_' + elementnames[x]).style.backgroundColor= '#fff' ;
	}
}	

function showDiv(divelem){
	document.getElementById(divelem).style.display='';
}

function showInvalidWarning(){
	document.getElementById('warning').style.display='';
	var wtimer = setTimeout("hideInvalidWarning()", 4000);
}

function hideInvalidWarning(){
	document.getElementById('warning').style.display='none';
}









// timer functies

/*

var timerID = 0;
var tStart  = null;
var pausedTime = null;

function updateTimer() {
   if(timerID) {
      clearTimeout(timerID);
      clockID  = 0;
   }

   if(!tStart)
      tStart   = new Date();

   var   tDate = new Date();
   var   tDiff = tDate.getTime() - tStart.getTime();

   tDate.setTime(tDiff);

   document.getElementById('timeEllapsed').innerHTML = " " 
   									 + (tDate.getHours()-1) + ":" 
                                   + tDate.getMinutes() + ":" 
                                   + tDate.getSeconds();
   totalScore= tDate;
   
   timerID = setTimeout("updateTimer()", 1000);
}

function startTimer() {
   tStart   = new Date();

   document.getElementById('timeEllapsed').innerHTML = "00:00:00";

   timerID  = setTimeout("updateTimer()", 1000);
}

function stopTimer() {
   if(timerID) {
      clearTimeout(timerID);
      timerID  = 0;
   }

   tStart = null;
}

function resetTimer() {
   tStart = null;

   document.getElementById('timeEllapsed').innerHTML = "00:00:00";
}

function pauseTimer(){
   if(timerID) {
      clearTimeout(timerID);
      timerID  = 0;
   }
	pausedTime = new Date();
	timerPaused=true;
}

function checkTimer(){
	if(timerPaused){
	timerPaused=false;
	
	var curStart = new Date();
	
	var curStartDelta = new Date();
	
	curStartDelta.setTime(curStart.getTime() - pausedTime.getTime() ); 
	
	tStart.setTime(tStart.getTime() +  curStartDelta.getTime());
	 
	updateTimer();
	}
}
*/