Spark
2fde103e93
Partiel _header.html unique pour les 19 pages (fin des copies qui dérivaient): desktop une ligne — primaires + menu Plus + Ctrl K, page active déduite du gabarit dans render(); mobile ≤900px burger + panneau ≥44px, Échap/clic extérieur; wallboard sans header et triage sur le même partiel. nav.js partagé.
56 lines
1.9 KiB
JavaScript
56 lines
1.9 KiB
JavaScript
/**
|
|
* Kanbante — header navigation (issue #16): the "Plus" dropdown on
|
|
* desktop and the burger panel on mobile. One shared partial
|
|
* (_header.html), one shared behaviour: this file.
|
|
*/
|
|
(function () {
|
|
var moreBtn = document.getElementById('nav-more-btn');
|
|
var moreMenu = document.getElementById('nav-more-menu');
|
|
var burger = document.getElementById('nav-burger');
|
|
var mobileNav = document.getElementById('mobile-nav');
|
|
|
|
function setOpen(menu, btn, open) {
|
|
if (!menu || !btn) return;
|
|
menu.hidden = !open;
|
|
btn.setAttribute('aria-expanded', open ? 'true' : 'false');
|
|
}
|
|
function closeAll() {
|
|
setOpen(moreMenu, moreBtn, false);
|
|
setOpen(mobileNav, burger, false);
|
|
if (burger) {
|
|
burger.textContent = '☰';
|
|
burger.setAttribute('aria-label', 'Ouvrir le menu');
|
|
}
|
|
}
|
|
|
|
if (moreBtn && moreMenu) {
|
|
moreBtn.addEventListener('click', function (e) {
|
|
e.stopPropagation();
|
|
var willOpen = moreMenu.hidden;
|
|
closeAll();
|
|
setOpen(moreMenu, moreBtn, willOpen);
|
|
});
|
|
moreMenu.addEventListener('click', function (e) { e.stopPropagation(); });
|
|
}
|
|
if (burger && mobileNav) {
|
|
burger.addEventListener('click', function (e) {
|
|
e.stopPropagation();
|
|
var willOpen = mobileNav.hidden;
|
|
closeAll();
|
|
setOpen(mobileNav, burger, willOpen);
|
|
burger.textContent = willOpen ? '✕' : '☰';
|
|
burger.setAttribute('aria-label', willOpen ? 'Fermer le menu' : 'Ouvrir le menu');
|
|
});
|
|
}
|
|
document.addEventListener('click', function () { closeAll(); });
|
|
document.addEventListener('keydown', function (e) {
|
|
if (e.key === 'Escape') closeAll();
|
|
});
|
|
window.addEventListener('resize', function () {
|
|
if (window.innerWidth > 900) {
|
|
closeAll();
|
|
if (burger) burger.textContent = '☰';
|
|
}
|
|
});
|
|
})();
|