marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-09-23 17:29:54 +02:00
Code Issues Packages Projects Releases Wiki Activity

Use monaco-mermaid for syntax highlighting and many syntax highlighting improvements

Browse Source
This commit is contained in:
Yash-Singh1
2021-10-31 14:45:41 -07:00
parent 66d4d9d5b8
commit 1b7e690ec1
19 changed files with 356 additions and 207 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
docs/index.html
View File

@@ -22,6 +22,12 @@
}
</script>
<script>var require = { paths: { 'vs': 'https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.29.1/min/vs' } }</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.29.1/min/vs/loader.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.29.1/min/vs/editor/editor.main.nls.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.29.1/min/vs/editor/editor.main.js"></script>
<script>exports = {};</script>
<script src="https://unpkg.com/monaco-mermaid/browser.js"></script>
<style>
.markdown-section {
@@ -32,6 +38,18 @@
<body>
<div id="app"></div>
<script>
const initEditor = exports.default;
var currentCodeExample = 0;
var colorize = [];
function colorizeEverything() {
colorize.map((id) => {
monaco.editor.colorizeElement(document.getElementById('code' + id))
})
colorize = colorize.filter(colorizeEl => colorizeEl)
}
window.$docsify = {
search: 'auto',
name: 'mermaid',
@@ -47,6 +65,12 @@
return (
'<div class="mermaid">' + mermaid.render('mermaid-svg-' + num++, code) + "</div>"
);
} else if (lang === 'mermaid-code') {
currentCodeExample++;
colorize.push(currentCodeExample);
return (
'<pre id="code' + currentCodeExample + '" data-lang="mermaid">' + code + '</pre>'
)
}
return this.origin.code.apply(this, arguments);
}
@@ -59,6 +83,13 @@
var editHtml = '[:memo: Edit this Page](' + url + ')\n'
return editHtml + html
})
hook.ready(function () {
if (document.readyState !== 'complete') {
return;
}
colorizeEverything()
})
}
]
}
@@ -78,6 +109,10 @@
ga('send', 'pageview', location.hash);
}
}
window.onload = () => {
initEditor(monaco)
colorizeEverything()
}
</script>
<script src="//cdn.jsdelivr.net/npm/docsify/lib/docsify.min.js"></script>
<script src="//cdn.jsdelivr.net/npm/docsify/lib/plugins/search.min.js"></script>