91 lines
2.8 KiB
JavaScript
91 lines
2.8 KiB
JavaScript
async function loadAdminHeader() {
|
|
const container = document.getElementById('app-header');
|
|
if (!container) return;
|
|
try {
|
|
const res = await fetch('/static/common/html/header.html?v=0.3.1');
|
|
if (!res.ok) return;
|
|
container.innerHTML = await res.text();
|
|
const path = window.location.pathname;
|
|
const links = container.querySelectorAll('a[data-nav]');
|
|
links.forEach((link) => {
|
|
const target = link.getAttribute('data-nav') || '';
|
|
if (target && path.startsWith(target)) {
|
|
link.classList.add('active');
|
|
const group = link.closest('.nav-group');
|
|
if (group) {
|
|
const trigger = group.querySelector('.nav-group-trigger');
|
|
if (trigger) {
|
|
trigger.classList.add('active');
|
|
}
|
|
}
|
|
}
|
|
});
|
|
if (typeof updateStorageModeButton === 'function') {
|
|
updateStorageModeButton();
|
|
}
|
|
|
|
const nav = container.querySelector('nav');
|
|
const menuToggle = container.querySelector('#admin-menu-toggle');
|
|
const mobileMenu = container.querySelector('#admin-mobile-menu');
|
|
if (menuToggle && mobileMenu) {
|
|
const setMenuOpen = (open) => {
|
|
const isOpen = Boolean(open);
|
|
menuToggle.setAttribute('aria-expanded', isOpen ? 'true' : 'false');
|
|
mobileMenu.hidden = !isOpen;
|
|
mobileMenu.classList.toggle('open', isOpen);
|
|
if (nav) {
|
|
nav.classList.toggle('mobile-menu-open', isOpen);
|
|
}
|
|
document.body.classList.toggle('mobile-menu-open', isOpen);
|
|
};
|
|
|
|
setMenuOpen(false);
|
|
|
|
menuToggle.addEventListener('click', () => {
|
|
const expanded = menuToggle.getAttribute('aria-expanded') === 'true';
|
|
setMenuOpen(!expanded);
|
|
});
|
|
|
|
mobileMenu.addEventListener('click', (event) => {
|
|
const target = event.target;
|
|
if (!(target instanceof Element)) return;
|
|
if (target.closest('a') || target.closest('button')) {
|
|
setMenuOpen(false);
|
|
}
|
|
});
|
|
|
|
document.addEventListener('click', (event) => {
|
|
const target = event.target;
|
|
if (!(target instanceof Node)) return;
|
|
if (!container.contains(target)) {
|
|
setMenuOpen(false);
|
|
}
|
|
});
|
|
|
|
document.addEventListener('keydown', (event) => {
|
|
if (event.key === 'Escape') {
|
|
setMenuOpen(false);
|
|
}
|
|
});
|
|
|
|
window.addEventListener('resize', () => {
|
|
if (window.innerWidth > 900) {
|
|
setMenuOpen(false);
|
|
}
|
|
});
|
|
}
|
|
|
|
if (window.themeController && typeof window.themeController.refreshButtons === 'function') {
|
|
window.themeController.refreshButtons();
|
|
}
|
|
} catch (e) {
|
|
// Fail silently to avoid breaking page load
|
|
}
|
|
}
|
|
|
|
if (document.readyState === 'loading') {
|
|
document.addEventListener('DOMContentLoaded', loadAdminHeader);
|
|
} else {
|
|
loadAdminHeader();
|
|
}
|