/* 
 * To change this license header, choose License Headers in Project Properties.
 * To change this template file, choose Tools | Templates
 * and open the template in the editor.
 */


$(document).ready(function () {

    initInputs();
    init(); // METODOS CRUD
    MyValidate();
    $('#btn_agregar_persona').on('click', function () {
        limpiarInputs();
    });

    $('#btn_cerar_registrar_persona').on('click', function () {
        $("form_registrar_persona").validate().resetForm();
    });
    
    filtrarPersona();
});

var codigoPersona;

function init() {
    listarPersona();
    registrarPersona();
    editarPersona();
}

function listarPersonaTest() {
    $.ajax({
        url: '../PersonaServlet?accion=listarPersonaTest',
        type: 'POST',
        beforeSend: function (xhr) {
//            console.log('Antes de...');
        }, success: function (data, textStatus, jqXHR) {
            console.log(data);
        }, complete: function (jqXHR, textStatus) {
//            console.log('Siempre ejecutará esta función');
        }
    });
}

function registrarPersona() {
    $('#btn_registrar_persona').on('click', function () {

        var validator = $('#form_registrar_persona').validate({

            rules: {
                txt_numero_documento: {required: true, digits: true, minlength: 8, maxlength: 8},
                txt_apellidos: {required: true, lettersonly: true, maxlength: 50},
                txt_nombres: {required: true, lettersonly: true, maxlength: 50},
                txt_edad: {required: true, digits: true, maxlength: 2},
                txt_correo: {required: true, email: true, maxlength: 50}
            },
            messages: {
                txt_numero_documento: {required: "Ingresar número de documento.", minlength: "Ingresar 8 dígitos.", maxlength: "Ingresar 8 dígitos.", digits: "Ingresar solo números."},
                txt_apellidos: {required: "Ingresar apellidos.", maxlength: "Ingresar 50 letras como máximo.", lettersonly: "Ingresar solo letras"},
                txt_nombres: {required: "Ingresar nombres.", maxlength: "Ingresar 50 letras como máximo.", lettersonly: "Ingresar solo letras"},
                txt_edad: {required: "Ingresar edad.", maxlength: "Ingresar 2 dígitos como máximo", digits: "Ingresar solo números"},
                txt_correo: {required: "Ingresar correo.", maxlength: "Ingresar 50 letras como máximo.", email: "Ingresar un correo válido"}
            }
        });

        var estado = validator.form();
        if (estado) {
            var json = {
                dni: $('#txt_numero_documento').val().trim(),
                apellidos: $('#txt_apellidos').val().trim(),
                nombres: $('#txt_nombres').val().trim(),
                edad: $('#txt_edad').val().trim(),
                correo: $('#txt_correo').val().trim()
            };

            $.ajax({
                type: 'POST',
                url: '../PersonaServlet?accion=registrarPersona',
                dataType: 'json',
                data: {json: JSON.stringify(json)},
                beforeSend: function (xhr) {
                    console.log('cargando...');
                },
                success: function (data, textStatus, jqXHR) {
                    console.log(data);
                    var resultado = data.resultado;

                    if (resultado === "0") { //Error al registrar
                        imprimirAlerta('Error!', data.mensaje, 'error');
                    } else if (resultado === "2") { //DNI repetido
                        imprimirAlerta(data.mensaje, 'Ingresar número de documento correcto, por favor.', 'warning');
                    } else if (resultado === "-1") { //SQLException error (catch)
                        imprimirAlerta('Error!', data.mensaje, 'error');
                    } else { //Registro correcto
                        imprimirAlerta('Correcto!', data.mensaje, 'success');
                        recargarTabla();
                        $('#modal_registrar_persona').modal('hide');
                    }

                },
                complete: function (jqXHR, textStatus) {

                }
            });

        }

    });
}

function editarPersona() {
    $('#btn_editar_persona').on('click', function () {

        var validator = $('#form_editar_persona').validate({

            rules: {
                txt_apellidos_editar: {required: true, lettersonly: true, maxlength: 50},
                txt_nombres_editar: {required: true, lettersonly: true, maxlength: 50},
                txt_edad_editar: {required: true, digits: true, maxlength: 2},
                txt_correo_editar: {required: true, email: true, maxlength: 50}
            },
            messages: {
                txt_apellidos_editar: {required: "Ingresar apellidos.", maxlength: "Ingresar 50 letras como máximo.", lettersonly: "Ingresar solo letras"},
                txt_nombres_editar: {required: "Ingresar nombres.", maxlength: "Ingresar 50 letras como máximo.", lettersonly: "Ingresar solo letras"},
                txt_edad_editar: {required: "Ingresar edad.", maxlength: "Ingresar 2 dígitos como máximo", digits: "Ingresar solo números"},
                txt_correo_editar: {required: "Ingresar correo.", maxlength: "Ingresar 50 letras como máximo.", email: "Ingresar un correo válido"}
            }
        });

        var estado = validator.form();

        if (estado) {
            var json = {
                apellidos: $('#txt_apellidos_editar').val().trim(),
                nombres: $('#txt_nombres_editar').val().trim(),
                edad: $('#txt_edad_editar').val().trim(),
                correo: $('#txt_correo_editar').val().trim(),
                codigo: codigoPersona
            };
            $.ajax({
                type: 'POST',
                url: '../PersonaServlet?accion=editarPersona',
                dataType: 'json',
                data: {json: JSON.stringify(json)},
                beforeSend: function (xhr) {
                    console.log('cargando...');
                },
                success: function (data, textStatus, jqXHR) {
                    console.log(data);
                    var resultado = data.resultado;
                    if (resultado === '0') { //Error al actualizar
                        imprimirAlerta('Error!', data.mensaje, 'error');
                    } else if (resultado === '-1') { //SQLException error (catch)
                        imprimirAlerta('Error!', data.mensaje, 'error');
                    } else { // Actualizacion correcta
                        imprimirAlerta('Correcto!', data.mensaje, 'success');
                        recargarTabla();
                        $('#modal_editar_persona').modal('hide');
                    }
                },
                complete: function (jqXHR, textStatus) {
                }
            });
        }
    });
}

function listarPersona() {

    var txt_criterio_busqueda = $('#txt_criterio_busqueda').val().trim();


    var tabla_persona = $('#tabla_persona').DataTable({
        language: {
            paginate: {'next': '&rarr; ', 'previous': ' &larr;'},
            emptyTable: 'No hay registros'
        },
        ajax: {
            url: '../PersonaServlet?accion=listarPersona',
            type: 'POST',
            dataType: 'json',
            data: {search: txt_criterio_busqueda}
        },
        processing: true,
        serverSide: true,
        responsive: true,
        iDisplayLength: 10,
        bSort: false,
        bInfo: false,
        searching: false,
        bLengthChange: false,
        bFilter: false,
        columns: [
            {data: "item"},
            {data: "dni"},
            {
                data: null,
                render: function (data, type, row) {
                    return data.apellidos + ", " + data.nombres;
                }
            },
            {data: "edad", className: 'text-center'},
            {data: "correo"},
            {
                data: "estado",
                className: 'text-center',
                render: function (data, type, row) {
                    return data === "1" ? '<span class="label label-success">activo</span>' : '<span class="label label-danger">inactivo</span>';
                }
            },
            {
                data: null,
                className: 'text-center',
                render: function (data, type, row) {
                    return data.estado === "1" ? '<ul class="icons-list"><li title="Editar" data-toggle="modal" data-target="#modal_editar_persona" class="text-primary-600"><a href="#" class="editarPersona"><i class="icon-pencil7"></i></a></li><li title="Desactivar" class="text-success-600"><a href="#" class="desactivarPersona"><i class="icon-switch2"></i></a></li></ul>' : '<ul class="icons-list"><li title="Editar" data-toggle="modal" data-target="#modal_editar_persona" class="text-primary-600"><a href="#" class="editarPersona"><i class="icon-pencil7"></i></a></li><li title="Activar" class="text-danger-600"><a href="#" class="activarPersona"><i class="icon-switch2"></i></a></li></ul>';
                }
            }
        ],
        "fnRowCallBack": function (row, data, displayIndex, displayIndexFull) {
        }

    });

    $('#tabla_persona tbody').on('click', '.editarPersona', function () {
        var data_row = tabla_persona.row($(this).parents('tr')).data();
        console.log(data_row);
        codigoPersona = '';
        $('#txt_numero_documento_editar').val(data_row.dni);
        $('#txt_apellidos_editar').val(data_row.apellidos);
        $('#txt_nombres_editar').val(data_row.nombres);
        $('#txt_edad_editar').val(data_row.edad);
        $('#txt_correo_editar').val(data_row.correo);
        codigoPersona = data_row.codigo;
    });

    $('#tabla_persona tbody').on('click', '.desactivarPersona', function () {
        var data_row = tabla_persona.row($(this).parents('tr')).data();

        var json = {
            codigo: data_row.codigo
        };

        swal({
            title: "¿Estás seguro?",
            text: "¿Desea desactivar a " + data_row.apellidos + ", " + data_row.nombres + " ?",
            type: "warning",
            showCancelButton: true,
            confirmButtonColor: "#EF5350",
            confirmButtonText: "Si!",
            cancelButtonText: "No!",
            closeOnConfirm: false,
            closeOnCancel: true
        },
                function (isConfirm) {
                    if (isConfirm) {
                        $.ajax({
                            url: '../PersonaServlet?accion=desactivarPersona',
                            type: 'POST',
                            dataType: 'json',
                            data: {json: JSON.stringify(json)},
                            beforeSend: function (xhr) {
                            },
                            success: function (data, textStatus, jqXHR) {
                                console.log(data);
                                imprimirAlerta('Desactivado!', data_row.apellidos + ', ' + data_row.nombres + ' fue desactivado con exito!', 'success');
                                recargarTabla();
                            }
                        });
                    }
                });

    });

    $('#tabla_persona tbody').on('click', '.activarPersona', function () {
        var data_row = tabla_persona.row($(this).parents('tr')).data();
        var json = {
            codigo: data_row.codigo
        };

        swal({
            title: "¿Estás seguro?",
            text: "¿Desea activar a " + data_row.apellidos + ", " + data_row.nombres + " ?",
            type: "warning",
            showCancelButton: true,
            confirmButtonColor: "#EF5350",
            confirmButtonText: "Si!",
            cancelButtonText: "No!",
            closeOnConfirm: false,
            closeOnCancel: true
        },
                function (isConfirm) {
                    if (isConfirm) {
                        $.ajax({
                            url: '../PersonaServlet?accion=activarPersona',
                            type: 'POST',
                            dataType: 'json',
                            data: {json: JSON.stringify(json)},
                            beforeSend: function (xhr) {
                            },
                            success: function (data, textStatus, jqXHR) {
                                console.log(data);
                                imprimirAlerta('Activo!', data_row.apellidos + ', ' + data_row.nombres + ' fue activado con exito!', 'success');
                                recargarTabla();
                            }
                        });
                    }
                });
    });

}

function initInputs() {

    var txt_correo = $('#txt_correo');
    var txt_correo_editar = $('#txt_correo_editar');

    txt_correo_editar.attr({
        disabled: true
    });
    txt_correo.attr({
        disabled: true
    });
}

function imprimirAlerta(title, text, type) {
    var s_col = "#66BB6A";
    var e_col = "#EF5350";
    var w_col = "#FF7043";
    var btnCol;

    if (type === 'error') {
        btnCol = e_col;
    } else if (type === 'warning') {
        btnCol = w_col;
    } else {
        btnCol = s_col;
    }

    swal({
        title: title,
        text: text,
        confirmButtonColor: btnCol,
        type: type
    });

}

function recargarTabla() {
    $('#tabla_persona').DataTable().destroy();
    listarPersona();
}

function filtrarPersona() {
    // PRIMERA FORMA: CON BOTON
    $('#btn_buscar_criterio').on('click', function () {
        recargarTabla();
    });

    // SEGUNDA FORMA: MIENTRAS SE ESCRIBE
//    $('#txt_criterio_busqueda').keyup(function (e) {
//        recargarTabla();
//    });

    // TERCERA FORMA: PRESIONANDO ENTER
//    $('#txt_criterio_busqueda').keyup(function (e) {
//        if (e.keyCode === 13) {
//            recargarTabla();
//        }
//    });
}

function limpiarInputs() {
    $('#txt_numero_documento').attr({
        autofocus: true
    });
    $('#txt_numero_documento').val('');
    $('#txt_apellidos').val('');
    $('#txt_nombres').val('');
    $('#txt_edad').val('');
    $('#txt_correo').val('');

}

function MyValidate() {

    function stripHtml(value) {
        // remove html tags and space chars
        return value.replace(/<.[^<>]*?>/g, ' ').replace(/&nbsp;|&#160;/gi, ' ')
                // remove numbers and punctuation
                .replace(/[0-9.(),;:!?%#$'"_+=\/-]*/g, '');
    }

    jQuery.validator.addMethod("lettersonly", function (value, element) {
        return this.optional(element) || /^[a-z\s]+$/i.test(value);
    }, "Solo letras.");




    jQuery.validator.setDefaults({
        debug: true,
        ignore: 'input[type=hidden], .select2-search__field', // ignore hidden fields
        errorClass: 'validation-error-label',
        successClass: 'validation-valid-label',
        highlight: function (element, errorClass) {
            $(element).removeClass(errorClass);
        },
        unhighlight: function (element, errorClass) {
            $(element).removeClass(errorClass);
        },
        // Different components require proper error label placement
        errorPlacement: function (error, element) {

            // Styled checkboxes, radios, bootstrap switch
            if (element.parents('div').hasClass("checker") || element.parents('div').hasClass("choice") || element.parent().hasClass('bootstrap-switch-container')) {
                if (element.parents('label').hasClass('checkbox-inline') || element.parents('label').hasClass('radio-inline')) {
                    error.appendTo(element.parent().parent().parent().parent());
                } else {
                    error.appendTo(element.parent().parent().parent().parent().parent());
                }
            }

            // Unstyled checkboxes, radios
            else if (element.parents('div').hasClass('checkbox') || element.parents('div').hasClass('radio')) {
                error.appendTo(element.parent().parent().parent());
            }

            // Input with icons and Select2
            else if (element.parents('div').hasClass('has-feedback') || element.hasClass('select2-hidden-accessible')) {
                error.appendTo(element.parent());
            }

            // Inline checkboxes, radios
            else if (element.parents('label').hasClass('checkbox-inline') || element.parents('label').hasClass('radio-inline')) {
                error.appendTo(element.parent().parent());
            }

            // Input group, styled file input
            else if (element.parent().hasClass('uploader') || element.parents().hasClass('input-group')) {
                error.appendTo(element.parent().parent());
            } else {
                error.insertAfter(element);
            }
        }
    });

}

function initInputs() {

    var txt_numero_documento = $('#txt_numero_documento');
    var txt_apellidos = $('#txt_apellidos');
    var txt_nombres = $('#txt_nombres');
    var txt_edad = $('#txt_edad');
    var txt_correo = $('#txt_correo');
    var dominio_correo = '.TI@SACOOLIVEROS.EDU.PE';

//    txt_correo.attr({
//        disabled: true
//    });




}