//This is a listener that will look for the loading of the Document Object Model. 
//This allows elements to be hidden before the page is loaded
document.observe("dom:loaded", function() {
  // Initially hides the form from view
  $$('div#thankYou').invoke('hide');
});
//This function does the AJAX by communicating with mail.php
function email() {
	var url = $('emailForm').serialize(); //Puts all the variables from the form into a url encoded string
	
	new Ajax.Request('mail.php',
	{
		method: 'get', //or POST
		parameters: url, //Parameters are the URL Encoded string
		onSuccess: function(transport) //What to do if the call to mail.php is successful
		{
			var response = transport.responseText || "no response text"; //Whatever response is returned from mail.php
			new Effect.Fade('formHolder', {duration:1, from:1.0, to:0.0});
			new Effect.Appear('thankYou', {queue: 'end', duration:2, from:0.0, to:1.0});
		},
		onFailure: function() //If it fails to communicate, do this.
		{ 
			alert('Something went wrong...')  //Alert something went wrong
		}	
	});
}