function validateChapterForm() {
    let valid = true;
    // Validar número de capítulo
    const chapterNumber = document.getElementById('chapter_number');
    if (!chapterNumber.value || parseInt(chapterNumber.value) < 1) {
        chapterNumber.classList.add('is-invalid');
        valid = false;
    } else {
        chapterNumber.classList.remove('is-invalid');
    }

    // Validar título
    const chapterTitle = document.getElementById('chapterTitle');
    if (!chapterTitle.value.trim()) {
        chapterTitle.classList.add('is-invalid');
        valid = false;
    } else {
        chapterTitle.classList.remove('is-invalid');
    }
    return valid;
}

// Función para configurar CKEditor
function setUpCkEditor(element) {
    if (!element) return;
    if (window.CKEDITOR) {
        CKEDITOR.replace(element, {
            height: 400,
            toolbar: [
                { name: 'basicstyles', items: ['Bold', 'Italic', 'Underline', 'Strike', '-', 'Subscript', 'Superscript'] },
                { name: 'paragraph', items: ['NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', '-', 'Blockquote'] },
                { name: 'insert', items: ['Link', 'Image', 'Table', 'HorizontalRule', 'Smiley', 'SpecialChar'] },
                { name: 'styles', items: ['Styles', 'Format', 'Font', 'FontSize'] },
                { name: 'colors', items: ['TextColor', 'BGColor'] },
                { name: 'tools', items: ['Maximize'] },
                { name: 'editing', items: ['Scayt'] }
            ]
        });
    }
}

// Función para enviar el formulario del capítulo
function submitChampterForm() {
    const form = document.getElementById('editChapterForm');
    if (!form) return;

    // Crear un FormData para enviar el formulario
    const formData = new FormData(form);

    // Enviar el método de envío del formulario
    formData.append('_method', 'PUT');

    // Enviar el formulario usando fetch
    fetch(form.action, {
        method: 'POST', // Usamos POST para Laravel, que lo tratará como PUT 
        body: formData,
        headers: {
            'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content')
        }
    })
        .then(response => {
            if (!response.ok) {
                throw new Error('Network response was not ok');
            }
            return response.json();
        })
        .then(data => {
            // Manejar la respuesta del servidor
            if (data.success) {
                notifySuccess('Chapter saved successfully!');
            }
        })
        .catch(error => {
            console.error('Error al enviar el formulario:', error);
            notifyError('Error al guardar el capítulo: ' + error.message);
        });
}

// Función para añadir un nuevo ejercicio
function addNewExercise(chapterId) {
    fetch(`/api/exercise/create`, {
        method: 'POST',
        headers: {
            'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content'),
            'Content-Type': 'application/json'
        },
        body: JSON.stringify({ chapter_id: chapterId }),
    })
        .then(response => {
            if (!response.ok) {
                throw new Error('Network response was not ok');
            }
            return response.json();
        })
        .then(data => {
            if (!data.success ||!data.exercise) {
                notifyError('Failed to create exercise: ' + (data.message || 'Unknown error'));
                throw new Error(data.message || 'Failed to create exercise');
            }

            // En caso de éxito recargar la página para mostrar el nuevo ejercicio
            window.location.reload();
        })
        .catch(error => {
            console.error('Error:', error);
            notifyError('Error to add a new exercise ' + error.message);
        });
}

// Función para recuperar el de laravel la variable $chapter
function getChapterId() {
    return window.chapter || [];
}

function init() {
    // Configuramos el CkEditor para el contenido del capítulo
    const contentElement = document.getElementById('content');
    setUpCkEditor(contentElement);

    // Configurar el botón de guardar
    const saveButton = document.getElementById('saveChapterButton');

    if (!saveButton) { console.error("Save button not found."); }


    if (saveButton) {
        saveButton.addEventListener('click', (event) => {
            event.preventDefault();

            // Validar el formulario del capítulo
            if (validateChapterForm()) {
                // Si usas CKEditor, actualiza el textarea antes de enviar
                if (window.CKEDITOR && CKEDITOR.instances.content) {
                    CKEDITOR.instances.content.updateElement();
                }

                // Enviar el formulario
                submitChampterForm();
            }
        });
    }

    // Configurar botón de añadir nuevo ejercicio
    const addExerciseButton = document.getElementById('add-exercise-btn');

    if (!addExerciseButton) {
        console.error("Add exercise button not found.");
    }

    const chapterId = getChapterId();

    if (!chapterId) {
        console.error("chapter ID is missing.");
    }

    
    addExerciseButton.addEventListener('click', () => {
        // Añadir un nuevo ejercicio
        addNewExercise(chapterId);
    });


}

document.addEventListener('DOMContentLoaded', init);