$(document).ready(function() {
	var imgstep;
	  $('input, textarea').placeholder();
	  
	$('form.fancy input[type=button]').click(function() {
        $(this).parents('form.fancy').submit();
    });
    
   	var chosenSteps = new Array();
   	
   	
   	$('div#steps img').live('click', function() {
   	
		var id = $(this).attr('rel');
		$('ul#foliewijzer_options').html();
		imgstep = 1;

		step = id;
		
		if (step == 1) {
			getScreen("producten", id);
		}else {
			getScreen(array[0], 2);
		}
		
		
   	});
   	
	$("div.step ul li a").live('click', function() { 	
		
		var url = $(this).attr('id');
	  	var step = $(this).attr('rel');
	  	imgstep = 0;
		
		if ( step < 3 && event.preventDefault) { event.preventDefault(); } else { event.returnValue = false; }	 
	  	
	  	if (step < 3)
	  	{
			getScreen(url, step);
		}else{
			window.location.href = $(this).attr('href');
			return true;
		}
	});
	
	function getScreen(url, step)
	{
		if (imgstep === 1) {
			step = 1;
	
		}
	 	$.get("nl/foliewijzer/ajax/", { name: url, step: step  },
   		function(data){
   		
   		url = url.replace("-", " ");

   		var i = 0;

   			$("ul#foliewijzer_options li").each(
  				function() {
   					var elem = $(this);
   				 	elem.fadeOut('fast', function() {
   				 		if (i == 0) { 		
   				 			$('p#first').html('Met deze wijzer vindt u snel de folie waar u naar op zoek bent.');
   				 			$('p#second').html('<strong>Bent u op zoek naar folie voor:</strong>');
   				 			$('ul#foliewijzer_options').append(data);
   				 			$('ul#foliewijzer_options').hide();
   				 			$('ul#foliewijzer_options').fadeIn('fast');
   				 			
   				 			if (step == 1)
   				 			{   
   				 				array = new Array;
   				 				array.push(url);

								$('p#first').text('U heeft voor "' + ucfirst(url) + '" gekozen');
								$('p#second').html('<strong>Maak hieronder uw keuze</strong>');
   				 				$('div#steps img#step1').attr("src","img/foliewijzer/stap1.png");
   				 				$('div#steps img#step3').attr("src","img/foliewijzer/stap3.png");
   				 				$('div#steps img#step2').attr("src","img/foliewijzer/stap2_active.png");
   				 			}else if (step == 2)
   				 			{
   				 				$('p#first').text('U heeft voor "' + ucfirst(url) + '" gekozen');
								$('p#second').html('<strong>Hieronder een overzicht van de relevante producten.</strong>');
   				 				$('div#steps img#step1').attr("src","img/foliewijzer/stap1.png");
   				 				$('div#steps img#step2').attr("src","img/foliewijzer/stap2.png");
   				 				$('div#steps img#step3').attr("src","img/foliewijzer/stap3_active.png");
   				 			}else {
   				 				$('div#steps img#step1').attr("src","img/foliewijzer/stap1_active.png");
   				 				$('div#steps img#step2').attr("src","img/foliewijzer/stap2.png");
   				 				$('div#steps img#step3').attr("src","img/foliewijzer/stap3.png");

   				 			}
						}
						i++;
						elem.remove();
  					});      				
				}
			);				   			
   		});
	}
	
	function ucfirst(str) {
  		var f = str.charAt(0).toUpperCase();
  		return f + str.substr(1);
	}	


});