From d75e98e892d623365b17f094e201c6b5792a64f8 Mon Sep 17 00:00:00 2001
From: xaoxuu <xaoxuu@gmail.com>
Date: Mon, 11 May 2020 12:51:25 +0800
Subject: [PATCH] fix mathjax #296

---
 _config.yml                          |  3 --
 layout/_third-party/mathjax.ejs      | 63 +++++++++++++++++++++-------
 source/css/_layout/article.styl      |  7 ----
 source/css/_third-party/mathjax.styl | 11 +++++
 4 files changed, 59 insertions(+), 25 deletions(-)
 create mode 100644 source/css/_third-party/mathjax.styl

diff --git a/_config.yml b/_config.yml
index 722ab2c..9c4895f 100755
--- a/_config.yml
+++ b/_config.yml
@@ -415,9 +415,6 @@ plugins:
   # Codeblock Copy Button
   clipboard: https://cdn.jsdelivr.net/npm/clipboard@2/dist/clipboard.min.js
 
-  # mathjax
-  mathjax: https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js
-
   ######## Plugins for SEO:
   # Traffic statistics (very slow loading)
   busuanzi: https://cdn.jsdelivr.net/gh/xaoxuu/cdn-busuanzi@2.3/js/busuanzi.pure.mini.js
diff --git a/layout/_third-party/mathjax.ejs b/layout/_third-party/mathjax.ejs
index e185059..7cc34fe 100755
--- a/layout/_third-party/mathjax.ejs
+++ b/layout/_third-party/mathjax.ejs
@@ -1,19 +1,52 @@
-<script async src="<%- theme.plugins.mathjax %>"></script>
+<script async src="https://cdn.jsdelivr.net/npm/mathjax@3.0/es5/tex-mml-chtml.js"></script>
 <!-- MathJax配置，可通过单美元符号书写行内公式等 -->
+
 <script>
-window.MathJax = {
-  tex: {
-    inlineMath: [ ["$", "$"], ["\\(","\\)"] ],
-    displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
-    processEscapes: true,
-    tags: "ams",
-    macros: {
-      href: "{}"
-    }
-  },
-  options: {
-    ignoreHtmlClass: "tex2jax_ignore|dno",
-    skipHtmlTags: ['script', 'noscript', 'style', 'textarea', 'pre', 'code']
+  if (typeof MathJax === 'undefined') {
+    window.MathJax = {
+      loader: {
+        source: {
+          '[tex]/amsCd': '[tex]/amscd',
+          '[tex]/AMScd': '[tex]/amscd'
+        }
+      },
+      tex: {
+        inlineMath: {'[+]': [['$', '$']]},
+        tags: 'ams'
+      },
+      options: {
+        renderActions: {
+          findScript: [10, doc => {
+            document.querySelectorAll('script[type^="math/tex"]').forEach(node => {
+              const display = !!node.type.match(/; *mode=display/);
+              const math = new doc.options.MathItem(node.textContent, doc.inputJax[0], display);
+              const text = document.createTextNode('');
+              node.parentNode.replaceChild(text, node);
+              math.start = {node: text, delim: '', n: 0};
+              math.end = {node: text, delim: '', n: 0};
+              doc.math.push(math);
+            });
+          }, '', false],
+          insertedScript: [200, () => {
+            document.querySelectorAll('mjx-container').forEach(node => {
+              let target = node.parentNode;
+              if (target.nodeName.toLowerCase() === 'li') {
+                target.parentNode.classList.add('has-jax');
+              }
+            });
+          }, '', false]
+        }
+      }
+    };
+    (function () {
+      var script = document.createElement('script');
+      script.src = 'https://cdn.jsdelivr.net/npm/mathjax@3.0/es5/tex-mml-chtml.js';
+      script.defer = true;
+      document.head.appendChild(script);
+    })();
+  } else {
+    MathJax.startup.document.state(0);
+    MathJax.texReset();
+    MathJax.typeset();
   }
-};
 </script>
diff --git a/source/css/_layout/article.styl b/source/css/_layout/article.styl
index ab6b4e4..c51a1c2 100644
--- a/source/css/_layout/article.styl
+++ b/source/css/_layout/article.styl
@@ -114,13 +114,6 @@
     text-align: $textalign-p
     max-width: 100%
     line-height: inherit
-    &.has-jax
-      font-family: $fontfamily-code
-      background: $color-mathjax
-      padding: $gap $gap * 0.5
-      border-radius: $border-codeblock
-      .mjx-chtml.MJXc-display
-        margin: 0
 
 
   ul,ol
diff --git a/source/css/_third-party/mathjax.styl b/source/css/_third-party/mathjax.styl
new file mode 100644
index 0000000..624b653
--- /dev/null
+++ b/source/css/_third-party/mathjax.styl
@@ -0,0 +1,11 @@
+.article
+  mjx-container
+    font-family: $fontfamily-code
+    background: $color-mathjax
+    padding: $gap $gap * 0.5
+    border-radius: $border-codeblock
+    min-width: 0 !important
+  mjx-container[jax="CHTML"][display="true"], .has-jax
+    overflow: auto hidden
+  mjx-container + br
+    display: none