176 lines
5.9 KiB
HTML
176 lines
5.9 KiB
HTML
<head>
|
|
<title>{{site.title}} • {{page.title}}</title>
|
|
<meta
|
|
name="description"
|
|
content="Learn how to use the best and latest web technologies to boost your productivity."
|
|
/>
|
|
<meta charset="utf-8" />
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
|
|
<!-- Open Graph data -->
|
|
<meta property="og:title" content="{{ page.title }}" />
|
|
<meta property="og:url" content="{{ page.url | absolute_url }}" />
|
|
<meta property="og:description" content="{{ page.description }}" />
|
|
|
|
{% if page.type == "post" %}
|
|
<meta property="og:type" content="article" />
|
|
<meta property="article:author" content="{{ site.author }}" />
|
|
{% else %}
|
|
<meta property="og:type" content="website" />
|
|
{% endif %} {% if page.layout == 'home' %}
|
|
<meta
|
|
property="og:image"
|
|
content="{{ '/assets/images/' | absolute_url }}ayo.png"
|
|
/>
|
|
{% elsif page.image %}
|
|
<meta
|
|
property="og:image"
|
|
content="{{ '/assets/images/' | absolute_url }}{{ page.image }}.jpg"
|
|
/>
|
|
{% else %}
|
|
<meta
|
|
property="og:image"
|
|
content="{{ '/assets/images/' | absolute_url }}ayo.png"
|
|
/>
|
|
{% endif %}
|
|
|
|
<meta property="og:site_name" content="{{site.title}}" />
|
|
|
|
<!--meta property="article:published_time" content="2013-09-17T05:59:00+01:00" />
|
|
<meta property="article:modified_time" content="2013-09-16T19:08:47+01:00" />
|
|
<meta property="article:section" content="Article Section" />
|
|
<meta property="article:tag" content="Article Tag" /-->
|
|
|
|
<link rel="me" href="https://ayco.io" />
|
|
<link rel="me" href="https://ayo.ayco.io" />
|
|
<link rel="me" href="https://social.ayco.io/@ayo" />
|
|
<link rel="me" href="https://mastodon.ph/@ayo" />
|
|
<link rel="me" href="https://shrediverse.net/@ayo" />
|
|
<link rel="me" href="https://stop.voring.me/@ayo" />
|
|
<link rel="me" href="https://metapixl.com/@ayo" />
|
|
|
|
<link rel="webmention" href="https://webmention.io/ayos.blog/webmention" />
|
|
|
|
<link rel="stylesheet" href="{{ '/assets/main.css' | relative_url }}" />
|
|
<link
|
|
rel="alternate"
|
|
type="application/rss+xml"
|
|
title="{{ site.title | escape }}"
|
|
href="{{ '/feed.xml' | relative_url }}"
|
|
/>
|
|
<link
|
|
rel="stylesheet"
|
|
type="text/css"
|
|
href="//fonts.googleapis.com/css?family=Lato"
|
|
/>
|
|
<link rel="shortcut icon" type="image/png" href="/favicon.ico" />
|
|
|
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
<link
|
|
href="https://fonts.googleapis.com/css2?family=Source+Serif+Pro:wght@900&display=swap"
|
|
rel="stylesheet"
|
|
/>
|
|
|
|
<script>
|
|
const ignore = ["/", "/categories/"];
|
|
const url = new URL(
|
|
document.URL.replace("http://localhost:4000", "https://ayos.blog")
|
|
);
|
|
if (!ignore.includes(url.pathname)) {
|
|
console.log("url: ", url);
|
|
const mentions = getMentions(url.toString())
|
|
.then((mentions) => {
|
|
const likes = mentions.filter((m) => m["wm-property"] === "like-of");
|
|
console.log("likes", likes);
|
|
if (likes.length)
|
|
document.getElementById(
|
|
"page-likes"
|
|
).innerHTML = `${likes.length} likes`;
|
|
|
|
const replies = mentions.filter(
|
|
(m) => m["wm-property"] === "in-reply-to"
|
|
);
|
|
console.log("replies", replies);
|
|
if (replies.length) {
|
|
// render to post header meta
|
|
document.getElementById(
|
|
"page-replies"
|
|
).innerHTML = `${replies.length} replies`;
|
|
|
|
// render to replies section
|
|
const repliesTable = document.createElement("table");
|
|
replies.forEach((reply) => {
|
|
const row = document.createElement("tr");
|
|
const cell = document.createElement("td");
|
|
row.append(cell);
|
|
const author = document.createElement("p");
|
|
author.className = "author-wrapper";
|
|
author.innerHTML = `<img class="reply-photo" src="${
|
|
reply.author.photo
|
|
}" /> <span class="reply-name">${
|
|
reply.author.name
|
|
}</span><a href="${reply.url}" class="reply-date">${new Date(
|
|
reply.published
|
|
).toLocaleDateString()}</a><div class="clear-both"></div>`;
|
|
const replyBlock = document.createElement("quote");
|
|
replyBlock.innerHTML = reply.content.html;
|
|
replyBlock.insertBefore(author, replyBlock.firstChild);
|
|
cell.appendChild(replyBlock);
|
|
repliesTable.append(row);
|
|
});
|
|
document.querySelector("section#replies").append(repliesTable);
|
|
}
|
|
|
|
const reposts = mentions.filter(
|
|
(m) => m["wm-property"] === "repost-of"
|
|
);
|
|
console.log("reposts", reposts);
|
|
if (reposts.length)
|
|
document.getElementById(
|
|
"page-reposts"
|
|
).innerHTML = `${reposts.length} reposts`;
|
|
|
|
const others = mentions.filter(
|
|
(m) =>
|
|
m["wm-property"] !== "like-of" &&
|
|
m["wm-property"] !== "in-reply-to" &&
|
|
m["wm-property"] !== "repost-of"
|
|
);
|
|
console.log("others", others);
|
|
|
|
// console.log("mentions", mentions);
|
|
})
|
|
.catch((err) => console.log("err", err));
|
|
} else {
|
|
console.log("ignoring url: ", url);
|
|
}
|
|
|
|
async function getMentions(url) {
|
|
let mentions = [];
|
|
let page = 0;
|
|
let perPage = 100;
|
|
|
|
while (true) {
|
|
const results = await fetch(
|
|
`https://webmention.io/api/mentions.jf2?target=${url}&per-page=${perPage}&page=${page}`
|
|
).then((r) => r.json());
|
|
|
|
mentions = mentions.concat(results.children);
|
|
|
|
if (results.children.length < perPage) {
|
|
break;
|
|
}
|
|
|
|
page++;
|
|
}
|
|
|
|
return mentions.sort((a, b) =>
|
|
(a.published || a["wm-received"]) < (b.published || b["wm-received"])
|
|
? -1
|
|
: 1
|
|
);
|
|
}
|
|
</script>
|
|
</head>
|