// JavaScript Document

// Image preloader
jQuery.preloadImages = function(){
	for(var i = 0; i<arguments.length; i++){
    	jQuery("<img>").attr("src", arguments[i]);
  	}
}	

// DOM READY
$(function() { 	
	
	// Image preloader
	$.preloadImages("images/ico/cross.png");
		
	// Remove annoying autocomplete on all input fields
	$("input").attr("autocomplete","off");

	// move form
	$("#formwrap").insertBefore($("#anchor"));

	// more dom manip :o
	$("ul#check").insertAfter($("h1#home"));

	// Form validation
	$("form#s1").validate({				  
		submitHandler: function(form) {
			success();
		},
		rules: {
			TotalOwed: {
				required: true,
				minlength: 4,
				digits: true				
			},
			NumDebts: {
				required: true
			},
			NatureOfIncome: {
				required: true
			},
			MonthlyIncome: {
				required: true,
				digits: true
			},
			Expenses: {
				required: true,
				digits: true
			},
			ResStatus: {
				required: true
			}			
		},
		messages: {
			TotalOwed: {
				required: "Please enter the total amount of money you owe, excluding mortgages and/or secured loans",
				minlength: "Please enter at least 4 characters",
				digits: "Please enter only numbers"				
			},
			NumDebts: {
				required: "Please enter the number of creditors you are in debt to"
			},
			NatureOfIncome: {
				required: "Please enter your employment status"
			},
			MonthlyIncome: {
				required: "Please enter your monthly income",
				digits: "Please enter only numbers"
			},
			Expenses: {
				required: "Please enter your monthly expenses",
				digits: "Please enter only numbers"
			},
			ResStatus: {
				required: "Please enter only numbers"
			}	
		},
		errorPlacement: function(error, element) {
			error.appendTo( element.parent("td").next("td") );
		}		
	});
	
	$("#next").click(function(e) {
		e.preventDefault();
		$("form#s1").submit();						  
	});
	
	// Form validation
	$("form#s2").validate({
		rules: {
			x_C1Forename: {
				required: true,
				minlength: 2
			},
			x_C1Surname: {
				required: true,
				minlength: 2
			},
			x_C1Address: {
				required: true
			},
			x_C1Town: {
				required: true,
				minlength: 3
			},
			x_C1County: {
				required: true,
				minlength: 3
			},
			x_C1Postcode: {
				required: true,
				minlength: 5
			},
			x_C1Email: {
				required: true,
				minlength: 6,
				email: true
			},	
			x_C1HomeTel: {
				required: true,
				minlength: 11,
				digits: true
			},	
			x_C1MobilePhoneNo: {
				required: true,
				minlength: 11,
				digits: true				
			},
			x_C1ContactTime: {
				required: true	
			}
		},
		messages: {
			x_C1Forename: {
				required: "Please enter your forename",
				minlength: "Please enter at least 2 characters"
			},
			x_C1Surname: {
				required: "Please enter your surname",
				minlength: "Please enter at least 2 characters"
			},
			x_C1Address: {
				required: "Please enter the first line of your address"
			},
			x_C1Town: {
				required: "Please enter your town",
				minlength: "Please enter at least 3 characters"				
			},
			x_C1County: {
				required: "Please enter your county",
				minlength: "Please enter at least 3 characters"
			},
			x_C1Postcode: {
				required: "Please enter your postcode",
				minlength: "Please enter at least 5 characters"
			},
			x_C1Email: {
				required: "Please enter your email address",
				minlength: "Please enter at least 6 characters",
				email: "Please enter a valid email address"
			},	
			x_C1HomeTel: {
				required: "Please enter a home or work telephone number",
				minlength: "Your number must consist of at least 11 digits",
				digits: "Please enter only numbers"
			},	
			x_C1MobilePhoneNo: {
				required: "Please enter your mobile number",
				minlength: "Your number must consist of at least 11 digits",
				digits: "Please enter only numbers"				
			},
			x_C1ContactTime: {
				required: "Please select the best time to contact you"	
			}
		},
		errorPlacement: function(error, element) {
			error.appendTo( element.parent("td").next("td") );
		}		
	});
	
	function success() {		
		$("<div id='overlay'></div>").appendTo("#form").css("height",$("#form").height());

		var NatureOfIncome = $('select[name=NatureOfIncome]').val();
		var ResStatus = $('select[name=ResStatus]').val();
		var MonthlyIncome = $('input[name=MonthlyIncome]').val();
		var Expenses = $('input[name=Expenses]').val();
		var TotalOwed = $('input[name=TotalOwed]').val();
		var NumDebts = $('select[name=NumDebts]').val();
	
		$.ajax({
			url: '/includes/form.inc.php',
			type: 'POST',
			data: 'x_NatureOfIncome=' + NatureOfIncome + '&x_ResStatus=' + ResStatus + '&x_MonthlyIncome=' + MonthlyIncome + '&x_Expenses=' + Expenses + '&x_TotalOwed=' + TotalOwed + '&x_NumDebts=' + NumDebts,
			
			success: function() {
				$('input[name=x_NatureOfIncome]').val(NatureOfIncome);
				$('input[name=x_ResStatus]').val(ResStatus);
				$('input[name=x_MonthlyIncome]').val(MonthlyIncome);
				$('input[name=x_Expenses]').val(Expenses);
				$('input[name=x_TotalOwed]').val(TotalOwed);
				$('input[name=x_NumDebts]').val(NumDebts);			
				$("#overlay").fadeOut(1500, function() {$(this).remove()});				
				$("#s1").fadeOut(500, function() {$("#s2").fadeIn(750)});
			}	
		});	
	};
	
		// Form (Back)
	$("#back").click(function(e) {
		e.preventDefault();
		$("<div id='overlay'></div>").appendTo("#form").css("height",$("#form").height());

		var NatureOfIncome = $('input[name=x_NatureOfIncome]').val();
		var ResStatus = $('input[name=x_ResStatus]').val();
		var MonthlyIncome = $('input[name=x_MonthlyIncome]').val();
		var Expenses = $('input[name=x_Expenses]').val();
		var TotalOwed = $('input[name=x_TotalOwed]').val();
		var NumDebts = $('input[name=x_NumDebts]').val();
	
		$.ajax({
			url: '/includes/form.inc.php',
			type: 'POST',
			data: 'NatureOfIncome=' + NatureOfIncome + '&ResStatus=' + ResStatus + '&MonthlyIncome=' + MonthlyIncome + '&Expenses=' + Expenses + '&TotalOwed=' + TotalOwed + '&NumDebts=' + NumDebts,
			
			success: function() {
				$('select[name=NatureOfIncome]').val(NatureOfIncome);
				$('select[name=ResStatus]').val(ResStatus);
				$('input[name=MonthlyIncome]').val(MonthlyIncome);
				$('input[name=Expenses]').val(Expenses);
				$('input[name=TotalOwed]').val(TotalOwed);
				$('select[name=NumDebts]').val(NumDebts);			
				$("#overlay").fadeOut(1500, function() {$(this).remove()});				
				$("#s2").fadeOut(500, function() {$("#s1").fadeIn(750)});
			}	
		});	
	});
	
	
	
	
	
	
	

});