PonyMirrors/philomena
1
0
Fork 0
mirror of https://github.com/philomena-dev/philomena.git synced 2024-11-23 20:18:00 +01:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #304 from philomena-dev/burger-ts

Browse source 
convert burger menu logic to typescript
This commit is contained in:
liamwhite 2024-06-23 11:43:44 -04:00 committed by GitHub
commit 29c88cf74e
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 19 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

38
assets/js/burger.js → assets/js/burger.ts
View file

@ -2,12 +2,15 @@
* Hamburger menu.
*/
function switchClasses(element, oldClass, newClass) {
import { $, $$ } from './utils/dom';
import { assertNotNull } from './utils/assert';
function switchClasses(element: HTMLElement, oldClass: string, newClass: string) {
element.classList.remove(oldClass);
element.classList.add(newClass);
}
function open(burger, content, body, root) {
function open(burger: HTMLElement, content: HTMLElement, body: HTMLElement, root: HTMLElement) {
switchClasses(content, 'close', 'open');
switchClasses(burger, 'close', 'open');
@ -15,7 +18,7 @@ function open(burger, content, body, root) {
body.classList.add('no-overflow');
}
function close(burger, content, body, root) {
function close(burger: HTMLElement, content: HTMLElement, body: HTMLElement, root: HTMLElement) {
switchClasses(content, 'open', 'close');
switchClasses(burger, 'open', 'close');
@ -26,31 +29,29 @@ function close(burger, content, body, root) {
}, 300);
}
function copyArtistLinksTo(burger) {
const copy = links => {
function copyUserLinksTo(burger: HTMLElement) {
const copy = (links: HTMLCollection) => {
burger.appendChild(document.createElement('hr'));
[].slice.call(links).forEach(link => {
const burgerLink = link.cloneNode(true);
for (const link of links) {
const burgerLink = link.cloneNode(true) as HTMLElement;
burgerLink.className = '';
burger.appendChild(burgerLink);
});
}
};
const linksContainers = document.querySelectorAll('.js-burger-links');
[].slice.call(linksContainers).forEach(container => copy(container.children));
$$<HTMLElement>('.js-burger-links').forEach(container => copy(container.children));
}
function setupBurgerMenu() {
const burger = document.getElementById('burger');
const toggle = document.getElementById('js-burger-toggle');
const content = document.getElementById('container');
export function setupBurgerMenu() {
// Burger menu should exist on all pages.
const burger = assertNotNull($<HTMLElement>('#burger'));
const toggle = assertNotNull($<HTMLElement>('#js-burger-toggle'));
const content = assertNotNull($<HTMLElement>('#container'));
const body = document.body;
const root = document.documentElement;
copyArtistLinksTo(burger);
copyUserLinksTo(burger);
toggle.addEventListener('click', event => {
event.stopPropagation();
@ -63,11 +64,10 @@ function setupBurgerMenu() {
open(burger, content, body, root);
}
});
content.addEventListener('click', () => {
if (content.classList.contains('open')) {
close(burger, content, body, root);
}
});
}
export { setupBurgerMenu };