sofi-web/static/assets/weblog/comments.js
2023-12-06 18:17:16 +01:00

43 lines
1.8 KiB
JavaScript

(async () => {
let el = document.getElementById("comment-section")
if (el == null) {
return
}
let status_url = `https://hachyderm.io/api/v1/statuses/${el.getAttribute("data-status")}/context`
let comments = await (await fetch(status_url)).json()
if (comments["descendants"] == null || comments["descendants"].length === 0) {
el.innerHTML = `<div class="no-comments">No comments yet</div>`
return
}
for (let comment of comments["descendants"]) {
let date = new Date(comment.created_at).toLocaleDateString(navigator.language || "en-GB", {
day: "2-digit",
year: "numeric",
month: "long",
hour: "2-digit",
minute: "2-digit",
})
let sanitize = DOMPurify.sanitize
let comment_html =
`
<div class="comment">
<div class="comment-author">
<img class="comment-author-image" src="${sanitize(comment.account.avatar)}" alt="Profile picture of ${sanitize(comment.account.display_name)}">
<div class="comment-author-data">
<div>
<span class="comment-author-name"><a class="comment-author-link" href="${comment.account.url}">${sanitize(comment.account.display_name)}</a></span>
</div>
<a href="${sanitize(comment.uri)}"><time datetime="${sanitize(comment.created_at)}">${date}</time></a>
</div>
</div>
<div class="comment-content">
${sanitize(comment.content)}
</div>
</div>
`
el.innerHTML += comment_html
}
})()