From: Lady Date: Sun, 14 May 2023 21:03:39 +0000 (-0700) Subject: Support autogenerating an entry links footer X-Git-Url: https://git.ladys.computer/Blog/commitdiff_plain/f4534532841f6cf69571b0b108ea14750cf37ca8 Support autogenerating an entry links footer --- diff --git a/build.js b/build.js index a9d2baf..0260323 100755 --- 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" ); diff --git a/style.css b/style.css index 8013609..94ad8a1 100644 --- 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 }