TDvorak/PPve
1
0
Fork 0
mirror of https://github.com/Dvorinka/PPve.git synced 2026-06-03 20:12:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

te

Browse Source
This commit is contained in:
Tomas Dvorak
2025-05-30 12:20:29 +02:00
parent 4c5605f37e
commit ed4460c8f5
1 changed files with 28 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files
admin-dashboard.html
+28 -25
View File
@@ -2445,7 +2445,9 @@ function initIconPicker() {
let isModalOpen = false; let isModalOpen = false;
// Simple show/hide functions
// Improved modal toggle with cleanup
const toggleModal = () => { const toggleModal = () => {
isModalOpen = !isModalOpen; isModalOpen = !isModalOpen;
document.body.style.overflow = isModalOpen ? 'hidden' : ''; document.body.style.overflow = isModalOpen ? 'hidden' : '';
@@ -2455,68 +2457,69 @@ function initIconPicker() {
// Focus search input only after modal is visible // Focus search input only after modal is visible
requestAnimationFrame(() => { requestAnimationFrame(() => {
if (iconSearch) { if (iconSearch) {
iconSearch.value = '';
renderIcons('');
iconSearch.focus(); iconSearch.focus();
} }
}); });
} else {
// Reset search when closing
if (iconSearch) {
iconSearch.value = '';
renderIcons('');
}
} }
}; };
// Toggle modal on icon input click // Toggle modal on icon input click
iconInput.addEventListener('click', (e) => { iconInput.addEventListener('click', (e) => {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
toggleModal(); toggleModal();
}); });
// Close modal handlers // Close modal handlers
if (closeButton) { if (closeButton) {
closeButton.addEventListener('click', () => { closeButton.addEventListener('click', toggleModal);
isModalOpen = false;
document.body.style.overflow = '';
iconPickerModal.style.display = 'none';
});
} }
// Close when clicking outside the modal content // Close when clicking outside the modal content
iconPickerModal.addEventListener('click', (e) => { iconPickerModal.addEventListener('click', (e) => {
if (e.target === iconPickerModal) { if (e.target === iconPickerModal && isModalOpen) {
isModalOpen = false; toggleModal();
document.body.style.overflow = '';
iconPickerModal.style.display = 'none';
} }
}); });
// Handle icon selection // Handle icon selection
if (iconList) { if (iconList) {
iconList.addEventListener('click', (e) => { iconList.addEventListener('click', (e) => {
const iconOption = e.target.closest('.icon-option'); const iconOption = e.target.closest('.icon-option');
if (iconOption) { if (iconOption && isModalOpen) {
const iconClass = iconOption.getAttribute('data-icon'); const iconClass = iconOption.getAttribute('data-icon');
selectIcon(iconClass); selectIcon(iconClass);
toggleModal(); // Close modal after selection
} }
}); });
} }
// Handle search // Handle search with improved debounce
if (iconSearch) { if (iconSearch) {
let searchTimeout;
iconSearch.addEventListener('input', () => { iconSearch.addEventListener('input', () => {
// Debounce search to prevent excessive re-renders if (searchTimeout) clearTimeout(searchTimeout);
clearTimeout(iconSearch.dataset.searchTimeout); searchTimeout = setTimeout(() => {
iconSearch.dataset.searchTimeout = setTimeout(() => {
renderIcons(iconSearch.value.toLowerCase()); renderIcons(iconSearch.value.toLowerCase());
}, 200); }, 200);
}); });
} }
// Initial render // Initial render
renderIcons(''); renderIcons('');
// Close on Escape // Close on Escape
document.addEventListener('keydown', (e) => { document.addEventListener('keydown', (e) => {
if (e.key === 'Escape' && isModalOpen) { if (e.key === 'Escape' && isModalOpen) {
isModalOpen = false; toggleModal();
document.body.style.overflow = '';
iconPickerModal.style.display = 'none';
} }
}); });
} }