feat: modal UX - close on Escape key and backdrop click, add ARIA attributes

- Escape key closes any open memory modal
- Clicking the dark backdrop behind a modal closes it
- Add role=dialog, aria-modal, aria-label for accessibility
This commit is contained in:
2026-02-28 23:31:28 +02:00
parent 8b96f4dc8a
commit 7a10206617

View File

@@ -5842,6 +5842,37 @@ function closeCreateMemoryModal() {
document.getElementById('create-memory-modal').style.display = 'none'; document.getElementById('create-memory-modal').style.display = 'none';
} }
// Modal keyboard and backdrop close handlers
document.addEventListener('keydown', function(e) {
if (e.key === 'Escape') {
const editModal = document.getElementById('edit-memory-modal');
const createModal = document.getElementById('create-memory-modal');
if (editModal && editModal.style.display !== 'none') closeEditMemoryModal();
if (createModal && createModal.style.display !== 'none') closeCreateMemoryModal();
}
});
document.addEventListener('DOMContentLoaded', function() {
const editModal = document.getElementById('edit-memory-modal');
const createModal = document.getElementById('create-memory-modal');
if (editModal) {
editModal.setAttribute('role', 'dialog');
editModal.setAttribute('aria-modal', 'true');
editModal.setAttribute('aria-label', 'Edit Memory');
editModal.addEventListener('click', function(e) {
if (e.target === this) closeEditMemoryModal();
});
}
if (createModal) {
createModal.setAttribute('role', 'dialog');
createModal.setAttribute('aria-modal', 'true');
createModal.setAttribute('aria-label', 'Create Memory');
createModal.addEventListener('click', function(e) {
if (e.target === this) closeCreateMemoryModal();
});
}
});
async function saveNewMemory() { async function saveNewMemory() {
const collection = document.getElementById('create-memory-collection').value; const collection = document.getElementById('create-memory-collection').value;
const content = document.getElementById('create-memory-content').value.trim(); const content = document.getElementById('create-memory-content').value.trim();