~pyrho/blog: templates/post.html - sourcehut git


                                                                                      
      1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
      <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$