2020-06-28 15:44:59 +00:00
|
|
|
import { nextAnimationFrame } from "../../utils";
|
|
|
|
|
2020-07-02 10:26:08 +00:00
|
|
|
function expandPage(root: HTMLElement) {
|
|
|
|
// Show all sections
|
|
|
|
root.querySelectorAll<HTMLElement>("div.hidden").forEach((div) => {
|
|
|
|
div.style.display = "block";
|
|
|
|
div.style.opacity = "1";
|
|
|
|
});
|
|
|
|
|
|
|
|
// Hide buttons
|
|
|
|
root.querySelector<HTMLElement>(".action_buttons").style.display = "none";
|
|
|
|
|
|
|
|
// Remove vertical centering
|
|
|
|
root.classList.remove("center");
|
|
|
|
}
|
|
|
|
|
2020-06-28 15:44:59 +00:00
|
|
|
export function welcomeScript(root: HTMLElement): void {
|
2020-07-02 10:46:41 +00:00
|
|
|
const buttonContainer = root.querySelector<HTMLElement>(".action_buttons");
|
|
|
|
root.querySelectorAll<HTMLDivElement>("div[data-name]").forEach((sec) => {
|
|
|
|
const { name } = sec.dataset;
|
|
|
|
const button = document.createElement("button");
|
|
|
|
button.className = "pretty-button";
|
|
|
|
button.appendChild(document.createTextNode(name));
|
|
|
|
button.addEventListener("click", async () => {
|
|
|
|
expandPage(root);
|
|
|
|
await nextAnimationFrame();
|
|
|
|
sec.scrollIntoView({
|
|
|
|
block: "start",
|
|
|
|
inline: "nearest",
|
|
|
|
behavior: "smooth",
|
|
|
|
});
|
2020-06-28 15:44:59 +00:00
|
|
|
});
|
2020-07-02 10:46:41 +00:00
|
|
|
buttonContainer.appendChild(button);
|
2020-06-28 15:44:59 +00:00
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
export default { welcomeScript };
|