generated from sofia/eleventy-base
43 lines
1.8 KiB
JavaScript
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
|
||
|
|
}
|
||
|
|
})()
|