f.weber/jekyll-theme-chirpy
Template
1
0
Fork 0
mirror of https://github.com/cotes2020/jekyll-theme-chirpy.git synced 2025-12-18 05:41:31 +00:00
Code Issues Packages Releases Activity

perf(assets): reduce HTTP requests to CDN

Browse Source
This commit is contained in:
Cotes Chung
2023-03-23 01:29:17 +08:00
parent 016a9baddd
commit 9d97120197
9 changed files with 167 additions and 139 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
_includes/mermaid.html
View File

@@ -1,59 +1,58 @@
<!--
mermaid-js loader
-->
<script src="{{ site.data.assets[origin].mermaid.js | relative_url }}"></script>
<script>
<!-- mermaid-js loader -->
<script type="text/javascript">
(function () {
function updateMermaid(event) {
if (event.source === window && event.data &&
event.data.direction === ModeToggle.ID) {
if (event.source === window && event.data && event.data.direction === ModeToggle.ID) {
const mode = event.data.message;
if (typeof mermaid === "undefined") {
if (typeof mermaid === 'undefined') {
return;
}
let expectedTheme = (mode === ModeToggle.DARK_MODE ? "dark" : "default");
let config = {theme: expectedTheme};
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 () {
$('.mermaid').each(function () {
let svgCode = $(this).prev().children().html();
$(this).removeAttr("data-processed");
$(this).removeAttr('data-processed');
$(this).html(svgCode);
});
mermaid.initialize(config);
mermaid.init(undefined, ".mermaid");
mermaid.init(undefined, '.mermaid');
}
}
let initTheme = "default";
let initTheme = 'default';
const html = document.documentElement;
if ($("html[data-mode=dark]").length > 0
|| ($("html[data-mode]").length == 0
&& window.matchMedia("(prefers-color-scheme: dark)").matches)) {
initTheme = "dark";
if (
(html.hasAttribute('data-mode') && html.getAttribute('data-mode') === 'dark') ||
(!html.hasAttribute('data-mode') && window.matchMedia('(prefers-color-scheme: dark)').matches)
) {
initTheme = 'dark';
}
let mermaidConf = {
theme: initTheme /* <default|dark|forest|neutral> */
theme: initTheme /* <default|dark|forest|neutral> */
};
/* Create mermaid tag */
$("pre").has("code.language-mermaid").each(function () {
let svgCode = $(this).children().html();
$(this).addClass("unloaded");
$(this).after(`<pre class=\"mermaid\">${svgCode}</pre>`);
document.querySelectorAll('pre>code.language-mermaid').forEach((elem) => {
const svgCode = elem.textContent;
const backup = elem.parentElement;
backup.classList.add('unloaded');
/* create mermaid node */
let mermaid = document.createElement('pre');
mermaid.classList.add('mermaid');
const text = document.createTextNode(svgCode);
mermaid.appendChild(text);
backup.after(mermaid);
});
mermaid.initialize(mermaidConf);
window.addEventListener("message", updateMermaid);
window.addEventListener('message', updateMermaid);
})();
</script>