$(function() {

	$('span#tel').html('07837 544 562');
	$('span#email').html('benleighgourley@googlemail.com')
	
	var formDisplayed = false;
	
	// Form actions
	$('a#contact').click(function() {
	
		if ($('form#contact-form:animated').length==0) {
			
			var $el = $(this).siblings('form#contact-form').eq(0);
			
			if (!formDisplayed) {
				$el.css({ "opacity": 0 }).slideDown(400,function() { $(this).animate({ "opacity" : 1 }, 600); });
				setUpFormInteraction($el);
				formDisplayed = true;
			} else {
				$el.animate({ "opacity" : 0 }, 600, function() { $(this).slideUp(400); });
				formDisplayed = false;
			}
		}
		
		return false;
	
	});
	
	
	// Lightbox actions
	$('ul#work > li').click( function() {
		
		$('body').append('<div id="overlay"></div><div id="lightbox-container"><img src="'+$(this).children('a').attr('href')+'"/></div>');
		$('div#overlay').fadeTo(300, 0.6, function() { $('div#lightbox-container').fadeIn(); });
		$('body').one( "click", function() {
									$('div#overlay, div#lightbox-container').fadeOut(300, function () {
																								$(this).remove();
																							});
									});
		
		return false;
		
	});
	

});

/**
*	Sets up form interaction: listeners and validation.
*/
function setUpFormInteraction($el) {

	$el.submit(function() {
	
		$el.find('input').blur();
		
		if ($el.find('input.form-error').length>0) {
		
			// Error message
			$('h2#form-message-title').text("Oops... Something's not quite right");
			$('p#form-message').text("The form elements marked with red crosses aren't valid. Please go back and correct them, then try again.");
			$('a#action').text("Back")
					 .unbind()
					 .click( function() { $el.children('section').animate({ "left": 0 }); return false; });
			$el.children('section').animate({ "left": -958 });
		
		} else {
		
			// Submit form
			sendMail($el.find('input[type="text"], textarea'),$el);
		
		}
		
		return false;
	
	});

	$el.find('input[type="text"]').focus( function() {
									$(this).addClass('form-focus');
									$(this).removeClass('form-error form-valid');
								})
						 .blur( function() {
						 			$(this).removeClass('form-focus');
						 			if (validateInput($(this))) {
						 				$(this).removeClass('form-error');
						 				$(this).addClass('form-valid');
						 			} else {
						 				$(this).addClass('form-error');
						 			}
						 		});
						 		
	$el.find('input[name="phone"]').val("(optional)")
								   .focus( function() { if ($(this).val()=="(optional)") { $(this).val(""); } });
	
	$el.find('textarea').focus( function() { if ($(this).val()=="Message...") { $(this).val(""); } });

}

/**
*	Validates a single field's input
*/
function validateInput($el) {

	// Validate name
	if ($el.attr("name")=="name") {
	
		var re = /^[\w\s-]+$/;
		var result = re.test($el.val());
		return result;
	
	// Validate email
	} else if ($el.attr("name")=="email") {
	
		var re = /^[\w.-]+@[\w.-]+\.[A-Za-z]{2,6}$/;
		var result = re.test($el.val());
		return result;
	
	// Validate phone number
	} else if ($el.attr("name")=="phone") {
		
		var re = /^\+?0[\d|\s]+$/
		var result = re.test($el.val());
		if ($el.val()=="") {
			$el.val("(optional)");
		}
		if (!result) {
			result = $el.val()=="(optional)";
		}
		
		return result;
	
	}	
	
}


/**
*	Send the form to server and generate email
*/
function sendMail($fields, $el) {
	
	var name = $fields.filter('input[name="name"]').val();
	var email = $fields.filter('input[name="email"]').val();
	var phone = $fields.filter('input[name="phone"]').val();
	var message = $fields.filter('textarea').val();
	
	$.ajax({
			   
			   url: "contact.php",
			   type: "POST",
			   success: function(msg) { handleResponse(msg, $el); },
			   data: "name="+name+"&phone="+phone+"&email="+email+"&message="+message
			   
	});
	
}

/**
*	Handles response from server
*/
function handleResponse(msg, $el) {
	
	if (msg==1) {
	
		// Success
		$('h2#form-message-title').text("Message Sent");
		$('p#form-message').text("Thanks for getting in touch. I'll get back to you as soon as I can.");
		$('a#action').text("Close")
					 .unbind()
					 .click( function() { $('a#contact').click(); return false; });
		$el.children('section').animate({ "left": -958 });
	
	} else {
		
		// Error
		$('h2#form-message-title').text("Oops... Something's not quite right");
		$('p#form-message').text("Please go back and make sure everything you've put in the form makes sense, then try again.");
		$('a#action').text("Back")
					 .unbind()
					 .click( function() { $el.children('section').animate({ "left": 0 }); return false; });
		$el.children('section').animate({ "left": -958 });
	
	}

}