fix pjax

layout/includes/third-party/comments/remark42.pug

@@ -1,43 +1,67 @@
-- const { host, siteId, language, option } = theme.remark42
+- const { host, siteId, option } = theme.remark42
 script.
-    let nowTheme = document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light'
-    var remark_config = Object.assign({
-        host: '!{host}',
-        site_id: '!{siteId}',
-        components: ['embed','counter'],
-        locale: '!{language}',
-    },!{JSON.stringify(option)})
+  var remark_config = Object.assign({
+    host: '!{host}',
+    site_id: '!{siteId}',
+    components: ['embed'],
+    theme: document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light'
+  },!{JSON.stringify(option)})
 
-script.
-    function loadRemark42(){
-        !(function (e, n) {
-            for (var o = 0; o < e.length; o++) {
-                var r = n.createElement('script'),
-                    c = '.js',
-                    d = n.head || n.body
-                'noModule' in r ? ((r.type = 'module'), (c = '.mjs')) : (r.async = !0),
-                    (r.defer = !0),
-                    (r.src = remark_config.host + '/web/' + e[o] + c),
-                    d.appendChild(r)
-            }
-        })(remark_config.components || ['embed'], document)
+  function addRemark42(){
+    for (let i = 0; i < remark_config.components.length; i++) {
+      const s = document.createElement('script')
+      s.src = remark_config.host + '/web/' + remark_config.components[i] + '.js'
+      s.defer = true
+      document.head.appendChild(s)
     }
+  }
 
-    function changeRemark42Theme(){
-        let theme = document.documentElement.getAttribute('data-theme') === 'dark' ? 'light' : 'dark'
-        window.REMARK42.changeTheme(theme)
+  function initRemark42() {
+    if (window.REMARK42) {
+      if (this.remark42Instance) {
+        this.remark42Instance.destroy()
+      }
+
+      this.remark42Instance = window.REMARK42.createInstance({
+        ...remark_config
+      })
     }
+  }
 
-    let themeBtn = document.getElementById('darkmode')
-    themeBtn.addEventListener('click',()=>{
-        changeRemark42Theme()
-    })
+  function getCount () {
+    const ele = document.querySelector('.remark42__counter')
+    if (ele) {
+      const s = document.createElement('script')
+      s.src = remark_config.host + '/web/counter.js'
+      s.defer = true
+      document.head.appendChild(s)
+    }
+  }
 
-    if ('!{theme.comments.use[0]}' === 'Remark42' || !!{theme.comments.lazyload}) {
-        if (!{theme.comments.lazyload}) btf.loadComment(document.getElementById('remark42'), loadRemark42)
-        else loadRemark42()
+  function loadRemark42 () {
+    if (window.REMARK42) {
+      this.initRemark42()
+      getCount()
     } else {
-        function loadOtherComment () {
-            loadRemark42()
-        }
-    }
+      addRemark42()
+      window.addEventListener('REMARK42::ready', () => {
+        this.initRemark42()
+        getCount()
+      })
+    }
+  }
+
+  document.getElementById('darkmode').addEventListener('click',()=>{
+    if (!window.REMARK42) return
+    let theme = document.documentElement.getAttribute('data-theme') === 'dark' ? 'light' : 'dark'
+    window.REMARK42.changeTheme(theme)
+  })
+
+  if ('!{theme.comments.use[0]}' === 'Remark42' || !!{theme.comments.lazyload}) {
+    if (!{theme.comments.lazyload}) btf.loadComment(document.getElementById('remark42'), loadRemark42)
+    else loadRemark42()
+  } else {
+    function loadOtherComment () {
+      loadRemark42()
+    }
+  }