1
0
mirror of https://github.com/cotes2020/jekyll-theme-chirpy.git synced 2025-12-18 05:41:31 +00:00

perf: replace jQuery with Vanilla JS (#1681)

Also replaced `magnific-popup` with `GLightbox`
This commit is contained in:
Cotes Chung
2024-04-17 06:10:01 +08:00
committed by GitHub
parent c85e9e2394
commit fe7afa379f
22 changed files with 274 additions and 305 deletions

View File

@@ -1,29 +1,31 @@
<!-- mermaid-js loader -->
<script type="text/javascript">
(function () {
function updateMermaid(event) {
if (event.source === window && event.data && event.data.direction === ModeToggle.ID) {
const mode = event.data.message;
function updateMermaid(event) {
if (event.source === window && event.data && event.data.direction === ModeToggle.ID) {
const mode = event.data.message;
if (typeof mermaid === 'undefined') {
return;
}
let expectedTheme = mode === ModeToggle.DARK_MODE ? 'dark' : 'default';
let config = { theme: expectedTheme };
/* Re-render the SVG <https://github.com/mermaid-js/mermaid/issues/311#issuecomment-332557344> */
$('.mermaid').each(function () {
let svgCode = $(this).prev().children().html();
$(this).removeAttr('data-processed');
$(this).html(svgCode);
});
mermaid.initialize(config);
mermaid.init(undefined, '.mermaid');
if (typeof mermaid === 'undefined') {
return;
}
}
let expectedTheme = mode === ModeToggle.DARK_MODE ? 'dark' : 'default';
let config = { theme: expectedTheme };
/* Re-render the SVG <https://github.com/mermaid-js/mermaid/issues/311#issuecomment-332557344> */
const mermaidList = document.getElementsByClassName('mermaid');
[...mermaidList].forEach((elem) => {
const svgCode = elem.previousSibling.children.item(0).innerHTML;
elem.innerHTML = svgCode;
elem.removeAttribute('data-processed');
});
mermaid.initialize(config);
mermaid.init(undefined, '.mermaid');
}
}
(function () {
let initTheme = 'default';
const html = document.documentElement;
@@ -35,11 +37,12 @@
}
let mermaidConf = {
theme: initTheme /* <default|dark|forest|neutral> */
theme: initTheme /* <default | dark | forest | neutral> */
};
/* Create mermaid tag */
document.querySelectorAll('pre>code.language-mermaid').forEach((elem) => {
const basicList = document.getElementsByClassName('language-mermaid');
[...basicList].forEach((elem) => {
const svgCode = elem.textContent;
const backup = elem.parentElement;
backup.classList.add('unloaded');
@@ -52,7 +55,6 @@
});
mermaid.initialize(mermaidConf);
window.addEventListener('message', updateMermaid);
})();
</script>