X-Git-Url: https://git.ladys.computer/x_status_git/blobdiff_plain/2659b92ca7ae70783227a5de0c000e34b984e2c2..a95edc18a4daddb7791131ebb2dd26d0bed4d278:/index.html diff --git a/index.html b/index.html index b315183..3db7446 100644 --- 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 } +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]), @@ -23,16 +25,14 @@ footer small{ Font-Size: Inherit; Font-Style: Italic } const parser = new DOMParser document.title = location.hostname document.documentElement.querySelector("body>h1").textContent = location.hostname -const renderLatest = (path, container) => fetch(`${path}.jsonld`) -.then($ => $.json()) -.then(meta => { - const { items } = meta +const renderLatest = (meta, container) => { + const { feed, items } = meta const status = items.pop() const src = status.content 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"] @@ -47,10 +47,20 @@ 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" }.` - 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"))) +.then(meta => fetch(`${meta.current}.jsonld`)) +.then($ => $.json()) +.then(meta => renderLatest(meta, document.getElementById("status"))) fetch("topics.jsonld") .then($ => $.json()) .then(meta => { @@ -63,6 +73,5 @@ fetch("topics.jsonld") section.appendChild(document.createElement("h3")).textContent = topic.subject const div = section.appendChild(document.createElement("div")) div.className = "STATUS" - renderLatest(new URL(topic["@id"]).pathname, div) - }) } }) + renderLatest(topic, div) }) } })