Indiewebify part 3

layouts/partials/footer.html

@@ -1,3 +1,5 @@
+
+<hr>
 <p class="h-card vcard"> 
    <a style="text-decoration: none" href={{ .Site.BaseURL }} class="p-name u-url url author metatag" rel="me"> {{ .Site.Author.name }} </a> / 
    <a class="p-nickname u-email email metatag" rel="me" href="mailto:{{ .Site.Author.email }}"> {{ .Site.Author.nick }} </a> 
@@ -5,3 +7,4 @@
 </p>
 <br>
 <p>Copyright (c) {{ now.Format "2006"}} ch0ccyra1n</p>
+<script src="/webmention.min.js" async></script>

static/css/custom.css

@@ -28,4 +28,6 @@ blockquote {
     color: #888;
     cursor: pointer;
     transition: color 180ms ease-in-out;
-}
+}
+
+#webmentions img { max-height: 1.2em; margin-right: -1ex; }

static/webmention.min.js

@@ -0,0 +1,3 @@
+// @license magnet:?xt=urn:btih:d3d9a9a6595521f9666a5e94cc830dab83b65699&dn=expat.txt
+!function(){"use strict";window.i18next=window.i18next||{t:function(n){return n}};const n=window.i18next.t.bind(window.i18next);function t(n,t){return document.currentScript.getAttribute("data-"+n)||t}const e=t("page-url",window.location.href.replace(/#.*$/,"")),o=t("add-urls",void 0),r=t("id","webmentions"),s=t("wordcount"),i=t("max-webmentions",30),l=t("prevent-spoofing")?"wm-source":"url",a=t("sort-by","published"),c=t("sort-dir","up"),u=t("comments-are-reactions",!1),p={"in-reply-to":n("replied"),"like-of":n("liked"),"repost-of":n("reposted"),"bookmark-of":n("bookmarked"),"mention-of":n("mentioned"),rsvp:n("RSVPed"),"follow-of":n("followed")},f={"in-reply-to":"💬","like-of":"❤️","repost-of":"🔄","bookmark-of":"⭐️","mention-of":"💬",rsvp:"📅","follow-of":"🐜"},m={yes:"✅",no:"❌",interested:"💡",maybe:"💭"};function d(n){return n.replace(/[&<>"]/g,(n=>({"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;"}[n]||n)))}function w(t,e){const o=d(t.author?.name||t.url.split("/")[2]);let r=p[t["wm-property"]]||n("reacted");!e&&t.content&&t.content.text&&(r+=": "+x(t));let s="";s=t.author&&t.author.photo?`\n        <img\n          src="${d(t.author.photo)}"\n          loading="lazy"\n          decoding="async"\n          alt="${o}"\n        >\n      `:`\n        <img\n          class="missing"\n          src="data:image/webp;base64,UklGRkoCAABXRUJQVlA4TD4CAAAvP8APAIV0WduUOLr/m/iqY6SokDJSMD5xYX23SQizRsVdZmIj/f6goYUbiOj/BED7MOPReuBNT3vBesSzIex+SeqMFFkjebFmzH3S7POxDSJ1yaCbCmMnS2R46cRMPyQLw4GBK4esdK60pYwsZakecUCl5zsHv/5cPH08nx9/7i6rEEVCg2hR8VSd30PxMZpVoJZQO6Dixgg6X5oKFCmlVHIDmmMFShWumAXgCuyqVN8hHff/k+9fj8+ei7BVjpxBmZCUJv+6DhWGZwWvs+UoLHFCKsPYpfJtIcEXBTopEEsKwedZUv4ku1FZErKULLyQwFGgnmTs2vBD5qu44xwnG9uyjgrFOd+KRVlXyQfwQlauydaU6AVI7OjKXLUEqNtxJBmQegNDZgV7lxxqYMOMrDyC1NdAGbdiH9Ij0skjG+oTyfO0lmjdgvoH8iIgreuBMRYLSH+R3sAztXgL+XfS7E2bmfo6gnS0TrpnzHT7kL+skj7PgHuBwv/zpN8LDLQg7zfJZLBubMKnyeh6ZGyfDEfc2LYpnlUtG7JqsSHq1WoASbUS4KVaLwB8be5mfsGMDwBcm5VxbuxWxx3nkFanB6lYqsqSkOGkKicoDvXsneR7BkKU7DtaEuT7+pxBGVwx+9gVyqf2pVA9sC2CsmjZ1RJqEJHS4Tj/pCcS0JoyBYOsB91Xjh3OFfQPQhvCAYyeLJlaOoFp0XNNuD0BC8exr8uPx7D1JWkwFdZIXmD3MOPReuDNzHjBesSzIbQD"\n          alt="${o}$"\n        >\n      `;let i="";return t.rsvp&&m[t.rsvp]&&(i=`<sub>${m[t.rsvp]}</sub>`),`\n      <a\n        class="reaction"\n        rel="nofollow ugc"\n        title="${o} ${r}"\n        href="${t[l]}"\n      >\n        ${s}\n        ${f[t["wm-property"]]||"💥"}\n        ${i}\n      </a>\n    `}function h(n){return n.substr(n.indexOf("//"))}function g(n){const t=[],e={};return n.forEach((function(n){const o=h(n.url);e[o]||(t.push(n),e[o]=!0)})),t}function x(n){let t=d(n.content.text);if(s){let n=t.replace(/\s+/g," ").split(" ",s+1);n.length>s&&(n[s-1]+="&hellip;",n=n.slice(0,s),t=n.join(" "))}return t}window.addEventListener("load",(async function(){const t=document.getElementById(r);if(!t)return;const s=[h(e)];o&&o.split("|").forEach((function(n){s.push(h(n))}));let p=`https://webmention.io/api/mentions.jf2?per-page=${i}&sort-by=${a}&sort-dir=${c}`;s.forEach((function(n){p+=`&target[]=${encodeURIComponent("http:"+n)}&target[]=${encodeURIComponent("https:"+n)}`}));let f={};try{const n=await window.fetch(p);n.status>=200&&n.status<300?f=await n.json():(console.error("Could not parse response"),new Error(n.statusText))}catch(n){console.error("Request failed",n)}let m=[];const $=[];u&&(m=$);const y={"in-reply-to":m,"like-of":$,"repost-of":$,"bookmark-of":$,"follow-of":$,"mention-of":m,rsvp:m};f.children.forEach((function(n){const t=y[n["wm-property"]];t&&t.push(n)}));let b="";m.length>0&&m!==$&&(b=function(t){return`\n      <h2>${n("Responses")}</h2>\n      <ul class="comments">${t.map((t=>{const e=w(t,!0);let o=d(t.url.split("/")[2]);t.author&&t.author.name&&(o=d(t.author.name));const r=`<a class="source" rel="nofollow ugc" href="${t[l]}">${o}</a>`;let s="name",i=`(${n("mention")})`;return t.name?(s="name",i=d(t.name)):t.content&&t.content.text&&(s="text",i=x(t)),`<li>${e} ${r} <span class="${s}">${i}</span></li>`})).join("")}</ul>\n    `}(g(m)));let k="";var B;$.length>0&&(B=g($),k=`\n      <h2>${n("Reactions")}</h2>\n      <ul class="reacts">${B.map((n=>w(n))).join("")}</ul>\n    `),t.innerHTML=`${b}${k}`}))}();
+// @license-end

themes/ch0ccy-in-the-nineties/layouts/_default/single.html

@@ -14,4 +14,7 @@
         </div>  
   </article>  
 </section>  
+<hr>
+<h2>🤔 Thoughts...</h2>
+<div id="webmentions"></div>
 {{ end }}