$(document).ready(function() {
	
	$('form').submit(function(){
		$('input[type="submit"]').attr('disabled', 'disabled').val('Loading...');
	});
	
	
	// Initialise
	var havePartner = $('#have_partner');
	var partnerForm = $('#partnerForm');
	if (havePartner.val() == 'y') {
		$('#partnerForm').show();
	} else {
		$('#partnerForm').hide();
	}
	
	var haveChildren = $('#have_children');
	var childrenForm = $('#childrenForm');
	if (haveChildren.val() == 'y') {
		childrenForm.show();
	} else {
		childrenForm.hide();
	}
	
	
	// remove if they don't have a partner
	havePartner.change(function(event){
		if (havePartner.val() == 'n') {
			partnerForm.hide("slow");
		} else {
			partnerForm.show("slow");
		}
	})
	
	haveChildren.change(function(event){
		if (haveChildren.val() == 'n') {
			childrenForm.hide("slow");
		} else {
			childrenForm.show("slow");
		}
	})
	
	function generateChild(i)
	{
		var ret = '';
		// name
		ret += '<div class="row">\n';
		ret += '<label for="children['+i+'][first_name]">Name</label>';
		ret += '<input type="text" id="children['+i+'][first_name]" name="children['+i+'][first_name]">';
		ret += '</div>';
		
		// gender
		ret += '<div class="row">\n';
		ret += '<label for="children['+i+'][gender]">Gender</label>';
		ret += '<select name="children['+i+'][gender]" id="children['+i+'][gender]">';
		ret += '<option value=""></option>';
		ret += '<option value="m">Male</option>';
		ret += '<option value="f">Female</option>';
		ret += '</select>';
		ret += '</div>';
		
		
		// date of birth
		ret += '<div class="row">\n';
		ret += '<label for="children['+i+'][date_birth]">Birthday</label>';
		ret += '<div class="leftHalf">';
		ret += '<input type="text" id="children['+i+'][date_birth]" value="DD-MM-YYYY" class="small" name="children['+i+'][date_birth]">';
		ret += '<span class="note">DD-MM-YYYY</span>';
		ret += '</div>';
		ret += '</div>';
		
		return ret;
	}
	
	var childForm = $('.childForm');
	var num_children = $('#num_children');
	
	// Remove children if javascript is enabled
	if (num_children.val() < 1) {
		//childForm.html('');
	};
	
	num_children.change(function(event){
		// Clear what we have
		childForm.html('');
		childForm.hide();
		
		// Add new children
		for (var i=0; i < num_children.val(); i++) {
			childForm.append(generateChild(i));
		};
		
		// slide it in
		childForm.show("slow");
	});

});