Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 | 8x 8x 8x 8x 4x 4x 3x 3x 2x 2x 2x 2x 2x 1x 1x 1x 1x 1x 1x | function toggleDropdown(toggle: HTMLElement, open: boolean) {
const parentElement = toggle.parentNode;
const dropdown = document.getElementById(
toggle.getAttribute("aria-controls")!
);
dropdown?.setAttribute("aria-hidden", (!open).toString());
if (open) {
(parentElement as HTMLElement).classList.add("is-active", "is-selected");
} else {
(parentElement as HTMLElement).classList.remove("is-active", "is-selected");
}
}
function closeAllDropdowns(toggles: HTMLElement[]) {
toggles.forEach((toggle) => {
toggleDropdown(toggle, false);
});
}
function handleClickOutside(
toggles: HTMLElement[],
containerClass: string
): void {
document.addEventListener("click", (event: MouseEvent) => {
const target = event.target as HTMLElement;
Eif (target.closest) {
Eif (!target.closest(containerClass)) {
closeAllDropdowns(toggles);
}
}
});
}
function initNavDropdowns(containerClass: string): void {
const toggles = Array.from(
document.querySelectorAll(containerClass + " [aria-controls]")
) as HTMLElement[];
handleClickOutside(toggles, containerClass);
toggles.forEach((toggle) => {
toggle.addEventListener("click", (e: MouseEvent) => {
e.preventDefault();
const parentElement = (e.target as HTMLElement).parentNode as HTMLElement;
const isOpen = parentElement.classList.contains("is-active");
closeAllDropdowns(toggles);
toggleDropdown(toggle, !isOpen);
});
});
}
// Login
const navAccountContainer = document.querySelector(".js-nav-account");
Iif (navAccountContainer) {
fetch("/account.json")
.then((response) => response.json())
.then((data) => {
if (data.account) {
const notAuthenticatedMenu = navAccountContainer.querySelector(
".js-nav-account--notauthenticated"
) as HTMLElement;
const authenticatedMenu = navAccountContainer.querySelector(
".js-nav-account--authenticated"
) as HTMLElement;
const displayName = navAccountContainer.querySelector(
".js-account--name"
) as HTMLElement;
navAccountContainer.classList.add(
"p-navigation__item--dropdown-toggle"
);
notAuthenticatedMenu.classList.add("u-hide");
authenticatedMenu.classList.remove("u-hide");
displayName.innerHTML = data.account["display-name"];
initNavDropdowns(".js-nav-account");
}
});
}
initNavDropdowns(".p-navigation__item--dropdown-toggle");
export {
toggleDropdown,
closeAllDropdowns,
handleClickOutside,
initNavDropdowns,
};
|