fix: merge conf

assets/js/graph.js

@@ -1,5 +1,4 @@
 async function drawGraph(
-  url,
   baseUrl,
   pathColors,
   depth,
@@ -8,9 +7,12 @@ async function drawGraph(
   enableZoom
 ) {
   const container = document.getElementById('graph-container')
-
   const { index, links, content } = await fetchData
-  const curPage = url.replace(baseUrl, '')
+
+  // Use .pathname to remove hashes / searchParams / text fragments
+  const cleanUrl = window.location.origin + window.location.pathname
+
+  const curPage = cleanUrl.replace(/\/$/g, "").replace(baseUrl, "")
 
   const parseIdsFromLinks = (links) => [
     ...new Set(links.flatMap((link) => [link.source, link.target])),

assets/js/popover.js

@@ -1,5 +1,5 @@
 function htmlToElement(html) {
-  const template = document.createElement('template')
+  const template = document.createElement("template")
   html = html.trim()
   template.innerHTML = html
   return template.content.firstChild
@@ -7,19 +7,33 @@ function htmlToElement(html) {
 
 function initPopover(baseURL, useContextualBacklinks) {
   const basePath = baseURL.replace(window.location.origin, "")
-  document.addEventListener("DOMContentLoaded", () => {
-    fetchData.then(({ content }) => {
-      const links = [...document.getElementsByClassName("internal-link")]
-      links
-        .filter(li => li.dataset.src || (li.dataset.idx && useContextualBacklinks))
-        .forEach(li => {
-          if (li.dataset.ctx) {
-            console.log(li.dataset.ctx)
-            const linkDest = content[li.dataset.src]
-            const popoverElement = `<div class="popover">
+  fetchData.then(({ content }) => {
+    const links = [...document.getElementsByClassName("internal-link")]
+    links
+      .filter(li => li.dataset.src || (li.dataset.idx && useContextualBacklinks))
+      .forEach(li => {
+        if (li.dataset.ctx) {
+          const linkDest = content[li.dataset.src]
+          const popoverElement = `<div class="popover">
     <h3>${linkDest.title}</h3>
     <p>${highlight(removeMarkdown(linkDest.content), li.dataset.ctx)}...</p>
     <p class="meta">${new Date(linkDest.lastmodified).toLocaleDateString()}</p>
+</div>`
+          const el = htmlToElement(popoverElement)
+          li.appendChild(el)
+          li.addEventListener("mouseover", () => {
+            el.classList.add("visible")
+          })
+          li.addEventListener("mouseout", () => {
+            el.classList.remove("visible")
+          })
+        } else {
+          const linkDest = content[li.dataset.src.replace(/\/$/g, "").replace(basePath, "")]
+          if (linkDest) {
+            const popoverElement = `<div class="popover">
+    <h3>${linkDest.title}</h3>
+    <p>${removeMarkdown(linkDest.content).split(" ", 20).join(" ")}...</p>
+    <p class="meta">${new Date(linkDest.lastmodified).toLocaleDateString()}</p>
 </div>`
             const el = htmlToElement(popoverElement)
             li.appendChild(el)
@@ -29,25 +43,8 @@ function initPopover(baseURL, useContextualBacklinks) {
             li.addEventListener("mouseout", () => {
               el.classList.remove("visible")
             })
-          } else {
-            const linkDest = content[li.dataset.src.replace(/\/$/g, "").replace(basePath, "")]
-            if (linkDest) {
-              const popoverElement = `<div class="popover">
-    <h3>${linkDest.title}</h3>
-    <p>${removeMarkdown(linkDest.content).split(" ", 20).join(" ")}...</p>
-    <p class="meta">${new Date(linkDest.lastmodified).toLocaleDateString()}</p>
-</div>`
-              const el = htmlToElement(popoverElement)
-              li.appendChild(el)
-              li.addEventListener("mouseover", () => {
-                el.classList.add("visible")
-              })
-              li.addEventListener("mouseout", () => {
-                el.classList.remove("visible")
-              })
-            }
           }
-        })
-    })
+        }
+      })
   })
 }

assets/js/router.js

@@ -0,0 +1,12 @@
+import { router, navigate } from "https://unpkg.com/million@1.8.9-0/dist/router.mjs"
+
+export const attachSPARouting = (draw) => {
+  // SPA navigation for access later
+  window.navigate = navigate
+  // We only mutate document.title and content within .singlePage element
+  router(".singlePage")
+  // We need on initial load, then subsequent redirs
+  // requestAnimationFrame() delays graph draw until SPA routing is finished
+  window.addEventListener("million:navigate", () => requestAnimationFrame(draw))
+  window.addEventListener("DOMContentLoaded", () => requestAnimationFrame(draw))
+}

assets/js/search.js

@@ -154,7 +154,7 @@ const highlight = (content, term) => {
     // SPA navigation
     window.navigate(
       new URL(
-        `${BASE_URL}${id}#:~:text=${encodeURIComponent(term)}/`
+        `${BASE_URL.replace(/\/$/g, "")}${id}#:~:text=${encodeURIComponent(term)}/`
       ),
       '.singlePage'
     )