writefreely/templates/include/post-render.tmpl

96 lines
2.9 KiB
Cheetah

<!-- Miscelaneous render related template parts we use multiple times -->
{{define "highlighting"}}
<script>
// TODO: this feels more like a mutation observer
addEventListener('DOMContentLoaded', function () {
var hlbaseUri = "/js/";
var lb = document.querySelectorAll("code[class^='language-']");
// Custom aliasmap
var aliasmap = {
"elisp" : "lisp",
"emacs-lisp" : "lisp",
"c" : "cpp",
"cc" : "cpp",
"h" : "cpp",
"c++" : "cpp",
"h++" : "cpp",
"hpp" : "cpp",
"hh" : "cpp",
"hxx" : "cpp",
"cxx" : "cpp",
"sh" : "bash",
"js" : "javascript",
"jsx" : "javascript",
"html" : "xml"
};
// Given a set of nodes, run highlighting on them
function highlight(nodes) {
for (i=0; i < nodes.length; i++) {
hljs.highlightBlock(nodes[i]);
}
}
// Given a array of URIs, load them in order
function loadLanguages(uris, callback) {
uris.forEach(function(uri) {
var sc = document.createElement('script');
sc.src = uri;
sc.async = false; // critical?
// Set callback on last script
if (uris.indexOf(uri) == uris.length-1) {
// Set callback regardless
// so we're sure it will run if last element had error
// (we only know after loading, so we've had load time already)
sc.onload = callback; sc.onerror = callback;
}
document.head.appendChild(sc);
});
}
// We don't have to do anything if there are no language blocks
if (lb.length > 0) {
// We have blocks to be highlighted, so we load css
var st = document.createElement('link');
st.rel = "stylesheet";
st.href = "/css/lib/atom-one-light.min.css";
document.head.appendChild(st);
// Construct set of files to load, in order
var jss = [hlbaseUri + "highlight.min.js"];
// Check what we need to load
for (i=0; i < lb.length; i++) {
lang = lb[i].className.replace('language-','');
// Support the aliases specified above
if (aliasmap[lang]) lang = aliasmap[lang];
lurl = hlbaseUri + "highlightjs/" + lang + ".min.js";
if (!jss.includes(lurl)) {
jss.push(lurl);
}
}
// Load files in order, higlight on last load
loadLanguages(jss, () => {highlight(lb)});
}
});
</script>
{{end}}
<!-- Include mathjax configuration -->
{{define "mathjax"}}
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
extensions: ["tex2jax.js"],
jax: ["input/TeX", "output/HTML-CSS"],
tex2jax: {
inlineMath: [ ['$','$'], ["\\(","\\)"] ],
displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
processEscapes: true
},
"HTML-CSS": { fonts: ["TeX"] }
});
</script>
<script type="text/javascript" src="/js/mathjax/MathJax.js?config=TeX-MML-AM_CHTML" async></script>
{{end}}