1  ---
 2  layout: default
 3  ---
 4  <article class="post h-entry">
 5  
 6    {% if page.mathjax %}
 7    <script src='https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/latest.js?config=TeX-MML-AM_CHTML' async></script>
 8    {% endif %}
 9  
10    <h1 class="p-name">{% include title_emoji.html %}</h1>
11    <a class="u-url" href="{{ page.url | prepend: site.url }}" hidden>permalink</a>
12    {% if page.external-url %}
13    <p class="meta"><span class="postdate">Link: <a href="{{ page.external-url }}">{{ page.external-url }}</a></span></p>
14    {% endif %}
15  
16    {% include toc.html html=content class="toc" %}
17    <div class="e-content post-content">{{ content }}</div>
18  
19    <div class="post-footer">
20      <address>By
21        <a class="p-author h-card" href="{{ site.url }}">{{ site.author["name"] }}</a>
22      </address>
23      <p class="meta">Posted on <span class="postdate"><time class="dt-published" datetime="{{ page.date | date_to_xmlschema }}"
24            itemprop="datePublished">{{ page.date | date: "%b %d, %Y" }}</time>{% if page.last_modified_at %}
25          (Updated: <time class="dt-updated" datetime="{{ page.last_modified_at | date_to_xmlschema }}" itemprop="dateModified">{{
26            page.last_modified_at | date: "%b %d, %Y" }}</time>){% endif %}</span>
27      </p>
28      <p>{% for tag in page.tags %}<a class="p-category" href="/tags/#{{ tag | slugify }}" rel="tag">{{ tag }}</a>{% endfor %}</p>
29    </div>
30  
31    <div class="post-comments">
32      <button id="open-comments-btn">Open Comments</button>
33      <div id="comments-container" style="display: none;"></div>
34    </div>
35  
36    <div class="post-webmentions">
37      <button id="open-webmentions-btn">Open Webmentions</button>
38      <div id="webmentions-container" style="display: none;"
39           data-page-url="{{ page.url | prepend: site.url }}"
40           data-token="kafUIc2SQX03BkZzQgsb1g"></div>
41    </div>
42  </article>
43  
44  <script>
45    (function () {
46      var giscusLoaded = false;
47  
48      document.getElementById('open-comments-btn').addEventListener('click', function () {
49        var btn = this;
50        var container = document.getElementById('comments-container');
51        if (container.style.display === 'none') {
52          container.style.display = 'block';
53          btn.style.display = 'none';
54          if (!giscusLoaded) {
55            giscusLoaded = true;
56            var script = document.createElement('script');
57            script.src = 'https://giscus.app/client.js';
58            script.setAttribute('data-repo', 'hashb/chenna.me');
59            script.setAttribute('data-repo-id', 'MDEwOlJlcG9zaXRvcnkxMjY2NzEzNQ==');
60            script.setAttribute('data-category', 'General');
61            script.setAttribute('data-category-id', 'DIC_kwDOAMFI_84B_Mgr');
62            script.setAttribute('data-mapping', 'title');
63            script.setAttribute('data-reactions-enabled', '1');
64            script.setAttribute('data-emit-metadata', '0');
65            script.setAttribute('data-theme', 'preferred_color_scheme');
66            script.setAttribute('crossorigin', 'anonymous');
67            script.async = true;
68            container.appendChild(script);
69          }
70        } else {
71          container.style.display = 'none';
72          btn.style.display = 'block';
73        }
74      });
75  
76      var wmLoaded = false;
77      document.getElementById('open-webmentions-btn').addEventListener('click', function () {
78        var btn = this;
79        var container = document.getElementById('webmentions-container');
80        if (container.style.display === 'none') {
81          container.style.display = 'block';
82          btn.style.display = 'none';
83          if (!wmLoaded) {
84            wmLoaded = true;
85            container.innerHTML = '<p>Loading webmentions&hellip;</p>';
86            var s = document.createElement('script');
87            s.src = '/assets/webmentions.js';
88            document.body.appendChild(s);
89          }
90        } else {
91          container.style.display = 'none';
92          btn.style.display = 'block';
93        }
94      });
95    }());
96  </script>