feat: 修改 toc 打開效果

feat: 適配 hexo-blog-encrypt
fix: 修復 hexo 新版本下，prismjs 的問題
improvement: 在 pjax 關閉的情況下。減少不必要的全局變量
improvement: 更新依賴版本
improvement: 頁面進入效果優化
improvement: 添加平滑滾動
improvement: 兼容性優化
improvement: 優化 lighthouse 分數
improvement: 優化代碼

layout/includes/head.pug

@@ -48,6 +48,8 @@ if (theme.snackbar && theme.snackbar.enable)
 if theme.fancybox
   link(rel='stylesheet' href=url_for(theme.asset.fancybox_css) media="print" onload="this.media='all'")
 
+!=fragment_cache('injectHeadJs', function(){return inject_head_js()})
+
 //- google_adsense
 !=partial('includes/head/google_adsense', {}, {cache: true})
 
@@ -63,6 +65,4 @@ if theme.blog_title_font && theme.blog_title_font.font_link
 
 include ./head/config_site.pug
 
-!=fragment_cache('injectHeadJs', function(){return inject_head_js()})
-
 !=fragment_cache('injectHead', function(){return injectHtml(theme.inject.head)})

layout/includes/head/analytics.pug

@@ -7,14 +7,20 @@ if theme.baidu_analytics
       var s = document.getElementsByTagName("script")[0]; 
       s.parentNode.insertBefore(hm, s);
     })();
+    btf.addGlobalFn('pjaxComplete', () => {
+      _hmt.push(['_trackPageview',window.location.pathname])
+    }, 'baidu_analytics')
 
 if theme.google_analytics
   script(async src=`https://www.googletagmanager.com/gtag/js?id=${theme.google_analytics}`)
   script.
-    window.dataLayer = window.dataLayer || [];
-    function gtag(){dataLayer.push(arguments);}
-    gtag('js', new Date());
-    gtag('config', '!{theme.google_analytics}');
+    window.dataLayer = window.dataLayer || []
+    function gtag(){dataLayer.push(arguments)}
+    gtag('js', new Date())
+    gtag('config', '!{theme.google_analytics}')
+    btf.addGlobalFn('pjaxComplete', () => {
+      gtag('config', '!{theme.google_analytics}', {'page_path': window.location.pathname})
+    }, 'google_analytics')
 
 if theme.cloudflare_analytics
   script(defer data-pjax src='https://static.cloudflareinsights.com/beacon.min.js' data-cf-beacon=`{"token": "${theme.cloudflare_analytics}"}`)

layout/includes/header/menu_item.pug

@@ -12,7 +12,7 @@ if theme.menu
         .menus_item
           - const labelArray = label.split('||')
           - const hideClass = labelArray[2] && trim(labelArray[2]) === 'hide' ? 'hide' : ''
-          a.site-page.group(class=`${hideClass}` href='javascript:void(0);')
+          span.site-page.group(class=`${hideClass}`)
             if labelArray[1]
               i.fa-fw(class=trim(labelArray[1]))
             span=' '+ trim(labelArray[0])

layout/includes/header/nav.pug

@@ -2,20 +2,20 @@ nav#nav
   span#blog-info
     a(href=url_for('/') title=config.title)
       if theme.nav.logo
-        img.site-icon(src=url_for(theme.nav.logo))
+        img.site-icon(src=url_for(theme.nav.logo) alt='Logo')
       if theme.nav.display_title
         span.site-name=config.title
     
   #menus
     if (theme.algolia_search.enable || theme.local_search.enable || theme.docsearch.enable)
       #search-button
-        a.site-page.social-icon.search(href="javascript:void(0);")
+        span.site-page.social-icon.search
           i.fas.fa-search.fa-fw
           span=' '+_p('search.title')
     !=partial('includes/header/menu_item', {}, {cache: true})
 
     #toggle-menu
-      a.site-page(href="javascript:void(0);")
+      span.site-page
         i.fas.fa-bars.fa-fw
 
 

layout/includes/loading/fullpage-loading.pug

@@ -27,7 +27,7 @@ script.
     window.addEventListener('load',() => { preloader.endLoading() })
 
     if (!{theme.pjax && theme.pjax.enable}) {
-      document.addEventListener('pjax:send', () => { preloader.initLoading() })
-      document.addEventListener('pjax:complete', () => { preloader.endLoading() })
+      btf.addGlobalFn('pjaxSend', () => { preloader.initLoading() }, 'preloader_init')
+      btf.addGlobalFn('pjaxComplete', () => { preloader.endLoading() }, 'preloader_end')
     }
   })()

layout/includes/loading/pace.pug

@@ -3,9 +3,10 @@ script.
     restartOnPushState: false
   }
 
-  document.addEventListener('pjax:send', () => {
+  btf.addGlobalFn('pjaxSend', () => {
     Pace.restart()
-  })
+  }, 'pace_restart')
+
 
 link(rel="stylesheet", href=url_for(theme.preloader.pace_css_url || theme.asset.pace_default_css))
 script(src=url_for(theme.asset.pace_js))

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/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))
+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 loadMeting = () => {
+        typeof loadMeting === 'function' && document.getElementsByClassName('aplayer').length && loadMeting()
+      }
+
+      btf.addGlobalFn('pjaxSend', destroyAplayer, 'destroyAplayer')
+      btf.addGlobalFn('pjaxComplete', loadMeting, 'loadMeting')
+    })()

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/comments/artalk.pug

@@ -31,8 +31,8 @@ script.
     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()
       }
     }

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/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/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

@@ -22,14 +22,16 @@ script.
       btf.addGlobalFn('pjax', 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)}')
+        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/katex.pug

@@ -1,9 +1,2 @@
 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'})
-    })
-  })()
-  

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

@@ -1,5 +1,7 @@
 //- Mathjax 3
 script.
+  (() => {
+    const loadMathjax = () => {
       if (!window.MathJax) {
         window.MathJax = {
           tex: {
@@ -36,3 +38,8 @@ script.
         MathJax.texReset()
         MathJax.typesetPromise()
       }
+    }
+
+    btf.addGlobalFn('encrypt', loadMathjax, 'mathjax')
+    window.pjax ? loadMathjax() : window.addEventListener('load', loadMathjax)
+  })()

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

@@ -1,12 +1,10 @@
 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) => {
+      Array.from(ele).forEach((item, index) => {
         const mermaidSrc = item.firstElementChild
         const mermaidThemeConfig = '%%{init:{ \'theme\':\'' + theme + '\'}}%%\n'
         const mermaidID = 'mermaid-' + index
@@ -29,10 +27,14 @@ script.
     }
 
     const loadMermaid = () => {
-      window.loadMermaid ? runMermaid() : getScript('!{url_for(theme.asset.mermaid)}').then(runMermaid)
+      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

@@ -81,7 +81,7 @@ script.
             'date': e.date,
           }
         })
-        saveToLocal.set('artalk-newest-comments', JSON.stringify(artalk), !{theme.newest_comments.storage}/(60*24))
+        btf.saveToLocal.set('artalk-newest-comments', JSON.stringify(artalk), !{theme.newest_comments.storage}/(60*24))
         generateHtml(artalk)
       } catch (e) {
         console.log(e)
@@ -92,7 +92,7 @@ script.
 
     const newestCommentInit = () => {
       if (document.querySelector('#card-newest-comments .aside-list')) {
-        const data = saveToLocal.get('artalk-newest-comments')
+        const data = btf.saveToLocal.get('artalk-newest-comments')
         if (data) {
           generateHtml(JSON.parse(data))
         } else {
@@ -102,5 +102,6 @@ script.
     }
 
     newestCommentInit()
-    document.addEventListener('pjax:complete', newestCommentInit)
+    btf.addGlobalFn('pjaxComplete', newestCommentInit, 'artalk_newestComment')
+
   })

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

@@ -28,7 +28,7 @@ script.
             }
           })
 
-          saveToLocal.set('disqus-newest-comments', JSON.stringify(disqusArray), !{theme.newest_comments.storage}/(60*24))
+          btf.saveToLocal.set('disqus-newest-comments', JSON.stringify(disqusArray), !{theme.newest_comments.storage}/(60*24))
           generateHtml(disqusArray)
         }).catch(e => {
           const $dom = document.querySelector('#card-newest-comments .aside-list')
@@ -65,7 +65,7 @@ script.
 
     const newestCommentInit = () => {
       if (document.querySelector('#card-newest-comments .aside-list')) {
-        const data = saveToLocal.get('disqus-newest-comments')
+        const data = btf.saveToLocal.get('disqus-newest-comments')
         if (data) {
           generateHtml(JSON.parse(data))
         } else {
@@ -75,7 +75,7 @@ script.
     }
 
     newestCommentInit()
-    document.addEventListener('pjax:complete', newestCommentInit)
+    btf.addGlobalFn('pjaxComplete', newestCommentInit, 'disqus_newestComment')
   })
 
 

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

@@ -35,7 +35,7 @@ script.
             }
           })
 
-          saveToLocal.set('github-newest-comments', JSON.stringify(array), !{theme.newest_comments.storage}/(60*24))
+          btf.saveToLocal.set('github-newest-comments', JSON.stringify(array), !{theme.newest_comments.storage}/(60*24))
           generateHtml(array)
       });
     }
@@ -94,7 +94,7 @@ script.
 
     const newestCommentInit = () => {
       if (document.querySelector('#card-newest-comments .aside-list')) {
-        const data = saveToLocal.get('github-newest-comments')
+        const data = btf.saveToLocal.get('github-newest-comments')
         if (data) {
           generateHtml(JSON.parse(data))
         } else {
@@ -104,7 +104,7 @@ script.
     }
 
     newestCommentInit()
-    document.addEventListener('pjax:complete', newestCommentInit)
+    btf.addGlobalFn('pjaxComplete', newestCommentInit, 'github_newestComment')
   })
 
 

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

@@ -56,7 +56,7 @@ script.
               'date': e.time,
             }
           })
-          saveToLocal.set('remark42-newest-comments', JSON.stringify(remark42), !{theme.newest_comments.storage}/(60*24))
+          btf.saveToLocal.set('remark42-newest-comments', JSON.stringify(remark42), !{theme.newest_comments.storage}/(60*24))
           generateHtml(remark42)
         }).catch(e => {
           const $dom = document.querySelector('#card-newest-comments .aside-list')
@@ -66,7 +66,7 @@ script.
 
     const newestCommentInit = () => {
       if (document.querySelector('#card-newest-comments .aside-list')) {
-        const data = saveToLocal.get('remark42-newest-comments')
+        const data = btf.saveToLocal.get('remark42-newest-comments')
         if (data) {
           generateHtml(JSON.parse(data))
         } else {
@@ -76,5 +76,5 @@ script.
     }
 
     newestCommentInit()
-    document.addEventListener('pjax:complete', newestCommentInit)
+    btf.addGlobalFn('pjaxComplete', newestCommentInit, 'remark42_newestComment')
   })

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

@@ -32,7 +32,7 @@ script.
             }
           })
 
-          saveToLocal.set('twikoo-newest-comments', JSON.stringify(twikooArray), !{theme.newest_comments.storage}/(60*24))
+          btf.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')
@@ -43,7 +43,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)
       }
     }
 
@@ -76,7 +76,7 @@ script.
 
     const newestCommentInit = () => {
       if (document.querySelector('#card-newest-comments .aside-list')) {
-        const data = saveToLocal.get('twikoo-newest-comments')
+        const data = btf.saveToLocal.get('twikoo-newest-comments')
         if (data) {
           generateHtml(JSON.parse(data))
         } else {
@@ -86,7 +86,7 @@ script.
     }
 
     newestCommentInit()
-    document.addEventListener('pjax:complete', newestCommentInit)
+    btf.addGlobalFn('pjaxComplete', newestCommentInit, 'twikoo_newestComment')
   })
 
 

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

@@ -75,7 +75,7 @@ script.
               'date': e.updatedAt,
             }
           })
-          saveToLocal.set('valine-newest-comments', JSON.stringify(valineArray), !{theme.newest_comments.storage}/(60*24))
+          btf.saveToLocal.set('valine-newest-comments', JSON.stringify(valineArray), !{theme.newest_comments.storage}/(60*24))
           generateHtml(valineArray)
         }).catch(e => {
           const $dom = document.querySelector('#card-newest-comments .aside-list')
@@ -85,7 +85,7 @@ script.
 
     const newestCommentInit = () => {
       if (document.querySelector('#card-newest-comments .aside-list')) {
-        const data = saveToLocal.get('valine-newest-comments')
+        const data = btf.saveToLocal.get('valine-newest-comments')
         if (data) {
           generateHtml(JSON.parse(data))
         } else {
@@ -95,5 +95,5 @@ script.
     }
 
     newestCommentInit()
-    document.addEventListener('pjax:complete', newestCommentInit)
+    btf.addGlobalFn('pjaxComplete', newestCommentInit, 'valine_newestComment')
   })

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

@@ -56,7 +56,7 @@ script.
             'date': e.time || e.insertedAt
           }
         })
-        saveToLocal.set('waline-newest-comments', JSON.stringify(walineArray), !{theme.newest_comments.storage}/(60*24))
+        btf.saveToLocal.set('waline-newest-comments', JSON.stringify(walineArray), !{theme.newest_comments.storage}/(60*24))
         generateHtml(walineArray)
       } catch (err) {
         console.error(err)
@@ -67,7 +67,7 @@ script.
 
     const newestCommentInit = () => {
       if (document.querySelector('#card-newest-comments .aside-list')) {
-        const data = saveToLocal.get('waline-newest-comments')
+        const data = btf.saveToLocal.get('waline-newest-comments')
         if (data) {
           generateHtml(JSON.parse(data))
         } else {
@@ -77,5 +77,5 @@ script.
     }
 
     newestCommentInit()
-    document.addEventListener('pjax:complete', newestCommentInit)
+    btf.addGlobalFn('pjaxComplete', newestCommentInit, 'waline_newestComment')
   })

layout/includes/third-party/pangu.pug

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

layout/includes/third-party/pjax.pug

@@ -24,34 +24,25 @@ script.
     scrollRestoration: false
   })
 
+  const triggerPjaxFn = (val) => {
+    if (!val) return
+    Object.values(val).forEach(fn => { fn() })
+  }
+
   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()
+    triggerPjaxFn(window.globalFn.pjaxSend)
   })
 
-  document.addEventListener('pjax:complete', function () {
-    window.refreshFn()
-
+  document.addEventListener('pjax:complete', () => {
     document.querySelectorAll('script[data-pjax]').forEach(item => {
       const newScript = document.createElement('script')
       const content = item.text || item.textContent || item.innerHTML || ""
@@ -60,20 +51,7 @@ script.
       item.parentNode.replaceChild(newScript, item)
     })
 
-    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()
+    triggerPjaxFn(window.globalFn.pjaxComplete)
   })
 
   document.addEventListener('pjax:error', e => {

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/subtitle.pug

@@ -17,13 +17,14 @@ script.
         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('pjaxSend', () => { 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)}

package.json

@@ -1,6 +1,6 @@
 {
   "name": "hexo-theme-butterfly",
-  "version": "4.13.0",
+  "version": "4.14.0-b1",
   "description": "A Simple and Card UI Design theme for Hexo",
   "main": "package.json",
   "scripts": {

plugins.yml

@@ -1,11 +1,11 @@
 algolia_search:
   name: algoliasearch
   file: dist/algoliasearch-lite.umd.js
-  version: 4.22.1
+  version: 4.23.2
 instantsearch:
   name: instantsearch.js
   file: dist/instantsearch.production.min.js
-  version: 4.65.0
+  version: 4.66.1
 pjax:
   name: pjax
   file: pjax.min.js
@@ -37,17 +37,17 @@ disqusjs_css:
 twikoo:
   name: twikoo
   file: dist/twikoo.all.min.js
-  version: 1.6.31
+  version: 1.6.32
 waline_js:
   name: '@waline/client'
   file: dist/waline.js
   other_name: waline
-  version: 3.1.2
+  version: 3.1.3
 waline_css:
   name: '@waline/client'
   file: dist/waline.css
   other_name: waline
-  version: 3.1.2
+  version: 3.1.3
 sharejs:
   name: butterfly-extsrc
   file: sharejs/dist/js/social-share.min.js
@@ -64,16 +64,16 @@ katex:
   name: katex
   file: dist/katex.min.css
   other_name: KaTeX
-  version: 0.16.9
+  version: 0.16.10
 katex_copytex:
   name: katex
   file: dist/contrib/copy-tex.min.js
   other_name: KaTeX
-  version: 0.16.9
+  version: 0.16.10
 mermaid:
   name: mermaid
   file: dist/mermaid.min.js
-  version: 10.8.0
+  version: 10.9.0
 canvas_ribbon:
   name: butterfly-extsrc
   file: dist/canvas-ribbon.min.js
@@ -105,7 +105,7 @@ clickShowText:
 lazyload:
   name: vanilla-lazyload
   file: dist/lazyload.iife.min.js
-  version: 17.8.8
+  version: 19.0.5
 instantpage:
   name: instant.page
   file: instantpage.js
@@ -121,12 +121,12 @@ pangu:
 fancybox_css:
   name: '@fancyapps/ui'
   file: dist/fancybox/fancybox.css
-  version: 5.0.33
+  version: 5.0.35
   other_name: fancyapps-ui
 fancybox:
   name: '@fancyapps/ui'
   file: dist/fancybox/fancybox.umd.js
-  version: 5.0.33
+  version: 5.0.35
   other_name: fancyapps-ui
 medium_zoom:
   name: medium-zoom
@@ -180,11 +180,11 @@ prismjs_autoloader:
 artalk_js:
   name: artalk
   file: dist/Artalk.js
-  version: 2.8.2
+  version: 2.8.3
 artalk_css:
   name: artalk
   file: dist/Artalk.css
-  version: 2.8.2
+  version: 2.8.3
 pace_js:
   name: pace-js
   other_name: pace
@@ -199,12 +199,12 @@ docsearch_js:
   name: '@docsearch/js'
   other_name: docsearch-js
   file: dist/umd/index.js
-  version: 3.5.2
+  version: 3.6.0
 docsearch_css:
   name: '@docsearch/css'
   other_name: docsearch-css
   file: dist/style.css
-  version: 3.5.2
+  version: 3.6.0
 abcjs_basic_js:
   name: abcjs
   file: dist/abcjs-basic-min.js

scripts/helpers/inject_head_js.js

@@ -6,16 +6,16 @@
 'use strict'
 
 hexo.extend.helper.register('inject_head_js', function () {
-  const { darkmode, aside } = this.theme
+  const { darkmode, aside, pjax } = this.theme
   const start = darkmode.start || 6
   const end = darkmode.end || 18
   const { theme_color } = hexo.theme.config
   const themeColorLight = (theme_color && theme_color.enable && theme_color.meta_theme_color_light) || '#ffffff'
   const themeColorDark = (theme_color && theme_color.enable && theme_color.meta_theme_color_dark) || '#0d0d0d'
 
-  const createLocalStore = () => {
+  const createCustonJs = () => {
     return `
-      win.saveToLocal = {
+      const saveToLocal = {
         set: (key, value, ttl) => {
           if (ttl === 0) return
           const now = Date.now()
@@ -43,13 +43,10 @@ hexo.extend.helper.register('inject_head_js', function () {
           return item.value
         }
       }
-    `
-  }
       
-  // https://stackoverflow.com/questions/16839698/jquery-getscript-alternative-in-native-javascript
-  const createGetScript = () => {
-    return `
-      win.getScript = (url, attr = {}) => new Promise((resolve, reject) => {
+      window.btf = {
+        saveToLocal: saveToLocal,
+        getScript: (url, attr = {}) => new Promise((resolve, reject) => {
           const script = document.createElement('script')
           script.src = url
           script.async = true
@@ -66,13 +63,9 @@ hexo.extend.helper.register('inject_head_js', function () {
           })
 
           document.head.appendChild(script)
-      })
-    `
-  }
+        }),
 
-  const createGetCSS = () => {
-    return `
-      win.getCSS = (url, id = false) => new Promise((resolve, reject) => {
+        getCSS: (url, id = false) => new Promise((resolve, reject) => {
           const link = document.createElement('link')
           link.rel = 'stylesheet'
           link.href = url
@@ -85,7 +78,23 @@ hexo.extend.helper.register('inject_head_js', function () {
             resolve()
           }
           document.head.appendChild(link)
-      })
+        }),
+
+        addGlobalFn: (key, fn, name = false, parent = window) => {
+          const pjaxEnable = ${pjax.enable}
+          if (!pjaxEnable && key.startsWith('pjax')) return
+
+          const globalFn = parent.globalFn || {}
+          const keyObj = globalFn[key] || {}
+    
+          if (name && keyObj[name]) return
+    
+          name = name || Object.keys(keyObj).length
+          keyObj[name] = fn
+          globalFn[key] = keyObj
+          parent.globalFn = globalFn
+        }
+      }
     `
   }
 
@@ -93,18 +102,22 @@ hexo.extend.helper.register('inject_head_js', function () {
     if (!darkmode.enable) return ''
 
     let darkmodeJs = `
-      win.activateDarkMode = () => {
+      const activateDarkMode = () => {
         document.documentElement.setAttribute('data-theme', 'dark')
         if (document.querySelector('meta[name="theme-color"]') !== null) {
           document.querySelector('meta[name="theme-color"]').setAttribute('content', '${themeColorDark}')
         }
       }
-      win.activateLightMode = () => {
+      const activateLightMode = () => {
         document.documentElement.setAttribute('data-theme', 'light')
         if (document.querySelector('meta[name="theme-color"]') !== null) {
           document.querySelector('meta[name="theme-color"]').setAttribute('content', '${themeColorLight}')
         }
       }
+
+      btf.activateDarkMode = activateDarkMode
+      btf.activateLightMode = activateLightMode
+      
       const t = saveToLocal.get('theme')
     `
 
@@ -179,5 +192,5 @@ hexo.extend.helper.register('inject_head_js', function () {
     `
   }
 
-  return `<script>(win=>{${createLocalStore() + createGetScript() + createGetCSS() + createDarkmodeJs() + createAsideStatus() + createDetectApple()}})(window)</script>`
+  return `<script>(()=>{${createCustonJs() + createDarkmodeJs() + createAsideStatus() + createDetectApple()}})()</script>`
 })

source/css/_global/function.styl

@@ -134,16 +134,14 @@ if hexo-config('enter_transitions')
   #footer
     animation: bottom-top 1s
 
-  #page-header:not(.full_page)
+  #page-header:not(.full_page),
+  #nav.show
     animation: header-effect 1s
 
   #site-title,
   #site-subtitle
     animation: titleScale 1s
 
-  #nav.show
-    animation: headerNoOpacity 1s
-
   canvas:not(#ribbon-canvas),
   #web_bg
     animation: to_show 4s
@@ -182,27 +180,16 @@ if hexo-config('avatar.effect') == true
 
 @keyframes header-effect
   0%
-    opacity: 0
-    transform: translateY(-50px)
-
-  100%
-    opacity: 1
-    transform: translateY(0)
-
-@keyframes headerNoOpacity
-  0%
-    transform: translateY(-50px)
+    transform: translateY(-35px)
 
   100%
     transform: translateY(0)
 
 @keyframes bottom-top
   0%
-    opacity: 0
-    transform: translateY(50px)
+    transform: translateY(35px)
 
   100%
-    opacity: 1
     transform: translateY(0)
 
 @keyframes titleScale

source/css/_global/index.styl

@@ -46,6 +46,7 @@ body
   font-family: $font-family
   line-height: $text-line-height
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
+  scroll-behavior: smooth
 
   if !hexo-config('copy.enable')
     user-select: none

source/css/_layout/head.styl

@@ -117,6 +117,7 @@
       box-shadow: 0 5px 6px -5px rgba(133, 133, 133, .6)
 
       a,
+      span.site-page,
       .site-name
         color: var(--font-color)
         text-shadow: none
@@ -140,6 +141,7 @@
           text-shadow: none
 
       a,
+      span.site-page,
       #toggle-menu
         color: var(--font-color)
         text-shadow: none
@@ -290,7 +292,8 @@
     &:hover
       color: var(--white)
 
-  a
+  a,
+  span.site-page
     color: var(--light-grey)
 
     &:hover
@@ -312,10 +315,10 @@
         .menus_item_child
           display: block
 
-        & > a > i:last-child
+        & > span > i:last-child
           transform: rotate(180deg)
 
-      & > a > i:last-child
+      & > span > i:last-child
         padding: 4px
         transition: transform .3s
 
@@ -370,7 +373,7 @@
     .menus_items
       display: none
 
-    #search-button span
+    #search-button span:not(.site-page)
       display: none
 
   #search-button

source/css/_layout/sidebar.styl

@@ -40,9 +40,10 @@
         position: relative
         display: block
         padding: 3px 28px 3px 20px
+        border-radius: 6px
         color: var(--font-color)
         font-size: 1.15em
-        border-radius: 6px
+        cursor: pointer
 
         &:hover
           background: var(--text-bg-hover)

source/css/_layout/third-party.styl

@@ -74,8 +74,9 @@ if hexo-config('waline.bg')
     margin: 0 0 .8em
     padding: 6px 0 16px
 
-.katex-wrap
-  overflow: auto
+.katex-display
+  overflow: auto hidden
+  padding: 5px
 
   if hexo-config('katex') && hexo-config('katex.hide_scrollbar')
     &::-webkit-scrollbar

source/js/main.js

@@ -180,6 +180,7 @@ document.addEventListener('DOMContentLoaded', function () {
    * PhotoFigcaption
    */
   const addPhotoFigcaption = () => {
+    if (!GLOBAL_CONFIG.isPhotoFigcaption) return
     document.querySelectorAll('#article-container img').forEach(item => {
       const altValue = item.title || item.alt
       if (!altValue) return
@@ -333,7 +334,7 @@ document.addEventListener('DOMContentLoaded', function () {
     if (typeof InfiniteGrid === 'function') {
       init()
     } else {
-      await getScript(`${GLOBAL_CONFIG.infinitegrid.js}`)
+      await btf.getScript(`${GLOBAL_CONFIG.infinitegrid.js}`)
       init()
     }
   }
@@ -461,6 +462,9 @@ document.addEventListener('DOMContentLoaded', function () {
           $cardToc.scrollTop = sidebarScrollTop - 150
         }
       }
+
+      // 處理 hexo-blog-encrypt 事件
+      $cardToc.style.display = 'block'
     }
 
     // find head position & add active class
@@ -563,13 +567,13 @@ document.addEventListener('DOMContentLoaded', function () {
     darkmode: () => { // switch between light and dark mode
       const willChangeMode = document.documentElement.getAttribute('data-theme') === 'dark' ? 'light' : 'dark'
       if (willChangeMode === 'dark') {
-        activateDarkMode()
+        btf.activateDarkMode()
         GLOBAL_CONFIG.Snackbar !== undefined && btf.snackbarShow(GLOBAL_CONFIG.Snackbar.day_to_night)
       } else {
-        activateLightMode()
+        btf.activateLightMode()
         GLOBAL_CONFIG.Snackbar !== undefined && btf.snackbarShow(GLOBAL_CONFIG.Snackbar.night_to_day)
       }
-      saveToLocal.set('theme', willChangeMode, 2)
+      btf.saveToLocal.set('theme', willChangeMode, 2)
       handleThemeChange(willChangeMode)
     },
     'rightside-config': item => { // Show or hide rightside-hide-btn
@@ -589,15 +593,24 @@ document.addEventListener('DOMContentLoaded', function () {
     'hide-aside-btn': () => { // Hide aside
       const $htmlDom = document.documentElement.classList
       const saveStatus = $htmlDom.contains('hide-aside') ? 'show' : 'hide'
-      saveToLocal.set('aside-status', saveStatus, 2)
+      btf.saveToLocal.set('aside-status', saveStatus, 2)
       $htmlDom.toggle('hide-aside')
     },
-    'mobile-toc-button': item => { // Show mobile toc
+    'mobile-toc-button': function (p, item) { // Show mobile toc
       const tocEle = document.getElementById('card-toc')
       tocEle.style.transition = 'transform 0.3s ease-in-out'
+
+      const tocEleHeight = tocEle.clientHeight
+      const btData = item.getBoundingClientRect()
+
+      const tocEleBottom = window.innerHeight - btData.bottom - 30
+      if (tocEleHeight > tocEleBottom) {
+        tocEle.style.transformOrigin = `right ${tocEleHeight - tocEleBottom - btData.height / 2}px`
+      }
+
       tocEle.classList.toggle('open')
       tocEle.addEventListener('transitionend', () => {
-        tocEle.style.transition = ''
+        tocEle.style.cssText = ''
       }, { once: true })
     },
     'chat-btn': () => { // Show chat
@@ -611,7 +624,7 @@ document.addEventListener('DOMContentLoaded', function () {
   document.getElementById('rightside').addEventListener('click', function (e) {
     const $target = e.target.closest('[id]')
     if ($target && rightSideFn[$target.id]) {
-      rightSideFn[$target.id](this)
+      rightSideFn[$target.id](this, $target)
     }
   })
 
@@ -812,6 +825,10 @@ document.addEventListener('DOMContentLoaded', function () {
       threshold: 0,
       data_src: 'lazy-src'
     })
+
+    btf.addGlobalFn('pjaxComplete', () => {
+      window.lazyLoadInstance.update()
+    }, 'lazyload')
   }
 
   const relativeDate = function (selector) {
@@ -835,14 +852,29 @@ document.addEventListener('DOMContentLoaded', function () {
     GLOBAL_CONFIG.copyright !== undefined && addCopyright()
 
     if (GLOBAL_CONFIG.autoDarkmode) {
-      window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', e => {
-        if (saveToLocal.get('theme') !== undefined) return
+      window.matchMedia('(prefers-color-scheme: dark)').addListener(e => {
+        if (btf.saveToLocal.get('theme') !== undefined) return
         e.matches ? handleThemeChange('dark') : handleThemeChange('light')
       })
     }
   }
 
-  window.refreshFn = function () {
+  const forPostFn = () => {
+    addHighlightTool()
+    addPhotoFigcaption()
+
+    btf.removeGlobalFnEvent('justifiedGallery')
+    const galleryContainer = document.querySelectorAll('#article-container .gallery-container')
+    galleryContainer.length && addJustifiedGallery(galleryContainer)
+
+    runLightbox()
+    scrollFnToDo()
+    addTableWrap()
+    clickFnOfTagHide()
+    tabsFn()
+  }
+
+  const refreshFn = () => {
     initAdjust()
 
     if (GLOBAL_CONFIG_SITE.isPost) {
@@ -855,24 +887,24 @@ document.addEventListener('DOMContentLoaded', function () {
       toggleCardCategory()
     }
 
-    scrollFnToDo()
     GLOBAL_CONFIG_SITE.isHome && scrollDownInIndex()
-    addHighlightTool()
-    GLOBAL_CONFIG.isPhotoFigcaption && addPhotoFigcaption()
     scrollFn()
 
-    btf.removeGlobalFnEvent('justifiedGallery')
-    const galleryContainer = document.querySelectorAll('#article-container .gallery-container')
-    galleryContainer.length && addJustifiedGallery(galleryContainer)
-
-    runLightbox()
-    addTableWrap()
-    clickFnOfTagHide()
-    tabsFn()
+    forPostFn()
     switchComments()
     openMobileMenu()
   }
 
+  btf.addGlobalFn('pjaxComplete', refreshFn, 'refreshFn')
   refreshFn()
   unRefreshFn()
+
+  // 處理 hexo-blog-encrypt 事件
+  window.addEventListener('hexo-blog-decrypt', e => {
+    forPostFn()
+    window.translateFn.translateInitialization()
+    Object.values(window.globalFn.encrypt).forEach(fn => {
+      fn()
+    })
+  })
 })

source/js/tw_cn.js

@@ -4,9 +4,9 @@ document.addEventListener('DOMContentLoaded', function () {
   let currentEncoding = defaultEncoding
   const targetEncodingCookie = 'translate-chn-cht'
   let targetEncoding =
-    saveToLocal.get(targetEncodingCookie) === undefined
+    btf.saveToLocal.get(targetEncodingCookie) === undefined
       ? defaultEncoding
-      : Number(saveToLocal.get('translate-chn-cht'))
+      : Number(btf.saveToLocal.get('translate-chn-cht'))
   let translateButtonObject
   const isSnackbar = snackbarData !== undefined
 
@@ -63,7 +63,7 @@ document.addEventListener('DOMContentLoaded', function () {
       translateButtonObject.textContent = msgToSimplifiedChinese
       isSnackbar && btf.snackbarShow(snackbarData.chs_to_cht)
     }
-    saveToLocal.set(targetEncodingCookie, targetEncoding, 2)
+    btf.saveToLocal.set(targetEncodingCookie, targetEncoding, 2)
     setLang()
     translateBody()
   }
@@ -114,9 +114,10 @@ document.addEventListener('DOMContentLoaded', function () {
   window.translateFn = {
     translatePage,
     Traditionalized,
-    Simplized
+    Simplized,
+    translateInitialization
   }
 
   translateInitialization()
-  document.addEventListener('pjax:complete', translateInitialization)
+  btf.addGlobalFn('pjaxComplete', translateInitialization, 'translateInitialization')
 })

source/js/utils.js

@@ -1,4 +1,5 @@
-const btf = {
+(() => {
+  const btfFn = {
     debounce: (func, wait = 0, immediate = false) => {
       let timeout
       return (...args) => {
@@ -264,18 +265,6 @@ const btf = {
       return percentage
     },
 
-  addGlobalFn: (key, fn, name = false, parent = window) => {
-    const globalFn = parent.globalFn || {}
-    const keyObj = globalFn[key] || {}
-
-    if (name && keyObj[name]) return
-
-    name = name || Object.keys(keyObj).length
-    keyObj[name] = fn
-    globalFn[key] = keyObj
-    parent.globalFn = globalFn
-  },
-
     addEventListenerPjax: (ele, event, fn, option = false) => {
       ele.addEventListener(event, fn, option)
       btf.addGlobalFn('pjax', () => {
@@ -293,4 +282,7 @@ const btf = {
       })
       delete parent.globalFn[key]
     }
-}
+  }
+
+  window.btf = { ...window.btf, ...btfFn }
+})()