breaking change:

1. 部分配置更改

feat:
1. 移除 messenger 聊天插件
2. 更新 fackbook 版本號
3. 增加 香港繁體、日文和韓語
4. 使用的新的複製api 代替舊的
5. 增加 umami 分析
6. 增加 umami 獲取訪問量/訪客數
7. snackbar 增加透明度
8. 文章頁下， nav fixed 下 顯示文章標題

improvement:
1. 代碼優化
2. 修改部分用語
3. 回復之前的相對時間邏輯
4. timeline tag 樣式優化
5. 優化 seo
6. 優化 artalk 的最新評論

fix:
1. tag-hide toggle 圓角問題
2. lazyload 為 false 時，artalk 無法正常加載評論的 bug
3. 修復 gallery 出現抖動的 bug

layout/includes/additional-js.pug

@@ -5,10 +5,8 @@ div
   if theme.translate.enable
     script(src=url_for(theme.asset.translate))
 
-  if theme.lightbox === 'medium_zoom'
-    script(src=url_for(theme.asset.medium_zoom))
-  else if theme.lightbox === 'fancybox'
-    script(src=url_for(theme.asset.fancybox))
+  if theme.lightbox
+    script(src=url_for(theme.asset[theme.lightbox]))
 
   if theme.instantpage
     script(src=url_for(theme.asset.instantpage), type='module')
@@ -30,7 +28,6 @@ div
       include ./third-party/subtitle.pug
 
     include ./third-party/math/index.pug
-
     include ./third-party/abcjs/index.pug
 
     if commentsJsLoad
@@ -39,27 +36,25 @@ div
   != partial("includes/third-party/prismjs", {}, { cache: true })
 
   if theme.aside.enable && theme.aside.card_newest_comments.enable
-    if theme.pjax.enable
-      != partial("includes/third-party/newest-comments/index", {}, { cache: true })
-    else if (!is_post() && page.aside !== false)
+    if theme.pjax.enable || (!is_post() && page.aside !== false)
       != partial("includes/third-party/newest-comments/index", {}, { cache: true })
 
   != fragment_cache('injectBottom', function(){return injectHtml(theme.inject.bottom)})
 
   != partial("includes/third-party/effect", {}, { cache: true })
-
   != partial("includes/third-party/chat/index", {}, { cache: true })
 
   if theme.aplayerInject && theme.aplayerInject.enable
-    if theme.pjax.enable || theme.aplayerInject.per_page
-      include ./third-party/aplayer.pug
-    else if page.aplayer
+    if theme.pjax.enable || theme.aplayerInject.per_page || page.aplayer
       include ./third-party/aplayer.pug
 
   if theme.pjax.enable
     != partial("includes/third-party/pjax", {}, { cache: true })
 
+  if theme.umami_analytics.enable
+    != partial("includes/third-party/umami_analytics", {}, { cache: true })
+
   if theme.busuanzi.site_uv || theme.busuanzi.site_pv || theme.busuanzi.page_pv
     script(async data-pjax src= theme.asset.busuanzi || '//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js')
 
-  !=partial('includes/third-party/search/index', {}, {cache: true})
+  != partial('includes/third-party/search/index', {}, { cache: true })

layout/includes/footer.pug

@@ -1,11 +1,12 @@
 #footer-wrap
   if theme.footer.owner.enable
-    - var now = new Date()
-    - var nowYear = now.getFullYear()
-    if theme.footer.owner.since && theme.footer.owner.since != nowYear
-      .copyright!= `©${theme.footer.owner.since} - ${nowYear} By ${config.author}`
-    else
-      .copyright!= `©${nowYear} By ${config.author}`
+    - const currentYear = new Date().getFullYear()
+    - const sinceYear = theme.footer.owner.since
+    .copyright
+      if sinceYear && sinceYear != currentYear
+        != `©${sinceYear} - ${currentYear} By ${config.author}`
+      else
+        != `©${currentYear} By ${config.author}`
   if theme.footer.copyright
     .framework-info
       span= _p('footer.framework') + ' '
@@ -14,4 +15,4 @@
       span= _p('footer.theme') + ' '
       a(href='https://github.com/jerryc127/hexo-theme-butterfly')= 'Butterfly'
   if theme.footer.custom_text
-    .footer_custom_text!=`${theme.footer.custom_text}`
+    .footer_custom_text!= theme.footer.custom_text

layout/includes/head/pwa.pug

@@ -1,11 +1,13 @@
-link(rel="manifest" href=url_for(theme.pwa.manifest))
-if(theme.pwa.theme_color) 
-  meta(name="msapplication-TileColor" content=theme.pwa.theme_color)
-if(theme.pwa.apple_touch_icon) 
-  link(rel="apple-touch-icon" sizes="180x180" href=url_for(theme.pwa.apple_touch_icon))
-if(theme.pwa.favicon_32_32) 
-  link(rel="icon" type="image/png" sizes="32x32" href=url_for(theme.pwa.favicon_32_32))
-if(theme.pwa.favicon_16_16)
-  link(rel="icon" type="image/png" sizes="16x16" href=url_for(theme.pwa.favicon_16_16))
-if(theme.pwa.mask_icon)
-  link(rel="mask-icon" href=url_for(theme.pwa.mask_icon) color="#5bbad5")
+- const { manifest, theme_color, apple_touch_icon, favicon_32_32, favicon_16_16, mask_icon } = theme.pwa
+
+link(rel="manifest" href=url_for(manifest))
+if theme_color
+  meta(name="msapplication-TileColor" content=theme_color)
+if apple_touch_icon
+  link(rel="apple-touch-icon" sizes="180x180" href=url_for(apple_touch_icon))
+if favicon_32_32
+  link(rel="icon" type="image/png" sizes="32x32" href=url_for(favicon_32_32))
+if favicon_16_16
+  link(rel="icon" type="image/png" sizes="16x16" href=url_for(favicon_16_16))
+if mask_icon
+  link(rel="mask-icon" href=url_for(mask_icon) color="#5bbad5")

layout/includes/header/index.pug

@@ -25,11 +25,10 @@ if !theme.disable_top_img && page.top_img !== false
 
   if top_img !== false
     - bg_img = getBgPath(top_img)
-    - headerClassName = is_home() ? 'full_page' : 'not-home-page'
-    - headerClassName = is_post() ? 'post-bg' : headerClassName
+    - headerClassName = is_home() ? 'full_page' : is_post() ? 'post-bg' : 'not-home-page'
 
-header#page-header(class=`${headerClassName+isFixedClass}` style=bg_img)
-  !=partial('includes/header/nav', {}, {cache: true})
+header#page-header(class=`${headerClassName + isFixedClass}` style=bg_img)
+  include ./nav.pug
   if top_img !== false
     if is_post()
       include ./post-info.pug
@@ -40,11 +39,15 @@ header#page-header(class=`${headerClassName+isFixedClass}` style=bg_img)
           - var loadSubJs = true
           #site-subtitle
             span#subtitle
-        if(theme.social)
+        if theme.social
           #site_social_icons
             !=partial('includes/header/social', {}, {cache: true})
       #scroll-down
         i.fas.fa-angle-down.scroll-down-effects
     else
       #page-site-info
-        h1#site-title=page.title || page.tag || page.category
+        h1#site-title=page.title || page.tag || page.category
+  else
+    //- improvement seo
+    if !is_post()
+      h1.title-seo=page.title || page.tag || page.category || config.title

layout/includes/header/menu_item.pug

@@ -3,25 +3,25 @@ if theme.menu
     each value, label in theme.menu
       if typeof value !== 'object'
         .menus_item
-          - const valueArray = value.split('||')
-          a.site-page(href=url_for(trim(valueArray[0])))
-            if valueArray[1]
-              i.fa-fw(class=trim(valueArray[1]))
-            span=' '+label
+          - const [link, icon] = value.split('||').map(part => trim(part))
+          a.site-page(href=url_for(link))
+            if icon
+              i.fa-fw(class=icon)
+            span= ' ' + label
       else
         .menus_item
-          - const labelArray = label.split('||')
-          - const hideClass = labelArray[2] && trim(labelArray[2]) === 'hide' ? 'hide' : ''
-          span.site-page.group(class=`${hideClass}`)
-            if labelArray[1]
-              i.fa-fw(class=trim(labelArray[1]))
-            span=' '+ trim(labelArray[0])
+          - const [groupLabel, groupIcon, groupClass] = label.split('||').map(part => trim(part))
+          - const hideClass = groupClass === 'hide' ? 'hide' : ''
+          span.site-page.group(class=hideClass)
+            if groupIcon
+              i.fa-fw(class=groupIcon)
+            span= ' ' + groupLabel
             i.fas.fa-chevron-down
           ul.menus_item_child
-            each val,lab in value 
-              - const valArray = val.split('||')
+            each val, lab in value
+              - const [childLink, childIcon] = val.split('||').map(part => trim(part))
               li
-                a.site-page.child(href=url_for(trim(valArray[0])))
-                  if valArray[1]
-                    i.fa-fw(class=trim(valArray[1]))
-                  span=' '+ lab
+                a.site-page.child(href=url_for(childLink))
+                  if childIcon
+                    i.fa-fw(class=childIcon)
+                  span= ' ' + lab

layout/includes/header/nav.pug

@@ -1,22 +1,22 @@
 nav#nav
   span#blog-info
-    a(href=url_for('/') title=config.title)
+    a.nav-site-title(href=url_for('/'))
       if theme.nav.logo
         img.site-icon(src=url_for(theme.nav.logo) alt='Logo')
       if theme.nav.display_title
         span.site-name=config.title
-
+    if is_post()
+      a.nav-page-title(href=url_for('/'))
+        span.site-name=(page.title || config.title)
   #menus
-    if (theme.search.use)
+    if theme.search.use
       #search-button
         span.site-page.social-icon.search
           i.fas.fa-search.fa-fw
-          span=' '+_p('search.title')
+          span= ' ' + _p('search.title')
     if theme.menu
-      !=partial('includes/header/menu_item', {}, {cache: true})
+      != partial('includes/header/menu_item', {}, {cache: true})
 
       #toggle-menu
         span.site-page
-          i.fas.fa-bars.fa-fw
-
-
+          i.fas.fa-bars.fa-fw

layout/includes/header/post-info.pug

@@ -4,41 +4,40 @@
     if theme.post_edit.enable
       a.post-edit-link(href=theme.post_edit.url + page.source title=_p('post.edit') target="_blank")
         i.fas.fa-pencil-alt
-        
+
   #post-meta
     .meta-firstline
-      if (theme.post_meta.post.date_type)
+      if theme.post_meta.post.date_type
         span.post-meta-date
-          if (theme.post_meta.post.date_type === 'both')
+          if theme.post_meta.post.date_type === 'both'
             i.far.fa-calendar-alt.fa-fw.post-meta-icon
             span.post-meta-label= _p('post.created')
-            time.post-meta-date-created(datetime=date_xml(page.date) title=_p('post.created') + ' ' + full_date(page.date))=date(page.date, config.date_format)
+            time.post-meta-date-created(datetime=date_xml(page.date) title=_p('post.created') + ' ' + full_date(page.date))= date(page.date, config.date_format)
             span.post-meta-separator |
             i.fas.fa-history.fa-fw.post-meta-icon
             span.post-meta-label= _p('post.updated')
-            time.post-meta-date-updated(datetime=date_xml(page.updated) title=_p('post.updated') + ' ' + full_date(page.updated))=date(page.updated, config.date_format)
+            time.post-meta-date-updated(datetime=date_xml(page.updated) title=_p('post.updated') + ' ' + full_date(page.updated))= date(page.updated, config.date_format)
           else
             - let data_type_update = theme.post_meta.post.date_type === 'updated'
             - let date_type = data_type_update ? 'updated' : 'date'
-            - let date_icon = data_type_update ? 'fas fa-history' :'far fa-calendar-alt'
+            - let date_icon = data_type_update ? 'fas fa-history' : 'far fa-calendar-alt'
             - let date_title = data_type_update ? _p('post.updated') : _p('post.created')
             i.fa-fw.post-meta-icon(class=date_icon)
             span.post-meta-label= date_title
-            time(datetime=date_xml(page[date_type]) title=date_title + ' ' + full_date(page[date_type]))=date(page[date_type], config.date_format)
-      if (theme.post_meta.post.categories && page.categories.data.length > 0)
+            time(datetime=date_xml(page[date_type]) title=date_title + ' ' + full_date(page[date_type]))= date(page[date_type], config.date_format)
+      if theme.post_meta.post.categories && page.categories.data.length > 0
         span.post-meta-categories
-          if (theme.post_meta.post.date_type)
+          if theme.post_meta.post.date_type
             span.post-meta-separator |
-
           each item, index in page.categories.data
             i.fas.fa-inbox.fa-fw.post-meta-icon
             a(href=url_for(item.path)).post-meta-categories #[=item.name]
-            if (index < page.categories.data.length - 1)
+            if index < page.categories.data.length - 1
               i.fas.fa-angle-right.post-meta-separator
 
     .meta-secondline
       - let postWordcount = theme.wordcount.enable && (theme.wordcount.post_wordcount || theme.wordcount.min2read)
-      if (postWordcount)
+      if postWordcount
         span.post-meta-separator |
         span.post-meta-wordcount
           if theme.wordcount.post_wordcount
@@ -51,42 +50,57 @@
             i.far.fa-clock.fa-fw.post-meta-icon
             span.post-meta-label= _p('post.min2read') + ':'
             span= min2read(page.content, {cn: 350, en: 160}) + _p('post.min2read_unit')
-    
+
       //- for pv and count
-      mixin pvBlock(parent_id,parent_class,parent_title)
+      mixin pvBlock(parent_id, parent_class, parent_title)
         span.post-meta-separator |
-        span(class=parent_class id=parent_id data-flag-title=page.title)
+        span(class=parent_class id=parent_id data-flag-title=parent_title)
           i.far.fa-eye.fa-fw.post-meta-icon
-          span.post-meta-label=_p('post.page_pv') + ':'
+          span.post-meta-label= _p('post.page_pv') + ':'
           if block
             block
 
-      - const commentUse = comments.use
+      - const commentUse = comments.use && comments.use[0]
       if page.comments !== false && commentUse && !comments.lazyload
-        if commentUse[0] === 'Valine' && theme.valine.visitor
-          +pvBlock(url_for(page.path),'leancloud_visitors',page.title)
-            span.leancloud-visitors-count
-              i.fa-solid.fa-spinner.fa-spin
-        else if commentUse[0] === 'Waline' && theme.waline.pageview
-          +pvBlock('','','')
-            span.waline-pageview-count(data-path=url_for(page.path))
-              i.fa-solid.fa-spinner.fa-spin
-        else if commentUse[0] === 'Twikoo' && theme.twikoo.visitor
-          +pvBlock('','','')
-            span#twikoo_visitors
-              i.fa-solid.fa-spinner.fa-spin
-        else if commentUse[0] === 'Artalk' && theme.artalk.visitor
-          +pvBlock('','','')
-            span#ArtalkPV
+        case commentUse
+          when 'Valine'
+            if theme.valine.visitor
+              +pvBlock(url_for(page.path), 'leancloud_visitors', page.title)
+                span.leancloud-visitors-count
+                  i.fa-solid.fa-spinner.fa-spin
+          when 'Waline'
+            if theme.waline.pageview
+              +pvBlock('', '', '')
+                span.waline-pageview-count(data-path=url_for(page.path))
+                  i.fa-solid.fa-spinner.fa-spin
+          when 'Twikoo'
+            if theme.twikoo.visitor
+              +pvBlock('', '', '')
+                span#twikoo_visitors
+                  i.fa-solid.fa-spinner.fa-spin
+          when 'Artalk'
+            if theme.artalk.visitor
+              +pvBlock('', '', '')
+                span#ArtalkPV
+                  i.fa-solid.fa-spinner.fa-spin
+          default
+            if theme.umami_analytics.enable && theme.umami_analytics.UV_PV.page_pv
+              +pvBlock('', '', '')
+                span#umamiPV(data-path=url_for(page.path))
+                  i.fa-solid.fa-spinner.fa-spin
+            else if theme.busuanzi.page_pv
+              +pvBlock('', 'post-meta-pv-cv', '')
+                span#busuanzi_value_page_pv
+                  i.fa-solid.fa-spinner.fa-spin
+      else
+        if theme.umami_analytics.enable && theme.umami_analytics.UV_PV.page_pv
+          +pvBlock('', '', '')
+            span#umamiPV(data-path=url_for(page.path))
               i.fa-solid.fa-spinner.fa-spin
         else if theme.busuanzi.page_pv
-          +pvBlock('','post-meta-pv-cv','')
+          +pvBlock('', 'post-meta-pv-cv', '')
             span#busuanzi_value_page_pv
               i.fa-solid.fa-spinner.fa-spin
-      else if theme.busuanzi.page_pv
-        +pvBlock('','post-meta-pv-cv','')
-          span#busuanzi_value_page_pv
-            i.fa-solid.fa-spinner.fa-spin
 
       if comments.count && !comments.lazyload && page.comments !== false && comments.use
         - var whichCount = comments.use[0]
@@ -98,7 +112,7 @@
             span.post-meta-label= _p('post.comments') + ':'
             if block
               block
-        
+
         case whichCount
           when 'Disqus'
             +countBlock

layout/includes/header/social.pug

@@ -1,4 +1,8 @@
 each url, icon in theme.social
-  a.social-icon(href=url_for(trim(url.split('||')[0])) target="_blank" 
-  title=url.split('||')[1] === undefined ? '' : trim(url.split('||')[1]))
-    i(class=icon style=url.split('||')[2] === undefined ? '' : `color: ${trim(url.split('||')[2]).replace(/[\'\"]/g, '')};`)
+  -
+    const [link, title, color] = url.split('||').map(i => trim(i))
+    const href = url_for(link)
+    const iconStyle = color ? `color: ${color.replace(/[\'\"]/g, '')};` : ''
+    const iconTitle = title || ''
+  a.social-icon(href=href target="_blank" title=iconTitle)
+    i(class=icon style=iconStyle)

layout/includes/layout.pug

@@ -9,8 +9,7 @@ html(lang=config.language data-theme=theme.display_mode class=htmlClassHideAside
   head
     include ./head.pug
   body
-    if theme.preloader.enable
-      !=partial('includes/loading/index', {}, {cache: true})
+    !=partial('includes/loading/index', {}, {cache: true})
 
     if theme.background
       #web_bg(style=getBgPath(theme.background))

layout/includes/loading/fullpage-loading.pug

@@ -24,10 +24,10 @@ script.
     }
 
     preloader.initLoading()
-    window.addEventListener('load',() => { preloader.endLoading() })
+    window.addEventListener('load', preloader.endLoading)
 
     if (!{theme.pjax && theme.pjax.enable}) {
-      btf.addGlobalFn('pjaxSend', () => { preloader.initLoading() }, 'preloader_init')
-      btf.addGlobalFn('pjaxComplete', () => { preloader.endLoading() }, 'preloader_end')
+      btf.addGlobalFn('pjaxSend', preloader.initLoading, 'preloader_init')
+      btf.addGlobalFn('pjaxComplete', preloader.endLoading, 'preloader_end')
     }
   })()

layout/includes/loading/index.pug

@@ -1,4 +1,5 @@
-if theme.preloader.source === 1
-  include ./fullpage-loading.pug
-else
-  include ./pace.pug
+if theme.preloader.enable
+  if theme.preloader.source === 1
+    include ./fullpage-loading.pug
+  else
+    include ./pace.pug

layout/includes/mixins/article-sort.pug

@@ -1,14 +1,14 @@
 mixin articleSort(posts)
   .article-sort
-    - var year
-    - posts.each(function (article) {
-      - let tempYear = date(article.date, 'YYYY')
-      - let no_cover = article.cover === false || !theme.cover.archives_enable ? 'no-article-cover' : ''
-      - let title = article.title || _p('no_title')
+    - let year
+    - posts.forEach(article => {
+      - const tempYear = date(article.date, 'YYYY')
+      - const noCoverClass = article.cover === false || !theme.cover.archives_enable ? 'no-article-cover' : ''
+      - const title = article.title || _p('no_title')
       if tempYear !== year
         - year = tempYear
         .article-sort-item.year= year
-      .article-sort-item(class=no_cover)
+      .article-sort-item(class=noCoverClass)
         if article.cover && theme.cover.archives_enable
           a.article-sort-item-img(href=url_for(article.path) title=title)
             if article.cover_type === 'img'

layout/includes/mixins/indexPostUI.pug

@@ -1,19 +1,16 @@
 mixin indexPostUI()
-  - let indexLayout = theme.index_layout
-  - let masonryLayoutClass = (indexLayout === 6 || indexLayout === 7) ? 'masonry' : ''
+  - const indexLayout = theme.index_layout
+  - const masonryLayoutClass = (indexLayout === 6 || indexLayout === 7) ? 'masonry' : ''
   #recent-posts.recent-posts.nc(class=masonryLayoutClass)
     .recent-post-items
-      each article , index in page.posts.data
+      each article, index in page.posts.data
         .recent-post-item
-          -
-            let link = article.link || article.path
-            let title = article.title || _p('no_title')
-            let leftOrRight = indexLayout === 3
-              ? index%2 == 0 ? 'left' : 'right'
-              : indexLayout === 2 ? 'right' : ''
-            let post_cover = article.cover
-            let no_cover = article.cover === false || !theme.cover.index_enable ? 'no-cover' : ''
-          -
+          - const link = article.link || article.path
+          - const title = article.title || _p('no_title')
+          - const leftOrRight = indexLayout === 3 ? (index % 2 === 0 ? 'left' : 'right') : (indexLayout === 2 ? 'right' : '')
+          - const post_cover = article.cover
+          - const no_cover = article.cover === false || !theme.cover.index_enable ? 'no-cover' : ''
+          
           if post_cover && theme.cover.index_enable
             .post_cover(class=leftOrRight)
               a(href=url_for(link) title=title)
@@ -23,43 +20,43 @@ mixin indexPostUI()
                   div.post-bg(style=`background: ${post_cover}`)
           .recent-post-info(class=no_cover)
             a.article-title(href=url_for(link) title=title)
-              if (is_home() && (article.top || article.sticky > 0))
+              if is_home() && (article.top || article.sticky > 0)
                 i.fas.fa-thumbtack.sticky
               = title
             .article-meta-wrap
-              if (theme.post_meta.page.date_type)
+              if theme.post_meta.page.date_type
                 span.post-meta-date
-                  if (theme.post_meta.page.date_type === 'both')
+                  if theme.post_meta.page.date_type === 'both'
                     i.far.fa-calendar-alt
                     span.article-meta-label=_p('post.created')
-                    time.post-meta-date-created(datetime=date_xml(article.date) title=_p('post.created') + ' ' + full_date(article.date))=date(article.date, config.date_format)
+                    time.post-meta-date-created(datetime=date_xml(article.date) title=_p('post.created') + ' ' + full_date(article.date))= date(article.date, config.date_format)
                     span.article-meta-separator |
                     i.fas.fa-history
                     span.article-meta-label=_p('post.updated')
-                    time.post-meta-date-updated(datetime=date_xml(article.updated) title=_p('post.updated') + ' ' + full_date(article.updated))=date(article.updated, config.date_format)
+                    time.post-meta-date-updated(datetime=date_xml(article.updated) title=_p('post.updated') + ' ' + full_date(article.updated))= date(article.updated, config.date_format)
                   else
-                    - let data_type_updated = theme.post_meta.page.date_type === 'updated'
-                    - let date_type = data_type_updated ? 'updated' : 'date'
-                    - let date_icon = data_type_updated ? 'fas fa-history' :'far fa-calendar-alt'
-                    - let date_title = data_type_updated ? _p('post.updated') : _p('post.created')
+                    - const data_type_updated = theme.post_meta.page.date_type === 'updated'
+                    - const date_type = data_type_updated ? 'updated' : 'date'
+                    - const date_icon = data_type_updated ? 'fas fa-history' : 'far fa-calendar-alt'
+                    - const date_title = data_type_updated ? _p('post.updated') : _p('post.created')
                     i(class=date_icon)
-                    span.article-meta-label=date_title
-                    time(datetime=date_xml(article[date_type]) title=date_title + ' ' + full_date(article[date_type]))=date(article[date_type], config.date_format)
-              if (theme.post_meta.page.categories && article.categories.data.length > 0)
+                    span.article-meta-label= date_title
+                    time(datetime=date_xml(article[date_type]) title=date_title + ' ' + full_date(article[date_type]))= date(article[date_type], config.date_format)
+              if theme.post_meta.page.categories && article.categories.data.length > 0
                 span.article-meta
                   span.article-meta-separator |
                   each item, index in article.categories.data
                     i.fas.fa-inbox
                     a(href=url_for(item.path)).article-meta__categories #[=item.name]
-                    if (index < article.categories.data.length - 1)
+                    if index < article.categories.data.length - 1
                       i.fas.fa-angle-right.article-meta-link
-              if (theme.post_meta.page.tags && article.tags.length > 0)
+              if theme.post_meta.page.tags && article.tags.length > 0
                 span.article-meta.tags
                   span.article-meta-separator |
                   each item, index in article.tags.data
                     i.fas.fa-tag
                     a(href=url_for(item.path)).article-meta__tags #[=item.name]
-                    if (index < article.tags.data.length - 1)
+                    if index < article.tags.data.length - 1
                       span.article-meta-link #[='•']
               
               mixin countBlockInIndex
@@ -119,7 +116,7 @@ mixin indexPostUI()
                 .content!= truncate(article.content, theme.index_post_content.length)
 
         if theme.ad && theme.ad.index
-          if (index + 1) % 3 == 0
-            .recent-post-item.ads-wrap!=theme.ad.index
+          if (index + 1) % 3 === 0
+            .recent-post-item.ads-wrap!= theme.ad.index
 
     include ../pagination.pug

layout/includes/post/post-copyright.pug

@@ -1,15 +1,15 @@
 if theme.post_copyright.enable && page.copyright !== false
-  - let author = page.copyright_author || config.author
-  - let authorHref = page.copyright_author_href || theme.post_copyright.author_href || config.url
-  - let url = page.copyright_url || page.permalink
-  - let info = page.copyright_info || _p('post.copyright.copyright_content', theme.post_copyright.license_url, theme.post_copyright.license, config.url, config.title)
+  - const author = page.copyright_author || config.author
+  - const authorHref = page.copyright_author_href || theme.post_copyright.author_href || config.url
+  - const url = page.copyright_url || page.permalink
+  - const info = page.copyright_info || _p('post.copyright.copyright_content', theme.post_copyright.license_url, theme.post_copyright.license, config.url, config.title)
   .post-copyright
     .post-copyright__author
       span.post-copyright-meta
         i.fas.fa-circle-user.fa-fw
         = _p('post.copyright.author') + ": "
       span.post-copyright-info
-        a(href=authorHref)=author
+        a(href=authorHref)= author
     .post-copyright__type
       span.post-copyright-meta
         i.fas.fa-square-arrow-up-right.fa-fw
@@ -20,4 +20,4 @@ if theme.post_copyright.enable && page.copyright !== false
       span.post-copyright-meta
         i.fas.fa-circle-exclamation.fa-fw
         = _p('post.copyright.copyright_notice') + ": "
-      span.post-copyright-info!= info
+      span.post-copyright-info!= info

layout/includes/post/reward.pug

@@ -5,9 +5,8 @@
   .reward-main
     ul.reward-all
       each item in theme.reward.QR_code
-        - var clickTo = item.link ? item.link : item.img
+        - const clickTo = item.link || item.img
         li.reward-item
           a(href=url_for(clickTo) target='_blank')
             img.post-qr-code-img(src=url_for(item.img) alt=item.text)
-          .post-qr-code-desc=item.text
-
+          .post-qr-code-desc=item.text

layout/includes/sidebar.pug

@@ -6,7 +6,7 @@ if theme.menu
         img(src=url_for(theme.avatar.img) onerror=`onerror=null;src='${theme.error_img.flink}'` alt="avatar")
       .site-data.is-center
         a(href=url_for(config.archive_dir) + '/')
-          .headline= _p('aside.articles') 
+          .headline= _p('aside.articles')
           .length-num= site.posts.length
         a(href=url_for(config.tag_dir) + '/' )
           .headline= _p('aside.tags')

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/card-post-count/fb.pug

@@ -1,5 +1,5 @@
-- const fbSDKVer = 'v16.0'
-- const fbSDK = theme.chat.use === 'messenger' ? `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/chat/chatra.pug

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

@@ -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/index.pug

@@ -6,6 +6,4 @@ case theme.chat.use
   when 'daovoice'
     include ./daovoice.pug
   when 'crisp'
-    include ./crisp.pug
-  when 'messenger'
-    include ./messenger.pug
+    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.rightside_button}
-    const isChatHideShow = !{theme.chat.button_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

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

@@ -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/facebook_comments.pug

@@ -1,5 +1,5 @@
-- const fbSDKVer = 'v16.0'
-- const fbSDK = theme.chat.use === 'messenger' ? `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/math/index.pug

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

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

@@ -1,15 +1,15 @@
 script.
   (async () => {
     const showKatex = () => {
-      const mathElements = document.querySelectorAll('#article-container .katex')
-      mathElements.length && mathElements.forEach((el) => {
-        el.classList.add('katex-show')
-      })
+      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)}')
+      if (!{theme.math.katex.copy_tex}) {
+        await btf.getScript('!{url_for(theme.asset.katex_copytex)}')
+      }
     }
 
     showKatex()

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

@@ -1,13 +1,13 @@
 script.
   (() => {
-    const runMermaid = (ele) => {
+    const runMermaid = ele => {
       window.loadMermaid = true
       const theme = document.documentElement.getAttribute('data-theme') === 'dark' ? '!{theme.mermaid.theme.dark}' : '!{theme.mermaid.theme.light}'
 
-      Array.from(ele).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)
@@ -16,14 +16,14 @@ script.
         }
 
         // mermaid v9 and v10 compatibility
-        typeof renderFn === 'string' ? renderMermaid(renderFn) : renderFn.then(({svg}) => renderMermaid(svg))
+        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'
@@ -45,7 +45,7 @@ script.
       btf.addGlobalFn('themeChange', runMermaidFn, 'mermaid')
       window.loadMermaid ? runMermaidFn() : btf.getScript('!{url_for(theme.asset.mermaid)}').then(runMermaidFn)
     }
-    
+
     btf.addGlobalFn('encrypt', loadMermaid, 'mermaid')
     window.pjax ? loadMermaid() : document.addEventListener('DOMContentLoaded', loadMermaid)
   })()

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

@@ -2,106 +2,63 @@
 - 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.aside.card_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.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()
-        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}` : ''
           return {
-            'avatar': `${avatarCdn}${e.email_encrypted}?${avatarDefault}`,
+            'avatar': avatar,
             'content': changeContent(e.content_marked),
             'nick': e.nick,
             'url': e.page_url,
             'date': e.date,
           }
         })
-        btf.saveToLocal.set('artalk-newest-comments', JSON.stringify(artalk), !{theme.aside.card_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 = btf.saveToLocal.get('artalk-newest-comments')
-        if (data) {
-          generateHtml(JSON.parse(data))
-        } else {
-          getComment()
-        }
-      }
-    }
-
-    newestCommentInit()
-    btf.addGlobalFn('pjaxComplete', newestCommentInit, 'artalk_newestComment')
-
-  })
+    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,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 = '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 = () => {
+    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 => {
@@ -28,54 +19,15 @@ script.
             }
           })
 
-          btf.saveToLocal.set('disqus-newest-comments', JSON.stringify(disqusArray), !{theme.aside.card_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.aside.card_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 = btf.saveToLocal.get('disqus-newest-comments')
-        if (data) {
-          generateHtml(JSON.parse(data))
-        } else {
-          getComment()
-        }
-      }
-    }
-
-    newestCommentInit()
-    btf.addGlobalFn('pjaxComplete', newestCommentInit, 'disqus_newestComment')
+    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,12 +26,12 @@ script.
             }
           })
 
-          btf.saveToLocal.set('github-newest-comments', JSON.stringify(array), !{theme.aside.card_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 = () => {
+    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.aside.card_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 = btf.saveToLocal.get('github-newest-comments')
-        if (data) {
-          generateHtml(JSON.parse(data))
-        } else {
-          getComment()
-        }
-      }
-    }
-
-    newestCommentInit()
-    btf.addGlobalFn('pjaxComplete', newestCommentInit, 'github_newestComment')
+    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.aside.card_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 => {
       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,
             }
           })
-          btf.saveToLocal.set('remark42-newest-comments', JSON.stringify(remark42), !{theme.aside.card_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 = btf.saveToLocal.get('remark42-newest-comments')
-        if (data) {
-          generateHtml(JSON.parse(data))
-        } else {
-          getComment()
-        }
-      }
-    }
-
-    newestCommentInit()
-    btf.addGlobalFn('pjaxComplete', newestCommentInit, 'remark42_newestComment')
+    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_aside.card_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.aside.card_newest_comments.limit},
           includeReply: true
-        }).then(function (res) {
+        }).then(res => {
           const twikooArray = res.map(e => {
             return {
               'content': changeContent(e.comment),
@@ -32,11 +23,11 @@ script.
             }
           })
 
-          btf.saveToLocal.set('twikoo-newest-comments', JSON.stringify(twikooArray), !{theme.aside.card_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')}"
         })
       }
 
@@ -47,46 +38,7 @@ script.
       }
     }
 
-    const generateHtml = array => {
-      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}) {
-            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 = btf.saveToLocal.get('twikoo-newest-comments')
-        if (data) {
-          generateHtml(JSON.parse(data))
-        } else {
-          getComment()
-        }
-      }
-    }
-
-    newestCommentInit()
-    btf.addGlobalFn('pjaxComplete', newestCommentInit, 'twikoo_newestComment')
+    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.aside.card_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 = {
@@ -66,7 +30,7 @@ script.
       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,
             }
           })
-          btf.saveToLocal.set('valine-newest-comments', JSON.stringify(valineArray), !{theme.aside.card_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 = btf.saveToLocal.get('valine-newest-comments')
-        if (data) {
-          generateHtml(JSON.parse(data))
-        } else {
-          getComment()
-        }
-      }
-    }
-
-    newestCommentInit()
-    btf.addGlobalFn('pjaxComplete', newestCommentInit, 'valine_newestComment')
+    run(keyName, getComment)
   })

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

@@ -1,49 +1,13 @@
 - 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.aside.card_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.aside.card_newest_comments.limit}', { method: 'GET' })
         const result = await res.json()
@@ -56,26 +20,13 @@ script.
             'date': e.time || e.insertedAt
           }
         })
-        btf.saveToLocal.set('waline-newest-comments', JSON.stringify(walineArray), !{theme.aside.card_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 = btf.saveToLocal.get('waline-newest-comments')
-        if (data) {
-          generateHtml(JSON.parse(data))
-        } else {
-          getComment()
-        }
-      }
-    }
-
-    newestCommentInit()
-    btf.addGlobalFn('pjaxComplete', newestCommentInit, 'waline_newestComment')
+    run(keyName, getComment)
   })

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,49 +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
-  })
-
-  const triggerPjaxFn = (val) => {
-    if (!val) return
-    Object.values(val).forEach(fn => { fn() })
-  }
-
-  document.addEventListener('pjax:send', function () {
-
-    // removeEventListener
-    btf.removeGlobalFnEvent('pjaxSendOnce')
-    btf.removeGlobalFnEvent('themeChange')
-
-    //reset readmode
-    const $bodyClassList = document.body.classList
-    $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)
+    window.pjax = new Pjax({
+      elements: '!{pjaxExclude}',
+      selectors: pjaxSelectors,
+      cacheBust: false,
+      analytics: !{theme.google_analytics ? true : false},
+      scrollRestoration: false
     })
 
-    triggerPjaxFn(window.globalFn.pjaxComplete)
-  })
-
-  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/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()
+  })()

layout/includes/widget/card_webinfo.pug

@@ -17,12 +17,22 @@ if theme.aside.card_webinfo.enable
         .webinfo-item
           .item-name=_p('aside.card_webinfo.site_wordcount') + " :"
           .item-count=totalcount(site)
-      if theme.busuanzi.site_uv
+      if theme.umami_analytics.enable && theme.umami_analytics.UV_PV.site_uv
+        .webinfo-item
+          .item-name= _p('aside.card_webinfo.site_uv_name') + " :"
+          .item-count#umami-site-uv
+            i.fa-solid.fa-spinner.fa-spin
+      else if theme.busuanzi.site_uv
         .webinfo-item
           .item-name= _p('aside.card_webinfo.site_uv_name') + " :"
           .item-count#busuanzi_value_site_uv
             i.fa-solid.fa-spinner.fa-spin
-      if theme.busuanzi.site_pv
+      if theme.umami_analytics.enable && theme.umami_analytics.UV_PV.site_pv
+        .webinfo-item
+          .item-name= _p('aside.card_webinfo.site_pv_name') + " :"
+          .item-count#umami-site-pv
+            i.fa-solid.fa-spinner.fa-spin
+      else if theme.busuanzi.site_pv
         .webinfo-item
           .item-name= _p('aside.card_webinfo.site_pv_name') + " :"
           .item-count#busuanzi_value_site_pv