/**
	Hier komt commentaar en uitleg.
 */
jQuery.fn.stappenplan = function(start) {
	// geef op welke stap geladen moet worden bij het opstarten.
	var n = start;	
	
	// Classes
	var blocks	= $('.stapInhoud');
	var prev 	= $('.vorigeStap');
	var next 	= $('.volgendeStap');
	var save 	= $('.opslaan');
	
	var todo	= "todo";
	var now		= "now"
	
	// stappenplan classes
	var stappenplan = $('.tpl_stappenplan li');	
	stappenplan.addClass(todo);
	stappenplan.eq(start).removeClass().addClass(now);
	
	// verberg alle stappen 
	blocks.hide();
		
	// Bepaal welke buttons er standaard worden getoont op de eerst geladen pagina
	if(n == (blocks.length - 1)){ // laatste pagina
		save.slideDown(); 
		next.hide(); 
	}
	else if(n == 0){ // eerste pagina
		save.hide(); 
		prev.hide();
	}
	else{ // alle andere pagina's
		save.hide(); 
	}
		
	// laad de eerste stap
	blocks.eq(start).slideDown("slow");
	
	// functie vorige stap
	var vorigeStap = function(){
		var e = n - 1;
		blocks.slideUp();
		blocks.eq(e).slideDown();
		
		stappenplan.removeClass().addClass(todo);
		stappenplan.eq(e).removeClass().addClass(now);
		
		n = e; // defineer de huidige stap
				
		// Bepaal welke buttons worden weergegeven
		if(n == 0){ // indien eerste pagina
			prev.hide();
		}
		else{
			prev.show();
			next.show();
			save.hide();
		}
	}
	
	// functie: volgende stap
	var volgendeStap = function(){
		var check = true;
		
		// verplichte velden vinden binnen de huidige stap.
		$('.required'+n +'[value=""]').each(function(index){			
				if(index == 0){$(this).focus();} // zet focus op eerste verplichte element die niet gevult is.
				$(this).addClass('inputError'); // zet class op alle verplichte elementen die niet ingevult zijn.
				check = false;			
		})		
		if(check){
			$('.required'+n).removeClass('inputError');
			var e = n + 1;		
			blocks.slideUp();
			blocks.eq(e).slideDown();
			
			stappenplan.removeClass().addClass(todo);
			stappenplan.eq(e).removeClass().addClass(now);
			
			n = e; // zet huidige positie
			
			prev.show(); // altijd de vorige stap button laden		
			
			if(n == (blocks.length - 1)){ // indien laatste pagina	
				next.hide(); 
				save.show();
			}
			else{
				next.show();
				save.hide();
			}
		}
		else{
			alert("U dient alle verplicht velden in te vullen.") // melding indien niet alle verplichte velden zijn ingevult
		}
	}
	
	// defineer de controlers
	next.bind('click', volgendeStap);
	prev.bind('click', vorigeStap);
};

