Added support for DOT (#2690)

Author: RunDevelopment

components.js

@@ -322,6 +322,12 @@
 			"alias": "dockerfile",
 			"owner": "JustinBeckwith"
 		},
+		"dot": {
+			"title": "DOT (Graphviz)",
+			"alias": "gv",
+			"optional": "markup",
+			"owner": "RunDevelopment"
+		},
 		"ebnf": {
 			"title": "EBNF",
 			"owner": "RunDevelopment"

components.json

@@ -0,0 +1,77 @@
+// https://www.graphviz.org/doc/info/lang.html
+
+(function (Prism) {
+
+	var ID = '(?:' + [
+		// an identifier
+		/[a-zA-Z_\x80-\uFFFF][\w\x80-\uFFFF]*/.source,
+		// a number
+		/-?(?:\.\d+|\d+(?:\.\d*)?)/.source,
+		// a double-quoted string
+		/"[^"\\]*(?:\\[\s\S][^"\\]*)*"/.source,
+		// HTML-like string
+		/<(?:[^<>]|(?!<!--)<(?:[^<>"']|"[^"]*"|'[^']*')+>|<!--(?:[^-]|-(?!->))*-->)*>/.source
+	].join('|') + ')';
+
+	var IDInside = {
+		'markup': {
+			pattern: /(^<)[\s\S]+(?=>$)/,
+			lookbehind: true,
+			alias: ['language-markup', 'language-html', 'language-xml'],
+			inside: Prism.languages.markup
+		}
+	};
+
+	/**
+	 * @param {string} source
+	 * @param {string} flags
+	 * @returns {RegExp}
+	 */
+	function withID(source, flags) {
+		return RegExp(source.replace(/<ID>/g, function () { return ID; }), flags);
+	}
+
+	Prism.languages.dot = {
+		'comment': {
+			pattern: /\/\/.*|\/\*[\s\S]*?\*\/|^#.*/m,
+			greedy: true
+		},
+		'graph-name': {
+			pattern: withID(/(\b(?:digraph|graph|subgraph)[ \t\r\n]+)<ID>/.source, 'i'),
+			lookbehind: true,
+			greedy: true,
+			alias: 'class-name',
+			inside: IDInside
+		},
+		'attr-value': {
+			pattern: withID(/(=[ \t\r\n]*)<ID>/.source),
+			lookbehind: true,
+			greedy: true,
+			inside: IDInside
+		},
+		'attr-name': {
+			pattern: withID(/([\[;, \t\r\n])<ID>(?=[ \t\r\n]*=)/.source),
+			lookbehind: true,
+			greedy: true,
+			inside: IDInside
+		},
+		'keyword': /\b(?:digraph|edge|graph|node|strict|subgraph)\b/i,
+		'compass-point': {
+			pattern: /(:[ \t\r\n]*)(?:[ns][ew]?|[ewc_])(?![\w\x80-\uFFFF])/,
+			lookbehind: true,
+			alias: 'builtin'
+		},
+		'node': {
+			pattern: withID(/(^|[^-.\w\x80-\uFFFF\\])<ID>/.source),
+			lookbehind: true,
+			greedy: true,
+			inside: IDInside
+		},
+		'operator': /[=:]|-[->]/,
+		'punctuation': /[\[\]{};,]/
+	};
+
+	Prism.languages.gv = Prism.languages.dot;
+
+}(Prism));
+

components/prism-dot.js

@@ -0,0 +1,31 @@
+<h2>Full example</h2>
+<pre><code>// source: http://www.ryandesign.com/canviz/graphs/dot/directed/ctext.gv.txt
+# Generated Tue Aug 21 10:21:21 GMT 2007 by dot - Graphviz version 2.15.20070819.0440 (Tue Aug 21 09:56:32 GMT 2007)
+#
+#
+# real	0m0.105s
+# user	0m0.076s
+# sys	0m0.022s
+
+digraph G {
+	node [label="\N"];
+	graph [bb="0,0,352,238",
+		_draw_="c 5 -white C 5 -white P 4 0 0 0 238 352 238 352 0 ",
+		xdotversion="1.2"];
+	xyz [label="hello\nworld", color=slateblue, fontsize=24, fontname="Palatino-Italic", style=filled, fontcolor=hotpink, pos="67,191", width="1.64", height="1.29", _draw_="S 6 -filled c 9 -slateblue C 9 -slateblue E 67 191 59 47 ", _ldraw_="F 24.000000 15 -Palatino-Italic c 7 -hotpink T 67 196 0 65 5 -hello F 24.000000 15 -Palatino-Italic c 7 -hotpink T 67 167 0 75 5\
+ -world "];
+	red [color=red, style=filled, pos="171,191", width="0.75", height="0.50", _draw_="S 6 -filled c 3 -red C 3 -red E 171 191 27 18 ", _ldraw_="F 14.000000 11 -Times-Roman c 5 -black T 171 186 0 24 3 -red "];
+	green [color=green, style=filled, pos="128,90", width="0.92", height="0.50", _draw_="S 6 -filled c 5 -green C 5 -green E 128 90 33 18 ", _ldraw_="F 14.000000 11 -Times-Roman c 5 -black T 128 85 0 41 5 -green "];
+	blue [color=blue, style=filled, fontcolor=black, pos="214,90", width="0.78", height="0.50", _draw_="S 6 -filled c 4 -blue C 4 -blue E 214 90 28 18 ", _ldraw_="F 14.000000 11 -Times-Roman c 5 -black T 214 85 0 31 4 -blue "];
+	cyan [color=cyan, style=filled, pos="214,18", width="0.83", height="0.50", _draw_="S 6 -filled c 4 -cyan C 4 -cyan E 214 18 30 18 ", _ldraw_="F 14.000000 11 -Times-Roman c 5 -black T 214 13 0 34 4 -cyan "];
+	magenta [color=magenta, style=filled, pos="307,18", width="1.25", height="0.50", _draw_="S 6 -filled c 7 -magenta C 7 -magenta E 307 18 45 18 ", _ldraw_="F 14.000000 11 -Times-Roman c 5 -black T 307 13 0 64 7 -magenta "];
+	yellow [color=yellow, style=filled, pos="36,18", width="1.00", height="0.50", _draw_="S 6 -filled c 6 -yellow C 6 -yellow E 36 18 36 18 ", _ldraw_="F 14.000000 11 -Times-Roman c 5 -black T 36 13 0 47 6 -yellow "];
+	orange [color=orange, style=filled, pos="128,18", width="1.06", height="0.50", _draw_="S 6 -filled c 6 -orange C 6 -orange E 128 18 38 18 ", _ldraw_="F 14.000000 11 -Times-Roman c 5 -black T 128 13 0 51 6 -orange "];
+	red -> green [pos="e,136,108 164,173 157,158 147,135 140,118", _draw_="c 5 -black B 4 164 173 157 158 147 135 140 118 ", _hdraw_="S 5 -solid S 15 -setlinewidth(1) c 5 -black C 5 -black P 3 143 116 136 108 136 119 "];
+	red -> blue [pos="e,206,108 178,173 185,158 195,135 202,118", _draw_="c 5 -black B 4 178 173 185 158 195 135 202 118 ", _hdraw_="S 5 -solid S 15 -setlinewidth(1) c 5 -black C 5 -black P 3 206 119 206 108 199 116 "];
+	blue -> cyan [pos="e,214,36 214,72 214,64 214,55 214,46", _draw_="c 5 -black B 4 214 72 214 64 214 55 214 46 ", _hdraw_="S 5 -solid S 15 -setlinewidth(1) c 5 -black C 5 -black P 3 218 46 214 36 211 46 "];
+	blue -> magenta [pos="e,286,34 232,76 246,66 263,52 278,40", _draw_="c 5 -black B 4 232 76 246 66 263 52 278 40 ", _hdraw_="S 5 -solid S 15 -setlinewidth(1) c 5 -black C 5 -black P 3 280 43 286 34 276 37 "];
+	green -> yellow [pos="e,56,33 109,75 96,65 78,51 64,40", _draw_="c 5 -black B 4 109 75 96 65 78 51 64 40 ", _hdraw_="S 5 -solid S 15 -setlinewidth(1) c 5 -black C 5 -black P 3 66 37 56 33 61 42 "];
+	green -> orange [pos="e,128,36 128,72 128,64 128,55 128,46", _draw_="c 5 -black B 4 128 72 128 64 128 55 128 46 ", _hdraw_="S 5 -solid S 15 -setlinewidth(1) c 5 -black C 5 -black P 3 132 46 128 36 125 46 "];
+}
+</code></pre>

components/prism-dot.min.js

@@ -173,6 +173,7 @@
 		"jinja2": "django",
 		"dns-zone": "dns-zone-file",
 		"dockerfile": "docker",
+		"gv": "dot",
 		"eta": "ejs",
 		"xlsx": "excel-formula",
 		"xls": "excel-formula",

examples/prism-dot.html

@@ -60,6 +60,8 @@
 		"dns-zone-file": "DNS zone file",
 		"dns-zone": "DNS zone file",
 		"dockerfile": "Docker",
+		"dot": "DOT (Graphviz)",
+		"gv": "DOT (Graphviz)",
 		"ebnf": "EBNF",
 		"editorconfig": "EditorConfig",
 		"ejs": "EJS",