5.0

layout/includes/third-party/abcjs/abcjs.pug

@@ -3,13 +3,15 @@ script.
     const abcjsInit = () => {
       const abcjsFn = () => {
         document.querySelectorAll(".abc-music-sheet").forEach(ele => {
+          if (ele.children.length > 0) return
           ABCJS.renderAbc(ele, ele.innerHTML, {responsive: 'resize'})
         })
       }
       
       typeof ABCJS === 'object' ? abcjsFn()
-        : getScript('!{url_for(theme.asset.abcjs_basic_js)}').then(abcjsFn)
+        : btf.getScript('!{url_for(theme.asset.abcjs_basic_js)}').then(abcjsFn)
     }
 
     window.pjax ? abcjsInit() : window.addEventListener('load', abcjsInit)
+    btf.addGlobalFn('encrypt', abcjsInit, 'abcjs')
   })()

layout/includes/third-party/abcjs/index.pug

@@ -1,4 +1,4 @@
-if theme.abcjs && theme.abcjs.enable
+if theme.abcjs.enable
   if theme.abcjs.per_page
     if is_post() || is_page()
       include ./abcjs.pug

layout/includes/third-party/aplayer.pug

@@ -1,3 +1,23 @@
 link(rel='stylesheet' href=url_for(theme.asset.aplayer_css) media="print" onload="this.media='all'")
 script(src=url_for(theme.asset.aplayer_js))
-script(src=url_for(theme.asset.meting_js))
+script(src=url_for(theme.asset.meting_js))
+if theme.pjax.enable
+  script.
+    (() => {
+      const destroyAplayer = () => {
+        if (window.aplayers) {
+          for (let i = 0; i < window.aplayers.length; i++) {
+            if (!window.aplayers[i].options.fixed) {
+              window.aplayers[i].destroy()
+            }
+          }
+        }
+      }
+
+      const runMetingJS = () => {
+        typeof loadMeting === 'function' && document.getElementsByClassName('aplayer').length && loadMeting()
+      }
+
+      btf.addGlobalFn('pjaxSend', destroyAplayer, 'destroyAplayer')
+      btf.addGlobalFn('pjaxComplete', loadMeting, 'runMetingJS')
+    })()

layout/includes/third-party/card-post-count/fb.pug

@@ -1,5 +1,5 @@
-- const fbSDKVer = 'v16.0'
-- const fbSDK = theme.messenger.enable ? `https://connect.facebook.net/${theme.facebook_comments.lang}/sdk/xfbml.customerchat.js#xfbml=1&version=${fbSDKVer}` : `https://connect.facebook.net/${theme.facebook_comments.lang}/sdk.js#xfbml=1&version=${fbSDKVer}`
+- const fbSDKVer = 'v20.0'
+- const fbSDK = `https://connect.facebook.net/${theme.facebook_comments.lang}/sdk.js#xfbml=1&version=${fbSDKVer}`
 
 script.
   (()=>{

layout/includes/third-party/card-post-count/twikoo.pug

@@ -28,7 +28,7 @@ script.
         if (typeof twikoo === 'object') {
           runTwikoo()
         } else {
-          getScript('!{url_for(theme.asset.twikoo)}').then(runTwikoo)
+          btf.getScript('!{url_for(theme.asset.twikoo)}').then(runTwikoo)
         }
     }
 

layout/includes/third-party/card-post-count/valine.pug

@@ -13,7 +13,7 @@ script.
       }
 
       if (typeof Valine === 'function') initValine() 
-      else getScript('!{url_for(theme.asset.valine)}').then(initValine)
+      else btf.getScript('!{url_for(theme.asset.valine)}').then(initValine)
     }
 
     window.pjax ? loadValine() : window.addEventListener('load', loadValine)

layout/includes/third-party/chat/chatra.pug

@@ -1,8 +1,8 @@
 //- https://chatra.io/help/api/
 script.
   (() => {
-    const isChatBtn = !{theme.chat_btn}
-    const isChatHideShow = !{theme.chat_hide_show}
+    const isChatBtn = !{theme.chat.rightside_button}
+    const isChatHideShow = !{theme.chat.button_hide_show}
 
     if (isChatBtn) {
       const close = () => {
@@ -15,22 +15,15 @@ script.
         Chatra('show')
       }
 
-      window.ChatraSetup = {
-        startHidden: true
-      }
+      window.ChatraSetup = { startHidden: true }
     
       window.chatBtnFn = () => {
-        const isShow = document.getElementById('chatra').classList.contains('chatra--expanded')
-        isShow ? close() : open()
+        document.getElementById('chatra').classList.contains('chatra--expanded') ? close() : open()
       }
     } else if (isChatHideShow) {
       window.chatBtn = {
-        hide: () => {
-          Chatra('hide')
-        },
-        show: () => {
-          Chatra('show')
-        }
+        hide: () => Chatra('hide'),
+        show: () => Chatra('show')
       }
     }
 
@@ -38,13 +31,12 @@ script.
       w.ChatraID = '#{theme.chatra.id}'
       var s = d.createElement('script')
       w[c] = w[c] || function() {
-          (w[c].q = w[c].q || []).push(arguments)
+        (w[c].q = w[c].q || []).push(arguments)
       }
       s.async = true
       s.src = 'https://call.chatra.io/chatra.js'
       if (d.head) d.head.appendChild(s)
     })(document, window, 'Chatra')
-
   })()
 
 

layout/includes/third-party/chat/crisp.pug

@@ -11,8 +11,8 @@ script.
     })();
     $crisp.push(["safe", true])
 
-    const isChatBtn = !{theme.chat_btn}
-    const isChatHideShow = !{theme.chat_hide_show}
+    const isChatBtn = !{theme.chat.rightside_button}
+    const isChatHideShow = !{theme.chat.button_hide_show}
 
     if (isChatBtn) {
       const open = () => {
@@ -20,26 +20,18 @@ script.
         $crisp.push(["do", "chat:open"])
       }
 
-      const close = () => {
-        $crisp.push(["do", "chat:hide"])
-      }
+      const close = () => $crisp.push(["do", "chat:hide"])
 
       close()
-      $crisp.push(["on", "chat:closed", function() {
-        close()
-      }])
 
-      window.chatBtnFn = () => {
-        $crisp.is("chat:visible") ? close() : open()
-      }
+      $crisp.push(["on", "chat:closed", close])
+
+      window.chatBtnFn = () => $crisp.is("chat:visible") ? close() : open()
+
     } else if (isChatHideShow) {
       window.chatBtn = {
-        hide: () => {
-          $crisp.push(["do", "chat:hide"])
-        },
-        show: () => {
-          $crisp.push(["do", "chat:show"])
-        }
+        hide: () => $crisp.push(["do", "chat:hide"]),
+        show: () => $crisp.push(["do", "chat:show"])
       }
     }
   })()

layout/includes/third-party/chat/daovoice.pug

@@ -3,8 +3,8 @@ script.
   (() => {
     (function(i,s,o,g,r,a,m){i["DaoVoiceObject"]=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;a.charset="utf-8";m.parentNode.insertBefore(a,m)})(window,document,"script",('https:' == document.location.protocol ? 'https:' : 'http:') + "//widget.daovoice.io/widget/!{theme.daovoice.app_id}.js","daovoice")
 
-    const isChatBtn = !{theme.chat_btn}
-    const isChatHideShow = !{theme.chat_hide_show}
+    const isChatBtn = !{theme.chat.rightside_button}
+    const isChatHideShow = !{theme.chat.button_hide_show}
 
     daovoice('init', {
       app_id: '!{theme.daovoice.app_id}',},{

layout/includes/third-party/chat/index.pug

@@ -1,10 +1,9 @@
-if theme.chatra && theme.chatra.enable
-  include ./chatra.pug
-else if theme.tidio && theme.tidio.enable
-  include ./tidio.pug
-else if theme.daovoice && theme.daovoice.enable
-  include ./daovoice.pug
-else if theme.crisp && theme.crisp.enable
-  include ./crisp.pug
-else if theme.messenger && theme.messenger.enable
-  include ./messenger.pug
+case theme.chat.use
+  when 'chatra'
+    include ./chatra.pug
+  when 'tidio'
+    include ./tidio.pug
+  when 'daovoice'
+    include ./daovoice.pug
+  when 'crisp'
+    include ./crisp.pug

layout/includes/third-party/chat/messenger.pug

@@ -1,44 +0,0 @@
-- let { pageID, lang } = theme.messenger
-- lang = theme.comments.use && theme.comments.use.includes('Facebook Comments') ? theme.facebook_comments.lang : lang
-
-#fb-customer-chat.fb-customerchat(page_id=pageID attribution='biz_inbox')
-
-script.
-  (() => {
-    document.getElementById('fb-root') ? '' : document.body.insertAdjacentHTML('afterend', '<div id="fb-root"></div>')
-
-    window.fbAsyncInit = function() {
-      FB.init({
-        xfbml: true,
-        version: 'v16.0'
-      });
-    };
-
-    (function(d, s, id) {
-      var js, fjs = d.getElementsByTagName(s)[0];
-      if (d.getElementById(id)) return;
-      js = d.createElement(s); js.id = id;
-      js.src = 'https://connect.facebook.net/!{lang}/sdk/xfbml.customerchat.js';
-      fjs.parentNode.insertBefore(js, fjs);
-    }(document, 'script', 'facebook-jssdk'));
-
-    const isChatBtn = !{theme.chat_btn}
-    const isChatHideShow = !{theme.chat_hide_show}
-
-    if (isChatBtn) {
-      window.chatBtnFn = () => {
-        const isShow = document.querySelector('.fb_customer_chat_bounce_in_v2')
-        isShow ? FB.CustomerChat.hide() : FB.CustomerChat.show()
-      }
-    } else if (isChatHideShow) {
-      window.chatBtn = {
-        hide: () => {
-          FB.CustomerChat.hide()
-        },
-        show: () => {
-          FB.CustomerChat.show(false)
-        }
-      }
-    }
-  })()
-

layout/includes/third-party/chat/tidio.pug

@@ -1,8 +1,8 @@
 script(src=`//code.tidio.co/${theme.tidio.public_key}.js` async)
 script.
   (() => {
-    const isChatBtn = !{theme.chat_btn}
-    const isChatHideShow = !{theme.chat_hide_show}
+    const isChatBtn = !{theme.chat.rightside_button}
+    const isChatHideShow = !{theme.chat.button_hide_show}
 
     if (isChatBtn) {
       let isShow = false
@@ -33,12 +33,8 @@ script.
       }
     } else if (isChatHideShow) {
       window.chatBtn = {
-        hide: () => {
-          window.tidioChatApi && window.tidioChatApi.hide()
-        },
-        show: () => {
-          window.tidioChatApi && window.tidioChatApi.show()
-        }
+        hide: () => window.tidioChatApi && window.tidioChatApi.hide(),
+        show: () => window.tidioChatApi && window.tidioChatApi.show()
       }
     }
   })()

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

@@ -25,14 +25,14 @@ script.
         artalkItem.destroy()
       }
 
-      btf.addGlobalFn('pjax', destroyArtalk, 'destroyArtalk')
+      btf.addGlobalFn('pjaxSendOnce', destroyArtalk, 'destroyArtalk')
     }
 
     const loadArtalk = async () => {
       if (typeof Artalk === 'object') initArtalk()
       else {
-        await getCSS('!{theme.asset.artalk_css}')
-        await getScript('!{theme.asset.artalk_js}')
+        await btf.getCSS('!{theme.asset.artalk_css}')
+        await btf.getScript('!{theme.asset.artalk_js}')
         initArtalk()
       }
     }
@@ -48,7 +48,7 @@ script.
 
     if ('!{use[0]}' === 'Artalk' || !!{lazyload}) {
       if (!{lazyload}) btf.loadComment(document.getElementById('artalk-wrap'), loadArtalk)
-      else loadArtalk()
+      else setTimeout(loadArtalk, 100)
     } else {
       window.loadOtherComment = loadArtalk
     }

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

@@ -28,8 +28,8 @@ script.
     const loadDisqusjs = async() => {
       if (window.disqusJsLoad) initDisqusjs()
       else {
-        await getCSS('!{url_for(theme.asset.disqusjs_css)}')
-        await getScript('!{url_for(theme.asset.disqusjs)}')
+        await btf.getCSS('!{url_for(theme.asset.disqusjs_css)}')
+        await btf.getScript('!{url_for(theme.asset.disqusjs)}')
         initDisqusjs()
         window.disqusJsLoad = true
       }

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

@@ -1,5 +1,5 @@
-- const fbSDKVer = 'v16.0'
-- const fbSDK = theme.messenger.enable ? `https://connect.facebook.net/${theme.facebook_comments.lang}/sdk/xfbml.customerchat.js#xfbml=1&version=${fbSDKVer}` : `https://connect.facebook.net/${theme.facebook_comments.lang}/sdk.js#xfbml=1&version=${fbSDKVer}`
+- const fbSDKVer = 'v20.0'
+- const fbSDK = `https://connect.facebook.net/${theme.facebook_comments.lang}/sdk.js#xfbml=1&version=${fbSDKVer}`
 
 script.
   (()=>{

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

@@ -1,13 +1,11 @@
-- const { repo, repo_id, category_id, theme:themes, option } = theme.giscus
-- const giscusUrl = theme.asset.giscus || 'https://giscus.app/client.js'
-- const giscusOriginUrl = new URL(giscusUrl).origin
 - const { use, lazyload } = theme.comments
+- const { repo, repo_id, category_id, light_theme, dark_theme, js, option } = theme.giscus
+- const giscusUrl = js || 'https://giscus.app/client.js'
+- const giscusOriginUrl = new URL(giscusUrl).origin
 
 script.
   (()=>{
-    const getGiscusTheme = theme => {
-      return theme === 'dark' ? '!{themes.dark}' : '!{themes.light}'
-    }
+    const getGiscusTheme = theme => theme === 'dark' ? '!{dark_theme}' : '!{light_theme}'
 
     const loadGiscus = () => {
       const config = Object.assign({
@@ -30,17 +28,17 @@ script.
     }
 
     const changeGiscusTheme = theme => {
-      const sendMessage = message => {
-        const iframe = document.querySelector('iframe.giscus-frame')
-        if (!iframe) return
-        iframe.contentWindow.postMessage({ giscus: message }, '!{giscusOriginUrl}')
-      }
-
-      sendMessage({
-        setConfig: {
-          theme: getGiscusTheme(theme)
+      const iframe = document.querySelector('#giscus-wrap iframe')
+      if (iframe) {
+        const message = {
+          giscus: {
+            setConfig: {
+              theme: getGiscusTheme(theme)
+            }
+          }
         }
-      });
+        iframe.contentWindow.postMessage(message, '!{giscusOriginUrl}')
+      }
     }
 
     btf.addGlobalFn('themeChange', changeGiscusTheme, 'giscus')

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

@@ -19,8 +19,8 @@ script.
     const loadGitalk = async() => {
       if (typeof Gitalk === 'function') initGitalk()
       else {
-        await getCSS('!{url_for(theme.asset.gitalk_css)}')
-        await getScript('!{url_for(theme.asset.gitalk)}')
+        await btf.getCSS('!{url_for(theme.asset.gitalk_css)}')
+        await btf.getScript('!{url_for(theme.asset.gitalk)}')
         initGitalk()
       }
     }

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

@@ -33,7 +33,7 @@ script.
 
     const loadTwikoo = () => {
       if (typeof twikoo === 'object') setTimeout(init,0)
-      else getScript('!{url_for(theme.asset.twikoo)}').then(init)
+      else btf.getScript('!{url_for(theme.asset.twikoo)}').then(init)
     }
 
     if ('!{use[0]}' === 'Twikoo' || !!{lazyload}) {

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

@@ -1,34 +1,42 @@
 - const { use, lazyload } = theme.comments
-- const { repo, issue_term, light_theme, dark_theme } = theme.utterances
+- const { repo, issue_term, light_theme, dark_theme, js, option } = theme.utterances
+- const utterancesUrl = js || 'https://utteranc.es/client.js'
+- const utterancesOriginUrl = new URL(utterancesUrl).origin
 
 script.
   (() => {
+    const getUtterancesTheme = theme => theme === 'dark' ? '#{dark_theme}' : '#{light_theme}'
+
     const loadUtterances = () => {
-      let ele = document.createElement('script')
-      ele.id = 'utterances_comment'
-      ele.src = 'https://utteranc.es/client.js'
-      ele.setAttribute('repo', '!{repo}')
-      ele.setAttribute('issue-term', '!{issue_term}')
-      const nowTheme = document.documentElement.getAttribute('data-theme') === 'dark' ? '#{dark_theme}' : '#{light_theme}'
-      ele.setAttribute('theme', nowTheme)
-      ele.crossOrigin = 'anonymous'
-      ele.async = true
+      const config = Object.assign({
+        id: 'utterances_comment',
+        src: '!{utterancesUrl}',
+        repo: '!{repo}',
+        'issue-term': '!{issue_term}',
+        theme: getUtterancesTheme(document.documentElement.getAttribute('data-theme')),
+        crossorigin: 'anonymous',
+        async: true
+      },!{JSON.stringify(option)})
+
+      const ele = document.createElement('script')
+      for (let key in config) {
+        ele.setAttribute(key, config[key])
+      }
       document.getElementById('utterances-wrap').appendChild(ele)
     }
 
-    const utterancesTheme = theme => {
-      const iframe = document.querySelector('.utterances-frame')
+    const changeUtterancesTheme = theme => {
+      const iframe = document.querySelector('#utterances-wrap iframe')
       if (iframe) {
-        const theme = theme === 'dark' ? '#{dark_theme}' : '#{light_theme}'
         const message = {
           type: 'set-theme',
-          theme: theme
+          theme: getUtterancesTheme(theme)
         };
-        iframe.contentWindow.postMessage(message, 'https://utteranc.es');
+        iframe.contentWindow.postMessage(message, '!{utterancesOriginUrl}')
       }
     }
 
-    btf.addGlobalFn('themeChange', utterancesTheme, 'utterances')
+    btf.addGlobalFn('themeChange', changeUtterancesTheme, 'utterances')
 
     if ('!{use[0]}' === 'Utterances' || !!{lazyload}) {
       if (!{lazyload}) btf.loadComment(document.getElementById('utterances-wrap'), loadUtterances)

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

@@ -23,7 +23,7 @@ script.
     const loadValine = async () => {
       if (typeof Valine === 'function') initValine()
       else {
-        await getScript('!{url_for(theme.asset.valine)}')
+        await btf.getScript('!{url_for(theme.asset.valine)}')
         initValine()
       }
     }

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

@@ -19,17 +19,19 @@ script.
         waline.destroy()
       }
 
-      btf.addGlobalFn('pjax', destroyWaline, 'destroyWaline')
+      btf.addGlobalFn('pjaxSendOnce', destroyWaline, 'destroyWaline')
     }
 
-    const loadWaline = async () => {
+    const loadWaline = () => {
       if (initFn) initWaline(initFn)
       else {
-        await getCSS('!{url_for(theme.asset.waline_css)}')
-        const { init } = await import('!{url_for(theme.asset.waline_js)}')
-        initFn = init || Waline.init
-        initWaline(initFn)
-        window.walineFn = initFn
+        btf.getCSS('!{url_for(theme.asset.waline_css)}')
+          .then(() => import('!{url_for(theme.asset.waline_js)}'))
+          .then(({ init }) => {
+            initFn = init || Waline.init
+            initWaline(initFn)
+            window.walineFn = initFn
+          })
       }
     }
 

layout/includes/third-party/math/index.pug

@@ -1,17 +1,10 @@
-if theme.mathjax && theme.mathjax.enable
-  if theme.mathjax.per_page
-    if is_post() || is_page()
-      include ./mathjax.pug
-  else
-    if page.mathjax
+case theme.math.use
+  when 'mathjax'
+    if (theme.math.per_page && (is_post() || is_page())) || page.mathjax
       include ./mathjax.pug
 
-if theme.katex && theme.katex.enable
-  if theme.katex.per_page
-    if is_post() || is_page()
-      include ./katex.pug
-  else
-    if page.katex
+  when 'katex'
+    if (theme.math.per_page && (is_post() || is_page())) || page.katex
       include ./katex.pug
 
 if theme.mermaid.enable

layout/includes/third-party/math/katex.pug

@@ -1,9 +1,16 @@
-link(rel="stylesheet" type="text/css" href=url_for(theme.asset.katex))
-script(src=url_for(theme.asset.katex_copytex))
 script.
-  (() => {
-    document.querySelectorAll('#article-container span.katex-display').forEach(item => {
-      btf.wrap(item, 'div', { class: 'katex-wrap'})
-    })
-  })()
-  
+  (async () => {
+    const showKatex = () => {
+      document.querySelectorAll('#article-container .katex').forEach(el => el.classList.add('katex-show'))
+    }
+
+    if (!window.katex_js_css) {
+      window.katex_js_css = true
+      await btf.getCSS('!{url_for(theme.asset.katex)}')
+      if (!{theme.math.katex.copy_tex}) {
+        await btf.getScript('!{url_for(theme.asset.katex_copytex)}')
+      }
+    }
+
+    showKatex()
+  })()

layout/includes/third-party/math/mathjax.pug

@@ -1,38 +1,47 @@
 //- Mathjax 3
+- const { tags, enableMenu } = theme.math.mathjax
 script.
-  if (!window.MathJax) {
-    window.MathJax = {
-      tex: {
-        inlineMath: [['$', '$'], ['\\(', '\\)']],
-        tags: 'ams'
-      },
-      chtml: {
-        scale: 1.1
-      },
-      options: {
-        renderActions: {
-          findScript: [10, doc => {
-            for (const node of document.querySelectorAll('script[type^="math/tex"]')) {
-              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)
+  (() => {
+    const loadMathjax = () => {
+      if (!window.MathJax) {
+        window.MathJax = {
+          tex: {
+            inlineMath: [['$', '$'], ['\\(', '\\)']],
+            tags: '!{tags}',
+          },
+          chtml: {
+            scale: 1.1
+          },
+          options: {
+            enableMenu: !{enableMenu},
+            renderActions: {
+              findScript: [10, doc => {
+                for (const node of document.querySelectorAll('script[type^="math/tex"]')) {
+                  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)
+                }
+              }, '']
             }
-          }, '']
+          }
         }
+        
+        const script = document.createElement('script')
+        script.src = '!{url_for(theme.asset.mathjax)}'
+        script.id = 'MathJax-script'
+        script.async = true
+        document.head.appendChild(script)
+      } else {
+        MathJax.startup.document.state(0)
+        MathJax.texReset()
+        MathJax.typesetPromise()
       }
     }
-    
-    const script = document.createElement('script')
-    script.src = '!{url_for(theme.asset.mathjax)}'
-    script.id = 'MathJax-script'
-    script.async = true
-    document.head.appendChild(script)
-  } else {
-    MathJax.startup.document.state(0)
-    MathJax.texReset()
-    MathJax.typesetPromise()
-  }
+
+    btf.addGlobalFn('encrypt', loadMathjax, 'mathjax')
+    window.pjax ? loadMathjax() : window.addEventListener('load', loadMathjax)
+  })()

layout/includes/third-party/math/mermaid.pug

@@ -1,38 +1,51 @@
 script.
   (() => {
-    const $mermaid = document.querySelectorAll('#article-container .mermaid-wrap')
-    if ($mermaid.length === 0) return
-    const runMermaid = () => {
+    const runMermaid = ele => {
       window.loadMermaid = true
       const theme = document.documentElement.getAttribute('data-theme') === 'dark' ? '!{theme.mermaid.theme.dark}' : '!{theme.mermaid.theme.light}'
 
-      Array.from($mermaid).forEach((item, index) => {
+      ele.forEach((item, index) => {
         const mermaidSrc = item.firstElementChild
-        const mermaidThemeConfig = '%%{init:{ \'theme\':\'' + theme + '\'}}%%\n'
-        const mermaidID = 'mermaid-' + index
+        const mermaidThemeConfig = `%%{init:{ 'theme':'${theme}'}}%%\n`
+        const mermaidID = `mermaid-${index}`
         const mermaidDefinition = mermaidThemeConfig + mermaidSrc.textContent
 
         const renderFn = mermaid.render(mermaidID, mermaidDefinition)
-
-        const renderV10 = () => {
-          renderFn.then(({svg}) => {
-            mermaidSrc.insertAdjacentHTML('afterend', svg)
-          })
-        }
-
-        const renderV9 = svg => {
+        const renderMermaid = svg => {
           mermaidSrc.insertAdjacentHTML('afterend', svg)
         }
 
-        typeof renderFn === 'string' ? renderV9(renderFn) : renderV10()
+        // mermaid v9 and v10 compatibility
+        typeof renderFn === 'string' ? renderMermaid(renderFn) : renderFn.then(({ svg }) => renderMermaid(svg))
+      })
+    }
+
+    const codeToMermaid = () => {
+      const codeMermaidEle = document.querySelectorAll('pre > code.mermaid')
+      if (codeMermaidEle.length === 0) return
+
+      codeMermaidEle.forEach(ele => {
+        const preEle = document.createElement('pre')
+        preEle.className = 'mermaid-src'
+        preEle.hidden = true
+        preEle.textContent = ele.textContent
+        const newEle = document.createElement('div')
+        newEle.className = 'mermaid-wrap'
+        newEle.appendChild(preEle)
+        ele.parentNode.replaceWith(newEle)
       })
     }
 
     const loadMermaid = () => {
-      window.loadMermaid ? runMermaid() : getScript('!{url_for(theme.asset.mermaid)}').then(runMermaid)
+      if (!{theme.mermaid.code_write}) codeToMermaid()
+      const $mermaid = document.querySelectorAll('#article-container .mermaid-wrap')
+      if ($mermaid.length === 0) return
+
+      const runMermaidFn = () => runMermaid($mermaid)
+      btf.addGlobalFn('themeChange', runMermaidFn, 'mermaid')
+      window.loadMermaid ? runMermaidFn() : btf.getScript('!{url_for(theme.asset.mermaid)}').then(runMermaidFn)
     }
 
-    btf.addGlobalFn('themeChange', runMermaid, 'mermaid')
-
+    btf.addGlobalFn('encrypt', loadMermaid, 'mermaid')
     window.pjax ? loadMermaid() : document.addEventListener('DOMContentLoaded', loadMermaid)
   })()

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

@@ -2,105 +2,71 @@
 - const avatarCdn = (option !== null && option.gravatar && option.gravatar.mirror) || ''
 - const avatarDefault = (option !== null && option.gravatar && (option.gravatar.params || option.gravatar.default)) || ''
 
+!= partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
 script.
   window.addEventListener('load', () => {
-    const changeContent = (content) => {
-      if (content === '') return content
+    const keyName = 'artalk-newest-comments'
+    const { changeContent, generateHtml, run } = window.newestComments
 
-      content = content.replace(/<img.*?src="(.*?)"?[^\>]+>/ig, '[!{_p("aside.card_newest_comments.image")}]') // replace image link
-      content = content.replace(/<a[^>]+?href=["']?([^"']+)["']?[^>]*>([^<]+)<\/a>/gi, '[!{_p("aside.card_newest_comments.link")}]') // replace url
-      content = content.replace(/<pre><code>.*?<\/pre>/gi, '[!{_p("aside.card_newest_comments.code")}]') // replace code
-      content = content.replace(/<[^>]+>/g,"") // remove html tag
+    const getAvatarValue = async () => {
+      const predefinedAvatarCdn = '!{avatarCdn}'
+      const predefinedAvatarDefault = '!{avatarDefault}'
 
-      if (content.length > 150) {
-        content = content.substring(0,150) + '...'
+      const avatarDefaultFormat = e => e.startsWith('d=') ? e : `d=${e}`
+
+      if (predefinedAvatarCdn && predefinedAvatarDefault) {
+        return { avatarCdn: predefinedAvatarCdn, avatarDefault: avatarDefaultFormat(predefinedAvatarDefault) }
       }
-      return content
-    }
-
-    const generateHtml = array => {
-      let result = ''
-
-      if (array.length) {
-        for (let i = 0; i < array.length; i++) {
-          result += '<div class=\'aside-list-item\'>'
-
-          if (!{theme.newest_comments.avatar}) {
-            const name = '!{theme.lazyload.enable ? "data-lazy-src" : "src"}'
-            result += `<a href='${array[i].url}' class='thumbnail'><img ${name}='${array[i].avatar}' alt='${array[i].nick}'></a>`
-          }
-
-          result += `<div class='content'>
-          <a class='comment' href='${array[i].url}' title='${array[i].content}'>${array[i].content}</a>
-          <div class='name'><span>${array[i].nick} / </span><time datetime="${array[i].date}">${btf.diffDate(array[i].date, true)}</time></div>
-          </div></div>`
-        }
-      } else {
-        result += '!{_p("aside.card_newest_comments.zero")}'
-      }
-
-      let $dom = document.querySelector('#card-newest-comments .aside-list')
-      $dom && ($dom && ($dom.innerHTML= result))
-      window.lazyLoadInstance && window.lazyLoadInstance.update()
-      window.pjax && window.pjax.refresh($dom)
-    }
-
-    const getSetting = async () => {
+    
       try {
-        const res = await fetch('!{server}/api/v2/conf', { method: 'GET' })
-        return await res.json()
+        const res = await fetch('!{server}/api/v2/conf')
+        const result = await res.json()
+        const { mirror, params, default: defaults } = result.frontend_conf.gravatar
+        const avatarCdn = predefinedAvatarCdn || mirror
+        let avatarDefault = avatarDefaultFormat(predefinedAvatarDefault || params || defaults)
+        return { avatarCdn, avatarDefault}
       } catch (e) {
-        console.log(e)
+        console.error(e)
+        return { avatarCdn: predefinedAvatarCdn, avatarDefault: avatarDefaultFormat(predefinedAvatarDefault) }
       }
     }
 
-    const headerList = {
-      method: 'GET',
-    }
-
     const searchParams = new URLSearchParams({
       'site_name': '!{site}',
-      'limit': '!{theme.newest_comments.limit}',
+      'limit': '!{theme.aside.card_newest_comments.limit}',
     })
 
-    const getComment = async () => {
+    const getComment = async (ele) => {
       try {
-        const res = await fetch(`!{server}/api/v2/stats/latest_comments?${searchParams}`, headerList)
+        const res = await fetch(`!{server}/api/v2/stats/latest_comments?${searchParams}`)
         const result = await res.json()
+<<<<<<< HEAD
         const avatarStr = await getSetting()
         const { mirror, params, default:defaults } = avatarStr.frontend_conf.gravatar
         const avatarCdn = '!{avatarCdn}' || mirror
         let avatarDefault = '!{avatarDefault}' || params || defaults
         avatarDefault = avatarDefault.startsWith('d=') ? avatarDefault : `d=${avatarDefault}`
         const artalk = result.data.map(function (e) {
+=======
+        const { avatarCdn, avatarDefault } = await getAvatarValue()
+        const artalk = result.data.map(e => {
+          const avatar = avatarCdn && e.email_encrypted ? `${avatarCdn}${e.email_encrypted}?${avatarDefault}` : ''
+>>>>>>> dev
           return {
-            'avatar': `${avatarCdn}${e.email_encrypted}?${avatarDefault}`,
+            'avatar': avatar,
             'content': changeContent(e.content_marked),
             'nick': e.nick,
             'url': e.page_url,
             'date': e.date,
           }
         })
-        saveToLocal.set('artalk-newest-comments', JSON.stringify(artalk), !{theme.newest_comments.storage}/(60*24))
-        generateHtml(artalk)
+        btf.saveToLocal.set(keyName, JSON.stringify(artalk), !{theme.aside.card_newest_comments.storage}/(60*24))
+        generateHtml(artalk, ele)
       } catch (e) {
         console.log(e)
-        const $dom = document.querySelector('#card-newest-comments .aside-list')
-        $dom.textContent= "!{_p('aside.card_newest_comments.error')}"
+        ele.textContent= "!{_p('aside.card_newest_comments.error')}"
       }
     }
 
-    const newestCommentInit = () => {
-      if (document.querySelector('#card-newest-comments .aside-list')) {
-        const data = saveToLocal.get('artalk-newest-comments')
-        if (data) {
-          generateHtml(JSON.parse(data))
-        } else {
-          getComment()
-        }
-      }
-    }
-
-    newestCommentInit()
-    document.addEventListener('pjax:complete', newestCommentInit)
-  })
+    run(keyName, getComment)
+  })

layout/includes/third-party/newest-comments/common.pug

@@ -0,0 +1,60 @@
+script.
+  window.newestComments = {
+    changeContent: content => {
+      if (content === '') return content
+
+      content = content.replace(/<img.*?src="(.*?)"?[^\>]+>/ig, '[!{_p("aside.card_newest_comments.image")}]') // replace image link
+      content = content.replace(/<a[^>]+?href=["']?([^"']+)["']?[^>]*>([^<]+)<\/a>/gi, '[!{_p("aside.card_newest_comments.link")}]') // replace url
+      content = content.replace(/<pre><code>.*?<\/pre>/gi, '[!{_p("aside.card_newest_comments.code")}]') // replace code
+      content = content.replace(/<code>.*?<\/code>/gi, '[!{_p("aside.card_newest_comments.code")}]') // replace code      
+      content = content.replace(/<[^>]+>/g, "") // remove html tag
+
+      if (content.length > 150) {
+        content = content.substring(0, 150) + '...'
+      }
+      return content
+    },
+
+    generateHtml: (array, ele) => {
+      let result = ''
+
+      if (array.length) {
+        for (let i = 0; i < array.length; i++) {
+          result += '<div class="aside-list-item">'
+
+          if (!{theme.aside.card_newest_comments.avatar} && array[i].avatar) {
+            const imgAttr = '!{theme.lazyload.enable ? "data-lazy-src" : "src"}'
+            result += `<a href="${array[i].url}" class="thumbnail"><img ${imgAttr}="${array[i].avatar}" alt="${array[i].nick}"></a>`
+          }
+
+          result += `<div class="content">
+          <a class="comment" href="${array[i].url}" title="${array[i].content}">${array[i].content}</a>
+          <div class="name"><span>${array[i].nick} / </span><time datetime="${array[i].date}">${btf.diffDate(array[i].date, true)}</time></div>
+          </div></div>`
+        }
+      } else {
+        result += '!{_p("aside.card_newest_comments.zero")}'
+      }
+
+      ele.innerHTML = result
+      window.lazyLoadInstance && window.lazyLoadInstance.update()
+      window.pjax && window.pjax.refresh(ele)
+    },
+
+    newestCommentInit: (name, getComment) => {
+      const $dom = document.querySelector('#card-newest-comments .aside-list')
+      if ($dom) {
+        const data = btf.saveToLocal.get(name)
+        if (data) {
+          newestComments.generateHtml(JSON.parse(data), $dom)
+        } else {
+          getComment($dom)
+        }
+      }
+    },
+
+    run: (name, getComment) => {
+      newestComments.newestCommentInit(name, getComment)
+      btf.addGlobalFn('pjaxComplete', () => newestComments.newestCommentInit(name, getComment), name)
+    }
+  }

layout/includes/third-party/newest-comments/disqus-comment.pug

@@ -1,21 +1,12 @@
+!= partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
+
 script.
   window.addEventListener('load', () => {
-    const changeContent = (content) => {
-      if (content === '') return content
+    const keyName = 'disqus-newest-comments'
+    const { changeContent, generateHtml, run } = window.newestComments
 
-      content = content.replace(/<img.*?src="(.*?)"?[^\>]+>/ig, '[!{_p("aside.card_newest_comments.image")}]') // replace image link
-      content = content.replace(/<a[^>]+?href=["']?([^"']+)["']?[^>]*>([^<]+)<\/a>/gi, '[!{_p("aside.card_newest_comments.link")}]') // replace url
-      content = content.replace(/<code>.*?<\/code>/gi, '[!{_p("aside.card_newest_comments.code")}]') // replace code
-      content = content.replace(/<[^>]+>/g,"") // remove html tag
-
-      if (content.length > 150) {
-        content = content.substring(0,150) + '...'
-      }
-      return content
-    }
-
-    const getComment = () => {
-      fetch('https://disqus.com/api/3.0/forums/listPosts.json?forum=!{forum}&related=thread&limit=!{theme.newest_comments.limit}&api_key=!{apiKey}')
+    const getComment = ele => {
+      fetch('https://disqus.com/api/3.0/forums/listPosts.json?forum=!{forum}&related=thread&limit=!{theme.aside.card_newest_comments.limit}&api_key=!{apiKey}')
         .then(response => response.json())
         .then(data => {
           const disqusArray = data.response.map(item => {
@@ -28,54 +19,15 @@ script.
             }
           })
 
-          saveToLocal.set('disqus-newest-comments', JSON.stringify(disqusArray), !{theme.newest_comments.storage}/(60*24))
-          generateHtml(disqusArray)
+          btf.saveToLocal.set(keyName, JSON.stringify(disqusArray), !{theme.aside.card_newest_comments.storage}/(60*24))
+          generateHtml(disqusArray, ele)
         }).catch(e => {
-          const $dom = document.querySelector('#card-newest-comments .aside-list')
-          $dom.textContent= "!{_p('aside.card_newest_comments.error')}"
+          console.error(e)
+          ele.textContent= "!{_p('aside.card_newest_comments.error')}"
         })
     }
 
-    const generateHtml = array => {
-      let result = ''
-
-      if (array.length) {
-        for (let i = 0; i < array.length; i++) {
-          result += '<div class=\'aside-list-item\'>'
-
-          if (!{theme.newest_comments.avatar}) {
-            const name = '!{theme.lazyload.enable ? "data-lazy-src" : "src"}'
-            result += `<a href='${array[i].url}' class='thumbnail'><img ${name}='${array[i].avatar}' alt='${array[i].nick}'></a>`
-          }
-          
-          result += `<div class='content'>
-          <a class='comment' href='${array[i].url}' title='${array[i].content}'>${array[i].content}</a>
-          <div class='name'><span>${array[i].nick}</span><time> / ${btf.diffDate(array[i].date, true)}</time></div>
-          </div></div>`
-        }
-      } else {
-        result += '!{_p("aside.card_newest_comments.zero")}'
-      }
-
-      let $dom = document.querySelector('#card-newest-comments .aside-list')
-      $dom && ($dom.innerHTML= result)
-      window.lazyLoadInstance && window.lazyLoadInstance.update()
-      window.pjax && window.pjax.refresh($dom)
-    }
-
-    const newestCommentInit = () => {
-      if (document.querySelector('#card-newest-comments .aside-list')) {
-        const data = saveToLocal.get('disqus-newest-comments')
-        if (data) {
-          generateHtml(JSON.parse(data))
-        } else {
-          getComment()
-        }
-      }
-    }
-
-    newestCommentInit()
-    document.addEventListener('pjax:complete', newestCommentInit)
+    run(keyName, getComment)
   })
 
 

layout/includes/third-party/newest-comments/github-issues.pug

@@ -1,20 +1,11 @@
+!= partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
+
 script.
   window.addEventListener('load', () => {
-    const changeContent = (content) => {
-      if (content === '') return content
+    const keyName = 'github-newest-comments'
+    const { changeContent, generateHtml, run } = window.newestComments
 
-      content = content.replace(/<img.*?src="(.*?)"?[^\>]+>/ig, '[!{_p("aside.card_newest_comments.image")}]') // replace image link
-      content = content.replace(/<a[^>]+?href=["']?([^"']+)["']?[^>]*>([^<]+)<\/a>/gi, '[!{_p("aside.card_newest_comments.link")}]') // replace url
-      content = content.replace(/<pre><code>.*?<\/pre>/gi, '[!{_p("aside.card_newest_comments.code")}]') // replace code
-      content = content.replace(/<[^>]+>/g,"") // remove html tag
-
-      if (content.length > 150) {
-        content = content.substring(0,150) + '...'
-      }
-      return content
-    }
-
-    const findTrueUrl = (array) => {
+    const findTrueUrl = (array, ele) => {
       Promise.all(array.map(item =>
         fetch(item.url).then(resp => resp.json()).then(data => {
           let urlArray = data.body ? data.body.match(/(https?:\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*\/?/ig) : []
@@ -35,13 +26,13 @@ script.
             }
           })
 
-          saveToLocal.set('github-newest-comments', JSON.stringify(array), !{theme.newest_comments.storage}/(60*24))
-          generateHtml(array)
+          btf.saveToLocal.set(keyName, JSON.stringify(array), !{theme.aside.card_newest_comments.storage}/(60*24))
+          generateHtml(array, ele)
       });
     }
 
-    const getComment = () => {
-      fetch('https://api.github.com/repos/!{userRepo}/issues/comments?sort=updated&direction=desc&per_page=!{theme.newest_comments.limit}&page=1',{
+    const getComment = ele => {
+      fetch('https://api.github.com/repos/!{userRepo}/issues/comments?sort=updated&direction=desc&per_page=!{theme.aside.card_newest_comments.limit}&page=1',{
         "headers": {
           Accept: 'application/vnd.github.v3.html+json'
         }
@@ -54,57 +45,16 @@ script.
               'content': changeContent(item.body_html || item.body),
               'nick': item.user.login,
               'url': item.issue_url,
-              'date': item.updated_at,
-              'githubUrl': item.html_url
+              'date': item.updated_at
             }
           })
-          findTrueUrl(githubArray)
+          findTrueUrl(githubArray, ele)
         }).catch(e => {
-          const $dom = document.querySelector('#card-newest-comments .aside-list')
-          $dom.textContent= "!{_p('aside.card_newest_comments.error')}"
+          console.error(e)
+          ele.textContent= "!{_p('aside.card_newest_comments.error')}"
         })
     }
-
-    const generateHtml = array => {
-      let result = ''
-
-      if (array.length) {
-        for (let i = 0; i < array.length; i++) {
-          result += '<div class=\'aside-list-item\'>'
-
-          if (!{theme.newest_comments.avatar}) {
-            const name = '!{theme.lazyload.enable ? "data-lazy-src" : "src"}'
-            result += `<a href='${array[i].url}' class='thumbnail'><img ${name}='${array[i].avatar}' alt='${array[i].nick}'></a>`
-          }
-
-          result += `<div class='content'>
-          <a class='comment' href='${array[i].url}' title='${array[i].content}'>${array[i].content}</a>
-          <div class='name'><span>${array[i].nick} / </span><time datetime="${array[i].date}">${btf.diffDate(array[i].date, true)}</time></div>
-          </div></div>`
-        }
-      } else {
-        result += '!{_p("aside.card_newest_comments.zero")}'
-      }
-
-      let $dom = document.querySelector('#card-newest-comments .aside-list')
-      $dom && ($dom.innerHTML= result)
-      window.lazyLoadInstance && window.lazyLoadInstance.update()
-      window.pjax && window.pjax.refresh($dom)
-    }
-
-    const newestCommentInit = () => {
-      if (document.querySelector('#card-newest-comments .aside-list')) {
-        const data = saveToLocal.get('github-newest-comments')
-        if (data) {
-          generateHtml(JSON.parse(data))
-        } else {
-          getComment()
-        }
-      }
-    }
-
-    newestCommentInit()
-    document.addEventListener('pjax:complete', newestCommentInit)
+    run(keyName, getComment)
   })
 
 

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

@@ -2,52 +2,14 @@
 
 script.
   window.addEventListener('load', () => {
-    const changeContent = (content) => {
-      if (content === '') return content
+    const keyName = 'remark42-newest-comments'
+    const { changeContent, generateHtml, run } = window.newestComments
 
-      content = content.replace(/<img.*?src="(.*?)"?[^\>]+>/ig, '[!{_p("aside.card_newest_comments.image")}]') // replace image link
-      content = content.replace(/<a[^>]+?href=["']?([^"']+)["']?[^>]*>([^<]+)<\/a>/gi, '[!{_p("aside.card_newest_comments.link")}]') // replace url
-      content = content.replace(/<pre><code>.*?<\/pre>/gi, '[!{_p("aside.card_newest_comments.code")}]') // replace code
-      content = content.replace(/<[^>]+>/g,"") // remove html tag
-
-      if (content.length > 150) {
-        content = content.substring(0,150) + '...'
-      }
-      return content
-    }
-
-    const generateHtml = array => {
-      let result = ''
-
-      if (array.length) {
-        for (let i = 0; i < array.length; i++) {
-          result += '<div class=\'aside-list-item\'>'
-
-          if (!{theme.newest_comments.avatar}) {
-            const name = '!{theme.lazyload.enable ? "data-lazy-src" : "src"}'
-            result += `<a href='${array[i].url}' class='thumbnail'><img ${name}='${array[i].avatar}' alt='${array[i].nick}'></a>`
-          }
-
-          result += `<div class='content'>
-          <a class='comment' href='${array[i].url}' title='${array[i].content}'>${array[i].content}</a>
-          <div class='name'><span>${array[i].nick} / </span><time datetime="${array[i].date}">${btf.diffDate(array[i].date, true)}</time></div>
-          </div></div>`
-        }
-      } else {
-        result += '!{_p("aside.card_newest_comments.zero")}'
-      }
-
-      let $dom = document.querySelector('#card-newest-comments .aside-list')
-      $dom && ($dom.innerHTML= result)
-      window.lazyLoadInstance && window.lazyLoadInstance.update()
-      window.pjax && window.pjax.refresh($dom)
-    }
-
-    const getComment = () => {
-      fetch('!{host}/api/v1/last/!{theme.newest_comments.limit}?site=!{siteId}')
+    const getComment = ele => {
+      fetch('!{host}/api/v1/last/!{theme.aside.card_newest_comments.limit}?site=!{siteId}')
         .then(response => response.json())
         .then(data => {
-          const remark42 = data.map(function (e) {
+          const remark42 = data.map(e => {
             return {
               'avatar': e.user.picture,
               'content': changeContent(e.text),
@@ -56,25 +18,13 @@ script.
               'date': e.time,
             }
           })
-          saveToLocal.set('remark42-newest-comments', JSON.stringify(remark42), !{theme.newest_comments.storage}/(60*24))
-          generateHtml(remark42)
+          btf.saveToLocal.set(keyName, JSON.stringify(remark42), !{theme.aside.card_newest_comments.storage}/(60*24))
+          generateHtml(remark42, ele)
         }).catch(e => {
-          const $dom = document.querySelector('#card-newest-comments .aside-list')
-          $dom.textContent= "!{_p('aside.card_newest_comments.error')}"
+          console.error(e)
+          ele.textContent= "!{_p('aside.card_newest_comments.error')}"
         })
     }
 
-    const newestCommentInit = () => {
-      if (document.querySelector('#card-newest-comments .aside-list')) {
-        const data = saveToLocal.get('remark42-newest-comments')
-        if (data) {
-          generateHtml(JSON.parse(data))
-        } else {
-          getComment()
-        }
-      }
-    }
-
-    newestCommentInit()
-    document.addEventListener('pjax:complete', newestCommentInit)
+    run(keyName, getComment)
   })

layout/includes/third-party/newest-comments/twikoo-comment.pug

@@ -1,27 +1,18 @@
+!= partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
+
 script.
   window.addEventListener('load', () => {
-    const changeContent = (content) => {
-      if (content === '') return content
+    const keyName = 'twikoo-newest-comments'
+    const { changeContent, generateHtml, run } = window.newestComments
 
-      content = content.replace(/<img.*?src="(.*?)"?[^\>]+>/ig, '[!{_p("aside.card_newest_comments.image")}]') // replace image link
-      content = content.replace(/<a[^>]+?href=["']?([^"']+)["']?[^>]*>([^<]+)<\/a>/gi, '[!{_p("aside.card_newest_comments.link")}]') // replace url
-      content = content.replace(/<pre><code>.*?<\/pre>/gi, '[!{_p("aside.card_newest_comments.code")}]') // replace code
-      content = content.replace(/<[^>]+>/g,"") // remove html tag
-
-      if (content.length > 150) {
-        content = content.substring(0,150) + '...'
-      }
-      return content
-    }
-
-    const getComment = () => {
+    const getComment = ele => {
       const runTwikoo = () => {
         twikoo.getRecentComments({
           envId: '!{theme.twikoo.envId}',
           region: '!{theme.twikoo.region}',
-          pageSize: !{theme.newest_comments.limit},
+          pageSize: !{theme.aside.card_newest_comments.limit},
           includeReply: true
-        }).then(function (res) {
+        }).then(res => {
           const twikooArray = res.map(e => {
             return {
               'content': changeContent(e.comment),
@@ -32,61 +23,22 @@ script.
             }
           })
 
-          saveToLocal.set('twikoo-newest-comments', JSON.stringify(twikooArray), !{theme.newest_comments.storage}/(60*24))
-          generateHtml(twikooArray)
-        }).catch(function (err) {
-          const $dom = document.querySelector('#card-newest-comments .aside-list')
-          $dom.textContent= "!{_p('aside.card_newest_comments.error')}"
+          btf.saveToLocal.set(keyName, JSON.stringify(twikooArray), !{theme.aside.card_newest_comments.storage}/(60*24))
+          generateHtml(twikooArray, ele)
+        }).catch(err => {
+          console.error(err)
+          ele.textContent= "!{_p('aside.card_newest_comments.error')}"
         })
       }
 
       if (typeof twikoo === 'object') {
         runTwikoo()
       } else {
-        getScript('!{url_for(theme.asset.twikoo)}').then(runTwikoo)
+        btf.getScript('!{url_for(theme.asset.twikoo)}').then(runTwikoo)
       }
     }
 
-    const generateHtml = array => {
-      let result = ''
-
-      if (array.length) {
-        for (let i = 0; i < array.length; i++) {
-          result += '<div class=\'aside-list-item\'>'
-
-          if (!{theme.newest_comments.avatar}) {
-            const name = '!{theme.lazyload.enable ? "data-lazy-src" : "src"}'
-            result += `<a href='${array[i].url}' class='thumbnail'><img ${name}='${array[i].avatar}' alt='${array[i].nick}'></a>`
-          }
-          
-          result += `<div class='content'>
-          <a class='comment' href='${array[i].url}' title='${array[i].content}'>${array[i].content}</a>
-          <div class='name'><span>${array[i].nick} / </span><time datetime="${array[i].date}">${btf.diffDate(array[i].date, true)}</time></div>
-          </div></div>`
-        }
-      } else {
-        result += '!{_p("aside.card_newest_comments.zero")}'
-      }
-
-      let $dom = document.querySelector('#card-newest-comments .aside-list')
-      $dom && ($dom.innerHTML= result)
-      window.lazyLoadInstance && window.lazyLoadInstance.update()
-      window.pjax && window.pjax.refresh($dom)
-    }
-
-    const newestCommentInit = () => {
-      if (document.querySelector('#card-newest-comments .aside-list')) {
-        const data = saveToLocal.get('twikoo-newest-comments')
-        if (data) {
-          generateHtml(JSON.parse(data))
-        } else {
-          getComment()
-        }
-      }
-    }
-
-    newestCommentInit()
-    document.addEventListener('pjax:complete', newestCommentInit)
+    run(keyName, getComment)
   })
 
 

layout/includes/third-party/newest-comments/valine.pug

@@ -1,21 +1,12 @@
 - let default_avatar = theme.valine.avatar
 
 script(src=url_for(theme.asset.blueimp_md5))
+!= partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
+
 script.
   window.addEventListener('load', () => {
-    const changeContent = (content) => {
-      if (content === '') return content
-
-      content = content.replace(/<img.*?src="(.*?)"?[^\>]+>/ig, '[!{_p("aside.card_newest_comments.image")}]') // replace image link
-      content = content.replace(/<a[^>]+?href=["']?([^"']+)["']?[^>]*>([^<]+)<\/a>/gi, '[!{_p("aside.card_newest_comments.link")}]') // replace url
-      content = content.replace(/<pre><code>.*?<\/pre>/gi, '[!{_p("aside.card_newest_comments.code")}]') // replace code
-      content = content.replace(/<[^>]+>/g,"") // remove html tag
-
-      if (content.length > 150) {
-        content = content.substring(0,150) + '...'
-      }
-      return content
-    }
+    const keyName = 'valine-newest-comments'
+    const { changeContent, generateHtml, run } = window.newestComments
 
     const getIcon = (icon, mail) => {
       if (icon) return icon
@@ -24,34 +15,7 @@ script.
       return iconUrl
     }
 
-    const generateHtml = array => {
-      let result = ''
-
-      if (array.length) {
-        for (let i = 0; i < array.length; i++) {
-          result += '<div class=\'aside-list-item\'>'
-
-          if (!{theme.newest_comments.avatar}) {
-            const name = '!{theme.lazyload.enable ? "data-lazy-src" : "src"}'
-            result += `<a href='${array[i].url}' class='thumbnail'><img ${name}='${array[i].avatar}' alt='${array[i].nick}'></a>`
-          }
-
-          result += `<div class='content'>
-          <a class='comment' href='${array[i].url}' title='${array[i].content}'>${array[i].content}</a>
-          <div class='name'><span>${array[i].nick} / </span><time datetime="${array[i].date}">${btf.diffDate(array[i].date, true)}</time></div>
-          </div></div>`
-        }
-      } else {
-        result += '!{_p("aside.card_newest_comments.zero")}'
-      }
-
-      let $dom = document.querySelector('#card-newest-comments .aside-list')
-      $dom && ($dom.innerHTML= result)
-      window.lazyLoadInstance && window.lazyLoadInstance.update()
-      window.pjax && window.pjax.refresh($dom)
-    }
-
-    const getComment = () => {
+    const getComment = ele => {
       const serverURL = '!{theme.valine.serverURLs || `https://${theme.valine.appId.substring(0,8)}.api.lncldglobal.com` }'
 
       var settings = {
@@ -63,10 +27,10 @@ script.
         },
       }
 
-      fetch(`${serverURL}/1.1/classes/Comment?limit=!{theme.newest_comments.limit}&order=-createdAt`,settings)
+      fetch(`${serverURL}/1.1/classes/Comment?limit=!{theme.aside.card_newest_comments.limit}&order=-createdAt`,settings)
         .then(response => response.json())
         .then(data => {
-          const valineArray = data.results.map(function (e) {
+          const valineArray = data.results.map(e => {
             return {
               'avatar': getIcon(e.QQAvatar, e.mail),
               'content': changeContent(e.comment),
@@ -75,25 +39,13 @@ script.
               'date': e.updatedAt,
             }
           })
-          saveToLocal.set('valine-newest-comments', JSON.stringify(valineArray), !{theme.newest_comments.storage}/(60*24))
-          generateHtml(valineArray)
+          btf.saveToLocal.set(keyName, JSON.stringify(valineArray), !{theme.aside.card_newest_comments.storage}/(60*24))
+          generateHtml(valineArray, ele)
         }).catch(e => {
-          const $dom = document.querySelector('#card-newest-comments .aside-list')
-          $dom.textContent= "!{_p('aside.card_newest_comments.error')}"
-        }) 
+          console.error(e)
+          ele.textContent= "!{_p('aside.card_newest_comments.error')}"
+        })
     }
 
-    const newestCommentInit = () => {
-      if (document.querySelector('#card-newest-comments .aside-list')) {
-        const data = saveToLocal.get('valine-newest-comments')
-        if (data) {
-          generateHtml(JSON.parse(data))
-        } else {
-          getComment()
-        }
-      }
-    }
-
-    newestCommentInit()
-    document.addEventListener('pjax:complete', newestCommentInit)
+    run(keyName, getComment)
   })

layout/includes/third-party/newest-comments/waline.pug

@@ -1,51 +1,15 @@
 - const serverURL = theme.waline.serverURL.replace(/\/$/, '')
 
+!= partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
+
 script.
   window.addEventListener('load', () => {
-    const changeContent = content => {
-      if (content === '') return content
+    const keyName = 'waline-newest-comments'
+    const { changeContent, generateHtml, run } = window.newestComments
 
-      content = content.replace(/<img.*?src="(.*?)"?[^\>]+>/ig, '[!{_p("aside.card_newest_comments.image")}]') // replace image link
-      content = content.replace(/<a[^>]+?href=["']?([^"']+)["']?[^>]*>([^<]+)<\/a>/gi, '[!{_p("aside.card_newest_comments.link")}]') // replace url
-      content = content.replace(/<pre><code>.*?<\/pre>/gi, '[!{_p("aside.card_newest_comments.code")}]') // replace code
-      content = content.replace(/<[^>]+>/g,"") // remove html tag
-
-      if (content.length > 150) {
-        content = content.substring(0,150) + '...'
-      }
-      return content
-    }
-
-    const generateHtml = array => {
-      let result = ''
-
-      if (array.length) {
-        for (let i = 0; i < array.length; i++) {
-          result += '<div class=\'aside-list-item\'>'
-
-          if (!{theme.newest_comments.avatar}) {
-            const name = '!{theme.lazyload.enable ? "data-lazy-src" : "src"}'
-            result += `<a href='${array[i].url}' class='thumbnail'><img ${name}='${array[i].avatar}' alt='${array[i].nick}'></a>`
-          }
-
-          result += `<div class='content'>
-          <a class='comment' href='${array[i].url}' title='${array[i].content}'>${array[i].content}</a>
-          <div class='name'><span>${array[i].nick} / </span><time datetime="${array[i].date}">${btf.diffDate(array[i].date, true)}</time></div>
-          </div></div>`
-        }
-      } else {
-        result += '!{_p("aside.card_newest_comments.zero")}'
-      }
-
-      let $dom = document.querySelector('#card-newest-comments .aside-list')
-      $dom && ($dom.innerHTML= result)
-      window.lazyLoadInstance && window.lazyLoadInstance.update()
-      window.pjax && window.pjax.refresh($dom)
-    }
-
-    const getComment = async () => {
+    const getComment = async (ele) => {
       try {
-        const res = await fetch('!{serverURL}/api/comment?type=recent&count=!{theme.newest_comments.limit}', { method: 'GET' })
+        const res = await fetch('!{serverURL}/api/comment?type=recent&count=!{theme.aside.card_newest_comments.limit}', { method: 'GET' })
         const result = await res.json()
         const walineArray = result.data.map(e => {
           return {
@@ -56,26 +20,13 @@ script.
             'date': e.time || e.insertedAt
           }
         })
-        saveToLocal.set('waline-newest-comments', JSON.stringify(walineArray), !{theme.newest_comments.storage}/(60*24))
-        generateHtml(walineArray)
+        btf.saveToLocal.set(keyName, JSON.stringify(walineArray), !{theme.aside.card_newest_comments.storage}/(60*24))
+        generateHtml(walineArray, ele)
       } catch (err) {
         console.error(err)
-        const $dom = document.querySelector('#card-newest-comments .aside-list')
-        $dom.textContent= "!{_p('aside.card_newest_comments.error')}"
+        ele.textContent= "!{_p('aside.card_newest_comments.error')}"
       }
     }
 
-    const newestCommentInit = () => {
-      if (document.querySelector('#card-newest-comments .aside-list')) {
-        const data = saveToLocal.get('waline-newest-comments')
-        if (data) {
-          generateHtml(JSON.parse(data))
-        } else {
-          getComment()
-        }
-      }
-    }
-
-    newestCommentInit()
-    document.addEventListener('pjax:complete', newestCommentInit)
+    run(keyName, getComment)
   })

layout/includes/third-party/pangu.pug

@@ -1,20 +1,23 @@
 script.
-  function panguFn () {
-    if (typeof pangu === 'object') pangu.autoSpacingPage()
-    else {
-      getScript('!{url_for(theme.asset.pangu)}')
-        .then(() => {
-          pangu.autoSpacingPage()
-        })
+  (() => {
+    const panguFn = () => {
+      if (typeof pangu === 'object') pangu.autoSpacingPage()
+      else {
+        btf.getScript('!{url_for(theme.asset.pangu)}')
+          .then(() => {
+            pangu.autoSpacingPage()
+          })
+      }
     }
-  }
 
-  function panguInit () {
-    if (!{theme.pangu.field === 'post'}){
-      GLOBAL_CONFIG_SITE.isPost && panguFn()
-    } else {
-      panguFn()
+    const panguInit = () => {
+      if (!{theme.pangu.field === 'post'}){
+        GLOBAL_CONFIG_SITE.isPost && panguFn()
+      } else {
+        panguFn()
+      }
     }
-  }
 
-  document.addEventListener('DOMContentLoaded', panguInit)
+    btf.addGlobalFn('pjaxComplete', panguInit, 'pangu')
+    document.addEventListener('DOMContentLoaded', panguInit)
+  })()

layout/includes/third-party/pjax.pug

@@ -1,9 +1,9 @@
 - var pjaxExclude = 'a:not([target="_blank"])'
 if theme.pjax.exclude
   each val in theme.pjax.exclude
-    - pjaxExclude = pjaxExclude + `:not([href="${val}"])`
+    - pjaxExclude += `:not([href="${val}"])`
 
-- let pjaxSelectors = ['head > title','#config-diff','#body-wrap','#rightside-config-hide','#rightside-config-show','.js-pjax']
+- let pjaxSelectors = ['head > title', '#config-diff', '#body-wrap', '#rightside-config-hide', '#rightside-config-show', '.js-pjax']
 
 - let choose = theme.comments.use
 if choose
@@ -14,70 +14,50 @@ if choose
 
 script(src=url_for(theme.asset.pjax))
 script.
-  let pjaxSelectors = !{JSON.stringify(pjaxSelectors)}
+  (() => {
+    const pjaxSelectors = !{JSON.stringify(pjaxSelectors)}
 
-  var pjax = new Pjax({
-    elements: '!{pjaxExclude}',
-    selectors: pjaxSelectors,
-    cacheBust: false,
-    analytics: !{theme.google_analytics ? true : false},
-    scrollRestoration: false
-  })
-
-  document.addEventListener('pjax:send', function () {
-
-    // removeEventListener
-    btf.removeGlobalFnEvent('pjax')
-    btf.removeGlobalFnEvent('themeChange')
-
-    document.getElementById('rightside').classList.remove('rightside-show')
-    
-    if (window.aplayers) {
-      for (let i = 0; i < window.aplayers.length; i++) {
-        if (!window.aplayers[i].options.fixed) {
-          window.aplayers[i].destroy()
-        }
-      }
-    }
-
-    typeof typed === 'object' && typed.destroy()
-
-    //reset readmode
-    const $bodyClassList = document.body.classList
-    $bodyClassList.contains('read-mode') && $bodyClassList.remove('read-mode')
-
-    typeof disqusjs === 'object' && disqusjs.destroy()
-  })
-
-  document.addEventListener('pjax:complete', function () {
-    window.refreshFn()
-
-    document.querySelectorAll('script[data-pjax]').forEach(item => {
-      const newScript = document.createElement('script')
-      const content = item.text || item.textContent || item.innerHTML || ""
-      Array.from(item.attributes).forEach(attr => newScript.setAttribute(attr.name, attr.value))
-      newScript.appendChild(document.createTextNode(content))
-      item.parentNode.replaceChild(newScript, item)
+    window.pjax = new Pjax({
+      elements: '!{pjaxExclude}',
+      selectors: pjaxSelectors,
+      cacheBust: false,
+      analytics: !{theme.google_analytics ? true : false},
+      scrollRestoration: false
     })
 
-    GLOBAL_CONFIG.islazyload && window.lazyLoadInstance.update()
-
-    typeof panguInit === 'function' && panguInit()
-
-    // google analytics
-    typeof gtag === 'function' && gtag('config', '!{theme.google_analytics}', {'page_path': window.location.pathname});
-
-    // baidu analytics
-    typeof _hmt === 'object' && _hmt.push(['_trackPageview',window.location.pathname]);
-
-    typeof loadMeting === 'function' && document.getElementsByClassName('aplayer').length && loadMeting()
-
-    // prismjs
-    typeof Prism === 'object' && Prism.highlightAll()
-  })
-
-  document.addEventListener('pjax:error', e => {
-    if (e.request.status === 404) {
-      pjax.loadUrl('!{url_for("/404.html")}')
+    const triggerPjaxFn = (val) => {
+      if (!val) return
+      Object.values(val).forEach(fn => fn())
     }
-  })
+
+    document.addEventListener('pjax:send', () => {
+      // removeEventListener
+      btf.removeGlobalFnEvent('pjaxSendOnce')
+      btf.removeGlobalFnEvent('themeChange')
+
+      // reset readmode
+      const $bodyClassList = document.body.classList
+      if ($bodyClassList.contains('read-mode')) $bodyClassList.remove('read-mode')
+
+      triggerPjaxFn(window.globalFn.pjaxSend)
+    })
+
+    document.addEventListener('pjax:complete', () => {
+      btf.removeGlobalFnEvent('pjaxCompleteOnce')
+      document.querySelectorAll('script[data-pjax]').forEach(item => {
+        const newScript = document.createElement('script')
+        const content = item.text || item.textContent || item.innerHTML || ""
+        Array.from(item.attributes).forEach(attr => newScript.setAttribute(attr.name, attr.value))
+        newScript.appendChild(document.createTextNode(content))
+        item.parentNode.replaceChild(newScript, item)
+      })
+
+      triggerPjaxFn(window.globalFn.pjaxComplete)
+    })
+
+    document.addEventListener('pjax:error', e => {
+      if (e.request.status === 404) {
+        pjax.loadUrl('!{url_for("/404.html")}')
+      }
+    })
+  })()

layout/includes/third-party/prismjs.pug

@@ -1,5 +1,23 @@
-if config.prismjs && config.prismjs.enable && !config.prismjs.preprocess
-  script(src=url_for(theme.asset.prismjs_js))
-  script(src=url_for(theme.asset.prismjs_autoloader))
-  if config.prismjs.line_number
-    script(src=url_for(theme.asset.prismjs_lineNumber_js))
+- const { prismjs_js, prismjs_autoloader, prismjs_lineNumber_js } = theme.asset
+- const { prismjs, syntax_highlighter } = config
+- const { enable, preprocess, line_number } = prismjs
+
+if (syntax_highlighter === 'prismjs' || enable) && !preprocess
+  script.
+    (() => {
+      window.Prism = window.Prism || {}
+      window.Prism.manual = true
+
+      const highlightAll = () => {
+        window.Prism.highlightAll()
+      }
+
+      window.addEventListener('load', highlightAll)
+      btf.addGlobalFn('pjaxComplete', highlightAll, 'prismjs')
+      btf.addGlobalFn('encrypt', highlightAll, 'prismjs')
+    })()
+
+  script(src=url_for(prismjs_js))
+  script(src=url_for(prismjs_autoloader))
+  if (line_number)
+    script(src=url_for(prismjs_lineNumber_js))

layout/includes/third-party/search/docsearch.pug

@@ -1,4 +1,4 @@
-- const { appId, apiKey, indexName, option } = theme.docsearch
+- const { placeholder, docsearch: { appId, apiKey, indexName, option } } = theme.search
 
 .docsearch-wrap
   #docsearch(style="display:none")
@@ -11,6 +11,7 @@
         apiKey: '!{apiKey}',
         indexName: '!{indexName}',
         container: '#docsearch',
+        placeholder: '!{ placeholder || _p("search.input_placeholder")}',
       }, !{JSON.stringify(option)}))
 
       const handleClick = () => {

layout/includes/third-party/search/index.pug

@@ -1,6 +1,7 @@
-if theme.algolia_search.enable
-  include ./algolia.pug
-else if theme.local_search.enable
-  include ./local-search.pug
-else if theme.docsearch.enable
-  include ./docsearch.pug
+case theme.search.use
+  when 'algolia_search'
+    include ./algolia.pug
+  when 'local_search'
+    include ./local-search.pug
+  when 'docsearch'
+    include ./docsearch.pug

layout/includes/third-party/search/local-search.pug

@@ -13,7 +13,7 @@
     .search-wrap
       #local-search-input
         .local-search-box
-          input(placeholder=_p("search.local_search.input_placeholder") type="text").local-search-box--input
+          input(placeholder=theme.search.placeholder || _p("search.input_placeholder") type="text").local-search-box--input
       hr
       #local-search-results
       #local-search-stats-wrap

layout/includes/third-party/share/index.pug

@@ -1,5 +1,9 @@
-.post_share
-  if theme.sharejs.enable
-    include ./share-js.pug
-  else if theme.addtoany.enable
-    !=partial('includes/third-party/share/addtoany', {}, {cache: true})
+- const { use } = theme.share
+
+if use
+  .post-share
+    case use
+      when 'addtoany'
+        !=partial('includes/third-party/share/addtoany', {}, {cache: true})
+      when 'sharejs'
+        include ./share-js.pug

layout/includes/third-party/share/share-js.pug

@@ -1,4 +1,4 @@
 - const coverVal = page.cover_type === 'img' ? page.cover : theme.avatar.img
-.social-share(data-image=url_for(coverVal) data-sites= theme.sharejs.sites)
+.social-share(data-image=url_for(coverVal) data-sites= theme.share.sharejs.sites)
 link(rel='stylesheet' href=url_for(theme.asset.sharejs_css) media="print" onload="this.media='all'")
 script(src=url_for(theme.asset.sharejs) defer)

layout/includes/third-party/subtitle.pug

@@ -3,7 +3,7 @@
 
 script.
   window.typedJSFn = {
-    init: (str) => {
+    init: str => {
       window.typed = new Typed('#subtitle', Object.assign({
         strings: str,
         startDelay: 300,
@@ -12,18 +12,19 @@ script.
         backSpeed: 50,
       }, !{JSON.stringify(typed_option)}))
     },
-    run: (subtitleType) => {
+    run: subtitleType => {
       if (!{effect}) {
         if (typeof Typed === 'function') {
           subtitleType()
         } else {
-          getScript('!{url_for(theme.asset.typed)}').then(subtitleType)
+          btf.getScript('!{url_for(theme.asset.typed)}').then(subtitleType)
         }
       } else {
         subtitleType()
       }
     }
   }
+  btf.addGlobalFn('pjaxSendOnce', () => { typed.destroy() }, 'typedDestroy')
 
 case source
   when 1
@@ -47,7 +48,7 @@ case source
   when 2
     script.
       function subtitleType () {
-        getScript('https://yijuzhan.com/api/word.php?m=js').then(() => {
+        btf.getScript('https://yijuzhan.com/api/word.php?m=js').then(() => {
           const con = str[0]
           if (!{effect}) {
             const from = '出自 ' + str[1]
@@ -64,7 +65,7 @@ case source
   when 3
     script.
       function subtitleType () {
-        getScript('https://sdk.jinrishici.com/v2/browser/jinrishici.js').then(() => {
+        btf.getScript('https://sdk.jinrishici.com/v2/browser/jinrishici.js').then(() => {
           jinrishici.load(result =>{
             if (!{effect}) {
               const sub = !{JSON.stringify(subContent)}

layout/includes/third-party/umami_analytics.pug

@@ -0,0 +1,65 @@
+- let { serverURL, website_id, option, UV_PV } = theme.umami_analytics
+- const isServerURL = !!serverURL
+- const baseURL = serverURL ? serverURL.replace(/\/$/, '') : 'https://cloud.umami.is'
+- const apiUrl = serverURL ? serverURL.replace(/\/$/, '') + '/api' : 'https://api.umami.is/v1'
+
+script.
+  (() => {
+    const option = !{JSON.stringify(option)}
+    const config = !{JSON.stringify(UV_PV)}
+
+    const runTrack = () => {
+      umami.track(props => ({ ...props, url: window.location.pathname, title: GLOBAL_CONFIG_SITE.title }))
+    }
+
+    const loadUmamiJS = () => {
+      btf.getScript('!{baseURL}/script.js', {
+        'data-website-id': '!{website_id}',
+        'data-auto-track': 'false',
+        ...option
+      }).then(runTrack)
+    }
+
+    const getData = async (isPost) => {
+      const now = Date.now()
+      const keyUrl = isPost ? `&url=${window.location.pathname}` : ''
+      const headerList = { 'Accept': 'application/json' }
+      if (!{isServerURL}) headerList['Authorization'] = `Bearer ${config.token}`
+      else headerList['x-umami-api-key'] = config.token
+      const res = await fetch(`!{apiUrl}/websites/!{website_id}/stats?startAt=0000000000&endAt=${now}${keyUrl}`, {
+        method: "GET",
+        headers: headerList
+      })
+      return await res.json()
+    }
+
+    const insertData = async () => {
+      try {
+        if (GLOBAL_CONFIG_SITE.isPost && config.page_pv) {
+          const pagePV = document.getElementById('umamiPV')
+          if (pagePV) {
+            const data = await getData(true)
+            pagePV.textContent = data.pageviews.value
+          }
+        } else {
+          const data = (config.site_uv || config.site_pv) && await getData()
+          if (config.site_uv) {
+            const siteUV = document.getElementById('umami-site-uv')
+            if (siteUV) siteUV.textContent = data.visitors.value
+          }
+          if (config.site_pv) {
+            const sitePV = document.getElementById('umami-site-pv')
+            if (sitePV) sitePV.textContent = data.pageviews.value
+          }
+        }
+      } catch (e) {
+        console.error('Failed to load Umami Analytics:', e)
+      }
+    }
+
+    btf.addGlobalFn('pjaxComplete', runTrack, 'umami_analytics_run_track')
+    btf.addGlobalFn('pjaxComplete', insertData, 'umami_analytics_insert')
+
+    loadUmamiJS()
+    insertData()
+  })()