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

function initializeModals() {
    // Setup modal triggers
    document.querySelectorAll('[data-toggle="modal"]').forEach(trigger => {
        const targetId = trigger.getAttribute('data-target');
        const targetModal = document.querySelector(targetId);

        if (targetModal) {
            trigger.addEventListener('click', function (e) {
                e.preventDefault();
                openModal(targetId);
            });
        }
    });

    // Setup direct modal triggers (like the new folder button)
    const newFolderBtn = document.getElementById('new-folder-btn');
    if (newFolderBtn) {
        newFolderBtn.addEventListener('click', function () {
            openModal('#new-folder-modal');
        });
    }

    const emptyNewFolderBtn = document.getElementById('empty-new-folder-btn');
    if (emptyNewFolderBtn) {
        emptyNewFolderBtn.addEventListener('click', function () {
            openModal('#new-folder-modal');
        });
    }

    // Close buttons
    document.querySelectorAll('.modal-close, .modal-cancel').forEach(closeBtn => {
        closeBtn.addEventListener('click', function () {
            const modal = this.closest('.modal');
            if (modal) {
                closeModal('#' + modal.id);
            }
        });
    });

    // 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');
    }
}