// prepare the form when the DOM is ready 
$(document).ready(function()
{
    $('#progress_button').hide();
    
    $("#contact_form").validate({
        focusInvalid: false,
        rules: {
            name: "required",
            email: {
                required: true,
                email: true
            },
            phone: {
                required: true
            },
            message: "required"
        },
        messages: {
            name: "Please enter your full name",
            email: "Please enter a valid email",
            phone: "Please enter a valid phone number",
            message: "Please enter a message"
        },
        submitHandler: function(form)
        {
            $('#contact_message').hide();
            var options = {
                target: '#alert',
                beforeSubmit: showRequest,
                success: showResponse,
                clearForm: false,
                url: '../../php/sendmail.php',
                type: 'post'
            };
            
            // bind form using 'ajaxForm' 
            $('#contact_form').ajaxSubmit(options);
        },
        invalidHandler: function(form)
        {
            $('#contact_message').hide();
        }
    });
});

function showRequest(formData, jqForm, options)
{
    $('#contact_button').hide();
    $('#progress_button').show();
}

// post-submit callback 
function showResponse(responseText, statusText)
{
    $('#contact_button').show();
    $('#progress_button').hide();
    $("#contact_message").hide("slow").show("slow").animate({opacity: 1.0}, 4000, function() {if($('#success_message').length > 0) {self.parent.tb_remove();}}).hide("slow");
}