Skip to content

Commit d737f63

Browse files
committed
Add mermaid simple mode
1 parent 980a67a commit d737f63

4 files changed

Lines changed: 135 additions & 2 deletions

File tree

mode/index.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -89,6 +89,7 @@ <h2>Language modes</h2>
8989
<li><a href="markdown/index.html">Markdown</a> (<a href="gfm/index.html">GitHub-flavour</a>)</li>
9090
<li><a href="mathematica/index.html">Mathematica</a></li>
9191
<li><a href="mbox/index.html">mbox</a></li>
92+
<li><a href="mermaid/index.html">mermaid</a></li>
9293
<li><a href="mirc/index.html">mIRC</a></li>
9394
<li><a href="modelica/index.html">Modelica</a></li>
9495
<li><a href="mscgen/index.html">MscGen</a></li>

mode/mermaid/index.html

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
<!doctype html>
2+
3+
<title>CodeMirror: Mermaidmode</title>
4+
<meta charset="utf-8"/>
5+
<link rel=stylesheet href="../../doc/docs.css">
6+
7+
<link rel="stylesheet" href="../../lib/codemirror.css">
8+
<script src="../../lib/codemirror.js"></script>
9+
<script src="../../addon/mode/simple.js"></script>
10+
<script src="mermaid.js"></script>
11+
<style>.CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}</style>
12+
<div id=nav>
13+
<a href="https://codemirror.net"><h1>CodeMirror</h1><img id=logo src="../../doc/logo.png" alt=""></a>
14+
15+
<ul>
16+
<li><a href="../../index.html">Home</a>
17+
<li><a href="../../doc/manual.html">Manual</a>
18+
<li><a href="https://github.com/codemirror/codemirror">Code</a>
19+
</ul>
20+
<ul>
21+
<li><a href="../index.html">Language modes</a>
22+
<li><a class=active href="#">Dockerfile</a>
23+
</ul>
24+
</div>
25+
26+
<article>
27+
<h2>Dockerfile mode</h2>
28+
<form><textarea id="code" name="code">sequenceDiagram
29+
participant Alice
30+
participant Bob
31+
Alice->>John: Hello John, how are you?
32+
loop Healthcheck
33+
John->>John: Fight against hypochondria
34+
end
35+
Note right of John: Rational thoughts <br/>prevail!
36+
John-->>Alice: Great!
37+
John->>Bob: How about you?
38+
Bob-->>John: Jolly good!
39+
</textarea></form>
40+
41+
<script>
42+
var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
43+
lineNumbers: true,
44+
mode: "mermaid"
45+
});
46+
</script>
47+
48+
<p>Mermaid syntax highlighting for CodeMirror. Depends on
49+
the <a href="../../demo/simplemode.html">simplemode</a> addon.</p>
50+
51+
<p><strong>MIME types defined:</strong> <code>text/x-mermaid</code></p>
52+
</article>

mode/mermaid/mermaid.js

Lines changed: 81 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
// CodeMirror, copyright (c) by Marijn Haverbeke and others
2+
// Distributed under an MIT license: https://codemirror.net/LICENSE
3+
4+
(function(mod) {
5+
if (typeof exports == "object" && typeof module == "object") // CommonJS
6+
mod(require("../../lib/codemirror"), require("../../addon/mode/simple"));
7+
else if (typeof define == "function" && define.amd) // AMD
8+
define(["../../lib/codemirror", "../../addon/mode/simple"], mod);
9+
else // Plain browser env
10+
mod(CodeMirror);
11+
})(function(CodeMirror) {
12+
"use strict";
13+
14+
var keywords = [
15+
'graph',
16+
'stateDiagram',
17+
'sequenceDiagram',
18+
'classDiagram',
19+
'pie',
20+
'erDiagram',
21+
'flowchart',
22+
'gantt',
23+
'gitGraph',
24+
'journey',
25+
'participant',
26+
'as',
27+
28+
// sequence diagram keywords
29+
// https://github.com/mermaid-js/mermaid/blob/master/src/diagrams/sequence/parser/sequenceDiagram.jison
30+
'end',
31+
'rect',
32+
'opt',
33+
'alt',
34+
'else',
35+
'par',
36+
'and',
37+
'end',
38+
'left of',
39+
'right of',
40+
'over',
41+
'note',
42+
'activate',
43+
'deactivate',
44+
'title',
45+
'autonumber',
46+
47+
// flowchart keywords
48+
// https://github.com/mermaid-js/mermaid/blob/master/src/diagrams/flowchart/parser/flow.jison
49+
// TODO:
50+
'subgraph',
51+
]
52+
var keywordsRegex = new RegExp("\\b(" + keywords.join('|') + ")\\b")
53+
54+
CodeMirror.defineSimpleMode("mermaid", {
55+
start: [
56+
{
57+
regex: keywordsRegex,
58+
token: "keyword"
59+
},
60+
{
61+
regex: /(---|===|-->|==>|->>|->)/,
62+
token: "operator"
63+
},
64+
{
65+
regex: /".*?"/,
66+
token: "string"
67+
},
68+
{
69+
regex: /[[{(}]+.+?[)\]}]+/,
70+
token: "string"
71+
},
72+
{
73+
regex: /%%.*$/,
74+
token: "comment"
75+
}
76+
]
77+
});
78+
79+
CodeMirror.defineMIME("text/x-mermaid", "mermaid");
80+
});
81+

package.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,5 @@
4343
"directories": {},
4444
"dependencies": {},
4545
"devDependencies": {}
46-
},
47-
"dependencies": {}
46+
}
4847
}

0 commit comments

Comments
 (0)