| | |
|---|
| | | import micromorph from "micromorph" |
|---|
| | | import { FullSlug, RelativeURL, getFullSlug, normalizeRelativeURLs } from "../../util/path" |
|---|
| | | import { fetchCanonical } from "./util" |
|---|
| | | |
|---|
| | | // adapted from `micromorph` |
|---|
| | | // https://github.com/natemoo-re/micromorph |
|---|
| | |
|---|
| | | const cleanupFns: Set<(...args: any[]) => void> = new Set() |
|---|
| | | window.addCleanup = (fn) => cleanupFns.add(fn) |
|---|
| | | |
|---|
| | | function startLoading() { |
|---|
| | | const loadingBar = document.createElement("div") |
|---|
| | | loadingBar.className = "navigation-progress" |
|---|
| | | loadingBar.style.width = "0" |
|---|
| | | if (!document.body.contains(loadingBar)) { |
|---|
| | | document.body.appendChild(loadingBar) |
|---|
| | | } |
|---|
| | | |
|---|
| | | setTimeout(() => { |
|---|
| | | loadingBar.style.width = "80%" |
|---|
| | | }, 100) |
|---|
| | | } |
|---|
| | | |
|---|
| | | let p: DOMParser |
|---|
| | | async function navigate(url: URL, isBack: boolean = false) { |
|---|
| | | startLoading() |
|---|
| | | p = p || new DOMParser() |
|---|
| | | const contents = await fetch(`${url}`) |
|---|
| | | const contents = await fetchCanonical(url) |
|---|
| | | .then((res) => { |
|---|
| | | const contentType = res.headers.get("content-type") |
|---|
| | | if (contentType?.startsWith("text/html")) { |
|---|
| | |
|---|
| | | |
|---|
| | | if (!contents) return |
|---|
| | | |
|---|
| | | // notify about to nav |
|---|
| | | const event: CustomEventMap["prenav"] = new CustomEvent("prenav", { detail: {} }) |
|---|
| | | document.dispatchEvent(event) |
|---|
| | | |
|---|
| | | // cleanup old |
|---|
| | | cleanupFns.forEach((fn) => fn()) |
|---|
| | | cleanupFns.clear() |
|---|
| | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | // now, patch head |
|---|
| | | // now, patch head, re-executing scripts |
|---|
| | | const elementsToRemove = document.head.querySelectorAll(":not([spa-preserve])") |
|---|
| | | elementsToRemove.forEach((el) => el.remove()) |
|---|
| | | const elementsToAdd = html.head.querySelectorAll(":not([spa-preserve])") |
|---|
| | |
|---|
| | | if (!isBack) { |
|---|
| | | history.pushState({}, "", url) |
|---|
| | | } |
|---|
| | | |
|---|
| | | notifyNav(getFullSlug(window)) |
|---|
| | | delete announcer.dataset.persist |
|---|
| | | } |
|---|
