$(document).ready(function() {

	//if submit button is clicked
	$('#submit').click(function () {		
		//Get the data from all the fields
		var name = $('input[name=name]');
		var email = $('input[name=email]');
		var comments = $('textarea[name=comments]');

		//Simple validation to make sure user entered something
		//If error found, add hightlight class to the text field
		if (name.val().length==0 || !isNaN(name.val()) || name.val()=='Name') {
			name.addClass('highlight');
			name.focus();
			return false;
		} else name.removeClass('highlight');
		
		var regEmail = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
		if (!email.val().match(regEmail)) {
			email.addClass('highlight');
			email.focus();
			return false;
		} else email.removeClass('highlight');
		
		if (comments.val()=='' || comments.val()=='Comments') {
			comments.addClass('highlight');
			comments.focus();
			return false;
		} else comments.removeClass('highlight');

		//organize the data properly
		var data = 'name=' + name.val() + '&email=' + email.val() + '&comments='  + encodeURIComponent(comments.val());
		
		//disabled all the text fields
		$('.text').attr('disabled','true');
		
		//show the loading sign
		$('.loading').show();
		
		//start the ajax
		$.ajax({
			//this is the php file that processes the data and send mail
			url: "process.php",	
			
			//POST method is used
			type: "POST",

			//pass the data			
			data: data,		
			
			//Do not cache the page
			cache: false,
			
			//success
			success: function(html) {
				
        	$('.contact-form').html("<div class='message'></div>");
			
        	$('.message').html("Thank You!<br />I'll be in touch soon!")
			
        	//.append("<p>I will be in touch soon!</p>")
			
        	.hide()
			
        	.fadeIn(1500, function() {
								   
          	//$('.message').append("<img id='checkmark' src='images/check.png' />");
			
        	});
      		}
		});
		
		//cancel the submit button default behaviours
		return false;
	});	
});	

var active_color = '#2e2e2e';
var inactive_color = '#a7a7a7';

$(document).ready(function() {
  $(".default-value").css("color", inactive_color);
  var default_values = new Array();
  $(".default-value").focus(function() {
    if (!default_values[this.id]) {
      default_values[this.id] = this.value;
    }
    if (this.value == default_values[this.id]) {
      this.value = '';
      this.style.color = active_color;
    }
    $(this).blur(function() {
      if (this.value == '') {
        this.style.color = inactive_color;
        this.value = default_values[this.id];
      }
    });
  });
});