Adding mathjax svg rendering in code pad

This commit is contained in:
Ludovic Dubost 2020-06-27 14:40:15 +02:00
parent d7dfe75746
commit 56473930cd
2 changed files with 9 additions and 2 deletions

View File

@ -49,7 +49,8 @@
"saferphore": "^0.0.1", "saferphore": "^0.0.1",
"jszip": "Stuk/jszip#^3.1.5", "jszip": "Stuk/jszip#^3.1.5",
"requirejs-plugins": "^1.0.3", "requirejs-plugins": "^1.0.3",
"dragula.js": "3.7.2" "dragula.js": "3.7.2",
"MathJax": "3.0.5"
}, },
"resolutions": { "resolutions": {
"bootstrap": "^v4.0.0", "bootstrap": "^v4.0.0",

View File

@ -2,6 +2,7 @@ define([
'jquery', 'jquery',
'/api/config', '/api/config',
'/bower_components/marked/marked.min.js', '/bower_components/marked/marked.min.js',
'/bower_components/MathJax/es5/tex-svg.js',
'/common/common-hash.js', '/common/common-hash.js',
'/common/common-util.js', '/common/common-util.js',
'/common/hyperscript.js', '/common/hyperscript.js',
@ -12,7 +13,7 @@ define([
'/bower_components/diff-dom/diffDOM.js', '/bower_components/diff-dom/diffDOM.js',
'/bower_components/tweetnacl/nacl-fast.min.js', '/bower_components/tweetnacl/nacl-fast.min.js',
'css!/common/highlight/styles/github.css' 'css!/common/highlight/styles/github.css'
],function ($, ApiConfig, Marked, Hash, Util, h, MT, MediaTag, Highlight, Messages) { ],function ($, ApiConfig, Marked, MathJax, Hash, Util, h, MT, MediaTag, Highlight, Messages) {
var DiffMd = {}; var DiffMd = {};
var DiffDOM = window.diffDOM; var DiffDOM = window.diffDOM;
@ -23,6 +24,8 @@ define([
init: function () {} init: function () {}
}; };
var MathJax = window.MathJax;
var mermaidThemeCSS = //".node rect { fill: #DDD; stroke: #AAA; } " + var mermaidThemeCSS = //".node rect { fill: #DDD; stroke: #AAA; } " +
"rect.task, rect.task0, rect.task2 { stroke-width: 1 !important; rx: 0 !important; } " + "rect.task, rect.task0, rect.task2 { stroke-width: 1 !important; rx: 0 !important; } " +
"g.grid g.tick line { opacity: 0.25; }" + "g.grid g.tick line { opacity: 0.25; }" +
@ -95,6 +98,9 @@ define([
renderer.code = function (code, language) { renderer.code = function (code, language) {
if (language === 'mermaid' && code.match(/^(graph|pie|gantt|sequenceDiagram|classDiagram|gitGraph)/)) { if (language === 'mermaid' && code.match(/^(graph|pie|gantt|sequenceDiagram|classDiagram|gitGraph)/)) {
return '<pre class="mermaid">'+Util.fixHTML(code)+'</pre>'; return '<pre class="mermaid">'+Util.fixHTML(code)+'</pre>';
} else if (language === 'mathjax') {
var svg = MathJax.tex2svg(code, {display: true})
return '<pre class="mathjax">'+ svg.innerHTML.replace(/xlink:href/g, "href") +'</pre>';
} else { } else {
return defaultCode.apply(renderer, arguments); return defaultCode.apply(renderer, arguments);
} }