From 1fd7d807740c15993fc6ca7f5e250c7abe7a998b Mon Sep 17 00:00:00 2001
From: Lucas Werkmeister <lucas.werkmeister@wikimedia.de>
Date: Fri, 11 Oct 2019 18:26:48 +0200
Subject: [PATCH] Render MathML using MathJax
Bug: T214980
Change-Id: I05533b97d5fc1ed0f64b306d9b556d0ee31fe56c
---
.jshintrc | 3 +-
Gruntfile.js | 7 +++
embed.html | 2 +
index.html | 3 ++
package-lock.json | 53 +++++++++++++++++--
package.json | 3 +-
wikibase/queryService/ui/ResultView.js | 2 +
.../resultBrowser/helper/FormatterHelper.js | 14 ++++-
8 files changed, 79 insertions(+), 8 deletions(-)
diff --git a/.jshintrc b/.jshintrc
index 58b67cc..59962a5 100644
--- a/.jshintrc
+++ b/.jshintrc
@@ -46,6 +46,7 @@
"moment": false,
"dimple": false,
"wellknown": false,
- "Map": false
+ "Map": false,
+ "MathJax": false
}
}
diff --git a/Gruntfile.js b/Gruntfile.js
index a84d4fc..909410c 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -147,6 +147,13 @@ module.exports = function( grunt ) {
'**/polestar/**'
],
dest: buildFolder
+ },{
+ expand: true,
+ cwd: './node_modules/mathjax/es5/',
+ src: [
+ 'output/chtml/fonts/woff-v2/*.woff'
+ ],
+ dest: buildFolder + '/js'
},{
expand: true,
src: [
diff --git a/embed.html b/embed.html
index b92fa84..47aa9f9 100644
--- a/embed.html
+++ b/embed.html
@@ -313,6 +313,7 @@ body {
}
</style>
+<style id="MJX-CHTML-styles">/* placeholder for MathJax */</style>
<body>
<div class="logo"></div>
<noscript>
@@ -492,6 +493,7 @@ body {
<script src="node_modules/@wikimedia/jquery.i18n/src/jquery.i18n.parser.js"></script>
<script src="node_modules/@wikimedia/jquery.i18n/src/jquery.i18n.emitter.js"></script>
<script src="node_modules/@wikimedia/jquery.i18n/src/jquery.i18n.language.js"></script>
+ <script src="node_modules/mathjax/es5/mml-chtml.js"></script>
<script src="vendor/bootstrap-tags/js/bootstrap-tags.min.js"></script>
<!-- endbuild -->
diff --git a/index.html b/index.html
index 717d355..b710cc8 100644
--- a/index.html
+++ b/index.html
@@ -45,6 +45,8 @@
<!-- build:js js/shim.min.js -->
<script src="node_modules/es6-shim/es6-shim.js"></script>
<!-- endbuild -->
+
+ <style id="MJX-CHTML-styles">/* placeholder for MathJax */</style>
</head>
<body>
<div class="wikibase-queryservice container-fluid">
@@ -486,6 +488,7 @@
<script src="node_modules/jstree/dist/jstree.js"></script>
<script src="node_modules/wellknown/wellknown.js"></script>
<script src="node_modules/gijgo/js/gijgo.min.js"></script>
+ <script src="node_modules/mathjax/es5/mml-chtml.js"></script>
<script src="vendor/bootstrap-tags/js/bootstrap-tags.min.js"></script>
<script src="vendor/sparqljs/dist/sparqljs-browser-min.js"></script>
<script src="vendor/bootstrapx-clickover/bootstrapx-clickover.js"></script>
diff --git a/package-lock.json b/package-lock.json
index 4589305..9a69b17 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -982,8 +982,7 @@
"commander": {
"version": "2.17.1",
"resolved": "https://registry.npmjs.org/commander/-/commander-2.17.1.tgz",
- "integrity": "sha512-wPMUt6FnH2yzG95SA6mzjQOEKUU3aLaDEmzs1ti+1E9h+CsrZghRlqEM/EJ4KscsQVG8uNN4uVreUeT8+drlgg==",
- "dev": true
+ "integrity": "sha512-wPMUt6FnH2yzG95SA6mzjQOEKUU3aLaDEmzs1ti+1E9h+CsrZghRlqEM/EJ4KscsQVG8uNN4uVreUeT8+drlgg=="
},
"comment-parser": {
"version": "0.3.2",
@@ -1698,6 +1697,11 @@
"integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
"dev": true
},
+ "esm": {
+ "version": "3.2.25",
+ "resolved": "https://registry.npmjs.org/esm/-/esm-3.2.25.tgz",
+ "integrity": "sha512-U1suiZ2oDVWv4zPO56S0NcR5QriEahGtdN2OR6FiOG4WJvcjBVFB0qI4+eKoWFH483PKGuLuu6V8Z4T5g63UVA=="
+ },
"esprima": {
"version": "2.7.3",
"resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz",
@@ -2809,8 +2813,7 @@
},
"grunt-merge-i18n": {
"version": "git+https://github.com/wikimedia/grunt-merge-i18n.git#abb919384593d893b91e9127f389490526834adf",
- "from": "git+https://github.com/wikimedia/grunt-merge-i18n.git",
- "dev": true
+ "from": "git+https://github.com/wikimedia/grunt-merge-i18n.git"
},
"grunt-shell": {
"version": "2.1.0",
@@ -4280,6 +4283,23 @@
"integrity": "sha512-rUxjysqif/BZQH2yhd5Aaq7vXMSx9NdEsQcyA07uEzIvxgI7zIr33gGsh+RU0/XjmQpCW7RsVof1vlkvQVCK5A==",
"dev": true
},
+ "mathjax": {
+ "version": "3.0.0",
+ "resolved": "https://registry.npmjs.org/mathjax/-/mathjax-3.0.0.tgz",
+ "integrity": "sha512-z4uLbDHNbs/aRuR6zCcnzwFQuMixkHCcWqgVaommfK/3cA1Ahq7OXemn+m8JwTYcBApSHgcrSbPr9sm3sZFL+A==",
+ "requires": {
+ "mathjax-full": "git://github.com/mathjax/MathJax-src.git"
+ }
+ },
+ "mathjax-full": {
+ "version": "git://github.com/mathjax/MathJax-src.git#0d74266e1820220d33cb6b29d4ca3575b352ac0d",
+ "from": "git://github.com/mathjax/MathJax-src.git",
+ "requires": {
+ "esm": "^3.2.25",
+ "mj-context-menu": "^0.2.0",
+ "speech-rule-engine": "^3.0.0-beta.6"
+ }
+ },
"maxmin": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/maxmin/-/maxmin-2.1.0.tgz",
@@ -4393,6 +4413,11 @@
}
}
},
+ "mj-context-menu": {
+ "version": "0.2.0",
+ "resolved": "https://registry.npmjs.org/mj-context-menu/-/mj-context-menu-0.2.0.tgz",
+ "integrity": "sha512-yJxrWBHCjFZEHsZgfs7m5g9OSCNzsVYadW6f6lX3pgZL67vmodtSW/4zhsYmuDKweXfHs0M1kJge1uQIasWA+g=="
+ },
"mkdirp": {
"version": "0.5.1",
"resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
@@ -6203,6 +6228,16 @@
"integrity": "sha512-Nc/QN/A425Qog7j9aHmwOrlwX2e7pNI47ciwxwy4jOlvbbMHkNNJchit+FX+UjF3IAdiaaV5BKeWuDUnws6G1A==",
"dev": true
},
+ "speech-rule-engine": {
+ "version": "3.0.0-beta.6",
+ "resolved": "https://registry.npmjs.org/speech-rule-engine/-/speech-rule-engine-3.0.0-beta.6.tgz",
+ "integrity": "sha512-B7gcT53jAsKpx7WvFYQcyUlFmgS3Wa9KlDy0FY8SOTa+Wz5EqmI0MpCD5/fYm8/2qiCPp8HwZg+H3cBgM+sNVw==",
+ "requires": {
+ "commander": "*",
+ "wicked-good-xpath": "*",
+ "xmldom-sre": "^0.1.31"
+ }
+ },
"split": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/split/-/split-1.0.1.tgz",
@@ -7284,6 +7319,11 @@
"isexe": "^2.0.0"
}
},
+ "wicked-good-xpath": {
+ "version": "1.3.0",
+ "resolved": "https://registry.npmjs.org/wicked-good-xpath/-/wicked-good-xpath-1.3.0.tgz",
+ "integrity": "sha1-gbDpXoZQ5JyUsiKY//hoa1VTz2w="
+ },
"window-size": {
"version": "0.1.4",
"resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.4.tgz",
@@ -7388,6 +7428,11 @@
}
}
},
+ "xmldom-sre": {
+ "version": "0.1.31",
+ "resolved": "https://registry.npmjs.org/xmldom-sre/-/xmldom-sre-0.1.31.tgz",
+ "integrity": "sha512-f9s+fUkX04BxQf+7mMWAp5zk61pciie+fFLC9hX9UVvCeJQfNHRHXpeo5MPcR0EUf57PYLdt+ZO4f3Ipk2oZUw=="
+ },
"xtend": {
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.1.tgz",
diff --git a/package.json b/package.json
index 850bf73..f217574 100644
--- a/package.json
+++ b/package.json
@@ -33,6 +33,7 @@
"es6-shim": "^0.35.5",
"font-awesome": "^4.7.0",
"gijgo": "1.9.6",
+ "grunt-merge-i18n": "git+https://github.com/wikimedia/grunt-merge-i18n.git",
"jqcloud2": "^2.0.3",
"jquery": "^3.4.1",
"jquery-resizable-dom": "^0.20.0",
@@ -46,11 +47,11 @@
"leaflet-zoombox": "^0.5.0",
"leaflet.locatecontrol": "^0.62.0",
"leaflet.markercluster": "^1.3.0",
+ "mathjax": "^3.0.0",
"moment": "^2.22.2",
"select2": "^4.0.8",
"underscore": "^1.9.1",
"vis": "^4.21.0",
- "grunt-merge-i18n": "git+https://github.com/wikimedia/grunt-merge-i18n.git",
"wellknown": "^0.5.0"
},
"devDependencies": {
diff --git a/wikibase/queryService/ui/ResultView.js b/wikibase/queryService/ui/ResultView.js
index c10d55d..08da446 100644
--- a/wikibase/queryService/ui/ResultView.js
+++ b/wikibase/queryService/ui/ResultView.js
@@ -679,7 +679,9 @@ wikibase.queryService.ui.ResultView = ( function( $, download, window ) {
window.setTimeout( function() {
try {
$( '#query-result' ).show();
+ MathJax.startup.output.clearCache();
resultBrowser.draw( $( '#query-result' ) );
+ $( '#MJX-CHTML-styles' ).replaceWith( MathJax.chtmlStylesheet() );
self._actionBar.hide();
} catch ( e ) {
self._drawErrorResult( resultBrowser );
diff --git a/wikibase/queryService/ui/resultBrowser/helper/FormatterHelper.js b/wikibase/queryService/ui/resultBrowser/helper/FormatterHelper.js
index c3090cf..
4638bd43687bb5 100644
--- a/wikibase/queryService/ui/resultBrowser/helper/FormatterHelper.js
+++ b/wikibase/queryService/ui/resultBrowser/helper/FormatterHelper.js
@@ -184,8 +184,
1318 @@ wikibase.queryService.ui.resultBrowser.helper.FormatterHelper = ( function( $, m
break;
case DATATYPE_MATHML:
- $html.append( $( data.value ) );
- break;
+ try {
+ $html.append(
MathJax.mathml2chtml( data.value )
+ MathJax.mathml2chtml(
+ value
+ .replace( /caligraphic/g, 'calligraphic' ) // work around https://github.com/mathjax/MathJax/issues/2214
+ )
+ );
+ break;
+ } catch ( e ) {
+ window.console.error( 'Invalid MathML', e );
+ // fall through to default case, escaping and displaying the raw value
+ } // jshint ignore:line
default:
var $label = $( '<span>' ).text( value );
--
2.20.1