Merge pull request #280 from compute-tooling/mathjax-support

Use MathJax to support mathematics symbols
compute-tooling · Apr 8, 2020 · 0304cfa · 0304cfa
2 parents e2cc902 + 4fadefb
commit 0304cfa
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 2 deletions.
diff --git a/src/Simulation/Outputs.tsx b/src/Simulation/Outputs.tsx
@@ -55,6 +55,11 @@ const OutputModal: React.FC<{
 }> = ({ output, children }) => {
   const [show, setShow] = React.useState(false);
 
+  React.useEffect(() => {
+    // @ts-ignore
+    if (show) const res = window.MathJax.typeset();
+  }, [show]);
+
   let el;
   switch (output.media_type) {
     case "table":

diff --git a/static/js/sim.js b/static/js/sim.js
diff --git a/static/js/sim.js.map b/static/js/sim.js.map
diff --git a/templates/comp/inputs_form.html b/templates/comp/inputs_form.html
@@ -19,4 +19,15 @@
 <script type="text/javascript">
   var Bokeh200 = window.Bokeh;
 </script>
+
+<script>
+  window.MathJax = {
+    tex: {
+      inlineMath: [['$', '$'], ['\\(', '\\)']]
+    }
+  };
+</script>
+<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
+<script type="text/javascript" id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js">
+</script>
 {% endblock %}