572 lines
20 KiB
JavaScript
572 lines
20 KiB
JavaScript
|
document.addEventListener('DOMContentLoaded', function () {
|
|||
|
|
const $blogName = document.getElementById('site-name')
|
|||
|
|
let blogNameWidth = $blogName && $blogName.offsetWidth
|
|||
|
|
const $menusEle = document.querySelector('#menus .menus_items')
|
|||
|
|
let menusWidth = $menusEle && $menusEle.offsetWidth
|
|||
|
|
const $searchEle = document.querySelector('#search-button')
|
|||
|
|
let searchWidth = $searchEle && $searchEle.offsetWidth
|
|||
|
|
|
|||
|
|
const adjustMenu = (change = false) => {
|
|||
|
|
if (change) {
|
|||
|
|
blogNameWidth = $blogName && $blogName.offsetWidth
|
|||
|
|
menusWidth = $menusEle && $menusEle.offsetWidth
|
|||
|
|
searchWidth = $searchEle && $searchEle.offsetWidth
|
|||
|
|
}
|
|||
|
|
const $nav = document.getElementById('nav')
|
|||
|
|
let t
|
|||
|
|
if (window.innerWidth < 768) t = true
|
|||
|
|
else t = blogNameWidth + menusWidth + searchWidth > $nav.offsetWidth - 120
|
|||
|
|
|
|||
|
|
if (t) {
|
|||
|
|
$nav.classList.add('hide-menu')
|
|||
|
|
} else {
|
|||
|
|
$nav.classList.remove('hide-menu')
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 初始化header
|
|||
|
|
const initAdjust = () => {
|
|||
|
|
adjustMenu()
|
|||
|
|
document.getElementById('nav').classList.add('show')
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// sidebar menus
|
|||
|
|
const sidebarFn = () => {
|
|||
|
|
const $toggleMenu = document.getElementById('toggle-menu')
|
|||
|
|
const $mobileSidebarMenus = document.getElementById('sidebar-menus')
|
|||
|
|
const $menuMask = document.getElementById('menu-mask')
|
|||
|
|
const $body = document.body
|
|||
|
|
|
|||
|
|
function openMobileSidebar() {
|
|||
|
|
btf.sidebarPaddingR()
|
|||
|
|
$body.style.overflow = 'hidden'
|
|||
|
|
btf.fadeIn($menuMask, 0.5)
|
|||
|
|
$mobileSidebarMenus.classList.add('open')
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function closeMobileSidebar() {
|
|||
|
|
$body.style.overflow = ''
|
|||
|
|
$body.style.paddingRight = ''
|
|||
|
|
btf.fadeOut($menuMask, 0.5)
|
|||
|
|
$mobileSidebarMenus.classList.remove('open')
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
$toggleMenu.addEventListener('click', openMobileSidebar)
|
|||
|
|
|
|||
|
|
$menuMask.addEventListener('click', e => {
|
|||
|
|
if ($mobileSidebarMenus.classList.contains('open')) {
|
|||
|
|
closeMobileSidebar()
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
window.addEventListener('resize', e => {
|
|||
|
|
if (btf.isHidden($toggleMenu)) {
|
|||
|
|
if ($mobileSidebarMenus.classList.contains('open')) closeMobileSidebar()
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 首頁top_img底下的箭頭
|
|||
|
|
*/
|
|||
|
|
const scrollDownInIndex = () => {
|
|||
|
|
const $scrollDownEle = document.getElementById('scroll-down')
|
|||
|
|
const $homeTop = document.getElementById('home_top')
|
|||
|
|
$scrollDownEle && $scrollDownEle.addEventListener('click', function () {
|
|||
|
|
$homeTop && btf.scrollToDest($homeTop.offsetTop, 300)
|
|||
|
|
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* justified-gallery 圖庫排版
|
|||
|
|
* 需要 jQuery
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
let detectJgJsLoad = false
|
|||
|
|
const runJustifiedGallery = function (ele) {
|
|||
|
|
|
|||
|
|
if (detectJgJsLoad) btf.initJustifiedGallerys(ele)
|
|||
|
|
else {
|
|||
|
|
$('head').append(`<link rel="stylesheet" type="text/css" href="${GLOBAL_CONFIG.source.justifiedGallery.css}">`)
|
|||
|
|
$.getScript(`${GLOBAL_CONFIG.source.justifiedGallery.js}`, function () {
|
|||
|
|
|
|||
|
|
btf.initJustifiedGallerys(ele)
|
|||
|
|
})
|
|||
|
|
detectJgJsLoad = true
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* fancybox
|
|||
|
|
*/
|
|||
|
|
const addFancybox = function (ele) {
|
|||
|
|
const runFancybox = (ele) => {
|
|||
|
|
ele.each(function (i, o) {
|
|||
|
|
const $this = $(o)
|
|||
|
|
const lazyloadSrc = $this.attr('data-lazy-src') || $this.attr('src')
|
|||
|
|
const dataCaption = $this.attr('alt') || ''
|
|||
|
|
$this.wrap(`<a href="${lazyloadSrc}" data-fancybox="images" data-caption="${dataCaption}" class="fancybox" data-srcset="${lazyloadSrc}"></a>`)
|
|||
|
|
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
$().fancybox({
|
|||
|
|
selector: '[data-fancybox]',
|
|||
|
|
loop: true,
|
|||
|
|
transitionEffect: 'slide',
|
|||
|
|
protect: true,
|
|||
|
|
buttons: ['slideShow', 'fullScreen', 'thumbs', 'close'],
|
|||
|
|
hash: false
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
if (typeof $.fancybox === 'undefined') {
|
|||
|
|
// $('head').append(`<link rel="stylesheet" type="text/css" href="${GLOBAL_CONFIG.source.fancybox.css}">`)
|
|||
|
|
$.getScript(`${GLOBAL_CONFIG.source.fancybox.js}`, function () {
|
|||
|
|
runFancybox($(ele))
|
|||
|
|
})
|
|||
|
|
} else {
|
|||
|
|
runFancybox($(ele))
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const jqLoadAndRun = () => {
|
|||
|
|
const $fancyboxEle = GLOBAL_CONFIG.lightbox === 'fancybox'
|
|||
|
|
? document.querySelectorAll('#article-container :not(a):not(.rss-plan-info-group):not(.no-lightbox) > img, #article-container > img,.bber-container-img > img')
|
|||
|
|
: []
|
|||
|
|
const fbLengthNoZero = $fancyboxEle.length > 0
|
|||
|
|
const $jgEle = document.querySelectorAll('#article-container .gallery')
|
|||
|
|
const jgLengthNoZero = $jgEle.length > 0
|
|||
|
|
|
|||
|
|
if (jgLengthNoZero || fbLengthNoZero) {
|
|||
|
|
btf.isJqueryLoad(() => {
|
|||
|
|
jgLengthNoZero && runJustifiedGallery($jgEle)
|
|||
|
|
fbLengthNoZero && addFancybox($fancyboxEle)
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* toc
|
|||
|
|
*/
|
|||
|
|
const tocFn = function () {
|
|||
|
|
const postContent = document.querySelector('.post-content');
|
|||
|
|
if (postContent == null) return;
|
|||
|
|
const titles = postContent.querySelectorAll('h1,h2,h3,h4,h5,h6');
|
|||
|
|
// 没有 toc 目录，则直接移除
|
|||
|
|
if (titles.length === 0 || !titles) {
|
|||
|
|
const cardToc = document.getElementById("card-toc");
|
|||
|
|
cardToc?.remove();
|
|||
|
|
const $mobileTocButton = document.getElementById("mobile-toc-button")
|
|||
|
|
if ($mobileTocButton) {
|
|||
|
|
$('#mobile-toc-button').attr('style', 'display: none');
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
tocbot.init({
|
|||
|
|
tocSelector: '.toc-content',
|
|||
|
|
contentSelector: '.post-content',
|
|||
|
|
headingSelector: 'h1,h2,h3,h4,h5,h6',
|
|||
|
|
listItemClass: 'toc-item',
|
|||
|
|
activeLinkClass: 'active',
|
|||
|
|
activeListItemClass: 'active',
|
|||
|
|
headingsOffset: -400,
|
|||
|
|
scrollSmooth: true,
|
|||
|
|
scrollSmoothOffset: -70,
|
|||
|
|
tocScrollOffset: 50,
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
const $cardTocLayout = document.getElementById('card-toc')
|
|||
|
|
const $cardToc = $cardTocLayout.getElementsByClassName('toc-content')[0]
|
|||
|
|
|
|||
|
|
// toc元素點擊
|
|||
|
|
$cardToc.addEventListener('click', (ele) => {
|
|||
|
|
if (window.innerWidth < 900) {
|
|||
|
|
$cardTocLayout.classList.remove("open");
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Rightside
|
|||
|
|
*/
|
|||
|
|
const rightSideFn = {
|
|||
|
|
switchReadMode: () => { // read-mode
|
|||
|
|
const $body = document.body
|
|||
|
|
$body.classList.add('read-mode')
|
|||
|
|
const newEle = document.createElement('button')
|
|||
|
|
newEle.type = 'button'
|
|||
|
|
newEle.className = 'haofont hao-icon-sign-out-alt exit-readmode'
|
|||
|
|
$body.appendChild(newEle)
|
|||
|
|
|
|||
|
|
function clickFn () {
|
|||
|
|
$body.classList.remove('read-mode')
|
|||
|
|
newEle.remove()
|
|||
|
|
newEle.removeEventListener('click', clickFn)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
newEle.addEventListener('click', clickFn)
|
|||
|
|
},
|
|||
|
|
showOrHideBtn: () => { // rightside 點擊設置 按鈕 展開
|
|||
|
|
document.getElementById('rightside-config-hide').classList.toggle('show')
|
|||
|
|
},
|
|||
|
|
scrollToTop: () => { // Back to top
|
|||
|
|
btf.scrollToDest(0, 500)
|
|||
|
|
},
|
|||
|
|
hideAsideBtn: () => { // Hide aside
|
|||
|
|
const $htmlDom = document.documentElement.classList
|
|||
|
|
$htmlDom.contains('hide-aside')
|
|||
|
|
? saveToLocal.set('aside-status', 'show', 2)
|
|||
|
|
: saveToLocal.set('aside-status', 'hide', 2)
|
|||
|
|
$htmlDom.toggle('hide-aside')
|
|||
|
|
},
|
|||
|
|
runMobileToc: item => {
|
|||
|
|
const tocEle = document.getElementById("card-toc");
|
|||
|
|
tocEle.style.transformOrigin = `right ${item.getBoundingClientRect().top + 17}px`;
|
|||
|
|
tocEle.style.transition = "transform 0.3s ease-in-out";
|
|||
|
|
tocEle.classList.toggle("open");
|
|||
|
|
tocEle.addEventListener(
|
|||
|
|
"transitionend",
|
|||
|
|
() => {
|
|||
|
|
tocEle.style.transition = "";
|
|||
|
|
tocEle.style.transformOrigin = "";
|
|||
|
|
},
|
|||
|
|
{ once: true }
|
|||
|
|
);
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
document.getElementById('rightside').addEventListener('click', function (e) {
|
|||
|
|
const $target = e.target.id || e.target.parentNode.id
|
|||
|
|
switch ($target) {
|
|||
|
|
case 'go-up':
|
|||
|
|
rightSideFn.scrollToTop()
|
|||
|
|
break
|
|||
|
|
case 'rightside-config':
|
|||
|
|
rightSideFn.showOrHideBtn()
|
|||
|
|
break
|
|||
|
|
case "mobile-toc-button":
|
|||
|
|
rightSideFn.runMobileToc(this);
|
|||
|
|
break;
|
|||
|
|
case 'readmode':
|
|||
|
|
rightSideFn.switchReadMode()
|
|||
|
|
break
|
|||
|
|
case 'darkmode':
|
|||
|
|
navFn.switchDarkMode();
|
|||
|
|
break
|
|||
|
|
case 'hide-aside-btn':
|
|||
|
|
rightSideFn.hideAsideBtn()
|
|||
|
|
break
|
|||
|
|
default:
|
|||
|
|
break
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 滾動處理
|
|||
|
|
*/
|
|||
|
|
const scrollFn = function () {
|
|||
|
|
const $postComment = document.getElementById('post-comment')
|
|||
|
|
const $rightside = document.getElementById('rightside')
|
|||
|
|
const innerHeight = window.innerHeight + 0
|
|||
|
|
|
|||
|
|
if ($postComment) {
|
|||
|
|
$('#to_comment').attr('style', 'display: block');
|
|||
|
|
} else {
|
|||
|
|
$('#to_comment').attr('style', 'display: none');
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 當滾動條小于 0 的時候
|
|||
|
|
if (document.body.scrollHeight <= innerHeight) {
|
|||
|
|
$rightside.style.cssText = 'opacity: 1; transform: translateX(-58px)'
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
let initTop = 0
|
|||
|
|
let isChatShow = true
|
|||
|
|
const $header = document.getElementById('page-header')
|
|||
|
|
const $gulitop = document.getElementById('guli_top')
|
|||
|
|
const $cookies_window = document.getElementById('cookies-window')
|
|||
|
|
const isChatBtnHide = typeof chatBtnHide === 'function'
|
|||
|
|
const isChatBtnShow = typeof chatBtnShow === 'function'
|
|||
|
|
window.addEventListener('scroll', btf.throttle(function (e) {
|
|||
|
|
const currentTop = window.scrollY || document.documentElement.scrollTop
|
|||
|
|
const isDown = scrollDirection(currentTop)
|
|||
|
|
if (currentTop > 0) {
|
|||
|
|
if (isDown) {
|
|||
|
|
if ($header.classList.contains('nav-visible')) $header.classList.remove('nav-visible')
|
|||
|
|
if (isChatBtnShow && isChatShow === true) {
|
|||
|
|
chatBtnHide()
|
|||
|
|
isChatShow = false
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
if (!$header.classList.contains('nav-visible')) $header.classList.add('nav-visible')
|
|||
|
|
if (isChatBtnHide && isChatShow === false) {
|
|||
|
|
chatBtnShow()
|
|||
|
|
isChatShow = true
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
$header.classList.add('nav-fixed')
|
|||
|
|
if($cookies_window!=null && $cookies_window!=''){
|
|||
|
|
$cookies_window.classList.add('cw-hide')
|
|||
|
|
}
|
|||
|
|
if (window.getComputedStyle($rightside).getPropertyValue('opacity') === '0') {
|
|||
|
|
$rightside.style.cssText = 'opacity: 0.8; transform: translateX(-58px)'
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
if (currentTop === 0) {
|
|||
|
|
$header.classList.remove('nav-fixed', 'nav-visible')
|
|||
|
|
}
|
|||
|
|
$rightside.style.cssText = "opacity: ''; transform: ''"
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
if (document.body.scrollHeight <= innerHeight) {
|
|||
|
|
$rightside.style.cssText = 'opacity: 0.8; transform: translateX(-58px)'
|
|||
|
|
}
|
|||
|
|
}, 200))
|
|||
|
|
|
|||
|
|
// find the scroll direction
|
|||
|
|
function scrollDirection (currentTop) {
|
|||
|
|
const result = currentTop > initTop // true is down & false is up
|
|||
|
|
initTop = currentTop
|
|||
|
|
return result
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* menu
|
|||
|
|
* 側邊欄sub-menu 展開/收縮
|
|||
|
|
* 解決menus在觸摸屏下，滑動屏幕menus_item_child不消失的問題（手機hover的bug)
|
|||
|
|
*/
|
|||
|
|
const clickFnOfSubMenu = function () {
|
|||
|
|
document.querySelectorAll('#sidebar-menus .expand').forEach(function (e) {
|
|||
|
|
e.addEventListener('click', function () {
|
|||
|
|
this.classList.toggle('hide')
|
|||
|
|
const $dom = this.parentNode.nextElementSibling
|
|||
|
|
if (btf.isHidden($dom)) {
|
|||
|
|
$dom.style.display = 'block'
|
|||
|
|
} else {
|
|||
|
|
$dom.style.display = 'none'
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
window.addEventListener('touchmove', function (e) {
|
|||
|
|
const $menusChild = document.querySelectorAll('#nav .menus_item_child')
|
|||
|
|
$menusChild.forEach(item => {
|
|||
|
|
if (!btf.isHidden(item)) item.style.display = 'none'
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 複製時加上版權信息
|
|||
|
|
*/
|
|||
|
|
const addCopyright = () => {
|
|||
|
|
const copyright = GLOBAL_CONFIG.copyright
|
|||
|
|
document.body.oncopy = (e) => {
|
|||
|
|
e.preventDefault()
|
|||
|
|
let textFont;
|
|||
|
|
const copyFont = window.getSelection(0).toString()
|
|||
|
|
if (copyFont.length > copyright.limitCount) {
|
|||
|
|
textFont = copyFont + '\n' + '\n' + '\n' +
|
|||
|
|
copyright.languages.author + '\n' +
|
|||
|
|
copyright.languages.link + window.location.href + '\n' +
|
|||
|
|
copyright.languages.source + '\n' +
|
|||
|
|
copyright.languages.info
|
|||
|
|
} else {
|
|||
|
|
textFont = copyFont
|
|||
|
|
}
|
|||
|
|
if (e.clipboardData) {
|
|||
|
|
return e.clipboardData.setData('text', textFont)
|
|||
|
|
} else {
|
|||
|
|
return window.clipboardData.setData('text', textFont)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 網頁運行時間
|
|||
|
|
*/
|
|||
|
|
const addRuntime = () => {
|
|||
|
|
const $runtimeCount = document.getElementById('runtimeshow');
|
|||
|
|
if ($runtimeCount) {
|
|||
|
|
var s1 = $runtimeCount.innerText;;//建站时间
|
|||
|
|
if (s1) {
|
|||
|
|
s1 = new Date(s1.replace(/-/g, "/"));
|
|||
|
|
s2 = new Date();
|
|||
|
|
var days = s2.getTime() - s1.getTime();
|
|||
|
|
var number_of_days = parseInt(days / (1000 * 60 * 60 * 24));
|
|||
|
|
$runtimeCount.innerText = number_of_days + "天";
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 最後一次更新時間
|
|||
|
|
*/
|
|||
|
|
const addLastPushDate = () => {
|
|||
|
|
const $lastPushDateItem = document.getElementById('last-push-date')
|
|||
|
|
if ($lastPushDateItem) {
|
|||
|
|
const lastPushDate = $lastPushDateItem.getAttribute('data-lastPushDate')
|
|||
|
|
$lastPushDateItem.innerText = btf.diffDate(lastPushDate, true)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* table overflow
|
|||
|
|
*/
|
|||
|
|
const addTableWrap = function () {
|
|||
|
|
const $table = document.querySelectorAll('#article-container :not(.highlight) > table, #article-container > table')
|
|||
|
|
if ($table.length) {
|
|||
|
|
$table.forEach(item => {
|
|||
|
|
btf.wrap(item, 'div', '', 'table-wrap')
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* tag-hide
|
|||
|
|
*/
|
|||
|
|
const clickFnOfTagHide = function () {
|
|||
|
|
const $hideInline = document.querySelectorAll('#article-container .hide-button')
|
|||
|
|
if ($hideInline.length) {
|
|||
|
|
$hideInline.forEach(function (item) {
|
|||
|
|
item.addEventListener('click', function (e) {
|
|||
|
|
const $this = this
|
|||
|
|
const $hideContent = $this.nextElementSibling
|
|||
|
|
$this.classList.toggle('open')
|
|||
|
|
if ($this.classList.contains('open')) {
|
|||
|
|
if ($hideContent.querySelectorAll('.gallery').length > 0) {
|
|||
|
|
btf.initJustifiedGallerys($hideContent.querySelectorAll('.gallery'))
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const tabsFn = {
|
|||
|
|
clickFnOfTabs: function () {
|
|||
|
|
document.querySelectorAll('#article-container .tab > button').forEach(function (item) {
|
|||
|
|
item.addEventListener('click', function (e) {
|
|||
|
|
const $this = this
|
|||
|
|
const $tabItem = $this.parentNode
|
|||
|
|
|
|||
|
|
if (!$tabItem.classList.contains('active')) {
|
|||
|
|
const $tabContent = $tabItem.parentNode.nextElementSibling
|
|||
|
|
const $siblings = btf.siblings($tabItem, '.active')[0]
|
|||
|
|
$siblings && $siblings.classList.remove('active')
|
|||
|
|
$tabItem.classList.add('active')
|
|||
|
|
const tabId = $this.getAttribute('data-href').replace('#', '')
|
|||
|
|
const childList = [...$tabContent.children]
|
|||
|
|
childList.forEach(item => {
|
|||
|
|
if (item.id === tabId) item.classList.add('active')
|
|||
|
|
else item.classList.remove('active')
|
|||
|
|
})
|
|||
|
|
const $isTabJustifiedGallery = $tabContent.querySelectorAll(`#${tabId} .gallery`)
|
|||
|
|
if ($isTabJustifiedGallery.length > 0) {
|
|||
|
|
btf.initJustifiedGallerys($isTabJustifiedGallery)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
backToTop: () => {
|
|||
|
|
document.querySelectorAll('#article-container .tabs .tab-to-top').forEach(function (item) {
|
|||
|
|
item.addEventListener('click', function () {
|
|||
|
|
btf.scrollToDest(btf.getEleTop(btf.getParents(this, '.tabs')), 300)
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const toggleCardCategory = function () {
|
|||
|
|
const $cardCategory = document.querySelectorAll('#aside-cat-list .card-category-list-item.parent i')
|
|||
|
|
if ($cardCategory.length) {
|
|||
|
|
$cardCategory.forEach(function (item) {
|
|||
|
|
item.addEventListener('click', function (e) {
|
|||
|
|
e.preventDefault()
|
|||
|
|
const $this = this
|
|||
|
|
$this.classList.toggle('expand')
|
|||
|
|
const $parentEle = $this.parentNode.nextElementSibling
|
|||
|
|
if (btf.isHidden($parentEle)) {
|
|||
|
|
$parentEle.style.display = 'block'
|
|||
|
|
} else {
|
|||
|
|
$parentEle.style.display = 'none'
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const addPostOutdateNotice = function () {
|
|||
|
|
const data = GLOBAL_CONFIG.noticeOutdate
|
|||
|
|
const diffDay = btf.diffDate("2022-11-04 20:08:15")
|
|||
|
|
if (diffDay >= data.limitDay) {
|
|||
|
|
const ele = document.createElement('div')
|
|||
|
|
ele.className = 'post-outdate-notice'
|
|||
|
|
ele.textContent = data.messagePrev + ' ' + diffDay + ' ' + data.messageNext
|
|||
|
|
const $targetEle = document.getElementById('article-container')
|
|||
|
|
if (data.position === 'top') {
|
|||
|
|
$targetEle.insertBefore(ele, $targetEle.firstChild)
|
|||
|
|
} else {
|
|||
|
|
$targetEle.appendChild(ele)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const lazyloadImg = () => {
|
|||
|
|
window.lazyLoadInstance = new LazyLoad({
|
|||
|
|
elements_selector: 'img',
|
|||
|
|
threshold: 0,
|
|||
|
|
data_src: 'lazy-src',
|
|||
|
|
callback_error: (img) => {
|
|||
|
|
img.setAttribute("srcset", GLOBAL_CONFIG.lazyload.error);
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const unRefreshFn = function () {
|
|||
|
|
window.addEventListener('resize', adjustMenu)
|
|||
|
|
window.addEventListener('orientationchange', () => {
|
|||
|
|
setTimeout(adjustMenu(true), 100)
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
clickFnOfSubMenu()
|
|||
|
|
GLOBAL_CONFIG.lazyload.enable && lazyloadImg()
|
|||
|
|
GLOBAL_CONFIG.copyright !== undefined && addCopyright()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
window.refreshFn = function () {
|
|||
|
|
initAdjust();
|
|||
|
|
|
|||
|
|
|
|||
|
|
if (GLOBAL_CONFIG.isPost) {
|
|||
|
|
addRuntime();
|
|||
|
|
tocFn();
|
|||
|
|
} else {
|
|||
|
|
addLastPushDate()
|
|||
|
|
toggleCardCategory()
|
|||
|
|
addRuntime()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
sidebarFn()
|
|||
|
|
GLOBAL_CONFIG.isHome && scrollDownInIndex()
|
|||
|
|
scrollFn()
|
|||
|
|
addTableWrap()
|
|||
|
|
clickFnOfTagHide()
|
|||
|
|
tabsFn.clickFnOfTabs()
|
|||
|
|
tabsFn.backToTop()
|
|||
|
|
jqLoadAndRun()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
refreshFn()
|
|||
|
|
unRefreshFn()
|
|||
|
|
})
|