/* ---------- Contact Form UI Functionality ---------- */
$(document).ready(function() {
	// set global variables for contact form
	var messageIsFor = '';
	var inputID;
	var id;
	var isValid;
	var nameDefault    = "What is your name?";
	var emailDefault   = "Your email?";
	var phoneDefault   = "Your phone?";
	var messageDefault = "How can I help you?";
	
	// set who your message is for
	$('#whoIsYourMessageFor a').click(function() {
		if(messageIsFor != '') {
			$('#'+messageIsFor).removeClass('active');
		}
		$(this).addClass('active');
		messageIsFor = $(this).attr('id');
	});
	
	// focus input
	$('input').focus(function() {
		inputID = "#"+$(this).attr('id');
		inputControl('focus',inputID);
	});
	
	// focus textarea
	$('textarea').focus(function() {
		inputID = "#"+$(this).attr('id');
		inputControl('focus',inputID);
	});
	
	// blur input
	$('input').blur(function() {
		inputID = "#"+$(this).attr('id');
		inputControl('blur',inputID);
	});
	
	// blur textarea
	$('textarea').blur(function() {
		inputID = "#"+$(this).attr('id');
		inputControl('blur',inputID);
	});
	
	// function for focusing & blurring form inputs & textareas
	function inputControl(state,id) {
		
		// if current input is not the submit button, proceed
		if(inputID != '#sendMessage') {
			// select info that corresponds with input
			switch (id) {
				case "#name":
				dMessage = nameDefault;
				break;
				case "#email":
				dMessage = emailDefault;
				break;
				case "#phone":
				dMessage = phoneDefault;
				break;
				case "#message":
				dMessage = messageDefault;
				break;
			}
			if(state == 'focus') {
				// if input contains default message, remove it
				if($(id).val() == dMessage) {
					$(id).val('');
				}
				// add class to focused input
				$(id).addClass('active');
			}
			if(state == 'blur') {
				// remove class from blurred input
				$(id).removeClass('active');
				// if blurred input value is empty replace with default message
				if($(id).val() == '') {
					$(id).val(dMessage);
				}
			}
		}
	}
	
	
	
	/* ---------- Contact Form Validation ---------- */
		
	// variable to define form submission attempt
	var firstSubmit = false;
	
	// validate form on submission
	$('input#sendMessage').click(function() {
		firstSubmit = true;
		var isValid = validateContact();
		if(isValid == true) {
			callAjaxSubmit();
		}
		else {
			return false;
		}
	});
	
	// validate form on key up, if submit button has been previously clicked
	$('input').keyup(function() {
		if((firstSubmit == true)) {
			validateContact();
		}
	});
	
	// validate form on key up, if submit button has been previously clicked
	$('textarea').keyup(function() {
		if((firstSubmit == true)) {
			validateContact();
		}
	});
	
	// validate form fields
	 function validateContact() {
		isValid = true;
		
		$('input').each(function() {
			
			// get id of current input
			inputID = "#"+$(this).attr('id');
				
				// if current input is not the submit button, proceed
				if(inputID != '#sendMessage') {
					
				// select info that corresponds with input
				switch (inputID) {
					case "#name":
					dMessage = nameDefault;
					break;
					case "#email":
					dMessage = emailDefault;
					break;
					case "#phone":
					dMessage = phoneDefault;
					break;
				}
			
				// if invalid, highlight red
				if(($(inputID).val() == '') || ($(inputID).val() == dMessage)) {
					$(inputID).css({ background:'#ff8c8c', color:'#000' });
					isValid = false;
				}
				else {
					$(inputID).css({ background:'#343332', color:'#999' });
				}
			}
		});
		
		// validate textarea
		var textareaID = "#"+$('textarea').attr('id');

		// if invalid, highlight red
		if(($(textareaID).val() == '') || ($(textareaID).val() == messageDefault)) {
			$(textareaID).css({ background:'#ff8c8c', color:'#000' });
			isValid = false;
		}
		else {
			$(textareaID).css({ background:'#343332', color:'#999' });
		}
		
	return isValid;
	}
	
	
	
	/* ---------- AJAX Form Submission ---------- */
	function callAjaxSubmit(){
		// collect values from form
		var name = $("input#name").val();
		var email = $("input#email").val();
		var phone = $("input#phone").val();
		var message = $("textarea#message").val();
	
		// assemble form values into a data string
		var dataString = 'messageIsFor=' + messageIsFor + '&name=' + name + '&email=' + email + '&phone=' + phone + '&message=' + message + '&ajax=true';
		
		// process AJAX function
		$.ajax({ 
			type: "POST", 
			url: "send.php", 
			data: dataString,
			dataType: "html", 
			success: function(scriptResponse){ 
				$('#content1').html("<div id='message'></div>");
				$('#message').html(scriptResponse)
				.hide()
				.fadeIn(1500);
			} ,
			error: function (XMLHttpRequest, textStatus, errorThrown)
			{
				errorMsg = textStatus + ': ' + XMLHttpRequest + '. There is a problem accessing the server.';
				alert(errorMsg);
			}
		});
		return false;
	}
});