$(document).ready(function(){
    //events
    var ulActive;

    // Función para manejar el estado de las pestañas
    function handleTabsState() {
        if ($("#especiality").val() === "SELECT") {
            $('#myTab a').not('#form-history-tab').addClass('disabled');
            $('#tabBackgrounds a').addClass('disabled');
            $('#tabTestPhysical a').addClass('disabled');
            
            // Desactivar los botones de navegación
            $("#nextToBackgrounds").addClass('disabled');
            $("#nextToExamPhysical").addClass('disabled');
            $("#nextToFiles").addClass('disabled');
        } else {
            $('#myTab a').removeClass('disabled');
            $('#tabBackgrounds a').removeClass('disabled');
            $('#tabTestPhysical a').removeClass('disabled');
            
            // Activar los botones de navegación
            $("#nextToBackgrounds").removeClass('disabled');
            $("#nextToExamPhysical").removeClass('disabled');
            $("#nextToFiles").removeClass('disabled');
        }
    }

    // Eventos de las pestañas
    $('#myTab a, #tabBackgrounds a, #tabTestPhysical a').on('click', function(e) {
        if ($("#especiality").val() === "SELECT") {
            e.preventDefault();
            e.stopPropagation();
            alert(window.translations["create-history"].selectSpecialtyFirst);
            return false;
        }
        $(this).tab('show');
    });

    /**
     * 
     */
    $('#myTab a').on('click',  function(e) {
        e.preventDefault();
        if ($("#especiality").val() === "SELECT") {
            return;
        }
        $(this).tab('show');
    });
    /**
     * 
     */
    $('#tabBackgrounds a').on('click',  function(e) {
        e.preventDefault();
        if ($("#especiality").val() === "SELECT") {
            return;
        }
        $(this).tab('show');
    });

    /**
     * Manejo de pestañas en exámenes físicos
     */
    $('#tabTestPhysical').on('click', 'a.nav-link', function(e) {
        e.preventDefault();
        
        // Validar especialidad seleccionada
        if ($("#especiality").val() === "SELECT") {
            return false;
        }
        
        // Remover clase active de todas las pestañas
        $('#tabTestPhysical .nav-link').removeClass('active');
        
        // Obtener el contenido asociado
        const target = $(this).attr('href');
        
        // Remover clase active de todo el contenido
        $('#tabTestPhysicalContent .tab-pane').removeClass('show active');
        
        // Activar nueva pestaña y contenido
        $(this).addClass('active');
        $(target).addClass('show active');
    });

    /**
     * 
     */
    $("#patients_id").on("change",()=>{
        $.fn.onValidButtonSubmit.call();
    });
    /**
     * 
     */
    $("#especiality").on("change",()=>{
        handleTabsState();
        $.fn.onValidButtonSubmit.call();
    });

    /**
     * 
     */
    $("#title").on("input",()=>{
        $.fn.onValidButtonSubmit.call();
    });

    /**
     * 
     */
    $("#summary").on("input",()=>{
        $.fn.onValidButtonSubmit.call();
    });

     /**
     * 
     */
     $("#diagnosis").on("input",()=>{
        $.fn.onValidButtonSubmit.call();
    });

    //functions
    $.fn.onValidButtonSubmit = ()=>{
        let isValid = (($("#patients_id").val() !== "SELECT") && ($("#especiality").val() !== "SELECT") && ($("#title").val().trim()!=="")&&($("#summary").val().trim()!=="")&&($("#diagnosis").val().trim()!==""));
        $("#btnSubmitHistory").attr("disabled",(!isValid));
    }

    $("#btnSubmitHistory").on("click",()=>{
        $("#historyForm").trigger("submit");
    });

    $("#nextToBackgrounds").on("click", function (e) {
        if ($("#especiality").val() === "SELECT") {
            e.preventDefault();
            e.stopPropagation();
            alert(window.translations["create-history"].selectSpecialtyFirst);
            return false;
        }
    });

    $("#nextToExamPhysical").on("click", function (e) {
        if ($("#especiality").val() === "SELECT") {
            e.preventDefault();
            e.stopPropagation();
            alert(window.translations["create-history"].selectSpecialtyFirst);
            return false;
        }
    });

    $("#nextToFiles").on("click", function (e) {
        if ($("#especiality").val() === "SELECT") {
            e.preventDefault();
            e.stopPropagation();
            alert(window.translations["create-history"].selectSpecialtyFirst);
            return false;
        }
    });

    $("#historyForm").on("submit", function (e) {
        var form = document.querySelector("#historyForm");
        var data = $.fn.getDataForm.call(this, form);
        var valid = $.fn.runValidations(data, $.fn.validations());
        console.log("data ", data);
        e.preventDefault();

        if (valid.valid) {
            // Verificar explícitamente que los valores críticos no sean SELECT
            const especialityValue = $("#especiality").val();
            const patientsIdValue = $("#patients_id").val();
            
            if (especialityValue === "SELECT") {
                alert(window.translations["create-history"].selectSpecialtyFirst || "Por favor seleccione una especialidad primero");
                $("#form-history-tab").tab('show');
                return false;
            }
            
            if (patientsIdValue === "SELECT") {
                alert("Por favor seleccione un paciente");
                $("#form-history-tab").tab('show');
                return false;
            }
            
            var formToSend = form.cloneNode(true);

            // Asegurar que los valores de los selects se copien correctamente
            const formSelects = ['especiality', 'patients_id'];
            formSelects.forEach(selectName => {
                const originalSelect = document.querySelector(`#${selectName}`);
                const clonedSelect = formToSend.querySelector(`#${selectName}`);
                
                if (originalSelect && clonedSelect) {
                    clonedSelect.value = originalSelect.value;
                    
                    // Verificación adicional
                    console.log(`Copiando valor de ${selectName}: ${originalSelect.value} -> ${clonedSelect.value}`);
                    
                    // Si el valor es SELECT, no enviar el formulario
                    if (clonedSelect.value === "SELECT") {
                        console.error(`Error: El valor de ${selectName} sigue siendo SELECT`);
                        return false;
                    }
                }
            });

            for (const element of document.querySelectorAll(".backgrounds")) {
                formToSend.appendChild(element.cloneNode(false));
            }

            for (const element of document.querySelectorAll(".phisycalExams")) {
                formToSend.appendChild(element.cloneNode(false));
            }

            for (const element of document.querySelectorAll(".filesZone")) {
                formToSend.appendChild(element.cloneNode(false));
            }

            formToSend.style.display = "none";
            $(document.body).append(formToSend);
            
            // Verificación final antes de enviar
            const finalEspecialityValue = formToSend.querySelector("#especiality").value;
            const finalPatientsIdValue = formToSend.querySelector("#patients_id").value;
            
            console.log("Valores finales antes de enviar:", {
                especialidad: finalEspecialityValue,
                paciente: finalPatientsIdValue
            });
            
            if (finalEspecialityValue !== "SELECT" && finalPatientsIdValue !== "SELECT") {
                $(formToSend).trigger("submit");
            } else {
                console.error("Error: No se puede enviar el formulario, valores inválidos");
                alert("Error: Datos inválidos. Por favor vuelva a verificar los campos");
                document.body.removeChild(formToSend);
                return false;
            }
            
            document.body.removeChild(formToSend);
        } else {
            $("#form-history-tab").tab('show');
        }
    });

    $.fn.validations = function () {
        return [{
            "name": "noEmpty",
            "message": window.translations["create-history"].fieldRequired,
            "run": function run(field) {
                if (field.key === "date" || field.key === "historyId" || field.key.includes("cie")) return true;
                if (field.key === "especiality") return field.value.trim() !== "SELECT";
                return field.value != undefined && field.value.trim() !== "";
            }
        }];
    };

    //assing
    $.fn.onValidButtonSubmit.call();

    // Inicializar el estado de las pestañas al cargar
    handleTabsState();

    /**
     * 
     */
    $(document).on("keydown",function(event){
        switch(event.key){
            case "Tab":
                if(ulActive != undefined){
                    event.preventDefault();
                    $.fn.toNextTab(ulActive);
                }
            break;
        }
    });

    /**
     * 
     */
    $(".nav-item").click(function(element){
        let getParentNodeUL = function(node){
            let parent = node.parentNode;
            if((parent.nodeName === "UL") && (parent.className.search("nav-tabs") !== -1))
                return parent;
            else
                return getParentNodeUL(parent);
        };
        ulActive = getParentNodeUL(element.target);
    });

    /**
     * 
     * @param {*} ul 
     */
    $.fn.toNextTab = function (ul){
        let tabs = Array.prototype.filter.call(ul.childNodes,(el) => (el.nodeName === "LI"));
        let next;
        let selected;
        let index = 0;
        let elementToNext;

        for(let li of tabs){
            for(let child of li.childNodes){
                if((child.nodeName === "A") && (child.className.search("active") !== -1)){
                    selected = child;
                }
            }
            if(selected != undefined) break;
            index++;
        }  

        next = ((index + 1)===tabs.length) ? 0 : index + 1;
        elementToNext = Array.prototype.find.call(tabs[next].childNodes,(el)=>el.nodeName === "A");
        if(elementToNext != undefined)
            $(elementToNext).tab("show");
    }
});




