117 lines
4.3 KiB
HTML
117 lines
4.3 KiB
HTML
<div class="comments-switch" style="display:flex;gap:.5rem;margin:.5rem 0 1rem;">
|
|
<button id="btn-isso" type="button" aria-pressed="true">Anonymous (Isso)</button>
|
|
<button id="btn-giscus" type="button" aria-pressed="false">GitHub (Giscus)</button>
|
|
<a href="https://github.com/AlipourIm/blog-comments/discussions/categories/comments" target="_blank" rel="noopener">Open on GitHub ↗</a>
|
|
</div>
|
|
|
|
|
|
|
|
<!-- Giscus panel (lazy-loaded) -->
|
|
<div id="panel-giscus" style="display:none">
|
|
<section id="giscus-thread"></section>
|
|
</div>
|
|
|
|
<!-- Isso panel (default) -->
|
|
<div id="panel-isso">
|
|
<section id="isso-thread"
|
|
data-isso-id="{{ .RelPermalink }}"
|
|
data-title="{{ .Title | htmlEscape }}">
|
|
<noscript>Javascript needs to be activated to view comments.</noscript>
|
|
</section>
|
|
<script
|
|
src="/isso/js/embed.min.js"
|
|
data-isso="/isso/"
|
|
data-isso-css="false"
|
|
data-isso-lang="en"
|
|
data-isso-max-comments-nested="5"
|
|
data-isso-sorting="newest"
|
|
async>
|
|
</script>
|
|
<small class="isso-powered" style="display:block;margin:.5rem 0;color:var(--secondary,#888)">
|
|
Comments powered by <a href="https://isso-comments.de" target="_blank" rel="noopener">Isso</a>
|
|
</small>
|
|
</div>
|
|
|
|
<script>
|
|
(function () {
|
|
var panelIsso = document.getElementById('panel-isso');
|
|
var panelGisc = document.getElementById('panel-giscus');
|
|
var issoBtn = document.getElementById('btn-isso');
|
|
var giscBtn = document.getElementById('btn-giscus');
|
|
var gLoaded = false;
|
|
|
|
function isDark() {
|
|
var pref = localStorage.getItem('pref-theme'); // PaperMod uses this
|
|
if (pref === 'dark') return true;
|
|
if (pref === 'light') return false;
|
|
|
|
var html = document.documentElement, body = document.body;
|
|
if (
|
|
(html.classList && html.classList.contains('dark')) ||
|
|
(body.classList && body.classList.contains('dark')) ||
|
|
html.getAttribute('data-theme') === 'dark' ||
|
|
body.getAttribute('data-theme') === 'dark' ||
|
|
(html.classList && html.classList.contains('theme-dark')) ||
|
|
(body.classList && body.classList.contains('theme-dark'))
|
|
) return true;
|
|
|
|
return window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
|
|
}
|
|
function gTheme(){ return isDark() ? 'dark_dimmed' : 'noborder_light'; }
|
|
|
|
function loadGiscus() {
|
|
if (gLoaded) return;
|
|
var s = document.createElement('script');
|
|
s.src = 'https://giscus.app/client.js';
|
|
s.async = true;
|
|
s.crossOrigin = 'anonymous';
|
|
s.setAttribute('data-repo','AlipourIm/blog-comments');
|
|
s.setAttribute('data-repo-id','R_kgDOQGARyA');
|
|
s.setAttribute('data-category','Comments');
|
|
s.setAttribute('data-category-id','DIC_kwDOQGARyM4Cw3x-');
|
|
s.setAttribute('data-mapping','pathname');
|
|
s.setAttribute('data-strict','0');
|
|
s.setAttribute('data-reactions-enabled','1');
|
|
s.setAttribute('data-emit-metadata','0');
|
|
s.setAttribute('data-input-position','bottom');
|
|
s.setAttribute('data-lang','en');
|
|
s.setAttribute('data-theme', gTheme());
|
|
document.getElementById('giscus-thread').appendChild(s);
|
|
|
|
function reTheme(){
|
|
var iframe = document.querySelector('iframe.giscus-frame');
|
|
if (iframe && iframe.contentWindow) {
|
|
iframe.contentWindow.postMessage(
|
|
{ giscus: { setConfig: { theme: gTheme() } } },
|
|
'https://giscus.app'
|
|
);
|
|
}
|
|
}
|
|
|
|
var tbtn = document.getElementById('theme-toggle');
|
|
if (tbtn) tbtn.addEventListener('click', function(){ setTimeout(reTheme, 0); });
|
|
|
|
var mo = new MutationObserver(function(){ reTheme(); });
|
|
mo.observe(document.documentElement, { attributes:true, attributeFilter:['class','data-theme'] });
|
|
mo.observe(document.body, { attributes:true, attributeFilter:['class','data-theme'] });
|
|
|
|
gLoaded = true;
|
|
}
|
|
|
|
function show(which) {
|
|
var showIsso = which === 'isso';
|
|
panelIsso.style.display = showIsso ? 'block' : 'none';
|
|
panelGisc.style.display = showIsso ? 'none' : 'block';
|
|
if (issoBtn) issoBtn.setAttribute('aria-pressed', showIsso ? 'true' : 'false');
|
|
if (giscBtn) giscBtn.setAttribute('aria-pressed', showIsso ? 'false' : 'true');
|
|
if (!showIsso) loadGiscus();
|
|
}
|
|
|
|
if (issoBtn) issoBtn.addEventListener('click', function(e){ e.preventDefault(); show('isso'); });
|
|
if (giscBtn) giscBtn.addEventListener('click', function(e){ e.preventDefault(); show('giscus'); });
|
|
|
|
// default view
|
|
show('isso');
|
|
})();
|
|
</script>
|
|
|