diff --git a/source/css/xry.styl b/source/css/xry.styl
index 20117fc..d501bb1 100644
--- a/source/css/xry.styl
+++ b/source/css/xry.styl
@@ -370,4 +370,48 @@ span#inline-toc {
margin-left: -40px;
border-bottom: none;
font-size: 1.375em;
+}
+
+.wm-avatar {
+ border-radius: 50%;
+ margin: 0;
+ border: 3px solid rgba(0,116,222,.5);
+}
+
+.webmention-avatars .avatar-wrapper {
+ margin-right: -8px;
+}
+
+a.avatar-wrapper {
+ display: inline-block;
+ width: 50px;
+ height: 50px;
+ position: relative;
+}
+
+.replies {
+ margin: 0;
+ padding: 0;
+}
+
+.reply {
+ list-style: none;
+ display: flex;
+ position: relative;
+ padding: 0;
+ align-items: flex-start;
+ margin-top: .6rem;
+}
+
+.reply p {
+ margin: 0;
+}
+
+.reply .text {
+ margin-left: 1rem;
+ font-size: 14px;
+}
+
+.reply-author-name {
+ font-weight: 500;
}
\ No newline at end of file
diff --git a/source/js/webmention-timeline.js b/source/js/webmention-timeline.js
index ab524ea..cac6274 100644
--- a/source/js/webmention-timeline.js
+++ b/source/js/webmention-timeline.js
@@ -1,34 +1,51 @@
window.addEventListener('load', function () {
const webmentionsPromise = window.webmentionContext.webmentionsPromise;
- const mastodonContext = window.mastodonContext;
- const webmentionTimelineMessages = window.webmentionTimelineMessages;
-
+ const webmentionCountPromise = window.webmentionContext.webmentionCountPromise;
+
+ // console.log(JSON.stringify(webmentionsPromise, null, "\t"))
webmentionsPromise && webmentionsPromise
.then(function (data) {
let html = '';
- data.children.forEach(function (item) {
- if (!(mastodonContext && item.url.startsWith(mastodonContext.mastodonBaseUrl))) {
- html += `
`;
-
- if (item.author && item.author.name) {
- html += ``;
- if (item.author.url) {
- html += `${item.author.name}`;
- }
- else {
- html += item.author.name;
- }
- html += ``;
- }
- let publishTime = (item.published && item.published.indexOf('T') > 0) ? item.published : item['wm-received'];
-
- html += `
π${item.url}
`;
- }
- else {
- html += `
`;
- }
+ // if(webmentionCountPromise && webmentionCountPromise.hasOwnProperty("count")) {
+ // html += `${webmentionCountPromise.count}
`
+ // }
+ // html += `${webmentionCountPromise.type}
`
+ const distinctMentions = [
+ ...new Map(data.children.map((item) => [item.author.url, item])).values()].sort((a, b) => new Date(a['wm-received']) - new Date(b['wm-received']));
+ const replies = distinctMentions.filter(
+ (mention) => 'in-reply-to' in mention && 'content' in mention
+ );
+ html += ``;
+ if (distinctMentions.length > 0) {
+ html += `Already ${distinctMentions.length} awesome people liked, shared or talked about this article:
`;
+ } else {
+ html += `Be the first one to share this article!`;
+ }
+ html += `
`;
+ distinctMentions.forEach(function (reply) {
+ html += `
`;
});
+ html += `
`;
+ if (replies && replies.length) {
+ html += `
`;
+ html += `
Replies
`;
+ html += `
`;
+ replies.forEach(function (reply){
+ html += `- `;
+ html += `
`;
+ html += `
`;
+ html += `
`;
+ html += `
${reply.author.name}
`;
+ html += `
${reply.content.text}
`;
+ html += `
`;
+
+ });
+ html += `
`;
+ html += `
`;
+ }
document.querySelector('div.webmention-timeline').innerHTML = html;
})
diff --git a/source/js/webmention.js b/source/js/webmention.js
index 61eb86a..98d1162 100644
--- a/source/js/webmention.js
+++ b/source/js/webmention.js
@@ -2,13 +2,24 @@
const url = window.location.href;
const webmentionBaseUrl = "https://webmention.io"
+ // const url = "https://www.owenyoung.com/en/blog/indieweb/"
webmentionContext.webmentionsPromise = fetch(webmentionBaseUrl + "/api/mentions.jf2?target=" + encodeURIComponent(url))
.then(function (response) {
- console.error('sucess ' + url);
+ console.log('sucess ' + webmentionBaseUrl + "/api/mentions.jf2?target=" + url);
return response.json();
})
.catch(function (ex) {
console.error('fetch webmention error' + ex);
});
+
+ webmentionContext.webmentionCountPromise = fetch(webmentionBaseUrl + "/api/count.json?target=" + encodeURIComponent(url))
+ .then(function (response) {
+ console.log('sucess ' + webmentionBaseUrl + "/api/count.json?target=" + url);
+ return response.json();
+ })
+ .catch(function (ex) {
+ console.error('fetch webmention count error' + ex);
+ });
+
})(window.webmentionContext);
\ No newline at end of file