$( document ).ready(function() {

    $.validator.setDefaults({
        errorElement: "span",
        errorClass: "help-block",
        highlight: function (element, errorClass, validClass) {
            $(element).closest('.form-group').addClass('has-error has-error has-feedback');
            $(element).siblings("span").remove();
            $('<span class="glyphicon glyphicon-remove form-control-feedback"></span>').insertAfter(element);
        },
        unhighlight: function (element, errorClass, validClass) {
            $(element).closest('.form-group').removeClass('has-error').addClass('has-success has-feedback');
            $(element).siblings("span").remove();
            $('<span class="glyphicon glyphicon-ok form-control-feedback"></span>').insertAfter(element);
        },
        errorPlacement: function (error, element) {
            if (element.parent('.input-group').length || element.prop('type') === 'checkbox' || element.prop('type') === 'radio') {
                error.insertAfter(element.parent());
            } else {
                error.insertAfter(element);
            }
        }
    });

    $.validator.addMethod( "alphanumeric", function( value, element ) {
        return this.optional( element ) || /^\w+$/i.test( value );
    }, "Letters, numbers, and underscores only please" );

        $.validator.addMethod( "lettersonly", function( value, element ) {
            return this.optional( element ) || /^[a-z]+$/i.test( value );
        }, "Letters only please" );

    $.extend( $.validator.messages, {
        required: "Este campo es obligatorio.",
        remote: "Por favor, rellena este campo.",
        email: "Por favor, escribe una dirección de correo válida.",
        url: "Por favor, escribe una URL válida.",
        date: "Por favor, escribe una fecha válida.",
        dateISO: "Por favor, escribe una fecha (ISO) válida.",
        number: "Por favor, escribe un número válido.",
        digits: "Por favor, escribe sólo dígitos.",
        creditcard: "Por favor, escribe un número de tarjeta válido.",
        equalTo: "Por favor, escribe el mismo password de nuevo.",
        extension: "Por favor, escribe un valor con una extensión aceptada.",
        maxlength: $.validator.format( "Por favor, no escribas más de {0} caracteres." ),
        minlength: $.validator.format( "Por favor, no escribas menos de {0} caracteres." ),
        rangelength: $.validator.format( "Por favor, escribe un valor entre {0} y {1} caracteres." ),
        range: $.validator.format( "Por favor, escribe un valor entre {0} y {1}." ),
        max: $.validator.format( "Por favor, escribe un valor menor o igual a {0}." ),
        min: $.validator.format( "Por favor, escribe un valor mayor o igual a {0}." ),
        nifES: "Por favor, escribe un NIF válido.",
        nieES: "Por favor, escribe un NIE válido.",
        cifES: "Por favor, escribe un CIF válido.",
        alphanumeric: "Por favor, escribe solo letras, numeros y guiones bajos.",
        lettersonly: "Por favor, escribe solo letras A-Z."
    } );


    $("#registrationForm").validate({
        rules: {
            username: {
                required: true,
                minlength: 5,
                maxlength: 20,
                alphanumeric: true
            },
            password: {
                required: true,
                minlength: 6,
                maxlength: 25
            },
            confirmPassword: {
                required: true,
                minlength: 5,
                maxlength: 25,
                equalTo: "#password"
            },
            email: {
                required: true,
                minlength: 5,
                maxlength: 100,
                email: true
            },
            firstname: {
                required: true,
                minlength: 1,
                maxlength: 100,
                lettersonly: true
            },
            lastname: {
                required: true,
                minlength: 1,
                maxlength: 100,
                lettersonly: true
            }
        }
    });
});