update

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

@@ -4,14 +4,27 @@
 script.
   (() => {
     let artalkItem = null
-    const initArtalk = () => {
-      artalkItem = Artalk.init(Object.assign({
-        el: '#artalk-wrap',
+    const option = !{JSON.stringify(option)}
+    const isShuoshuo = GLOBAL_CONFIG_SITE.isShuoshuo
+
+    const destroyArtalk = () => {
+      if (artalkItem) {
+        artalkItem.destroy()
+        artalkItem = null
+      }
+    }
+
+    const artalkChangeMode = theme => artalkItem && artalkItem.setDarkMode(theme === 'dark')
+
+    const initArtalk = (el = document, pageKey = location.pathname) => {
+      artalkItem = Artalk.init({
+        el: el.querySelector('#artalk-wrap'),
         server: '!{server}',
         site: '!{site}',
-        pageKey: location.pathname,
         darkMode: document.documentElement.getAttribute('data-theme') === 'dark',
-      },!{JSON.stringify(option)}))
+        ...option,
+        pageKey: isShuoshuo ? pageKey : (option && option.pageKey) || pageKey
+      })
 
       if (GLOBAL_CONFIG.lightbox === 'null') return
       artalkItem.on('list-loaded', () => {
@@ -21,31 +34,36 @@ script.
         })
       })
 
-      const destroyArtalk = () => {
-        artalkItem.destroy()
+      if (isShuoshuo) {
+        window.shuoshuoComment.destroyArtalk = () => {
+          destroyArtalk()
+          if (el.children.length) {
+            el.innerHTML = ''
+            el.classList.add('no-comment')
+          }
+        }
       }
 
       btf.addGlobalFn('pjaxSendOnce', destroyArtalk, 'destroyArtalk')
+      btf.addGlobalFn('themeChange', artalkChangeMode, 'artalk')
     }
 
-    const loadArtalk = async () => {
-      if (typeof Artalk === 'object') initArtalk()
+    const loadArtalk = async (el, pageKey) => {
+      if (typeof Artalk === 'object') initArtalk(el, pageKey)
       else {
         await btf.getCSS('!{theme.asset.artalk_css}')
         await btf.getScript('!{theme.asset.artalk_js}')
-        initArtalk()
+        initArtalk(el, pageKey)
       }
     }
 
-    const artalkChangeMode = theme => {
-      const artalkWrap = document.getElementById('artalk-wrap')
-      if (!(artalkWrap && artalkWrap.children.length)) return
-      const isDark = theme === 'dark'
-      artalkItem.setDarkMode(isDark)
+    if (isShuoshuo) {
+      '!{use[0]}' === 'Artalk'
+        ? window.shuoshuoComment = { loadComment: loadArtalk }
+        : window.loadOtherComment = loadArtalk
+      return
     }
 
-    btf.addGlobalFn('themeChange', artalkChangeMode, 'artalk')
-
     if ('!{use[0]}' === 'Artalk' || !!{lazyload}) {
       if (!{lazyload}) btf.loadComment(document.getElementById('artalk-wrap'), loadArtalk)
       else setTimeout(loadArtalk, 100)