biss/hexo-theme-butterfly
1
0
Fork 0
mirror of https://github.com/jerryc127/hexo-theme-butterfly.git synced 2026-04-16 17:40:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

breaking changes: 移除 subtitle 一句網調用（api 已失效)

Browse Source 
feat: 右下角按鈕增加預覽進度顯示
feat: toc可設置是否顯示預覽進度
fix: 修復 TypeError: require(...) is not a function 的報錯 #1102
improvement: 日期設置相對日期時，文章的日期格式和最新評論的日期格式統一為 年月日
This commit is contained in:
Jerry
2022-11-18 18:30:25 +08:00
Unverified
parent 5c0d578e4c
commit f218a0a14a
10 changed files with 83 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
source/js/main.js
View File

@@ -251,6 +251,21 @@ document.addEventListener('DOMContentLoaded', function () {
getScript(`${GLOBAL_CONFIG.source.justifiedGallery.js}`).then(() => { btf.initJustifiedGallery(ele) })
}
/**
* rightside scroll percent
*/
const rightsideScrollPercent = currentTop => {
const perNum = btf.getScrollPercent(currentTop,document.body)
const $goUp = document.getElementById('go-up')
if ( perNum < 95 ) {
$goUp.classList.add('show-percent')
$goUp.querySelector('.scroll-percent').textContent = perNum
}
else {
$goUp.classList.remove('show-percent')
}
}
/**
* 滾動處理
*/
@@ -276,6 +291,7 @@ document.addEventListener('DOMContentLoaded', function () {
const $header = document.getElementById('page-header')
const isChatBtnHide = typeof chatBtnHide === 'function'
const isChatBtnShow = typeof chatBtnShow === 'function'
const isShowPercent = GLOBAL_CONFIG.percent.rightside
const scrollTask = btf.throttle(() => {
const currentTop = window.scrollY || document.documentElement.scrollTop
@@ -305,9 +321,12 @@ document.addEventListener('DOMContentLoaded', function () {
$rightside.style.cssText = "opacity: ''; transform: ''"
}
isShowPercent && rightsideScrollPercent(currentTop)
if (document.body.scrollHeight <= innerHeight) {
$rightside.style.cssText = 'opacity: 0.8; transform: translateX(-58px)'
}
}, 200)
window.scrollCollect = scrollTask
@@ -325,26 +344,15 @@ document.addEventListener('DOMContentLoaded', function () {
if (!($article && (isToc || isAnchor))) return
let $tocLink, $cardToc, scrollPercent, autoScrollToc, isExpand
let $tocLink, $cardToc, autoScrollToc, $tocPercentage, isExpand
if (isToc) {
const $cardTocLayout = document.getElementById('card-toc')
$cardToc = $cardTocLayout.getElementsByClassName('toc-content')[0]
$tocLink = $cardToc.querySelectorAll('.toc-link')
const $tocPercentage = $cardTocLayout.querySelector('.toc-percentage')
$tocPercentage = $cardTocLayout.querySelector('.toc-percentage')
isExpand = $cardToc.classList.contains('is-expand')
scrollPercent = currentTop => {
const docHeight = $article.clientHeight
const winHeight = document.documentElement.clientHeight
const headerHeight = $article.offsetTop
const contentMath = (docHeight > winHeight) ? (docHeight - winHeight) : (document.documentElement.scrollHeight - winHeight)
const scrollPercent = (currentTop - headerHeight) / (contentMath)
const scrollPercentRounded = Math.round(scrollPercent * 100)
const percentage = (scrollPercentRounded > 100) ? 100 : (scrollPercentRounded <= 0) ? 0 : scrollPercentRounded
$tocPercentage.textContent = percentage
}
window.mobileToc = {
open: () => {
$cardTocLayout.style.cssText = 'animation: toc-open .3s; opacity: 1; right: 55px'
@@ -433,13 +441,14 @@ document.addEventListener('DOMContentLoaded', function () {
}
// main of scroll
window.tocScrollFn = function () {
return btf.throttle(function () {
window.tocScrollFn = btf.throttle(()=>{
const currentTop = window.scrollY || document.documentElement.scrollTop
isToc && scrollPercent(currentTop)
if (isToc && GLOBAL_CONFIG.percent.toc) {
$tocPercentage.textContent = btf.getScrollPercent(currentTop,$article)
}
findHeadPosition(currentTop)
}, 100)()
}
}, 100)
window.addEventListener('scroll', tocScrollFn)
}