' +
+ '
' +
' ' +
this.date(relatedPosts[i].updated, hexoConfig.date_format) +
'
'
}
result +=
- '
' + relatedPosts[i].title + '
'
+ '
' + relatedPosts[i].title + '
'
result += '
'
}
diff --git a/source/css/_highlight/highlight.styl b/source/css/_highlight/highlight.styl
index d9bd0a4..687fbcb 100644
--- a/source/css/_highlight/highlight.styl
+++ b/source/css/_highlight/highlight.styl
@@ -123,7 +123,7 @@ blockquote
.code-lang
position: absolute
left: .7rem
- text-transform: capitalize
+ text-transform: uppercase
font-weight: bold
font-size: 1.15em
diff --git a/source/css/_highlight/highlight/diff.styl b/source/css/_highlight/highlight/diff.styl
index 6bb5106..486754c 100644
--- a/source/css/_highlight/highlight/diff.styl
+++ b/source/css/_highlight/highlight/diff.styl
@@ -1,4 +1,3 @@
-// For diff highlight
figure.highlight
table
&::-webkit-scrollbar-thumb
diff --git a/source/css/_highlight/theme.styl b/source/css/_highlight/theme.styl
index 93d93fd..528f18e 100644
--- a/source/css/_highlight/theme.styl
+++ b/source/css/_highlight/theme.styl
@@ -116,3 +116,4 @@ if $highlight_theme == false
color: $highlight-foreground,
bg-color: darken($highlight-background, 5)
}
+ $highlight-scrollbar = darken($highlight-background, 8)
diff --git a/source/css/_layout/aside.styl b/source/css/_layout/aside.styl
index ad04192..9604a38 100644
--- a/source/css/_layout/aside.styl
+++ b/source/css/_layout/aside.styl
@@ -87,6 +87,10 @@
span
margin-left: .5rem
+ & + div,
+ & + ul
+ padding: .3rem 0 0
+
.sticky_layout
+minWidth900()
position: sticky
@@ -102,8 +106,6 @@
color: $text-hover !important
.aside-list
- margin: 10px 0 -15px
-
& > span
display: block
margin-bottom: .5rem
@@ -121,7 +123,7 @@
border-bottom: 1px dashed #f5f5f5
&:last-child
- margin-bottom: .3rem
+ padding-bottom: 0
.thumbnail
overflow: hidden
@@ -173,7 +175,6 @@
.card-archives ul.card-archive-list,
.card-categories ul.card-category-list
margin: 0
- padding: .2rem 0 0
list-style: none
.card-archives ul.card-archive-list > .card-archive-list-item,
@@ -241,12 +242,10 @@
.card-webinfo
.webinfo
- padding: .2rem .5rem
-
.webinfo-item
display: flex
align-items: center
- padding: 4px 0 0
+ padding: .1rem .5rem 0
div
&:first-child
diff --git a/source/css/_layout/head.styl b/source/css/_layout/head.styl
index 346cf79..9f30688 100644
--- a/source/css/_layout/head.styl
+++ b/source/css/_layout/head.styl
@@ -188,13 +188,13 @@ _:future,
padding: 0 16px
&:not(.fixed)
- .menus
+ #menus
padding-right: 0 !important
#blog_name
flex: 1
- .toggle-menu
+ #toggle-menu
display: none
padding: .1rem 0 0 .3rem
vertical-align: top
@@ -218,7 +218,7 @@ _:future,
a,
#site-name,
- .toggle-menu
+ #toggle-menu
color: var(--font-color)
text-shadow: none
@@ -302,7 +302,7 @@ _:future,
text-shadow: none
&.hide-menu
- .toggle-menu
+ #toggle-menu
display: inline-block !important
.site-page
diff --git a/source/css/_layout/relatedposts.styl b/source/css/_layout/relatedposts.styl
index 6471980..b296917 100644
--- a/source/css/_layout/relatedposts.styl
+++ b/source/css/_layout/relatedposts.styl
@@ -1,53 +1,54 @@
.relatedPosts
margin-top: 1rem
- .relatedPosts_headline
+ & > .headline
margin-bottom: 5px
font-weight: 700
font-size: 1.43em
- .relatedPosts_item
- position: relative
- display: inline-block
- overflow: hidden
- margin: 3px
- width: calc(33.333% - 6px)
- height: 200px
- background: $dark-black
- vertical-align: bottom
+ & > .relatedPosts-list
+ & > div
+ position: relative
+ display: inline-block
+ overflow: hidden
+ margin: 3px
+ width: calc(33.333% - 6px)
+ height: 200px
+ background: $dark-black
+ vertical-align: bottom
- &:hover
- .relatedPosts_cover
- opacity: .8
- transform: scale(1.1)
+ &:hover
+ .cover
+ opacity: .8
+ transform: scale(1.1)
- +maxWidth768()
- margin: 2px
- width: calc(50% - 4px)
- height: 150px
+ +maxWidth768()
+ margin: 2px
+ width: calc(50% - 4px)
+ height: 150px
- +maxWidth600()
- width: calc(100% - 4px)
+ +maxWidth600()
+ width: calc(100% - 4px)
- .relatedPosts_cover
- width: 100%
- height: 100%
- opacity: .4
- transition: all .6s
- object-fit: cover
+ .cover
+ width: 100%
+ height: 100%
+ opacity: .4
+ transition: all .6s
+ object-fit: cover
- .relatedPosts_main
- position: absolute
- top: 50%
- padding: 0 1rem
- width: 100%
- transform: translate(0, -50%)
+ .content
+ position: absolute
+ top: 50%
+ padding: 0 1rem
+ width: 100%
+ transform: translate(0, -50%)
- .relatedPosts_date
- color: var(--light-grey)
- font-size: 90%
+ .date
+ color: var(--light-grey)
+ font-size: 90%
- .relatedPosts_title
- @extend .limit-more-line
- color: var(--white)
- -webkit-line-clamp: 2
+ .title
+ @extend .limit-more-line
+ color: var(--white)
+ -webkit-line-clamp: 2
diff --git a/source/css/_mode/darkmode.styl b/source/css/_mode/darkmode.styl
index 481f2c7..d7d4955 100644
--- a/source/css/_mode/darkmode.styl
+++ b/source/css/_mode/darkmode.styl
@@ -123,7 +123,7 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
.gist,
.aplayer
filter: brightness(.7)
-
+
#aside_content .aside-list > .aside-list-item:not(:last-child)
border-bottom: 1px dashed alpha(#FFFFFF, .1)
diff --git a/source/js/main.js b/source/js/main.js
index 6382e81..a4df270 100644
--- a/source/js/main.js
+++ b/source/js/main.js
@@ -6,815 +6,806 @@
* 傳入 2 正常狀態下
*/
-const blogNameWidth = $('#site-name').width()
-const menusWidth = $('.menus').width()
-const sidebarWidth = $('#sidebar').width() || 300
+$(function () {
+ const blogNameWidth = $('#site-name').width()
+ const menusWidth = $('#menus').width()
+ const sidebarWidth = $('#sidebar').width() || 300
-const adjustMenu = function (n) {
- const $nav = $('#nav')
- let t
- if (n === 0) t = true
- else if (n === 1) t = blogNameWidth + menusWidth > $nav.width() - sidebarWidth - 30
- else t = blogNameWidth + menusWidth > $nav.width() - 30
+ const adjustMenu = function (n) {
+ const $nav = $('#nav')
+ let t
+ if (n === 0) t = true
+ else if (n === 1) t = blogNameWidth + menusWidth > $nav.width() - sidebarWidth - 30
+ else t = blogNameWidth + menusWidth > $nav.width() - 30
- if (t) {
- $nav.addClass('hide-menu')
- } else {
- $nav.removeClass('hide-menu')
+ if (t) {
+ $nav.addClass('hide-menu')
+ } else {
+ $nav.removeClass('hide-menu')
+ }
}
-}
-// 初始化header
-const initAdjust = () => {
- if (window.innerWidth < 768) adjustMenu(0)
- else adjustMenu(2)
- $('#nav').css({ opacity: '1', animation: 'headerNoOpacity 1s' })
-}
+ // 初始化header
+ const initAdjust = () => {
+ if (window.innerWidth < 768) adjustMenu(0)
+ else adjustMenu(2)
+ $('#nav').css({ opacity: '1', animation: 'headerNoOpacity 1s' })
+ }
-/**
+ /**
* 進入post頁sidebar處理
*/
-const OpenSidebarAuto = () => {
- if (window.innerWidth > 1024 && $('#toggle-sidebar').hasClass('on')) {
- setTimeout(function () {
- openSidebar()
- }, 400)
+ const OpenSidebarAuto = () => {
+ if (window.innerWidth > 1024 && $('#toggle-sidebar').hasClass('on')) {
+ setTimeout(function () {
+ openSidebar()
+ }, 400)
+ }
}
-}
-/**
+ /**
* 點擊左下角箭頭,顯示sidebar
*/
-const closeSidebar = () => {
- $('#sidebar').removeClass('tocOpenPc').animate({
- left: '-300px'
- }, 400)
- $('.menus').animate({
- paddingRight: 0
- }, 400)
- $('#body-wrap').animate({
- paddingLeft: 0
- }, 400)
- if ($('#nav').hasClass('hide-menu')) {
- setTimeout(function () {
- adjustMenu(2)
+ const closeSidebar = () => {
+ $('#sidebar').removeClass('tocOpenPc').animate({
+ left: '-300px'
+ }, 400)
+ $('#menus').animate({
+ paddingRight: 0
+ }, 400)
+ $('#body-wrap').animate({
+ paddingLeft: 0
+ }, 400)
+ if ($('#nav').hasClass('hide-menu')) {
+ setTimeout(function () {
+ adjustMenu(2)
+ }, 400)
+ }
+ }
+
+ const openSidebar = () => {
+ if (!$('#nav').hasClass('hide-menu')) {
+ adjustMenu(1)
+ }
+ $('#sidebar').addClass('tocOpenPc').animate({
+ left: 0
+ }, 400)
+ $('#menus').animate({
+ paddingRight: 300
+ }, 400)
+ $('#body-wrap').animate({
+ paddingLeft: 300
}, 400)
}
-}
-const openSidebar = () => {
- if (!$('#nav').hasClass('hide-menu')) {
- adjustMenu(1)
+ const toggleSidebar = function () {
+ $('#toggle-sidebar').on('click', function () {
+ const isOpen = $(this).hasClass('on')
+ isOpen ? $(this).removeClass('on') : $(this).addClass('on')
+ if (isOpen) {
+ closeSidebar()
+ } else {
+ openSidebar()
+ }
+ })
}
- $('#sidebar').addClass('tocOpenPc').animate({
- left: 0
- }, 400)
- $('.menus').animate({
- paddingRight: 300
- }, 400)
- $('#body-wrap').animate({
- paddingLeft: 300
- }, 400)
-}
-const toggleSidebar = function () {
- $('#toggle-sidebar').on('click', function () {
- const isOpen = $(this).hasClass('on')
- isOpen ? $(this).removeClass('on') : $(this).addClass('on')
- if (isOpen) {
- closeSidebar()
- } else {
- openSidebar()
- }
- })
-}
-
-/**
+ /**
* 手機menu和toc按鈕點擊
* 顯示menu和toc的sidebar
*/
-const sidebarFn = () => {
- const $toggleMenu = $('.toggle-menu')
- const $mobileSidebarMenus = $('#mobile-sidebar-menus')
- const $mobileTocButton = $('#mobile-toc-button')
- const $menuMask = $('#menu_mask')
- const $body = $('body')
- const $sidebar = $('#sidebar')
+ const sidebarFn = () => {
+ const $toggleMenu = $('#toggle-menu')
+ const $mobileSidebarMenus = $('#mobile-sidebar-menus')
+ const $mobileTocButton = $('#mobile-toc-button')
+ const $menuMask = $('#menu_mask')
+ const $body = $('body')
+ const $sidebar = $('#sidebar')
- function openMobileSidebar (name) {
- sidebarPaddingR()
- $body.css('overflow', 'hidden')
- $menuMask.fadeIn()
+ function openMobileSidebar (name) {
+ btf.sidebarPaddingR()
+ $body.css('overflow', 'hidden')
+ $menuMask.fadeIn()
- if (name === 'menu') {
- $toggleMenu.removeClass('close').addClass('open')
- $mobileSidebarMenus.addClass('open')
+ if (name === 'menu') {
+ $toggleMenu.removeClass('close').addClass('open')
+ $mobileSidebarMenus.addClass('open')
+ }
+
+ if (name === 'toc') {
+ $mobileTocButton.removeClass('close').addClass('open')
+ $sidebar.addClass('tocOpenMobile').css({ transform: 'translate3d(-100%,0,0)', left: '' })
+ }
}
- if (name === 'toc') {
- $mobileTocButton.removeClass('close').addClass('open')
- $sidebar.addClass('tocOpenMobile').css({ transform: 'translate3d(-100%,0,0)', left: '' })
+ function closeMobileSidebar (name) {
+ $body.css({ overflow: '', 'padding-right': '' })
+ $menuMask.fadeOut()
+
+ if (name === 'menu') {
+ $toggleMenu.removeClass('open').addClass('close')
+ $mobileSidebarMenus.removeClass('open')
+ }
+
+ if (name === 'toc') {
+ $mobileTocButton.removeClass('open').addClass('close')
+ $sidebar.removeClass('tocOpenMobile').css({ transform: '' })
+ }
}
+
+ $toggleMenu.on('click', function () {
+ openMobileSidebar('menu')
+ })
+
+ $mobileTocButton.on('click', function () {
+ openMobileSidebar('toc')
+ })
+
+ $menuMask.on('click touchstart', function (e) {
+ if ($toggleMenu.hasClass('open')) {
+ closeMobileSidebar('menu')
+ }
+ if ($mobileTocButton.hasClass('open')) {
+ closeMobileSidebar('toc')
+ }
+ })
+
+ $(window).on('resize', function (e) {
+ if (!$toggleMenu.is(':visible')) {
+ if ($toggleMenu.hasClass('open')) closeMobileSidebar('menu')
+ }
+ })
+
+ const mql = window.matchMedia('(max-width: 1024px)')
+ mql.addListener((ev) => {
+ if (ev.matches) {
+ if ($sidebar.hasClass('tocOpenPc')) closeSidebar()
+ } else {
+ if ($('#toggle-sidebar').hasClass('on')) openSidebar()
+ if ($mobileTocButton.hasClass('open')) closeMobileSidebar('toc')
+ }
+ })
+
+ // toc元素點擊
+ $sidebar.find('.toc-link').on('click', function (e) {
+ e.preventDefault()
+ btf.scrollToDest(decodeURI($(this).attr('href')))
+ if (window.innerWidth < 1024) {
+ closeMobileSidebar('toc')
+ }
+ })
}
- function closeMobileSidebar (name) {
- $body.css({ overflow: '', 'padding-right': '' })
- $menuMask.fadeOut()
-
- if (name === 'menu') {
- $toggleMenu.removeClass('open').addClass('close')
- $mobileSidebarMenus.removeClass('open')
- }
-
- if (name === 'toc') {
- $mobileTocButton.removeClass('open').addClass('close')
- $sidebar.removeClass('tocOpenMobile').css({ transform: '' })
- }
- }
-
- $toggleMenu.on('click', function () {
- openMobileSidebar('menu')
- })
-
- $mobileTocButton.on('click', function () {
- openMobileSidebar('toc')
- })
-
- $menuMask.on('click touchstart', function (e) {
- if ($toggleMenu.hasClass('open')) {
- closeMobileSidebar('menu')
- }
- if ($mobileTocButton.hasClass('open')) {
- closeMobileSidebar('toc')
- }
- })
-
- $(window).on('resize', function (e) {
- if (!$toggleMenu.is(':visible')) {
- if ($toggleMenu.hasClass('open')) closeMobileSidebar('menu')
- }
- })
-
- const mql = window.matchMedia('(max-width: 1024px)')
- mql.addEventListener('change', function (ev) {
- if (ev.matches) {
- if ($sidebar.hasClass('tocOpenPc')) closeSidebar()
- } else {
- if ($('#toggle-sidebar').hasClass('on')) openSidebar()
- if ($mobileTocButton.hasClass('open')) closeMobileSidebar('toc')
- }
- })
-
- // toc元素點擊
- $sidebar.find('.toc-link').on('click', function (e) {
- e.preventDefault()
- scrollToDest(decodeURI($(this).attr('href')))
- if (window.innerWidth <= 1024) {
- closeMobileSidebar('toc')
- }
- })
-}
-
-/**
+ /**
* 首頁top_img底下的箭頭
*/
-const scrollDownInIndex = () => {
- $('#scroll_down').on('click', function () {
- scrollToDest('#content-inner')
- })
-}
+ const scrollDownInIndex = () => {
+ $('#scroll_down').on('click', function () {
+ btf.scrollToDest('#content-inner')
+ })
+ }
-/**
+ /**
* 代碼
* 只適用於Hexo默認的代碼渲染
*/
-const addHighlightTool = function () {
- const isHighlightCopy = GLOBAL_CONFIG.highlight.highlightCopy
- const isHighlightLang = GLOBAL_CONFIG.highlight.highlightLang
- const isHighlightShrink = GLOBAL_CONFIG_SITE.isHighlightShrink
- const isShowTool = isHighlightCopy || isHighlightLang || isHighlightShrink !== undefined
- const $figureHighlight = GLOBAL_CONFIG.highlight.plugin === 'highlighjs' ? $('figure.highlight') : $('pre[class*="language-"')
+ const addHighlightTool = function () {
+ const isHighlightCopy = GLOBAL_CONFIG.highlight.highlightCopy
+ const isHighlightLang = GLOBAL_CONFIG.highlight.highlightLang
+ const isHighlightShrink = GLOBAL_CONFIG_SITE.isHighlightShrink
+ const isShowTool = isHighlightCopy || isHighlightLang || isHighlightShrink !== undefined
+ const $figureHighlight = GLOBAL_CONFIG.highlight.plugin === 'highlighjs' ? $('figure.highlight') : $('pre[class*="language-"')
- if (isShowTool && $figureHighlight.length) {
- const isPrismjs = GLOBAL_CONFIG.highlight.plugin === 'prismjs'
+ if (isShowTool && $figureHighlight.length) {
+ const isPrismjs = GLOBAL_CONFIG.highlight.plugin === 'prismjs'
- let highlightShrinkEle = ''
- let highlightCopyEle = ''
- const highlightShrinkClass = isHighlightShrink === true ? 'closed' : ''
+ let highlightShrinkEle = ''
+ let highlightCopyEle = ''
+ const highlightShrinkClass = isHighlightShrink === true ? 'closed' : ''
- if (isHighlightShrink !== undefined) {
- highlightShrinkEle = `
`
- }
-
- if (isHighlightCopy) {
- highlightCopyEle = '
'
- }
-
- if (isHighlightLang) {
- if (isPrismjs) {
- $figureHighlight.each(function () {
- const $this = $(this)
- const langName = $this.attr('data-language') !== undefined ? $this.attr('data-language') : 'Code'
- const highlightLangEle = `
${langName}
`
- $this.wrap('
').before(`
${highlightShrinkEle + highlightLangEle + highlightCopyEle}
`)
- })
- } else {
- $figureHighlight.each(function (i, o) {
- const $this = $(this)
- let langName = $this.attr('class').split(' ')[1]
- if (langName === 'plain' || langName === undefined) langName = 'Code'
- const highlightLangEle = `
${langName}
`
- $this.prepend(`
${highlightShrinkEle + highlightLangEle + highlightCopyEle}
`)
- })
+ if (isHighlightShrink !== undefined) {
+ highlightShrinkEle = `
`
}
- } else {
- const ele = `
${highlightShrinkEle + highlightCopyEle}
`
- if (isPrismjs) $figureHighlight.wrap('
').before(ele)
- else $figureHighlight.prepend(ele)
- }
- /**
+ if (isHighlightCopy) {
+ highlightCopyEle = '
'
+ }
+
+ if (isHighlightLang) {
+ if (isPrismjs) {
+ $figureHighlight.each(function () {
+ const $this = $(this)
+ const langName = $this.attr('data-language') !== undefined ? $this.attr('data-language') : 'Code'
+ const highlightLangEle = `
${langName}
`
+ $this.wrap('
').before(`
${highlightShrinkEle + highlightLangEle + highlightCopyEle}
`)
+ })
+ } else {
+ $figureHighlight.each(function (i, o) {
+ const $this = $(this)
+ let langName = $this.attr('class').split(' ')[1]
+ if (langName === 'plain' || langName === undefined) langName = 'Code'
+ const highlightLangEle = `
${langName}
`
+ $this.prepend(`
${highlightShrinkEle + highlightLangEle + highlightCopyEle}
`)
+ })
+ }
+ } else {
+ const ele = `
${highlightShrinkEle + highlightCopyEle}
`
+ if (isPrismjs) $figureHighlight.wrap('
').before(ele)
+ else $figureHighlight.prepend(ele)
+ }
+
+ /**
* 代碼收縮
*/
- if (isHighlightShrink !== undefined) {
- $('.highlight-tools >.expand').on('click', function () {
- const $this = $(this)
- const $table = $this.parent().nextAll()
- $this.toggleClass('closed')
- $table.is(':visible') ? $table.css('display', 'none') : $table.css('display', 'block')
- })
- }
-
- /**
- * 代碼copy
- */
- if (isHighlightCopy) {
- const copy = function (text, ctx) {
- if (document.queryCommandSupported && document.queryCommandSupported('copy')) {
- document.execCommand('copy')
- if (GLOBAL_CONFIG.Snackbar !== undefined) {
- snackbarShow(GLOBAL_CONFIG.copy.success)
- } else {
- $(ctx).prev('.copy-notice')
- .text(GLOBAL_CONFIG.copy.success)
- .animate({
- opacity: 1
- }, 450, function () {
- setTimeout(function () {
- $(ctx).prev('.copy-notice').animate({
- opacity: 0
- }, 650)
- }, 400)
- })
- }
- } else {
- if (GLOBAL_CONFIG.Snackbar !== undefined) {
- snackbarShow(GLOBAL_CONFIG.copy.noSupport)
- } else {
- $(ctx).prev('.copy-notice').text(GLOBAL_CONFIG.copy.noSupport)
- }
- }
+ if (isHighlightShrink !== undefined) {
+ $('.highlight-tools >.expand').on('click', function () {
+ const $this = $(this)
+ const $table = $this.parent().nextAll()
+ $this.toggleClass('closed')
+ $table.is(':visible') ? $table.css('display', 'none') : $table.css('display', 'block')
+ })
}
- // click events
- $('.highlight-tools >.copy-button').on('click', function () {
- const $buttonParent = $(this).parents('figure.highlight')
- $buttonParent.addClass('copy-true')
- const selection = window.getSelection()
- const range = document.createRange()
- if (isPrismjs) range.selectNodeContents($buttonParent.find('> pre code')[0])
- else range.selectNodeContents($buttonParent.find('table .code pre')[0])
- selection.removeAllRanges()
- selection.addRange(range)
- const text = selection.toString()
- copy(text, this)
- selection.removeAllRanges()
- $buttonParent.removeClass('copy-true')
- })
+ /**
+ * 代碼copy
+ */
+ if (isHighlightCopy) {
+ const copy = function (text, ctx) {
+ if (document.queryCommandSupported && document.queryCommandSupported('copy')) {
+ document.execCommand('copy')
+ if (GLOBAL_CONFIG.Snackbar !== undefined) {
+ btf.snackbarShow(GLOBAL_CONFIG.copy.success)
+ } else {
+ $(ctx).prev('.copy-notice')
+ .text(GLOBAL_CONFIG.copy.success)
+ .animate({
+ opacity: 1
+ }, 450, function () {
+ setTimeout(function () {
+ $(ctx).prev('.copy-notice').animate({
+ opacity: 0
+ }, 650)
+ }, 400)
+ })
+ }
+ } else {
+ if (GLOBAL_CONFIG.Snackbar !== undefined) {
+ btf.snackbarShow(GLOBAL_CONFIG.copy.noSupport)
+ } else {
+ $(ctx).prev('.copy-notice').text(GLOBAL_CONFIG.copy.noSupport)
+ }
+ }
+ }
+
+ // click events
+ $('.highlight-tools >.copy-button').on('click', function () {
+ const $buttonParent = $(this).parents('figure.highlight')
+ $buttonParent.addClass('copy-true')
+ const selection = window.getSelection()
+ const range = document.createRange()
+ if (isPrismjs) range.selectNodeContents($buttonParent.find('> pre code')[0])
+ else range.selectNodeContents($buttonParent.find('table .code pre')[0])
+ selection.removeAllRanges()
+ selection.addRange(range)
+ const text = selection.toString()
+ copy(text, this)
+ selection.removeAllRanges()
+ $buttonParent.removeClass('copy-true')
+ })
+ }
}
}
-}
-/**
+ /**
* PhotoFigcaption
*/
-function addPhotoFigcaption () {
- const images = $('#article-container img').not('.justified-gallery img')
- images.each(function (i, o) {
- const $this = $(o)
- if ($this.attr('alt')) {
- const t = $('
' + $this.attr('alt') + '
')
- $this.after(t)
- }
- })
-}
+ function addPhotoFigcaption () {
+ const images = $('#article-container img').not('.justified-gallery img')
+ images.each(function (i, o) {
+ const $this = $(o)
+ if ($this.attr('alt')) {
+ const t = $('
' + $this.attr('alt') + '
')
+ $this.after(t)
+ }
+ })
+ }
-/**
+ /**
* justified-gallery 圖庫排版
*/
-let detectJgJsLoad = false
-const runJustifiedGallery = function () {
- const $justifiedGallery = $('.justified-gallery')
- if ($justifiedGallery.length) {
- const $imgList = $justifiedGallery.find('img')
- $imgList.unwrap()
- if ($imgList.length) {
- $imgList.each(function (i, o) {
- if ($(o).attr('data-lazy-src')) $(o).attr('src', $(o).attr('data-lazy-src'))
- $(o).wrap('
')
- })
- }
+ let detectJgJsLoad = false
+ const runJustifiedGallery = function () {
+ const $justifiedGallery = $('.justified-gallery')
+ if ($justifiedGallery.length) {
+ const $imgList = $justifiedGallery.find('img')
+ $imgList.unwrap()
+ if ($imgList.length) {
+ $imgList.each(function (i, o) {
+ if ($(o).attr('data-lazy-src')) $(o).attr('src', $(o).attr('data-lazy-src'))
+ $(o).wrap('
')
+ })
+ }
- if (detectJgJsLoad) initJustifiedGallery($justifiedGallery)
- else {
- $('head').append(`
`)
- $.getScript(`${GLOBAL_CONFIG.justifiedGallery.js}`, function () {
- initJustifiedGallery($justifiedGallery)
- })
- detectJgJsLoad = true
+ if (detectJgJsLoad) btf.initJustifiedGallery($justifiedGallery)
+ else {
+ $('head').append(`
`)
+ $.getScript(`${GLOBAL_CONFIG.justifiedGallery.js}`, function () {
+ btf.initJustifiedGallery($justifiedGallery)
+ })
+ detectJgJsLoad = true
+ }
}
}
-}
-/**
+ /**
* fancybox和 mediumZoom
*/
-const addLightBox = function () {
- const isMediumZoom = GLOBAL_CONFIG.medium_zoom
- const isFancybox = GLOBAL_CONFIG.fancybox
- if (isFancybox) {
- const images = $('#article-container img:not(.gallery-group-img)').not($('a>img'))
- images.each(function (i, o) {
- const lazyloadSrc = $(o).attr('data-lazy-src') ? $(o).attr('data-lazy-src') : $(o).attr('src')
- const dataCaption = $(o).attr('alt') ? $(o).attr('alt') : ''
- $(o).wrap(`
`)
- })
-
- $().fancybox({
- selector: '[data-fancybox]',
- loop: true,
- transitionEffect: 'slide',
- protect: true,
- buttons: ['slideShow', 'fullScreen', 'thumbs', 'close'],
- hash: false
- })
- } else if (isMediumZoom) {
- const zoom = mediumZoom(document.querySelectorAll('#article-container :not(a)>img'))
- zoom.on('open', function (event) {
- const photoBg = $(document.documentElement).attr('data-theme') === 'dark' ? '#121212' : '#fff'
- zoom.update({
- background: photoBg
+ const addLightBox = function () {
+ const isMediumZoom = GLOBAL_CONFIG.medium_zoom
+ const isFancybox = GLOBAL_CONFIG.fancybox
+ if (isFancybox) {
+ const images = $('#article-container img:not(.gallery-group-img)').not($('a>img'))
+ images.each(function (i, o) {
+ const lazyloadSrc = $(o).attr('data-lazy-src') ? $(o).attr('data-lazy-src') : $(o).attr('src')
+ const dataCaption = $(o).attr('alt') ? $(o).attr('alt') : ''
+ $(o).wrap(`
`)
})
- })
- }
-}
-/**
+ $().fancybox({
+ selector: '[data-fancybox]',
+ loop: true,
+ transitionEffect: 'slide',
+ protect: true,
+ buttons: ['slideShow', 'fullScreen', 'thumbs', 'close'],
+ hash: false
+ })
+ } else if (isMediumZoom) {
+ const zoom = mediumZoom(document.querySelectorAll('#article-container :not(a)>img'))
+ zoom.on('open', function (event) {
+ const photoBg = $(document.documentElement).attr('data-theme') === 'dark' ? '#121212' : '#fff'
+ zoom.update({
+ background: photoBg
+ })
+ })
+ }
+ }
+
+ /**
* 滾動處理
*/
-const scrollFn = function () {
- let initTop = 0
- let isChatShow = true
- const $rightside = $('#rightside')
- const $nav = $('#nav')
- const isChatBtnHide = typeof chatBtnHide === 'function'
- const isChatBtnShow = typeof chatBtnShow === 'function'
- $(window).scroll(throttle(function (event) {
- const currentTop = $(this).scrollTop()
- const isDown = scrollDirection(currentTop)
- if (currentTop > 56) {
- if (isDown) {
- if ($nav.hasClass('visible')) $nav.removeClass('visible')
- if (isChatBtnShow && isChatShow === true) {
- chatBtnHide()
- isChatShow = false
+ const scrollFn = function () {
+ let initTop = 0
+ let isChatShow = true
+ const $rightside = $('#rightside')
+ const $nav = $('#nav')
+ const isChatBtnHide = typeof chatBtnHide === 'function'
+ const isChatBtnShow = typeof chatBtnShow === 'function'
+ $(window).scroll(btf.throttle(function (event) {
+ const currentTop = $(this).scrollTop()
+ const isDown = scrollDirection(currentTop)
+ if (currentTop > 56) {
+ if (isDown) {
+ if ($nav.hasClass('visible')) $nav.removeClass('visible')
+ if (isChatBtnShow && isChatShow === true) {
+ chatBtnHide()
+ isChatShow = false
+ }
+ } else {
+ if (!$nav.hasClass('visible')) $nav.addClass('visible')
+ if (isChatBtnHide && isChatShow === false) {
+ window.chatBtnShow()
+ isChatShow = true
+ }
+ }
+ $nav.addClass('fixed')
+ if ($rightside.css('opacity') === '0') {
+ $rightside.css({ opacity: '1', transform: 'translateX(-38px)' })
}
} else {
- if (!$nav.hasClass('visible')) $nav.addClass('visible')
- if (isChatBtnHide && isChatShow === false) {
- window.chatBtnShow()
- isChatShow = true
+ if (currentTop === 0) {
+ $nav.removeClass('fixed').removeClass('visible')
}
+ $rightside.css({ opacity: '', transform: '' })
}
- $nav.addClass('fixed')
- if ($rightside.css('opacity') === '0') {
- $rightside.css({ opacity: '1', transform: 'translateX(-38px)' })
- }
- } else {
- if (currentTop === 0) {
- $nav.removeClass('fixed').removeClass('visible')
- }
- $rightside.css({ opacity: '', transform: '' })
+ }, 200))
+
+ // find the scroll direction
+ function scrollDirection (currentTop) {
+ const result = currentTop > initTop // true is down & false is up
+ initTop = currentTop
+ return result
}
- }, 200))
-
- // find the scroll direction
- function scrollDirection (currentTop) {
- const result = currentTop > initTop // true is down & false is up
- initTop = currentTop
- return result
}
-}
-/**
+ /**
* toc
*/
-const tocFn = function () {
- $('.toc-child').hide()
+ const tocFn = function () {
+ $('.toc-child').hide()
- // main of scroll
- $(window).scroll(throttle(function (event) {
- const currentTop = $(this).scrollTop()
- scrollPercent(currentTop)
- findHeadPosition(currentTop)
- autoScrollToc(currentTop)
- }, 100))
+ // main of scroll
+ $(window).scroll(btf.throttle(function (event) {
+ const currentTop = $(this).scrollTop()
+ scrollPercent(currentTop)
+ findHeadPosition(currentTop)
+ autoScrollToc(currentTop)
+ }, 100))
- // expand toc-item
- const expandToc = function ($item) {
- if ($item.is(':visible')) {
- return
+ // expand toc-item
+ const expandToc = function ($item) {
+ if ($item.is(':visible')) {
+ return
+ }
+ $item.fadeIn(400)
}
- $item.fadeIn(400)
- }
- const scrollPercent = function (currentTop) {
- const docHeight = $('#article-container').height()
- const winHeight = $(window).height()
- const contentMath = (docHeight > winHeight) ? (docHeight - winHeight) : ($(document).height() - winHeight)
- const scrollPercent = (currentTop) / (contentMath)
- const scrollPercentRounded = Math.round(scrollPercent * 100)
- const percentage = (scrollPercentRounded > 100) ? 100
- : (scrollPercentRounded <= 0) ? 0
- : scrollPercentRounded
- $('.progress-num').text(percentage)
- $('.sidebar-toc__progress-bar').animate({
- width: percentage + '%'
- }, 100)
- }
-
- // anchor
- const isAnchor = GLOBAL_CONFIG.isanchor
- const updateAnchor = function (anchor) {
- if (window.history.replaceState && anchor !== window.location.hash) {
- window.history.replaceState(undefined, undefined, anchor)
+ const scrollPercent = function (currentTop) {
+ const $dom = $('#article-container')
+ const docHeight = $dom.height()
+ const winHeight = $(window).height()
+ const headerHeight = $dom.offset().top
+ const contentMath = (docHeight > winHeight) ? (docHeight - winHeight) : ($(document).height() - winHeight)
+ const scrollPercent = (currentTop - headerHeight) / (contentMath)
+ const scrollPercentRounded = Math.round(scrollPercent * 100)
+ const percentage = (scrollPercentRounded > 100) ? 100
+ : (scrollPercentRounded <= 0) ? 0
+ : scrollPercentRounded
+ $('#sidebar .progress-num').text(percentage)
+ $('#sidebar .sidebar-toc__progress-bar').animate({
+ width: percentage + '%'
+ }, 100)
}
- }
- // find head position & add active class
- // DOM Hierarchy:
- // ol.toc > (li.toc-item, ...)
- // li.toc-item > (a.toc-link, ol.toc-2child > (li.toc-item, ...))
- const versionBiggerFive = GLOBAL_CONFIG.hexoversion.split('.')[0] >= 5
- const findHeadPosition = function (top) {
+ // anchor
+ const isAnchor = GLOBAL_CONFIG.isanchor
+ const updateAnchor = function (anchor) {
+ if (window.history.replaceState && anchor !== window.location.hash) {
+ window.history.replaceState(undefined, undefined, anchor)
+ }
+ }
+
+ // find head position & add active class
+ // DOM Hierarchy:
+ // ol.toc > (li.toc-item, ...)
+ // li.toc-item > (a.toc-link, ol.toc-2child > (li.toc-item, ...))
+ const versionBiggerFive = GLOBAL_CONFIG.hexoversion.split('.')[0] >= 5
+ const findHeadPosition = function (top) {
// assume that we are not in the post page if no TOC link be found,
// thus no need to update the status
- if ($('.toc-link').length === 0) {
- return false
- }
-
- const list = $('#article-container').find('h1,h2,h3,h4,h5,h6')
- let currentId = ''
- list.each(function () {
- const head = $(this)
- if (top > head.offset().top - 70) {
- if (versionBiggerFive) currentId = '#' + encodeURI($(this).attr('id'))
- else currentId = '#' + $(this).attr('id')
+ if ($('.toc-link').length === 0) {
+ return false
}
- })
- if (currentId === '') {
- $('.toc-link').removeClass('active')
- $('.toc-child').hide()
- }
+ const list = $('#article-container').find('h1,h2,h3,h4,h5,h6')
+ let currentId = ''
+ list.each(function () {
+ const head = $(this)
+ if (top > head.offset().top - 70) {
+ if (versionBiggerFive) currentId = '#' + encodeURI($(this).attr('id'))
+ else currentId = '#' + $(this).attr('id')
+ }
+ })
- const currentActive = $('.toc-link.active')
- if (currentId && currentActive.attr('href') !== currentId) {
- if (isAnchor) updateAnchor(currentId)
+ if (currentId === '') {
+ $('.toc-link').removeClass('active')
+ $('.toc-child').hide()
+ }
- $('.toc-link').removeClass('active')
+ const currentActive = $('.toc-link.active')
+ if (currentId && currentActive.attr('href') !== currentId) {
+ if (isAnchor) updateAnchor(currentId)
- const _this = $('.toc-link[href="' + currentId + '"]')
- _this.addClass('active')
+ $('.toc-link').removeClass('active')
- const parents = _this.parents('.toc-child')
- // Returned list is in reverse order of the DOM elements
- // Thus `parents.last()` is the outermost .toc-child container
- // i.e. list of subsections
- const topLink = (parents.length > 0) ? parents.last() : _this
- expandToc(topLink.closest('.toc-item').find('.toc-child'))
- topLink
+ const _this = $('.toc-link[href="' + currentId + '"]')
+ _this.addClass('active')
+
+ const parents = _this.parents('.toc-child')
+ // Returned list is in reverse order of the DOM elements
+ // Thus `parents.last()` is the outermost .toc-child container
+ // i.e. list of subsections
+ const topLink = (parents.length > 0) ? parents.last() : _this
+ expandToc(topLink.closest('.toc-item').find('.toc-child'))
+ topLink
// Find all top-level .toc-item containers, i.e. sections
// excluding the currently active one
- .closest('.toc-item').siblings('.toc-item')
+ .closest('.toc-item').siblings('.toc-item')
// Hide their respective list of subsections
- .find('.toc-child').hide()
- }
- }
-
- const autoScrollToc = function (currentTop) {
- if ($('.toc-link').hasClass('active')) {
- const activePosition = $('.active').offset().top
- const sidebarScrollTop = $('#sidebar .sidebar-toc__content').scrollTop()
- if (activePosition > (currentTop + $(window).height() - 100)) {
- $('#sidebar .sidebar-toc__content').scrollTop(sidebarScrollTop + 100)
+ .find('.toc-child').hide()
}
- if (activePosition < currentTop + 100) {
- $('#sidebar .sidebar-toc__content').scrollTop(sidebarScrollTop - 100)
+ }
+
+ const autoScrollToc = function (currentTop) {
+ if ($('.toc-link').hasClass('active')) {
+ const activePosition = $('.active').offset().top
+ const sidebarScrollTop = $('#sidebar .sidebar-toc__content').scrollTop()
+ if (activePosition > (currentTop + $(window).height() - 100)) {
+ $('#sidebar .sidebar-toc__content').scrollTop(sidebarScrollTop + 100)
+ }
+ if (activePosition < currentTop + 100) {
+ $('#sidebar .sidebar-toc__content').scrollTop(sidebarScrollTop - 100)
+ }
}
}
}
-}
-/**
+ /**
* Rightside
*/
-const $rightsideEle = $('#rightside')
+ const $rightsideEle = $('#rightside')
-// read-mode
-$rightsideEle.on('click', '#readmode', function () {
- $('body').toggleClass('read-mode')
-})
+ // read-mode
+ $rightsideEle.on('click', '#readmode', function () {
+ $('body').toggleClass('read-mode')
+ })
-// Switch Between Light And Dark Mode
-if ($('#darkmode').length) {
- const switchReadMode = function () {
- const nowMode = document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light'
- if (nowMode === 'light') {
- activateDarkMode()
- saveToLocal.set('theme', 'dark', 2)
- GLOBAL_CONFIG.Snackbar !== undefined && snackbarShow(GLOBAL_CONFIG.Snackbar.day_to_night)
- } else {
- activateLightMode()
- saveToLocal.set('theme', 'light', 2)
- GLOBAL_CONFIG.Snackbar !== undefined && snackbarShow(GLOBAL_CONFIG.Snackbar.night_to_day)
+ // Switch Between Light And Dark Mode
+ if ($('#darkmode').length) {
+ const switchReadMode = function () {
+ const nowMode = document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light'
+ if (nowMode === 'light') {
+ activateDarkMode()
+ saveToLocal.set('theme', 'dark', 2)
+ GLOBAL_CONFIG.Snackbar !== undefined && btf.snackbarShow(GLOBAL_CONFIG.Snackbar.day_to_night)
+ } else {
+ activateLightMode()
+ saveToLocal.set('theme', 'light', 2)
+ GLOBAL_CONFIG.Snackbar !== undefined && btf.snackbarShow(GLOBAL_CONFIG.Snackbar.night_to_day)
+ }
}
+
+ $rightsideEle.on('click', '#darkmode', () => {
+ switchReadMode()
+ typeof utterancesTheme === 'function' && utterancesTheme()
+ typeof FB === 'object' && window.loadFBComment()
+ window.DISQUS && $('#disqus_thread').children().length && setTimeout(() => window.disqusReset(), 200)
+ })
}
- $rightsideEle.on('click', '#darkmode', () => {
- switchReadMode()
- typeof utterancesTheme === 'function' && utterancesTheme()
- typeof FB === 'object' && window.loadFBComment()
- window.DISQUS && $('#disqus_thread').children().length && setTimeout(() => window.disqusReset(), 200)
- })
-}
+ // rightside 點擊設置 按鈕 展開
+ $rightsideEle.on('click', '#rightside_config', () => $('#rightside-config-hide').toggleClass('show'))
-// rightside 點擊設置 按鈕 展開
-$rightsideEle.on('click', '#rightside_config', () => $('#rightside-config-hide').toggleClass('show'))
+ // Back to top
+ $rightsideEle.on('click', '#go-up', () => btf.scrollToDest('body'))
-// Back to top
-$rightsideEle.on('click', '#go-up', () => scrollToDest('body'))
-
-/**
+ /**
* menu
* 側邊欄sub-menu 展開/收縮
* 解決menus在觸摸屏下,滑動屏幕menus_item_child不消失的問題(手機hover的bug)
*/
-const clickFnOfSubMenu = function () {
- $('#mobile-sidebar-menus .expand').on('click', function () {
- $(this).parents('.menus_item').find('> .menus_item_child').slideToggle()
- $(this).toggleClass('hide')
- })
+ const clickFnOfSubMenu = function () {
+ $('#mobile-sidebar-menus .expand').on('click', function () {
+ $(this).parents('.menus_item').find('> .menus_item_child').slideToggle()
+ $(this).toggleClass('hide')
+ })
- $(window).on('touchmove', function (e) {
- const $menusChild = $('#nav .menus_item_child')
- if ($menusChild.is(':visible')) {
- $menusChild.css('display', 'none')
- }
- })
-}
+ $(window).on('touchmove', function (e) {
+ const $menusChild = $('#nav .menus_item_child')
+ if ($menusChild.is(':visible')) {
+ $menusChild.css('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' +
+ 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)
+ } else {
+ textFont = copyFont
+ }
+ if (e.clipboardData) {
+ return e.clipboardData.setData('text', textFont)
+ } else {
+ return window.clipboardData.setData('text', textFont)
+ }
}
}
-}
-/**
+ /**
* 網頁運行時間
*/
-const addRuntime = () => {
- const $runtimeCount = $('#runtimeshow')
- if ($runtimeCount.length) {
- const publishDate = $runtimeCount.attr('data-publishDate')
- $runtimeCount.text(diffDate(publishDate) + ' ' + GLOBAL_CONFIG.runtime)
+ const addRuntime = () => {
+ const $runtimeCount = $('#runtimeshow')
+ if ($runtimeCount.length) {
+ const publishDate = $runtimeCount.attr('data-publishDate')
+ $runtimeCount.text(btf.diffDate(publishDate) + ' ' + GLOBAL_CONFIG.runtime)
+ }
}
-}
-/**
+ /**
* 最後一次更新時間
*/
-const addLastPushDate = () => {
- const $lastPushDateItem = $('#last-push-date')
- if ($lastPushDateItem.length) {
- const lastPushDate = $lastPushDateItem.attr('data-lastPushDate')
- const diffDay = diffDate(lastPushDate, true)
- console.log(diffDay)
- $lastPushDateItem.text(diffDay)
+ const addLastPushDate = () => {
+ const $lastPushDateItem = $('#last-push-date')
+ if ($lastPushDateItem.length) {
+ const lastPushDate = $lastPushDateItem.attr('data-lastPushDate')
+ const diffDay = btf.diffDate(lastPushDate, true)
+ $lastPushDateItem.text(diffDay)
+ }
}
-}
-/**
+ /**
* table overflow
*/
-const addTableWrap = function () {
- const $table = $('#article-container table').not($('figure.highlight > table'))
- $table.each(function () {
- $(this).wrap('
')
- })
-}
+ const addTableWrap = function () {
+ const $table = $('#article-container table').not($('figure.highlight > table'))
+ $table.each(function () {
+ $(this).wrap('
')
+ })
+ }
-/**
+ /**
* 百度推送
*/
-const pushToBaidu = () => {
- const bp = document.createElement('script')
- const curProtocol = window.location.protocol.split(':')[0]
- if (curProtocol === 'https') {
- bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'
- } else {
- bp.src = 'http://push.zhanzhang.baidu.com/push.js'
+ const pushToBaidu = () => {
+ const bp = document.createElement('script')
+ const curProtocol = window.location.protocol.split(':')[0]
+ if (curProtocol === 'https') {
+ bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'
+ } else {
+ bp.src = 'http://push.zhanzhang.baidu.com/push.js'
+ }
+ bp.dataset.pjax = ''
+ const s = document.getElementsByTagName('script')[0]
+ s.parentNode.insertBefore(bp, s)
}
- bp.dataset.pjax = ''
- const s = document.getElementsByTagName('script')[0]
- s.parentNode.insertBefore(bp, s)
-}
-/**
+ /**
* tag-hide
*/
-const clickFnOfTagHide = function () {
- const $hideInline = $('.hide-button')
- if ($hideInline.length) {
- $hideInline.on('click', function (e) {
- const $this = $(this)
- const $hideContent = $(this).next('.hide-content')
- $this.toggleClass('open')
- $hideContent.toggle()
- if ($this.hasClass('open')) {
- if ($hideContent.find('.justified-gallery').length > 0) {
- initJustifiedGallery($hideContent.find('.justified-gallery'))
+ const clickFnOfTagHide = function () {
+ const $hideInline = $('.hide-button')
+ if ($hideInline.length) {
+ $hideInline.on('click', function (e) {
+ const $this = $(this)
+ const $hideContent = $(this).next('.hide-content')
+ $this.toggleClass('open')
+ $hideContent.toggle()
+ if ($this.hasClass('open')) {
+ if ($hideContent.find('.justified-gallery').length > 0) {
+ btf.initJustifiedGallery($hideContent.find('.justified-gallery'))
+ }
}
- }
- })
- }
-}
-
-const tabsFn = {
- clickFnOfTabs: function () {
- const $tab = $('#article-container .tabs')
- $tab.find('.tab > button:not(.tab-to-top)').on('click', function (e) {
- const $this = $(this)
- const $tabItem = $this.parent()
-
- if (!$tabItem.hasClass('active')) {
- const $tabContent = $this.parents('.nav-tabs').next()
- $tabItem.siblings('.active').removeClass('active')
- $tabItem.addClass('active')
- const tabId = $this.attr('data-href')
- $tabContent.find('> .tab-item-content').removeClass('active')
- $tabContent.find(`> ${tabId}`).addClass('active')
- const $isTabJustifiedGallery = $tabContent.find(tabId).find('.justified-gallery')
- if ($isTabJustifiedGallery.length > 0) {
- initJustifiedGallery($isTabJustifiedGallery)
- }
- }
- })
- },
- backToTop: () => {
- const backToTopBtn = $('#article-container .tabs .tab-to-top')
- backToTopBtn.on('click', function () {
- scrollToDest($(this).parents('.tabs'))
- })
- }
-}
-
-const toggleCardCategory = function () {
- const $cardCategory = $('.card-category-list-item.parent i')
- $cardCategory.on('click', function (e) {
- e.preventDefault()
- const $this = $(this)
- $this.toggleClass('expand')
- $this.parents('.parent').next().toggle()
- })
-}
-
-const switchComments = function () {
- let switchDone = false
- $('#switch-comments-btn').on('click', function () {
- $('#post-comment > .comment-wrap > div').each(function () {
- if ($(this).is(':visible')) {
- $(this).hide()
- } else {
- $(this).css({
- display: 'block',
- animation: 'tabshow .5s'
- })
- }
- })
- if (!switchDone && typeof loadOtherComment === 'function') {
- switchDone = true
- loadOtherComment()
- }
- })
-}
-
-const addPostOutdateNotice = function () {
- const data = GLOBAL_CONFIG.noticeOutdate
- var diffDay = diffDate(GLOBAL_CONFIG_SITE.postUpdate)
- if (diffDay >= data.limitDay) {
- const code = `
${data.messagePrev + ' ' + diffDay + ' ' + data.messageNext}
`
- if (data.position === 'top') {
- $('#article-container').prepend(code)
- } else {
- $('#article-container').append(code)
+ })
}
}
-}
-/**
- * lazyload
- */
+ const tabsFn = {
+ clickFnOfTabs: function () {
+ const $tab = $('#article-container .tabs')
+ $tab.find('.tab > button:not(.tab-to-top)').on('click', function (e) {
+ const $this = $(this)
+ const $tabItem = $this.parent()
-if (GLOBAL_CONFIG.islazyload) {
- window.lazyLoadOptions = {
- elements_selector: 'img',
- threshold: 0,
- data_src: 'lazy-src'
- }
- window.addEventListener(
- 'LazyLoad::Initialized',
- function (event) {
- window.lazyLoadInstance = event.detail.instance
+ if (!$tabItem.hasClass('active')) {
+ const $tabContent = $this.parents('.nav-tabs').next()
+ $tabItem.siblings('.active').removeClass('active')
+ $tabItem.addClass('active')
+ const tabId = $this.attr('data-href')
+ $tabContent.find('> .tab-item-content').removeClass('active')
+ $tabContent.find(`> ${tabId}`).addClass('active')
+ const $isTabJustifiedGallery = $tabContent.find(tabId).find('.justified-gallery')
+ if ($isTabJustifiedGallery.length > 0) {
+ btf.initJustifiedGallery($isTabJustifiedGallery)
+ }
+ }
+ })
},
- false
- )
-}
-
-const unRefreshFn = function () {
- $(window).on('resize', function () {
- if (window.innerWidth < 768) adjustMenu(0)
- else if ($('#sidebar').hasClass('tocOpenPc') && $('#nav').hasClass('fixed')) adjustMenu(1)
- else adjustMenu(2)
- })
-
- clickFnOfSubMenu()
- GLOBAL_CONFIG.copyright !== undefined && addCopyright()
- GLOBAL_CONFIG.baiduPush && pushToBaidu()
-}
-
-const refreshFn = function () {
- initAdjust()
-
- if (GLOBAL_CONFIG_SITE.isPost) {
- OpenSidebarAuto()
- toggleSidebar()
- GLOBAL_CONFIG_SITE.isSidebar && tocFn()
- GLOBAL_CONFIG.noticeOutdate !== undefined && addPostOutdateNotice()
+ backToTop: () => {
+ const backToTopBtn = $('#article-container .tabs .tab-to-top')
+ backToTopBtn.on('click', function () {
+ btf.scrollToDest($(this).parents('.tabs'))
+ })
+ }
}
- sidebarFn()
- GLOBAL_CONFIG_SITE.isHome && scrollDownInIndex()
- GLOBAL_CONFIG.highlight && addHighlightTool()
- GLOBAL_CONFIG.isPhotoFigcaption && addPhotoFigcaption()
- runJustifiedGallery()
- addLightBox()
- scrollFn()
- GLOBAL_CONFIG.runtime && addRuntime()
- addLastPushDate()
- addTableWrap()
- clickFnOfTagHide()
- tabsFn.clickFnOfTabs()
- tabsFn.backToTop()
- toggleCardCategory()
- switchComments()
-}
+ const toggleCardCategory = function () {
+ const $cardCategory = $('#aside-cat-list .card-category-list-item.parent i')
+ $cardCategory.on('click', function (e) {
+ e.preventDefault()
+ const $this = $(this)
+ $this.toggleClass('expand')
+ $this.parents('.parent').next().toggle()
+ })
+ }
+
+ const switchComments = function () {
+ let switchDone = false
+ $('#switch-comments-btn').on('click', function () {
+ $('#post-comment > .comment-wrap > div').each(function () {
+ if ($(this).is(':visible')) {
+ $(this).hide()
+ } else {
+ $(this).css({
+ display: 'block',
+ animation: 'tabshow .5s'
+ })
+ }
+ })
+ if (!switchDone && typeof loadOtherComment === 'function') {
+ switchDone = true
+ loadOtherComment()
+ }
+ })
+ }
+
+ const addPostOutdateNotice = function () {
+ const data = GLOBAL_CONFIG.noticeOutdate
+ var diffDay = btf.diffDate(GLOBAL_CONFIG_SITE.postUpdate)
+ if (diffDay >= data.limitDay) {
+ const code = `
${data.messagePrev + ' ' + diffDay + ' ' + data.messageNext}
`
+ if (data.position === 'top') {
+ $('#article-container').prepend(code)
+ } else {
+ $('#article-container').append(code)
+ }
+ }
+ }
+
+ const lazyloadImg = () => {
+ window.lazyLoadInstance = new LazyLoad({
+ elements_selector: 'img',
+ threshold: 0,
+ data_src: 'lazy-src'
+ })
+ }
+
+ const unRefreshFn = function () {
+ $(window).on('resize', function () {
+ if (window.innerWidth < 768) adjustMenu(0)
+ else if ($('#sidebar').hasClass('tocOpenPc') && $('#nav').hasClass('fixed')) adjustMenu(1)
+ else adjustMenu(2)
+ })
+
+ clickFnOfSubMenu()
+ GLOBAL_CONFIG.islazyload && lazyloadImg()
+ GLOBAL_CONFIG.copyright !== undefined && addCopyright()
+ GLOBAL_CONFIG.baiduPush && pushToBaidu()
+ }
+
+ window.refreshFn = function () {
+ initAdjust()
+
+ if (GLOBAL_CONFIG_SITE.isPost) {
+ OpenSidebarAuto()
+ toggleSidebar()
+ GLOBAL_CONFIG_SITE.isSidebar && tocFn()
+ GLOBAL_CONFIG.noticeOutdate !== undefined && addPostOutdateNotice()
+ }
+
+ sidebarFn()
+ GLOBAL_CONFIG_SITE.isHome && scrollDownInIndex()
+ GLOBAL_CONFIG.highlight && addHighlightTool()
+ GLOBAL_CONFIG.isPhotoFigcaption && addPhotoFigcaption()
+ runJustifiedGallery()
+ addLightBox()
+ scrollFn()
+ GLOBAL_CONFIG.runtime && addRuntime()
+ addLastPushDate()
+ addTableWrap()
+ clickFnOfTagHide()
+ tabsFn.clickFnOfTabs()
+ tabsFn.backToTop()
+ toggleCardCategory()
+ switchComments()
+ }
-$(function () {
refreshFn()
unRefreshFn()
})
diff --git a/source/js/third-party/fireworks.js b/source/js/third-party/fireworks.js
index 91993a7..7811dc1 100644
--- a/source/js/third-party/fireworks.js
+++ b/source/js/third-party/fireworks.js
@@ -9,7 +9,7 @@ if (canvasEl) {
var tap = 'mousedown'
var colors = ['#FF1461', '#18FF92', '#5A87FF', '#FBF38C']
- var setCanvasSize = debounce(function () {
+ var setCanvasSize = btf.debounce(function () {
canvasEl.width = window.innerWidth
canvasEl.height = window.innerHeight
canvasEl.style.width = window.innerWidth + 'px'
diff --git a/source/js/tw_cn.js b/source/js/tw_cn.js
index b85c7f2..6a1e893 100644
--- a/source/js/tw_cn.js
+++ b/source/js/tw_cn.js
@@ -50,14 +50,14 @@
translateButtonObject.innerHTML = msgToTraditionalChinese
saveToLocal.set(targetEncodingCookie, targetEncoding, 2)
translateBody()
- if (isSnackbar) snackbarShow(snackbarData.cht_to_chs)
+ if (isSnackbar) btf.snackbarShow(snackbarData.cht_to_chs)
} else if (targetEncoding === 2) {
currentEncoding = 2
targetEncoding = 1
translateButtonObject.innerHTML = msgToSimplifiedChinese
saveToLocal.set(targetEncodingCookie, targetEncoding, 2)
translateBody()
- if (isSnackbar) snackbarShow(snackbarData.chs_to_cht)
+ if (isSnackbar) btf.snackbarShow(snackbarData.chs_to_cht)
}
}
function JTPYStr () {
diff --git a/source/js/utils.js b/source/js/utils.js
index 61289d7..190f84c 100644
--- a/source/js/utils.js
+++ b/source/js/utils.js
@@ -1,134 +1,136 @@
/* eslint-disable no-unused-vars */
-function debounce (func, wait, immediate) {
- let timeout
- return function () {
- const context = this
- const args = arguments
- const later = function () {
- timeout = null
- if (!immediate) func.apply(context, args)
- }
- const callNow = immediate && !timeout
- clearTimeout(timeout)
- timeout = setTimeout(later, wait)
- if (callNow) func.apply(context, args)
- }
-}
-
-function throttle (func, wait, options) {
- let timeout, context, args
- let previous = 0
- if (!options) options = {}
-
- const later = function () {
- previous = options.leading === false ? 0 : new Date().getTime()
- timeout = null
- func.apply(context, args)
- if (!timeout) context = args = null
- }
-
- const throttled = function () {
- const now = new Date().getTime()
- if (!previous && options.leading === false) previous = now
- const remaining = wait - (now - previous)
- context = this
- args = arguments
- if (remaining <= 0 || remaining > wait) {
- if (timeout) {
- clearTimeout(timeout)
+var btf = {
+ debounce: function (func, wait, immediate) {
+ let timeout
+ return function () {
+ const context = this
+ const args = arguments
+ const later = function () {
timeout = null
+ if (!immediate) func.apply(context, args)
}
- previous = now
+ const callNow = immediate && !timeout
+ clearTimeout(timeout)
+ timeout = setTimeout(later, wait)
+ if (callNow) func.apply(context, args)
+ }
+ },
+
+ throttle: function (func, wait, options) {
+ let timeout, context, args
+ let previous = 0
+ if (!options) options = {}
+
+ const later = function () {
+ previous = options.leading === false ? 0 : new Date().getTime()
+ timeout = null
func.apply(context, args)
if (!timeout) context = args = null
- } else if (!timeout && options.trailing !== false) {
- timeout = setTimeout(later, remaining)
}
- }
- return throttled
-}
-
-function sidebarPaddingR () {
- const innerWidth = window.innerWidth
- const clientWidth = document.body.clientWidth
- const paddingRight = innerWidth - clientWidth
- if (innerWidth !== clientWidth) {
- $('body').css('padding-right', paddingRight)
- }
-}
-
-function scrollToDest (name) {
- const scrollOffset = $(name).offset().top
- let offset
- if ($(window).scrollTop() > scrollOffset) {
- offset = 65
- } else {
- offset = 0
- }
- $('body,html').animate({
- scrollTop: scrollOffset - offset
- })
-}
-
-function snackbarShow (text, showAction, duration) {
- const sa = (typeof showAction !== 'undefined') ? showAction : false
- const dur = (typeof duration !== 'undefined') ? duration : 2000
- const position = GLOBAL_CONFIG.Snackbar.position
- const bg = document.documentElement.getAttribute('data-theme') === 'light' ? GLOBAL_CONFIG.Snackbar.bgLight : GLOBAL_CONFIG.Snackbar.bgDark
- Snackbar.show({
- text: text,
- backgroundColor: bg,
- showAction: sa,
- duration: dur,
- pos: position
- })
-}
-
-const initJustifiedGallery = function (selector) {
- selector.each(function (i, o) {
- if ($(this).is(':visible')) {
- $(this).justifiedGallery({
- rowHeight: 220,
- margins: 4
- })
- }
- })
-}
-
-const diffDate = (d, more = false) => {
- const dateNow = new Date()
- const datePost = new Date(d)
- const dateDiff = dateNow.getTime() - datePost.getTime()
- const dayDiff = Math.floor(dateDiff / (24 * 3600 * 1000))
- let result
- if (more) {
- if (dateDiff <= 3600000) { // < 1 hour
- result = GLOBAL_CONFIG.date_suffix.one_hour
- } else if (dateDiff < 3600000 * 24) { // 1 hour < x < 24 hours
- result = Math.floor(dateDiff / 3600000) + ' ' + GLOBAL_CONFIG.date_suffix.hours
- } else if (dayDiff >= 1 || dayDiff < 365) { // 1 day < x < 365 days
- result = dayDiff + ' ' + GLOBAL_CONFIG.date_suffix.day
- } else { // > 365 days
- result = d.toLocaleDateString().replace(/\//g, '-')
- }
- } else {
- result = dayDiff
- }
- return result
-}
-
-const loadComment = (dom, callback) => {
- if ('IntersectionObserver' in window) {
- const observerItem = new IntersectionObserver((entries) => {
- if (entries[0].isIntersecting) {
- callback()
- observerItem.disconnect()
+ const throttled = function () {
+ const now = new Date().getTime()
+ if (!previous && options.leading === false) previous = now
+ const remaining = wait - (now - previous)
+ context = this
+ args = arguments
+ if (remaining <= 0 || remaining > wait) {
+ if (timeout) {
+ clearTimeout(timeout)
+ timeout = null
+ }
+ previous = now
+ func.apply(context, args)
+ if (!timeout) context = args = null
+ } else if (!timeout && options.trailing !== false) {
+ timeout = setTimeout(later, remaining)
}
- }, { threshold: [0] })
- observerItem.observe(dom)
- } else {
- callback()
+ }
+
+ return throttled
+ },
+
+ sidebarPaddingR: () => {
+ const innerWidth = window.innerWidth
+ const clientWidth = document.body.clientWidth
+ const paddingRight = innerWidth - clientWidth
+ if (innerWidth !== clientWidth) {
+ $('body').css('padding-right', paddingRight)
+ }
+ },
+
+ scrollToDest: name => {
+ const scrollOffset = $(name).offset().top
+ let offset
+ if ($(window).scrollTop() > scrollOffset) {
+ offset = 65
+ } else {
+ offset = 0
+ }
+ $('body,html').animate({
+ scrollTop: scrollOffset - offset
+ })
+ },
+
+ snackbarShow: (text, showAction, duration) => {
+ const sa = (typeof showAction !== 'undefined') ? showAction : false
+ const dur = (typeof duration !== 'undefined') ? duration : 2000
+ const position = GLOBAL_CONFIG.Snackbar.position
+ const bg = document.documentElement.getAttribute('data-theme') === 'light' ? GLOBAL_CONFIG.Snackbar.bgLight : GLOBAL_CONFIG.Snackbar.bgDark
+ Snackbar.show({
+ text: text,
+ backgroundColor: bg,
+ showAction: sa,
+ duration: dur,
+ pos: position
+ })
+ },
+
+ initJustifiedGallery: function (selector) {
+ selector.each(function (i, o) {
+ if ($(this).is(':visible')) {
+ $(this).justifiedGallery({
+ rowHeight: 220,
+ margins: 4
+ })
+ }
+ })
+ },
+
+ diffDate: (d, more = false) => {
+ const dateNow = new Date()
+ const datePost = new Date(d)
+ const dateDiff = dateNow.getTime() - datePost.getTime()
+ const dayDiff = Math.floor(dateDiff / (24 * 3600 * 1000))
+ let result
+ if (more) {
+ if (dateDiff <= 3600000) { // < 1 hour
+ result = GLOBAL_CONFIG.date_suffix.one_hour
+ } else if (dateDiff < 3600000 * 24) { // 1 hour < x < 24 hours
+ result = Math.floor(dateDiff / 3600000) + ' ' + GLOBAL_CONFIG.date_suffix.hours
+ } else if (dayDiff >= 1 || dayDiff < 365) { // 1 day < x < 365 days
+ result = dayDiff + ' ' + GLOBAL_CONFIG.date_suffix.day
+ } else { // > 365 days
+ result = d.toLocaleDateString().replace(/\//g, '-')
+ }
+ } else {
+ result = dayDiff
+ }
+ return result
+ },
+
+ loadComment: (dom, callback) => {
+ if ('IntersectionObserver' in window) {
+ const observerItem = new IntersectionObserver((entries) => {
+ if (entries[0].isIntersecting) {
+ callback()
+ observerItem.disconnect()
+ }
+ }, { threshold: [0] })
+ observerItem.observe(dom)
+ } else {
+ callback()
+ }
}
}