// Modal management script
document.addEventListener('DOMContentLoaded', function () {
    // Initialize all modals
    initializeModals();
});

function initializeModals() {
    // Get all modals
    const modals = document.querySelectorAll('.modal');

    // Initialize each modal
    modals.forEach(modal => {
        // Get close button
        const closeBtn = modal.querySelector('.modal-close');
        const cancelBtn = modal.querySelector('.modal-cancel');

        // Close modal when close button is clicked
        if (closeBtn) {
            closeBtn.addEventListener('click', function () {
                modal.classList.remove('active');
            });
        }

        // Close modal when cancel button is clicked
        if (cancelBtn) {
            cancelBtn.addEventListener('click', function () {
                modal.classList.remove('active');
            });
        }

        // Close modal when clicking outside
        modal.addEventListener('click', function (e) {
            if (e.target === modal) {
                modal.classList.remove('active');
            }
        });
    });

    // Open modal when trigger is clicked
    document.querySelectorAll('[data-modal]').forEach(trigger => {
        trigger.addEventListener('click', function () {
            const modalId = this.dataset.modal;
            const modal = document.getElementById(modalId);
            if (modal) {
                modal.classList.add('active');
            }
        });
    });

    // New folder button
    const newFolderBtn = document.getElementById('new-folder-btn');
    if (newFolderBtn) {
        newFolderBtn.addEventListener('click', function () {
            const modal = document.getElementById('new-folder-modal');
            if (modal) {
                modal.classList.add('active');
            }
        });
    }

    // Close on background click
    document.querySelectorAll('.modal').forEach(modal => {
        modal.addEventListener('click', function (e) {
            if (e.target === this) {
                closeModal('#' + this.id);
            }
        });
    });

    // Close on escape key
    document.addEventListener('keydown', function (e) {
        if (e.key === 'Escape') {
            const activeModal = document.querySelector('.modal.active');
            if (activeModal) {
                closeModal('#' + activeModal.id);
            }
        }
    });
}

// Open a modal by ID
function openModal(modalId) {
    const modal = typeof modalId === 'string' ?
        document.querySelector(modalId) :
        modalId;

    if (modal) {
        modal.classList.add('active');
    }
}

// Close a modal by ID
function closeModal(modalId) {
    const modal = typeof modalId === 'string' ?
        document.querySelector(modalId) :
        modalId;

    if (modal) {
        modal.classList.remove('active');
    }
}