feat: 更新 lazyload 配置，支持原生 lazyload 功能

feat: 代碼優化
feat: 優化 pageType 邏輯
fix: 修復解密文章後， chartjs 沒有加載的 bug

layout/includes/additional-js.pug

@@ -11,7 +11,7 @@ div
   if theme.instantpage
     script(src=url_for(theme.asset.instantpage), type='module')
 
-  if theme.lazyload.enable
+  if theme.lazyload.enable && !theme.lazyload.native
     script(src=url_for(theme.asset.lazyload))
 
   if theme.snackbar.enable
@@ -33,7 +33,7 @@ div
   != partial("includes/third-party/prismjs", {}, { cache: true })
 
   if theme.aside.enable && theme.aside.card_newest_comments.enable
-    if theme.pjax.enable || (!is_post() && page.aside !== false)
+    if theme.pjax.enable || (globalPageType !== 'post' && page.aside !== false)
       != partial("includes/third-party/newest-comments/index", {}, { cache: true })
 
   != fragment_cache('injectBottom', function(){return injectHtml(theme.inject.bottom)})

layout/includes/head.pug

@@ -1,12 +1,18 @@
 - var pageTitle
-- is_archive() ? page.title = findArchivesTitle(page, theme.menu, date) : ''
-- if (is_tag()) pageTitle = _p('page.tag') + ': ' + page.tag
-- else if (is_category()) pageTitle = _p('page.category') + ': ' + page.category
-- else if (is_current('/404.html', [strict])) pageTitle = _p('error404')
-- else pageTitle = page.title || config.title || ''
+- globalPageType === 'archive' ? page.title = findArchivesTitle(page, theme.menu, date) : ''
+case globalPageType
+  when 'tag'
+    - pageTitle = _p('page.tag') + ': ' + page.tag
+  when 'category'
+    - pageTitle = _p('page.category') + ': ' + page.category
+  when '404'
+    - pageTitle = _p('error404')
+  default
+    - pageTitle = page.title || config.title || ''
+
 
 - var isSubtitle = config.subtitle ? ' - ' + config.subtitle : ''
-- var tabTitle = is_home() || !pageTitle ? config.title + isSubtitle : pageTitle + ' | ' + config.title
+- var tabTitle = globalPageType === 'home' || !pageTitle ? config.title + isSubtitle : pageTitle + ' | ' + config.title
 - var pageAuthor = config.email ? config.author + ',' + config.email : config.author
 - var pageCopyright = config.copyright || config.author
 - var themeColorLight = theme.theme_color && theme.theme_color.enable && theme.theme_color.meta_theme_color_light || '#ffffff'

layout/includes/head/Open_Graph.pug

@@ -2,7 +2,7 @@ if theme.Open_Graph_meta.enable
   -
     const coverVal = page.cover_type === 'img' ? page.cover : theme.avatar.img
     let ogOption = Object.assign({
-      type: is_post() ? 'article' : 'website',
+      type: globalPageType === 'post' ? 'article' : 'website',
       image: coverVal ? full_url_for(coverVal) : '',
       fb_admins: theme.facebook_comments.user_id || '',
       fb_app_id: theme.facebook_comments.app_id || '',

layout/includes/head/analytics.pug

@@ -4,7 +4,7 @@ if theme.baidu_analytics
     (function() {
       var hm = document.createElement("script");
       hm.src = "https://hm.baidu.com/hm.js?!{theme.baidu_analytics}";
-      var s = document.getElementsByTagName("script")[0]; 
+      var s = document.getElementsByTagName("script")[0];
       s.parentNode.insertBefore(hm, s);
     })();
     btf.addGlobalFn('pjaxComplete', () => {

layout/includes/head/config.pug

@@ -116,7 +116,7 @@ script.
       buttonText: '!{_p("load_more")}'
     },
     isPhotoFigcaption: !{theme.photofigcaption},
-    islazyload: !{theme.lazyload.enable},
+    islazyloadPlugin: !{theme.lazyload.enable && !theme.lazyload.native},
     isAnchor: !{theme.anchor.auto_update || false},
     percent: {
       toc: !{theme.toc.scroll_percent},

layout/includes/head/config_site.pug

@@ -9,8 +9,8 @@
   var showToc = false
   if (theme.aside.enable && page.aside !== false) {
     let tocEnable = false
-    if (is_post() && theme.toc.post) tocEnable = true
-    else if (is_page() && theme.toc.page) tocEnable = true
+    if (globalPageType === 'post' && theme.toc.post) tocEnable = true
+    else if (globalPageType === 'page' && theme.toc.page) tocEnable = true
     const pageToc = typeof page.toc === 'boolean' ? page.toc : tocEnable
     showToc = pageToc && (toc(page.content) !== '' || page.encrypt === true)
   }
@@ -19,9 +19,7 @@
 script#config-diff.
   var GLOBAL_CONFIG_SITE = {
     title: '!{titleVal}',
-    isPost: !{is_post()},
-    isHome: !{is_home()},
     isHighlightShrink: !{isHighlightShrink},
     isToc: !{showToc},
-    isShuoshuo: !{page.type == 'shuoshuo'}
+    pageType: '!{page.type == 'shuoshuo' ? 'shuoshuo' : globalPageType}'
   }

layout/includes/head/preconnect.pug

@@ -10,7 +10,7 @@
 
 if internal_provider === third_party_provider && internal_provider !== 'local'
   link(rel="preconnect" href=providers[internal_provider])
-else 
+else
   if internal_provider !== 'local'
     link(rel="preconnect" href=providers[internal_provider])
   if third_party_provider !== 'local'

layout/includes/header/index.pug

@@ -6,33 +6,32 @@
   var bg_img = ''
 
 if !theme.disable_top_img && page.top_img !== false
-  if is_post()
-    - top_img = page.top_img || page.cover || theme.default_top_img
-  else if is_page()
-    - top_img = page.top_img || theme.default_top_img
-  else if is_tag()
-    - top_img = theme.tag_per_img && theme.tag_per_img[page.tag]
-    - top_img = top_img || returnTopImg(theme.tag_img)
-  else if is_category()
-    - top_img = theme.category_per_img && theme.category_per_img[page.category]
-    - top_img = top_img || returnTopImg(theme.category_img)
-  else if is_home()
-    - top_img = returnTopImg(theme.index_img)
-  else if is_archive()
-    - top_img = returnTopImg(theme.archive_img)
-  else
-    - top_img = page.top_img || theme.default_top_img
+  case globalPageType
+    when 'post'
+      - top_img = page.top_img || page.cover || theme.default_top_img
+    when 'page'
+      - top_img = page.top_img || theme.default_top_img
+    when 'tag'
+      - top_img = theme.tag_per_img && theme.tag_per_img[page.tag] || returnTopImg(theme.tag_img)
+    when 'category'
+      - top_img = theme.category_per_img && theme.category_per_img[page.category] || returnTopImg(theme.category_img)
+    when 'home'
+      - top_img = returnTopImg(theme.index_img)
+    when 'archive'
+      - top_img = returnTopImg(theme.archive_img)
+    default
+      - top_img = page.top_img || theme.default_top_img
 
   if top_img !== false
     - bg_img = getBgPath(top_img)
-    - headerClassName = is_home() ? 'full_page' : is_post() ? 'post-bg' : 'not-home-page'
+    - headerClassName = globalPageType === 'home' ? 'full_page' : globalPageType === 'post' ? 'post-bg' : 'not-home-page'
 
 header#page-header(class=`${headerClassName + isFixedClass}` style=bg_img)
   include ./nav.pug
   if top_img !== false
-    if is_post()
+    if globalPageType === 'post'
       include ./post-info.pug
-    else if is_home()
+    else if globalPageType === 'home'
       #site-info
         h1#site-title=config.title
         if theme.subtitle.enable
@@ -48,6 +47,6 @@ header#page-header(class=`${headerClassName + isFixedClass}` style=bg_img)
       #page-site-info
         h1#site-title=page.title || page.tag || page.category
   else
-    //- improvement seo
-    if !is_post()
+    //- improve seo
+    if globalPageType !== 'post'
       h1.title-seo=page.title || page.tag || page.category || config.title

layout/includes/header/nav.pug

@@ -5,7 +5,7 @@ nav#nav
         img.site-icon(src=url_for(theme.nav.logo) alt='Logo')
       if theme.nav.display_title
         span.site-name=config.title
-    if is_post()
+    if globalPageType === 'post'
       a.nav-page-title(href=url_for('/'))
         span.site-name=(page.title || config.title)
   #menus

layout/includes/layout.pug

@@ -1,7 +1,8 @@
+- var globalPageType = getPageType(page, is_home)
 - var htmlClassHideAside = theme.aside.enable && theme.aside.hide ? 'hide-aside' : ''
-- page.aside = is_archive() ? theme.aside.display.archive: is_category() ? theme.aside.display.category : is_tag() ? theme.aside.display.tag : page.aside
+- page.aside = globalPageType === 'archive' ? theme.aside.display.archive: globalPageType === 'category' ? theme.aside.display.category : globalPageType === 'tag' ? theme.aside.display.tag : page.aside
 - var hideAside = !theme.aside.enable || page.aside === false ? 'hide-aside' : ''
-- var pageType = is_post() ? 'post' : 'page'
+- var pageType = globalPageType === 'post' ? 'post' : 'page'
 - pageType = page.type ? pageType + ' type-' + page.type : pageType
 
 doctype html
@@ -13,7 +14,7 @@ html(lang=config.language data-theme=theme.display_mode class=htmlClassHideAside
 
     if theme.background
       #web_bg(style=getBgPath(theme.background))
-      
+
     !=partial('includes/sidebar', {}, {cache: true})
 
     #body-wrap(class=pageType)

layout/includes/mixins/indexPostUI.pug

@@ -10,7 +10,7 @@ mixin indexPostUI()
           - 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)
@@ -20,7 +20,7 @@ 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 globalPageType === 'home' && (article.top || article.sticky > 0)
                 i.fas.fa-thumbtack.sticky
               = title
             .article-meta-wrap
@@ -58,7 +58,7 @@ mixin indexPostUI()
                     a(href=url_for(item.path)).article-meta__tags #[=item.name]
                     if index < article.tags.data.length - 1
                       span.article-meta-link #[='•']
-              
+
               mixin countBlockInIndex
                 - needLoadCountJs = true
                 span.article-meta
@@ -67,7 +67,7 @@ mixin indexPostUI()
                   if block
                     block
                   span.article-meta-label= ' ' + _p('card_post_count')
-              
+
               if theme.comments.card_post_count && theme.comments.use
                 case theme.comments.use[0]
                   when 'Disqus'

layout/includes/page/flink.pug

@@ -30,7 +30,7 @@
                       <div class="flink-item-icon">
                         <img class="no-lightbox" src="${lists[j].avatar}" onerror='this.onerror=null;this.src="!{url_for(theme.error_img.flink)}"' alt="${lists[j].name}" />
                       </div>
-                      <div class="flink-item-name">${lists[j].name}</div> 
+                      <div class="flink-item-name">${lists[j].name}</div>
                       <div class="flink-item-desc" title="${lists[j].descr}">${lists[j].descr}</div>
                     </a>
                   </div>`
@@ -63,14 +63,14 @@
           - let listResult = ""
 
           each j in i.link_list
-            - 
+            -
               listResult += `
                 <div class="flink-list-item">
                   <a href="${j.link}" title="${j.name}" target="_blank">
                     <div class="flink-item-icon">
                       <img class="no-lightbox" src="${j.avatar}" onerror='this.onerror=null;this.src="${url_for(theme.error_img.flink)}"' alt="${j.name}" />
                     </div>
-                    <div class="flink-item-name">${j.name}</div> 
+                    <div class="flink-item-name">${j.name}</div>
                     <div class="flink-item-desc" title="${j.descr}">${j.descr}</div>
                   </a>
                 </div>`

layout/includes/pagination.pug

@@ -6,7 +6,7 @@
     escape: false
   }
 
-if is_post()
+if globalPageType === 'post'
   - let paginationOrder = theme.post_pagination === 1 ? { prev: page.prev, next: page.next } : { prev: page.next, next: page.prev }
 
   nav#pagination.pagination-post
@@ -15,13 +15,13 @@ if is_post()
         - const getPostDesc = direction.postDesc || postDesc(direction)
         - let className = key === 'prev' ? (paginationOrder.next ? '' : 'full-width') : (paginationOrder.prev ? '' : 'full-width')
         - className = getPostDesc ? className : className + ' no-desc'
-        
+
         a.pagination-related(class=className href=url_for(direction.path) title=direction.title)
           if direction.cover_type === 'img'
             img.cover(src=url_for(direction.cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt=`cover of ${key === 'prev' ? 'previous' : 'next'} post`)
           else
             .cover(style=`background: ${direction.cover || 'var(--default-bg-color)'}`)
-          
+
           .info(class=key === 'prev' ? '' : 'text-right')
             .info-1
               .info-item-1=_p(`pagination.${key}`)
@@ -32,6 +32,6 @@ if is_post()
 else
   nav#pagination
     .pagination
-      if is_home()
+      if globalPageType === 'home'
         - options.format = 'page/%d/#content-inner'
       !=paginator(options)

layout/includes/rightside.pug

@@ -3,7 +3,7 @@ mixin rightsideItem(array)
   each item in array
     case item
       when 'readmode'
-        if is_post() && readmode
+        if globalPageType === 'post' && readmode
           button#readmode(type="button" title=_p('rightside.readmode_title'))
             i.fas.fa-book-open
       when 'translate'
@@ -35,7 +35,7 @@ mixin rightsideItem(array)
   - const hideArray = enable ? hide && hide.split(',') : ['readmode','translate','darkmode','hideAside']
   - const showArray = enable ? show && show.split(',') : ['toc','chat','comment']
 
-  
+
   #rightside-config-hide
     if hideArray
       +rightsideItem(hideArray)
@@ -45,7 +45,7 @@ mixin rightsideItem(array)
         button#rightside-config(type="button" title=_p("rightside.setting"))
           i.fas.fa-cog.fa-spin
     else
-      if is_post()
+      if globalPageType === 'post'
         if (readmode || translate.enable || (darkmode.enable && darkmode.button))
           button#rightside-config(type="button" title=_p("rightside.setting"))
             i.fas.fa-cog.fa-spin

layout/includes/sidebar.pug

@@ -12,7 +12,7 @@ if theme.menu
           .headline= _p('aside.tags')
           .length-num= site.tags.length
         a(href=url_for(config.category_dir) + '/')
-          .headline= _p('aside.categories') 
+          .headline= _p('aside.categories')
           .length-num= site.categories.length
 
       !=partial('includes/header/menu_item', {}, {cache: true})

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

@@ -1,6 +1,3 @@
 if theme.abcjs.enable
-  if theme.abcjs.per_page
-    if is_post() || is_page()
-      include ./abcjs.pug
-  else if page.abcjs
+  if theme.abcjs.per_page && (['post','page'].includes(globalPageType)) || page.abcjs
     include ./abcjs.pug

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

@@ -5,7 +5,7 @@ script.
   (() => {
     let artalkItem = null
     const option = !{JSON.stringify(option)}
-    const isShuoshuo = GLOBAL_CONFIG_SITE.isShuoshuo
+    const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo'
 
     const destroyArtalk = () => {
       if (artalkItem) {

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

@@ -4,7 +4,7 @@
 
 script.
   (() => {
-    const isShuoshuo = GLOBAL_CONFIG_SITE.isShuoshuo
+    const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo'
 
     const disqusReset = conf => {
       window.DISQUS && window.DISQUS.reset({
@@ -72,7 +72,7 @@ script.
       if (!{lazyload}) btf.loadComment(document.getElementById('disqus_thread'), loadDisqus)
       else {
         loadDisqus()
-        !{ count ? 'GLOBAL_CONFIG_SITE.isPost && getCount()' : '' }
+        !{ count ? `GLOBAL_CONFIG_SITE.pageType === 'post' && getCount()` : '' }
       }
     } else {
       window.loadOtherComment = loadDisqus

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

@@ -3,7 +3,7 @@
 
 script.
   (() => {
-    const isShuoshuo = GLOBAL_CONFIG_SITE.isShuoshuo
+    const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo'== 'shuoshuo'
     const dqOption = !{JSON.stringify(dqOption)}
 
     const destroyDisqusjs = () => {
@@ -79,7 +79,7 @@ script.
       if (!{theme.comments.lazyload}) btf.loadComment(document.getElementById('disqusjs-wrap'), loadDisqusjs)
       else {
         loadDisqusjs()
-        !{ theme.comments.count ? 'GLOBAL_CONFIG_SITE.isPost && getCount()' : '' }
+        !{ theme.comments.count ? `GLOBAL_CONFIG_SITE.pageType === 'post' && getCount()` : '' }
       }
     } else {
       window.loadOtherComment = loadDisqusjs

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

@@ -3,7 +3,7 @@
 
 script.
   (()=>{
-    const isShuoshuo = GLOBAL_CONFIG_SITE.isShuoshuo
+    const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo'== 'shuoshuo'
 
     const loadFBComment = (el = document, path) => {
       if (isShuoshuo) {

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

@@ -5,7 +5,7 @@
 
 script.
   (() => {
-    const isShuoshuo = GLOBAL_CONFIG_SITE.isShuoshuo
+    const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo'
     const option = !{JSON.stringify(option)}
 
     const getGiscusTheme = theme => theme === 'dark' ? '!{dark_theme}' : '!{light_theme}'

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

@@ -2,7 +2,7 @@
 
 script.
   (() => {
-    const isShuoshuo = GLOBAL_CONFIG_SITE.isShuoshuo
+    const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo'
     const option = !{JSON.stringify(option)}
 
     const commentCount = n => {

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

@@ -2,7 +2,7 @@
 
 script.
   (() => {
-    const isShuoshuo = GLOBAL_CONFIG_SITE.isShuoshuo
+    const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo'
 
     const loadLivere = (el, path) => {
       window.livereOptions = {

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

@@ -2,7 +2,7 @@
 
 script.
   (() => {
-    const isShuoshuo = GLOBAL_CONFIG_SITE.isShuoshuo
+    const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo'
     const option = !{JSON.stringify(option)}
 
     const loadScript = src => {

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

@@ -3,7 +3,7 @@
 
 script.
   (() => {
-    const isShuoshuo = GLOBAL_CONFIG_SITE.isShuoshuo
+    const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo'
     const option = !{JSON.stringify(option)}
 
     const getCount = () => {
@@ -33,7 +33,7 @@ script.
         path: isShuoshuo ? path : (option && option.path) || path
       })
 
-      !{count ? 'GLOBAL_CONFIG_SITE.isPost && getCount()' : ''}
+      !{count ? `GLOBAL_CONFIG_SITE.pageType === 'post' && getCount()` : ''}
 
       isShuoshuo && (window.shuoshuoComment.destroyTwikoo = () => {
         if (el.children.length) {

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

@@ -5,7 +5,7 @@
 
 script.
   (() => {
-    const isShuoshuo = GLOBAL_CONFIG_SITE.isShuoshuo
+    const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo'
     const option = !{JSON.stringify(option)}
     const getUtterancesTheme = theme => theme === 'dark' ? '#{dark_theme}' : '#{light_theme}'
 

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

@@ -7,7 +7,7 @@ if site.data.valine
 
 script.
   (() => {
-    const isShuoshuo = GLOBAL_CONFIG_SITE.isShuoshuo
+    const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo'
     const option = !{JSON.stringify(option)}
 
     const initValine = (el, path) => {

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

@@ -4,7 +4,7 @@
 script.
   (() => {
     let initFn = window.walineFn || null
-    const isShuoshuo = GLOBAL_CONFIG_SITE.isShuoshuo
+    const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo'
     const option = !{JSON.stringify(option)}
 
     const destroyWaline = ele => ele.destroy()

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

@@ -2,9 +2,6 @@
 
 script.
   (() => {
-    const $chartjs = document.querySelectorAll('#article-container .chartjs-container')
-    if ($chartjs.length === 0) return
-
     const applyThemeDefaultsConfig = theme => {
       if (theme === 'dark-mode') {
         Chart.defaults.color = "!{fontColor.dark}"
@@ -20,7 +17,7 @@ script.
     // Recursively traverse the config object and automatically apply theme-specific color schemes
     const applyThemeConfig = (obj, theme) => {
       if (typeof obj !== 'object' || obj === null) return
-      
+
       Object.keys(obj).forEach(key => {
         const value = obj[key]
         // If the property is an object and has theme-specific options, apply them
@@ -35,10 +32,10 @@ script.
       })
     }
 
-    const runChartJS = () => {
+    const runChartJS = ele => {
       window.loadChartJS = true
 
-      Array.from($chartjs).forEach((item, index) => {
+      Array.from(ele).forEach((item, index) => {
         const chartSrc = item.firstElementChild
         const chartID = item.getAttribute('data-chartjs-id') || ('chartjs-' + index) // Use custom ID or default ID
         const width = item.getAttribute('data-width')
@@ -80,12 +77,15 @@ script.
     }
 
     const loadChartJS = () => {
-      window.loadChartJS ? runChartJS() : btf.getScript('!{url_for(theme.asset.chartjs)}').then(runChartJS)
+      const chartJSEle = document.querySelectorAll('#article-container .chartjs-container')
+      if (chartJSEle.length === 0) return
+
+      window.loadChartJS ? runChartJS(chartJSEle) : btf.getScript('!{url_for(theme.asset.chartjs)}').then(() => runChartJS(chartJSEle))
     }
 
     // Listen for theme change events
-    btf.addGlobalFn('themeChange', runChartJS, 'chartjs')
-    btf.addGlobalFn('encrypt', runChartJS, 'chartjs')
+    btf.addGlobalFn('themeChange', loadChartJS, 'chartjs')
+    btf.addGlobalFn('encrypt', loadChartJS, 'chartjs')
 
     window.pjax ? loadChartJS() : document.addEventListener('DOMContentLoaded', loadChartJS)
   })()

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

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

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

@@ -29,7 +29,7 @@ script.
             }
           }
         }
-        
+
         const script = document.createElement('script')
         script.src = '!{url_for(theme.asset.mathjax)}'
         script.id = 'MathJax-script'

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

@@ -18,7 +18,7 @@ script.
       if (predefinedAvatarCdn && predefinedAvatarDefault) {
         return { avatarCdn: predefinedAvatarCdn, avatarDefault: avatarDefaultFormat(predefinedAvatarDefault) }
       }
-    
+
       try {
         const res = await fetch('!{server}/api/v2/conf')
         const result = await res.json()

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

@@ -6,7 +6,7 @@ script.
       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(/<code>.*?<\/code>/gi, '[!{_p("aside.card_newest_comments.code")}]') // replace code
       content = content.replace(/<[^>]+>/g, "") // remove html tag
 
       if (content.length > 150) {
@@ -23,8 +23,9 @@ script.
           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>`
+            const imgAttr = '!{theme.lazyload.enable && !theme.lazyload.native ? "data-lazy-src" : "src"}'
+            const lazyloadNative = '!{theme.lazyload.enable && theme.lazyload.native ? "loading=\"lazy\"" : ""}'
+            result += `<a href="${array[i].url}" class="thumbnail"><img ${imgAttr}="${array[i].avatar}" alt="${array[i].nick}" ${lazyloadNative}></a>`
           }
 
           result += `<div class="content">

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

@@ -14,7 +14,7 @@
         #algolia-info
           .algolia-stats
           .algolia-poweredBy
-  
+
   #search-mask
 
   script(src=url_for(theme.asset.algolia_search))

layout/includes/third-party/umami_analytics.pug

@@ -35,7 +35,7 @@ script.
 
     const insertData = async () => {
       try {
-        if (GLOBAL_CONFIG_SITE.isPost && config.page_pv) {
+        if (GLOBAL_CONFIG_SITE.pageType === 'post' && config.page_pv) {
           const pagePV = document.getElementById('umamiPV')
           if (pagePV) {
             const data = await getData(true)

layout/includes/widget/card_author.pug

@@ -13,14 +13,14 @@ if theme.aside.card_author.enable
         .headline= _p('aside.tags')
         .length-num= site.tags.length
       a(href=url_for(config.category_dir) + '/')
-        .headline= _p('aside.categories') 
+        .headline= _p('aside.categories')
         .length-num= site.categories.length
 
     if theme.aside.card_author.button.enable
       a#card-info-btn(href=theme.aside.card_author.button.link)
         i(class=theme.aside.card_author.button.icon)
         span=theme.aside.card_author.button.text
-  
+
     if(theme.social)
       .card-info-social-icons
         !=partial('includes/header/social', {}, {cache: true})

layout/includes/widget/card_post_toc.pug

@@ -10,6 +10,5 @@
 
   if (page.encrypt == true)
     .toc-content.toc-div-class(class=tocExpandClass style="display:none")!=toc(page.origin, {list_number: tocNumber})
-  else 
+  else
     .toc-content(class=tocExpandClass)!=toc(page.content, {list_number: tocNumber})
-      

layout/includes/widget/index.pug

@@ -1,6 +1,6 @@
 #aside-content.aside-content
   //- post
-  if is_post()
+  if globalPageType === 'post'
     - const tocStyle = page.toc_style_simple
     - const tocStyleVal = tocStyle === true || tocStyle === false ? tocStyle : theme.toc.style_simple
     if showToc && tocStyleVal

layout/post.pug

@@ -17,7 +17,7 @@ block content
           each item, index in page.tags.data
             a(href=url_for(item.path)).post-meta__tags #[=item.name]
       include includes/third-party/share/index.pug
-        
+
     if theme.reward.enable && theme.reward.QR_code
       !=partial('includes/post/reward', {}, {cache: true})
 
@@ -33,4 +33,3 @@ block content
     if page.comments !== false && theme.comments.use
       - var commentsJsLoad = true
       !=partial('includes/third-party/comments/index', {}, {cache: true})
-      

package.json

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

scripts/events/merge_config.js

@@ -547,6 +547,7 @@ hexo.extend.filter.register('before_generate', () => {
     instantpage: false,
     lazyload: {
       enable: false,
+      native: false,
       field: 'site',
       placeholder: null,
       blur: false

scripts/filters/post_lazyload.js

@@ -9,6 +9,10 @@
 const urlFor = require('hexo-util').url_for.bind(hexo)
 
 const lazyload = htmlContent => {
+  if (hexo.theme.config.lazyload.native) {
+    return htmlContent.replace(/(<img.*?)(>)/ig, '$1 loading=\'lazy\'$2')
+  }
+
   const bg = hexo.theme.config.lazyload.placeholder ? urlFor(hexo.theme.config.lazyload.placeholder) : 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'
   return htmlContent.replace(/(<img.*? src=)/ig, `$1 "${bg}" data-lazy-src=`)
 }

scripts/helpers/page.js

@@ -131,3 +131,17 @@ hexo.extend.helper.register('shuoshuoFN', (data, page) => {
 
   return finalResult
 })
+
+hexo.extend.helper.register('getPageType', (page, isHome) => {
+  const { layout, tag, category, type, archive } = page
+  if (layout) return layout
+  if (tag) return 'tag'
+  if (category) return 'category'
+  if (archive) return 'archive'
+  if (type) {
+    if (type === 'tags' || type === 'categories') return type
+    else return 'page'
+  }
+  if (isHome) return 'home'
+  return 'post'
+})

scripts/tag/hide.js

@@ -16,50 +16,37 @@
 
 'use strict'
 
-const parseArgs = args => {
-  return args.join(' ').split(',')
-}
+const parseArgs = args => args.join(' ').split(',')
 
 const generateStyle = (bg, color) => {
   let style = 'style="'
-  if (bg) {
-    style += `background-color: ${bg};`
-  }
-  if (color) {
-    style += `color: ${color}`
-  }
+  if (bg) style += `background-color: ${bg};`
+  if (color) style += `color: ${color}`
   style += '"'
   return style
 }
 
 const hideInline = args => {
   const [content, display = 'Click', bg = false, color = false] = parseArgs(args)
-  const group = generateStyle(bg, color)
-
-  return `<span class="hide-inline"><button type="button" class="hide-button" ${group}>${display}
-  </button><span class="hide-content">${content}</span></span>`
+  const style = generateStyle(bg, color)
+  return `<span class="hide-inline"><button type="button" class="hide-button" ${style}>${display}</button><span class="hide-content">${content}</span></span>`
 }
 
 const hideBlock = (args, content) => {
   const [display = 'Click', bg = false, color = false] = parseArgs(args)
-  const group = generateStyle(bg, color)
-
-  return `<div class="hide-block"><button type="button" class="hide-button" ${group}>${display}
-    </button><div class="hide-content">${hexo.render.renderSync({ text: content, engine: 'markdown' })}</div></div>`
+  const style = generateStyle(bg, color)
+  const renderedContent = hexo.render.renderSync({ text: content, engine: 'markdown' })
+  return `<div class="hide-block"><button type="button" class="hide-button" ${style}>${display}</button><div class="hide-content">${renderedContent}</div></div>`
 }
 
 const hideToggle = (args, content) => {
   const [display, bg = false, color = false] = parseArgs(args)
-  const group = generateStyle(bg, color)
-  let border = ''
-
-  if (bg) {
-    border = `style="border: 1px solid ${bg}"`
-  }
-
-  return `<details class="toggle" ${border}><summary class="toggle-button" ${group}>${display}</summary><div class="toggle-content">${hexo.render.renderSync({ text: content, engine: 'markdown' })}</div></details>`
+  const style = generateStyle(bg, color)
+  const border = bg ? `style="border: 1px solid ${bg}"` : ''
+  const renderedContent = hexo.render.renderSync({ text: content, engine: 'markdown' })
+  return `<details class="toggle" ${border}><summary class="toggle-button" ${style}>${display}</summary><div class="toggle-content">${renderedContent}</div></details>`
 }
 
 hexo.extend.tag.register('hideInline', hideInline)
 hexo.extend.tag.register('hideBlock', hideBlock, { ends: true })
-hexo.extend.tag.register('hideToggle', hideToggle, { ends: true })
+hexo.extend.tag.register('hideToggle', hideToggle, { ends: true })

source/js/main.js

@@ -864,7 +864,7 @@ document.addEventListener('DOMContentLoaded', () => {
     menuMask && menuMask.addEventListener('click', () => { sidebarFn.close() })
 
     clickFnOfSubMenu()
-    GLOBAL_CONFIG.islazyload && lazyloadImg()
+    GLOBAL_CONFIG.islazyloadPlugin && lazyloadImg()
     GLOBAL_CONFIG.copyright !== undefined && addCopyright()
 
     if (GLOBAL_CONFIG.autoDarkmode) {
@@ -890,7 +890,7 @@ document.addEventListener('DOMContentLoaded', () => {
     initAdjust()
     justifiedIndexPostUI()
 
-    if (GLOBAL_CONFIG_SITE.isPost) {
+    if (GLOBAL_CONFIG_SITE.pageType === 'post') {
       addPostOutdateNotice()
       GLOBAL_CONFIG.relativeDate.post && relativeDate(document.querySelectorAll('#post-meta time'))
     } else {
@@ -900,11 +900,11 @@ document.addEventListener('DOMContentLoaded', () => {
       toggleCardCategory()
     }
 
-    GLOBAL_CONFIG_SITE.isHome && scrollDownInIndex()
+    GLOBAL_CONFIG_SITE.pageType === 'home' && scrollDownInIndex()
     scrollFn()
 
     forPostFn()
-    !GLOBAL_CONFIG_SITE.isShuoshuo && btf.switchComments(document)
+    GLOBAL_CONFIG_SITE.pageType !== 'shuoshuo' && btf.switchComments(document)
     openMobileMenu()
   }