asandikci.com
/
web
1
0
Fork 0
Code Issues 5 Pull Requests Actions Packages Projects Releases Wiki Activity

fix: `mermaid` occasionally fails to initialize (#536)

This commit is contained in:
Cotes Chung 2022-11-05 04:28:44 +08:00
parent 6774e0e1fb
commit 48f14e39ac
No known key found for this signature in database
GPG Key ID: 0D9E54843167A808
1 changed files with 12 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
_includes/mermaid.html
View File

@ -5,10 +5,11 @@
<script src="{{ site.data.assets[origin].mermaid.js | relative_url }}"></script> <script src="{{ site.data.assets[origin].mermaid.js | relative_url }}"></script>
<script> <script>
$(function() { (function () {
function updateMermaid(event) { function updateMermaid(event) {
if (event.source === window && event.data && if (event.source === window && event.data &&
event.data.direction === ModeToggle.ID) { event.data.direction === ModeToggle.ID) {
const mode = event.data.message; const mode = event.data.message;
@ -16,11 +17,11 @@
return; return;
} }
let expectedTheme = (mode === ModeToggle.DARK_MODE? "dark" : "default"); let expectedTheme = (mode === ModeToggle.DARK_MODE ? "dark" : "default");
let config = { theme: expectedTheme }; let config = {theme: expectedTheme};
/* Re-render the SVG › <https://github.com/mermaid-js/mermaid/issues/311#issuecomment-332557344> */ /* 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(); let svgCode = $(this).prev().children().html();
$(this).removeAttr("data-processed"); $(this).removeAttr("data-processed");
$(this).html(svgCode); $(this).html(svgCode);
@ -35,7 +36,7 @@
if ($("html[data-mode=dark]").length > 0 if ($("html[data-mode=dark]").length > 0
|| ($("html[data-mode]").length == 0 || ($("html[data-mode]").length == 0
&& window.matchMedia("(prefers-color-scheme: dark)").matches ) ) { && window.matchMedia("(prefers-color-scheme: dark)").matches)) {
initTheme = "dark"; initTheme = "dark";
} }
@ -43,15 +44,16 @@
theme: initTheme /* <default|dark|forest|neutral> */ theme: initTheme /* <default|dark|forest|neutral> */
}; };
/* Markdown converts to HTML */ /* Create mermaid tag */
$("pre").has("code.language-mermaid").each(function() { $("pre").has("code.language-mermaid").each(function () {
let svgCode = $(this).children().html(); let svgCode = $(this).children().html();
$(this).addClass("unloaded"); $(this).addClass("unloaded");
$(this).after(`<div class=\"mermaid\">${svgCode}</div>`); $(this).after(`<pre class=\"mermaid\">${svgCode}</pre>`);
}); });
mermaid.initialize(mermaidConf); mermaid.initialize(mermaidConf);
window.addEventListener("message", updateMermaid); window.addEventListener("message", updateMermaid);
}); })();
</script> </script>