Lady’s Gitweb - x_status_git/blob - topic.html

   1 <!dOcTyPe html>
   2 <META Charset=utf-8>
   3 <TITLE>Topic Feed</TITLE>
   4 <STYLE>
   5 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 }
   6 </STYLE>
   7 <H1>Topic Feed</H1>
   8 <NAV><DL></DL></NAV>
   9 <SCRIPT Type=module>
  10 const nav = document.body.querySelector("nav")
  11 const dl = nav.querySelector("dl")
  12 const parser = new DOMParser
  13 fetch(`${location}.jsonld`)
  14 .then($ => $.json())
  15 .then(meta => {
  16   const topic = meta.subject || meta["@id"].split("/").pop()
  17   document.title = topic
  18   document.body.querySelector("h1").textContent = "subject" in meta
  19   ? `#${topic}`
  20   : `@${topic}`
  21   if (meta.first != location) {
  22     const a = nav
  23     .insertBefore(document.createElement("p"), dl)
  24     .appendChild(document.createElement("a"))
  25     a.href = meta.first
  26     a.textContent = "First Page" }
  27   if (meta.prev && meta.prev != meta.first) {
  28     const a = nav
  29     .insertBefore(document.createElement("p"), dl)
  30     .appendChild(document.createElement("a"))
  31     a.href = meta.prev
  32     a.textContent = "Previous Page" }
  33   let prevDate = undefined
  34   for (const status of meta.items) {
  35     if (status.created != prevDate) dl.appendChild(document.createElement("dt")).textContent = status.created
  36     const a = dl
  37     .appendChild(document.createElement("dd"))
  38     .appendChild(document.createElement("a"))
  39     a.href = status["@id"]
  40     const summaryText = (() => {
  41       try {
  42         const d = parser.parseFromString(status.content, "application/xhtml+xml")
  43         const div = document.createElement("div")
  44         div.appendChild(document.importNode(d.documentElement, true))
  45         Object.assign(div.style,
  46           { position: "absolute"
  47           , top: "-2px"
  48           , height: "1px"
  49           , width: "1px"
  50           , overflow: "hidden" })
  51         document.body.appendChild(div)
  52         const text = div.innerText
  53         document.body.removeChild(div)
  54         return text }
  55       catch { } })() || "";
  56     const chars = Array.from(summaryText.trim().replaceAll(/\s+/gu, " "))
  57     a.textContent = chars.length > 28
  58     ? "".concat(...chars.slice(0, 27), "…")
  59     : summaryText || status.identifier }
  60   if (meta.next && meta.next != meta.current) {
  61     const a = nav
  62     .appendChild(document.createElement("p"))
  63     .appendChild(document.createElement("a"))
  64     a.href = meta.next
  65     a.textContent = "Next Page" }
  66   if (meta.current != location) {
  67     const a = nav
  68     .appendChild(document.createElement("p"))
  69     .appendChild(document.createElement("a"))
  70     a.href = meta.current
  71     a.textContent = "Latest Page" } })
  72 </SCRIPT>