<div class="container">
<article>
<section class="post-header">
<h1 class="post-title">$title$</h1>
Posted on $date$ $if(tags)$ - filed under: $tags$ $endif$
</section>
<section class="post-body">
$body$
</section>
</article>
$if(githubIssueId)$
<hr />
<comments>
<h3>Comments</h3>
<a
class="button button-outline add-comment"
href="https://github.com/pyrho/25.wf-comments/issues/$githubIssueId$#new_comment_field"
target="_blank"
>Comment on github</a
>
<br />
</comments>
$endif$
</div>
$if(githubIssueId)$
<script type="text/javascript">
function domReady(fn) {
document.addEventListener('DOMContentLoaded', fn);
if (document.readyState === 'interactive' || document.readyState === 'complete') {
fn();
}
}
async function getComments(url = '') {
const response = await fetch(url, {
method: 'GET',
mode: 'cors',
cache: 'no-cache',
headers: { Accept: 'application/vnd.github.v3.html+json' },
});
return response.json();
}
domReady(() => {
const apiUrl =
'https://api.github.com/repos/pyrho/25.wf-comments/issues/$githubIssueId$/comments';
const appendComments = function (comments) {
const commentSection = document.querySelector('comments');
if (!comments || !comments.forEach || comments.length === 0) {
commentSection.insertAdjacentHTML('beforeend', '<p>No comments yet.</p>');
return;
}
comments.forEach(function (comment) {
commentSection.insertAdjacentHTML(
'beforeend',
'<div class="comment"> ✿\
<a class="commenter" href="' +
comment.user.html_url +
'"\
target="_blank">' +
comment.user.login +
'</a> on ' +
new Date(comment.created_at).toUTCString() +
comment.body_html +
'</div>',
);
});
};
getComments(apiUrl).then(appendComments);
});
</script>
$endif$