]> Lady’s Gitweb - Blog/commitdiff
Support autogenerating an entry links footer
authorLady <redacted>
Sun, 14 May 2023 21:03:39 +0000 (14:03 -0700)
committerLady <redacted>
Sun, 14 May 2023 21:05:46 +0000 (14:05 -0700)
build.js
style.css

index a9d2bafc0bb5f624d5654dd3a7f950586e1e5657..0260323ec3afd2aa253c5c0a15d500b75594340a 100755 (executable)
--- a/build.js
+++ b/build.js
@@ -8,24 +8,29 @@
 
 import hljs from "npm:highlight.js@11.8.0";
 
-const processContent = (content) => {
+const contentLinks = new WeakMap();
+
+const processContent = function (content) {
   if (content == null || Object(content) instanceof String) {
+    // The provided content is nullish or a string.
     /* do nothing */
   } else if (Array.isArray(content)) {
     // The provided content is an array.
-    content.forEach(processContent);
+    content.forEach(processContent.bind(this));
   } else {
+    // The provided content is a NodeList.
     for (const child of Array.from(content)) {
-      applyHighlighting(child);
+      applyTransforms.call(this, child);
     }
   }
 };
 
-const applyHighlighting = (node) => {
+const applyTransforms = function (node) {
   if (
     node.localName == "pre" && node.childNodes.length == 1 &&
     node.firstChild.localName == "code"
   ) {
+    // This is a code block and should be highlighted.
     const code = node.firstChild;
     const language = /language-(.*)/u.exec(code.getAttribute("class"))
       ?.[1];
@@ -47,20 +52,31 @@ const applyHighlighting = (node) => {
         for (const node of Array.from(nodes)) {
           code.appendChild(code.ownerDocument.importNode(node, true));
         }
+        return; // don’t continue processing this node
       } catch (e) {
         console.warn(e);
       }
     }
-  } else if (node.nodeType == 1) {
-    Array.from(node.childNodes).forEach(applyHighlighting);
+  } else if (node.localName == "a") {
+    const href = node.getAttribute("href");
+    const title = node.getAttribute("title");
+    if (title && href) {
+      contentLinks.get(this)[title] = href;
+    }
+  }
+  if (node.nodeType == 1) {
+    // This is an element; process its children.
+    Array.from(node.childNodes).forEach(applyTransforms.bind(this));
   } else if (node.nodeType == 3) {
+    // This is a text node; apply replacements.
     node.textContent = node.textContent.replaceAll(":—", ":\u2060—");
   }
 };
 
 globalThis.bjørnTransformMetadata = (metadata, _type) => {
-  processContent(metadata.content);
-  processContent(metadata.summary);
+  contentLinks.set(metadata, {});
+  processContent.call(metadata, metadata.content);
+  processContent.call(metadata, metadata.summary);
 };
 
 globalThis.bjørnTransformFeedHTML = (document, _metadata) => {
@@ -76,6 +92,23 @@ globalThis.bjørnTransformFeedHTML = (document, _metadata) => {
   h1.appendChild(link);
 };
 
+globalThis.bjørnTransformEntryHTML = (document, metadata) => {
+  const LMN = Lemon.bind({ document });
+  const links = Object.entries(contentLinks.get(metadata));
+  if (links.length) {
+    document.getElementById("entry.content").appendChild(
+      LMN.footer`${LMN.nav`${[
+        LMN.h2`This post contains links.`,
+        LMN.ul`${
+          links.map(([name, href]) =>
+            LMN.li`${LMN.a.href(href)`${name}`}`
+          )
+        }`,
+      ]}`}`,
+    );
+  }
+};
+
 await import(
   "https://git.ladys.computer/Beorn/blob_plain/0.2.3:/build.js"
 );
index 80136097d9a78ad8ab6b21fa69c8253f0aa4bb2b..94ad8a1ef86d7727a8d3737edd2986331a232212 100644 (file)
--- a/style.css
+++ b/style.css
@@ -28,6 +28,8 @@ nav li[resource] time[property="http://purl.org/dc/elements/1.1/date"]::after{ C
 #entry\.content::before{ Position: Absolute; Inset-Block: .5CH; Inset-Inline-Start: -4REM; Border-Block: 1PX #97596B Dashed; Border-Inline-Start: 1PX #97596B Dashed; Border-Start-Start-Radius: 1CH; Border-End-Start-Radius: 1CH; Inline-Size: 1CH; Box-Shadow: Inset 0 0 0 1PX #F3DEE3, Inset -2PX 0 0 0 #F3DEE3, Inset 2PX 0 0 0 #B38A96; Content: "" }
 #entry\.content p,#entry\.content pre{ Counter-Increment: P }
 #entry\.content p::before,#entry\.content pre::before{ Position: Absolute; Inset-Inline-Start: -4REM; Inset-Inline-End: 100%; Margin-Block: -1PX; Margin-Inline: Auto; Border: 1PX Solid; Border-Radius: 50%; Padding-Inline: 1CH; Inline-Size: Max-Content; Color: #1F7D63; Text-Align: Center; Content: "¶" Counter(P) }
+#entry\.content footer{ Margin-Block-Start: Calc(.5REM + .75EM); Margin-Inline: -1CH; Border-Block-Start: Thin #97596B Solid; Padding-Block: .25EM; Padding-Inline: 3CH; Font-Size: Smaller }
+#entry\.content footer h2{ Margin-Block: .5EM; Font-Size: 1.25EM; }
 nav li[resource] div[property="http://purl.org/dc/elements/1.1/abstract"]{ Padding-Inline-Start: 4CH }
 nav li[resource] div[property="http://purl.org/dc/elements/1.1/abstract"]::before{ Display: Block; Margin-Block: .5EM; Margin-Inline: -2CH 0; Font-Style: Italic; Font-Weight: Bold; Letter-Spacing: Calc(1EM / 18); Text-Decoration: Underline; Content: "Summary:" }
 blockquote{ Border-Block-Color: #8396A9 #373F47; Border-Inline-Color: #8396A9 #373F47; Border-Style: Solid; Padding: .5REM 1CH; Color: #001B5F; Background: #E3E3E3; Box-Shadow: -2PX -2PX #D8E3FF, 2PX 2PX #6B95FF; Font-Style: Italic }
This page took 0.02487 seconds and 4 git commands to generate.