86 lines
No EOL
2.4 KiB
JavaScript
86 lines
No EOL
2.4 KiB
JavaScript
// 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');
|
|
}
|
|
}
|