window.allFieldsToJson = function allFieldsToJson() {
    const data = {};
    const fields = document.querySelectorAll('input, select, textarea');

    fields.forEach(field => {
        const key = field.name;// || field.id; // Usa el nombre del campo, o su ID si no tiene nombre
        const value = field.value;

        // Si la clave ya existe (por ejemplo, en caso de checkboxes o radios con el mismo nombre)
        if (data.hasOwnProperty(key)) {
            if (Array.isArray(data[key])) {
                data[key].push(value);
            } else {
                data[key] = [data[key], value];
            }
        } else {
            data[key] = value;
        }
    });

    return JSON.stringify(data);
}

window.populateFieldsFromJson = function populateFieldsFromJson(data) {
    Object.keys(data).forEach(key => {
        const fields = document.querySelectorAll(`[name="${key}"], [id="${key}"]`);
        
        fields.forEach(field => {
            const value = data[key];

            if (field.type === 'checkbox' || field.type === 'radio') {
                // Marcar checkboxes/radios según el valor (asumimos booleano o comparación de string)
                field.checked = Array.isArray(value) ? value.includes(field.value) : field.value === String(value);
            } else if (field.tagName === 'SELECT' && Array.isArray(value)) {
                // Seleccionar múltiples opciones si es un select múltiple
                Array.from(field.options).forEach(option => {
                    option.selected = value.includes(option.value);
                });
            } else {
                // Asignar valor a otros tipos de campos
                field.value = value;
            }
        });
    });
}

window.watchForChanges = function watchForChanges() {
    console.log("Observando")
    // Selecciona todos los campos de entrada, selectores y áreas de texto en el documento
    const fields = document.querySelectorAll('input, select, textarea');
    const snapearField = document.getElementById('snapear');
    
    // Verifica si existe el campo "snapear" en el documento
    if (!snapearField) {
        console.warn('El campo con id="snapear" no existe en el documento.');
        return;
    }

    fields.forEach(field => {
        // Agrega un evento 'change' a cada campo
        field.addEventListener('change', () => {
            snapearField.value = "1";
            console.log("Se encontro cambio se programa generer snap")
        });
    });
}