Support titles on statuses

Titles can be used akin to fediverse C·W’s/“summaries” and provide
a better display for the status in listings.

diff --git a/README.markdown b/README.markdown
index 657527d5751aa95bd7aff9c37524c166ab820725..9cd2346d66f7af5d6fe73f7364227beba2a16ad6 100644 (file)
--- a/README.markdown
+++ b/README.markdown
@@ -209,6 +209,13 @@ The files which represent a status are as follows :—
     The contents of this file **must** give the author’s URL,
       optionally followed by a trailing newline.
 
     The contents of this file **must** give the author’s URL,
       optionally followed by a trailing newline.
 

+ +  **`2=TITLE`** (where `TITLE` might be anything):
+    This file is **optional** and indicates the title of the status.
+    The value of `TITLE` **should** be a file·system‐friendly version
+      of the title, but is ignored.
+    The contents of this file **must** give the title of the status,
+      optionally followed by a trailing newline.
+

  +  **`3=YYYY-MM-DD`** (where `YYYY-MM-DD` is a date):
     This file is **required** and indicates the date of the status.
     Only one date is currently supported.
  +  **`3=YYYY-MM-DD`** (where `YYYY-MM-DD` is a date):
     This file is **required** and indicates the date of the status.
     Only one date is currently supported.

diff --git a/index.html b/index.html
index b31518373d780680e979d27d779da495b8550818..44698ed810095a5144735f47d9b1b24d65656164 100644 (file)
--- a/index.html
+++ b/index.html
@@ -8,6 +8,8 @@ body{ Display: Grid; Box-Sizing: Border-Box; Margin: Auto; Padding-Inline: 1REM;
 #topics h2{ Margin-Block-End: 0; Grid-Column: 1 / Span 2; Text-Align: Center }
 #topics h2:Last-Child{ Display: None }
 div.STATUS{ Border: Thin Solid; Padding-Inline: 1REM; Border-Radius: .5REM }
 #topics h2{ Margin-Block-End: 0; Grid-Column: 1 / Span 2; Text-Align: Center }
 #topics h2:Last-Child{ Display: None }
 div.STATUS{ Border: Thin Solid; Padding-Inline: 1REM; Border-Radius: .5REM }

+summary{ Padding-Block: 1REM; Font-Weight: Bold }
+details[open]>summary{ Border-Block-End: Thin Solid }

 footer{ Border-Block-Start: Thin Solid; Padding-Block: 1REM; Font-Size: Smaller; Text-Align: End }
 footer p{ Margin-Block: 0 .5REM }
 footer time:Not([datetime]),
 footer{ Border-Block-Start: Thin Solid; Padding-Block: 1REM; Font-Size: Smaller; Text-Align: End }
 footer p{ Margin-Block: 0 .5REM }
 footer time:Not([datetime]),


@@ -32,7 +34,7 @@ const renderLatest = (path, container) => fetch(`${path}.jsonld`)
   const { documentElement: article } = parser.parseFromString(src, "application/xhtml+xml")
   const footer = document.createElement("footer")
   const authorshipP = footer.appendChild(document.createElement("p"))
   const { documentElement: article } = parser.parseFromString(src, "application/xhtml+xml")
   const footer = document.createElement("footer")
   const authorshipP = footer.appendChild(document.createElement("p"))

-  const { creator } = status
+  const { creator, title } = status

   if (creator) {
     const authorLink = authorshipP.appendChild(document.createElement("a"))
     authorLink.href = creator["@id"]
   if (creator) {
     const authorLink = authorshipP.appendChild(document.createElement("a"))
     authorLink.href = creator["@id"]


@@ -47,7 +49,15 @@ const renderLatest = (path, container) => fetch(`${path}.jsonld`)
   const upLink = nav.appendChild(document.createElement("a"))
   upLink.href = meta["@id"]
   upLink.textContent = `See more ${ status.subject ? `“${status.subject}” posts` : "statuses" }.`
   const upLink = nav.appendChild(document.createElement("a"))
   upLink.href = meta["@id"]
   upLink.textContent = `See more ${ status.subject ? `“${status.subject}” posts` : "statuses" }.`

-  container.replaceChildren(document.importNode(article, true), footer) })
+  if (title) {
+    const wrapper = document.createElement("article")
+    const details = wrapper.appendChild(document.createElement("details"))
+    details.setAttribute("open", "")
+    const summary = details.appendChild(document.createElement("summary"))
+    summary.textContent = title
+    details.append(...document.importNode(article, true).childNodes)
+    container.replaceChildren(wrapper, footer) }
+  else container.replaceChildren(document.importNode(article, true), footer) })

 fetch("statuses.jsonld")
 .then($ => $.json())
 .then(meta => renderLatest(meta.current, document.getElementById("status")))
 fetch("statuses.jsonld")
 .then($ => $.json())
 .then(meta => renderLatest(meta.current, document.getElementById("status")))

diff --git a/post-receive b/post-receive
index bc16a55fab558b444134ae5a4197b7a69652e801..e1da847d92113611b02bc89ef9f700f7a667982d 100755 (executable)
--- a/post-receive
+++ b/post-receive
@@ -70,6 +70,11 @@ if stdin.read().split()[-1] == f"refs/heads/{LIVE_BRANCH}":
                        status["author"] = { "name": author_path.name[2:] }
                        with author_path.open("r", encoding="utf-8") as text:
                                status["author"]["@id"] = text.read().strip()
                        status["author"] = { "name": author_path.name[2:] }
                        with author_path.open("r", encoding="utf-8") as text:
                                status["author"]["@id"] = text.read().strip()

+               title_path = next(path.parent.glob("2=*"))
+               if title_path:
+                       with title_path.open("r", encoding="utf-8") as text:
+                               title = text.read().strip()
+                               status["title"] = title

                date_path = next(path.parent.glob("3=*"))
                datetime = ""
                if date_path:
                date_path = next(path.parent.glob("3=*"))
                datetime = ""
                if date_path:

diff --git a/status.html b/status.html
index a56276e4b3708ac983a37b6aef313b7646b14708..e1cbaeecd7061da7f562b217736ef9a8849d88a0 100644 (file)
--- a/status.html
+++ b/status.html
@@ -4,6 +4,8 @@
 <STYLE>
 body{ Display: Grid; Box-Sizing: Border-Box; Margin: Auto; Padding-Inline: 1REM; Min-Block-Size: 100VH; Inline-Size: 100%; Max-Inline-Size: 45REM; Align-Content: Center; Justify-Content: Stretch; Font-Family: Sans-Serif }
 article{ Font-Size: Larger }
 <STYLE>
 body{ Display: Grid; Box-Sizing: Border-Box; Margin: Auto; Padding-Inline: 1REM; Min-Block-Size: 100VH; Inline-Size: 100%; Max-Inline-Size: 45REM; Align-Content: Center; Justify-Content: Stretch; Font-Family: Sans-Serif }
 article{ Font-Size: Larger }

+summary{ Padding-Block: 1REM; Font-Weight: Bold }
+details[open]>summary{ Border-Block-End: Thin Solid }

 footer{ Border-Block-Start: Thin Solid; Padding-Block: 1REM; Text-Align: End }
 footer p{ Margin-Block: 0 .5REM }
 footer time:Not([datetime]),
 footer{ Border-Block-Start: Thin Solid; Padding-Block: 1REM; Text-Align: End }
 footer p{ Margin-Block: 0 .5REM }
 footer time:Not([datetime]),


@@ -20,7 +22,7 @@ fetch(`${new URL(".", location).toString().slice(0, -1)}.jsonld`)
   const status = items[n]
   const src = status.content
   const { documentElement: article } = parser.parseFromString(src, "application/xhtml+xml")
   const status = items[n]
   const src = status.content
   const { documentElement: article } = parser.parseFromString(src, "application/xhtml+xml")

-  const { creator, created } = status
+  const { creator, created, title } = status

   document.title = creator
   ? `Status by ${creator.name} @ ${status.created}`
   : `Status @ ${created}`
   document.title = creator
   ? `Status by ${creator.name} @ ${status.created}`
   : `Status @ ${created}`


@@ -90,5 +92,13 @@ fetch(`${new URL(".", location).toString().slice(0, -1)}.jsonld`)
     ? "".concat(...nextChars.slice(0, 27), "…")
     : nextText }
   nav.appendChild(document.createTextNode("."))
     ? "".concat(...nextChars.slice(0, 27), "…")
     : nextText }
   nav.appendChild(document.createTextNode("."))

-  document.body.replaceChildren(document.importNode(article, true), footer) })
+  if (title) {
+    const wrapper = document.createElement("article")
+    const details = wrapper.appendChild(document.createElement("details"))
+    details.setAttribute("open", "")
+    const summary = details.appendChild(document.createElement("summary"))
+    summary.textContent = title
+    details.append(...document.importNode(article, true).childNodes)
+    document.body.replaceChildren(wrapper, footer) }
+  else document.body.replaceChildren(document.importNode(article, true), footer) })

 </SCRIPT>
 </SCRIPT>

diff --git a/topic.html b/topic.html
index ea9b38438907eada202534a47190277593c09317..3a08a135ba5a10df19d03074871fc947c5f3b3b0 100644 (file)
--- a/topic.html
+++ b/topic.html
@@ -44,26 +44,31 @@ fetch(`${location}.jsonld`)
     .appendChild(document.createElement("dd"))
     .appendChild(document.createElement("a"))
     a.href = status["@id"]
     .appendChild(document.createElement("dd"))
     .appendChild(document.createElement("a"))
     a.href = status["@id"]

-    const summaryText = (() => {
-      try {
-        const d = parser.parseFromString(status.content, "application/xhtml+xml")
-        const div = document.createElement("div")
-        div.appendChild(document.importNode(d.documentElement, true))
-        Object.assign(div.style,
-          { position: "absolute"
-          , top: "-2px"
-          , height: "1px"
-          , width: "1px"
-          , overflow: "hidden" })
-        document.body.appendChild(div)
-        const text = div.innerText
-        document.body.removeChild(div)
-        return text }
-      catch { } })() || "";
-    const chars = Array.from(summaryText.trim().replaceAll(/\s+/gu, " "))
-    a.textContent = chars.length > 28
-    ? "".concat(...chars.slice(0, 27), "…")
-    : summaryText || status.identifier }
+    const { title } = status
+    if (title) a.textContent = title.length > 28
+    ? "".concat(...title.slice(0, 27), "…")
+    : title
+    else {
+      const summaryText = (() => {
+        try {
+          const d = parser.parseFromString(status.content, "application/xhtml+xml")
+          const div = document.createElement("div")
+          div.appendChild(document.importNode(d.documentElement, true))
+          Object.assign(div.style,
+            { position: "absolute"
+            , top: "-2px"
+            , height: "1px"
+            , width: "1px"
+            , overflow: "hidden" })
+          document.body.appendChild(div)
+          const text = div.innerText
+          document.body.removeChild(div)
+          return text }
+        catch { } })() || "";
+      const chars = Array.from(summaryText.trim().replaceAll(/\s+/gu, " "))
+      a.textContent = chars.length > 28
+      ? "".concat(...chars.slice(0, 27), "…")
+      : summaryText || status.identifier } }

   if (next) {
     const a = nav
     .appendChild(document.createElement("p"))
   if (next) {
     const a = nav
     .appendChild(document.createElement("p"))