var idForm = '#contact-form';
var idTextarea = '#contact-text',
		idLabel = '#contact label';		
// wait for the DOM to be loaded 
$(document).ready(function() { 
// bind 'myForm' and provide a simple callback function
 
// Handle placeholder labels

	$('label.js-placeholder')
	.addClass('placeholder')
	.each(function(){

		// Get the id of the input this label is associated with
		var label = $(this),
			idInput = label.attr('for'),
			initialText = $('#' + idInput).val();

		// Hide the label if the input has a value
		if (initialText.length > 0) {
			label.addClass('hidden');
		}

		// Handle classes
		$('#' + idInput)
		.focus(function(){
			label.addClass('faded');
		})
		.blur(function(){
			var text = $(this).val();
			if (text.length == 0) {
				label.removeClass('faded hidden');
			}
		})
		.keyup(function(){
			var text = $(this).val();
			if (text.length > 0) {
				label
				.removeClass('faded')
				.addClass('hidden');
			}
			else{
				label
				.removeClass('hidden')
				.addClass('faded');
			}
		});

	});
	
	
 
 
	$('#contact-form').submit(function() { 
		//alert("Thank you for your comment!");
		var label = $('.js-placeholder');
		if ($.trim($(idTextarea).val()) == '') {
			// Set our message
			$(cheers).css({opacity: '0', top: '0', position: 'relative'});
			label.html('<span id="c-mon">Ah go on say something, it can be anything, we don\'t mind...</span>');
		}
		
		else {
				// Create our message container
		var cheers = $('#cheers');
		if (cheers.length == 0) {
			cheers = $('<div id="cheers"></div>');
			$(cheers).css({opacity: '0', top: '227px', left: '188px', zIndex: '99', position: 'absolute'});
			$('#contact').css({position: 'relative'});
			$('#contact-form').after(cheers);
		}
		
		// Set our message
			$('#cheers').html('<p id="message">Cheers! We\'ll get back to you as soon as we get back from the pub.</p><a class="close" href="javascript:;">Send another</a');

			// Just make the form invisible, since we want to maintain layout.
			if ($('#contact-form').css('display') != 'none') {
				$('#contact-form').animate({opacity: 0});
			}
			$(idForm).animate({opacity: 0}, function(){
				// Take form inputs out of tabbing order while hidden
				//$('#talk-to-us :input').attr('tabindex', '-1');
				// Link to dismiss message
				$('#cheers a.close').click(function(e){
					e.preventDefault();
					cheers.animate({opacity: 0}, function(){
						// Put form inputs back in tabbing order
						//$('#talk-to-us :input').attr('tabindex', '0');
						$(cheers).css({zIndex: '1'});
						label.html('<span>Leave us a message and a way for us to contact you. Don\'t forget your name.</span>');
						$('#contact textarea')
							.val('')
							.blur()
							.TextAreaExpander('1em', '25em');
						$('#contact-form').animate({opacity: 1});
						$(idForm).animate({opacity: 1}, function(){
							// Focus on the textarea
							$('#contact textarea').focus();
						});
					});
				});
				$('#cheers').animate({opacity: 1}, function(){
					// Focus on the message
					$('#cheers').attr('tabindex', -1).focus();
				});
			});
		
	$(this).ajaxSubmit(); 
    // return false to prevent normal browser submit and page navigation 
    }
    return false;
	}); 
});