jQuery(document).ready(function(){
    jQuery("#response_contacto").hide();
    jQuery("#loading_contacto").css("display", "none");
    jQuery("#response").css("display", "none");
    
    jQuery('#name, #phone, #lada, #email, #comentarios').formclear({
        inactivecolor: 'red', // Defaults to #777 (dark grey)
        activecolor: '#2F8912', // defaults to #000 (black)
        // emptyval: 'Nombre: ' // defaults to '' (nothing, as in cleared)
    });
   
    
    jQuery('#borrar').click(function(){
        jQuery('.error').css("display", "none");
    });
    
    jQuery("#formContacto").validate({
        rules: {
            name: {
                required: true,
                minlength: 3,
                maxlength: 50
            
            },
            
            email: {
                required: true,
                email: true
            
            },
            comentarios: {
                required: true,
                minlength: 2,
                maxlength: 1000
            }
        },
        messages: {
            name: "Introduce tu nombre por favor",
            email: "Introduce un email válido por favor",
            comentarios: "Introduce un mensaje por favor (Min 10caractéres Max.. 1000 caractéres)"
        },
        submitHandler: function(){
            jQuery("#formContacto").ajaxSubmit({
                beforeSubmit: showRequest, // pre-submit callback
                success: showResponse // post-submit callback
            });
            
        },
        highlight: function(element, errorClass){
            // jQuery(element).addClass('error');
        },
        unhighlight: function(element, errorClass){
            // jQuery(element).removeClass('error');
        }
        
    });
    
    function showRequest(formData, jqForm, options){
        jQuery("#loading_contacto").show("slow");
    }
    
    
    // post-submit callback
    function showResponse(responseText, statusText){
        jQuery("#loading_contacto").hide("slow");
        jQuery("#response_contacto").show("slow").append(responseText).fadeTo(3000, 1).fadeOut(2000);
        jQuery("#response").show("slow").append(responseText).fadeTo(3000, 1).fadeOut(2000);
        jQuery('form')[1].reset();
    }
    
});