Dodo
30 lines
949 B
JavaScript
30 lines
949 B
JavaScript
export class MobileMenuController {
|
|
constructor({
|
|
buttonId = 'mobile-menu-button',
|
|
menuId = 'mobile-menu',
|
|
closeButtonId = 'close-mobile-menu',
|
|
} = {}) {
|
|
this.button = document.getElementById(buttonId);
|
|
this.menu = document.getElementById(menuId);
|
|
this.closeButton = document.getElementById(closeButtonId);
|
|
}
|
|
|
|
init() {
|
|
if (!this.button || !this.menu) return;
|
|
|
|
this.button.addEventListener('click', () => this.toggle());
|
|
this.closeButton?.addEventListener('click', () => this.close());
|
|
}
|
|
|
|
toggle() {
|
|
const isOpen = !this.menu.classList.contains('-translate-x-full');
|
|
this.menu.classList.toggle('-translate-x-full');
|
|
this.button.setAttribute('aria-expanded', isOpen ? 'false' : 'true');
|
|
}
|
|
|
|
close() {
|
|
this.menu.classList.add('-translate-x-full');
|
|
this.button?.setAttribute('aria-expanded', 'false');
|
|
}
|
|
}
|