new_site/_includes/scripts/diff2html.liquid

31 lines
1.3 KiB
Plaintext

{% if page.code_diff %}
<!-- diff2html doesn't go well with Bootstrap Table -->
<script
src="{{ site.third_party_libraries.diff2html.url.js }}"
integrity="{{ site.third_party_libraries.diff2html.integrity.js }}"
crossorigin="anonymous"
></script>
<script>
let theme = determineComputedTheme();
/* Create diff2html as another node and hide the code block, appending the diff2html node after it
this is done to enable retrieving the code again when changing theme between light/dark */
document.onreadystatechange = () => {
if (document.readyState === 'complete') {
document.querySelectorAll('pre>code.language-diff2html').forEach((elem) => {
const textData = elem.textContent;
const backup = elem.parentElement;
backup.classList.add('unloaded');
/* create diff node */
let diffElement = document.createElement('div');
diffElement.classList.add('diff2html');
backup.after(diffElement);
const configuration = { colorScheme: theme, drawFileList: true, highlight: true, matching: 'lines' };
const diff2htmlUi = new Diff2HtmlUI(diffElement, textData, configuration);
diff2htmlUi.draw();
});
}
};
</script>
{% endif %}