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

feat: 代碼優化
feat: 優化 pageType 邏輯
fix: 修復解密文章後, chartjs 沒有加載的 bug
This commit is contained in:
myw
2024-11-30 13:38:39 +08:00
Unverified
parent f7483d59b5
commit 247c1b664d
45 changed files with 138 additions and 132 deletions

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

@@ -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) => {

View File

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

View File

@@ -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)
})()

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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