diff --git a/_config.yml b/_config.yml index 8f60f54..11b2fe7 100644 --- a/_config.yml +++ b/_config.yml @@ -701,10 +701,10 @@ note: # -------------------------------------- # https://github.com/MoOx/pjax -pjax: true +pjax: false # Inject the css and script (aplayer/meting) -aplayerInject: true +aplayerInject: false # Snackbar (Toast Notification 彈窗) # https://github.com/polonel/SnackBar diff --git a/layout/includes/additional-js.pug b/layout/includes/additional-js.pug index e2a7e97..2607711 100644 --- a/layout/includes/additional-js.pug +++ b/layout/includes/additional-js.pug @@ -78,13 +78,19 @@ div if theme.busuanzi.site_uv || theme.busuanzi.site_pv || theme.busuanzi.page_pv script(async src=url_for(theme.CDN.busuanzi)) + if theme.pjax && theme.comments && theme.comments.use + !=partial('includes/comments/js-load-all', {}, {cache:theme.fragment_cache}) + else if commentsJsLoad + !=partial('includes/comments/js-load-all', {}, {cache:theme.fragment_cache}) + if theme.aplayerInject if theme.pjax include ./head/aplayer.pug else if page.aplayer include ./head/aplayer.pug - if theme.pjax - include ./third-party/pjax.pug - !=fragment_cache('injectBottom', function(){return injectHtml(theme.inject.bottom)}) + + if theme.pjax + !=partial('includes/third-party/pjax', {}, {cache:theme.fragment_cache}) + diff --git a/layout/includes/comments/disqus.pug b/layout/includes/comments/disqus.pug index 71bdcc3..406b4cf 100644 --- a/layout/includes/comments/disqus.pug +++ b/layout/includes/comments/disqus.pug @@ -6,11 +6,15 @@ script. this.page.title = '!{ page.title }' }; - if (window.DISQUS) { + window.disqusReset = () => { DISQUS.reset({ reload: true, config: disqus_config }) + } + + if (window.DISQUS) { + disqusReset() } else { (function() { var d = document, s = d.createElement('script') @@ -34,11 +38,11 @@ script. if is_post() && theme.comments.count && defaultComment === 'Disqus' script. - function getDisqusCount() { + if (window.DISQUSWIDGETS === undefined) { var d = document, s = d.createElement('script'); s.src = 'https://!{theme.disqus.shortname}.disqus.com/count.js'; s.id = 'dsq-count-scr'; (d.head || d.body).appendChild(s); + } else { + DISQUSWIDGETS.getCount({reset: true}); } - - getDisqusCount() \ No newline at end of file diff --git a/layout/includes/comments/disqusjs.pug b/layout/includes/comments/disqusjs.pug index 26524b2..f04ce37 100644 --- a/layout/includes/comments/disqusjs.pug +++ b/layout/includes/comments/disqusjs.pug @@ -7,7 +7,7 @@ script. document.getElementsByTagName('head')[0].appendChild(ele) } - function initDiqusjs () { + function initDisqusjs () { window.DISQUS = null new DisqusJS({ shortname: '!{theme.disqusjs.shortname}', @@ -23,11 +23,13 @@ script. }); } - if (window.disqusjsload) initDiqusjs() + window.disqusReset = initDisqusjs + + if (window.disqusJsLoad) initDisqusjs() else { addDisqusjsCSS() - $.getScript('!{url_for(theme.CDN.disqusjs)}', initDiqusjs) - window.disqusjsload = true + $.getScript('!{url_for(theme.CDN.disqusjs)}', initDisqusjs) + window.disqusJsLoad = true } } @@ -43,10 +45,12 @@ script. if is_post() && theme.comments.count && defaultComment === 'Disqusjs' script. - function getDisqusCount() { + if (window.DISQUSWIDGETS === undefined) { var d = document, s = d.createElement('script'); - s.src = 'https://!{theme.disqusjs.shortname}.disqus.com/count.js'; + s.src = 'https://!{theme.disqus.shortname}.disqus.com/count.js'; s.id = 'dsq-count-scr'; (d.head || d.body).appendChild(s); + } else { + DISQUSWIDGETS.getCount({reset: true}); } - getDisqusCount() + diff --git a/layout/includes/comments/facebook_comments.pug b/layout/includes/comments/facebook_comments.pug index 61b5013..ac6bbba 100644 --- a/layout/includes/comments/facebook_comments.pug +++ b/layout/includes/comments/facebook_comments.pug @@ -1,25 +1,29 @@ #fb-root script. - function loadFBComent () { - let ele = document.createElement('script') - ele.setAttribute('src','https://connect.facebook.net/!{theme.facebook_comments.lang}/sdk.js#xfbml=1&version=v7.0') - ele.setAttribute('async', 'true') - ele.setAttribute('defer', 'true') - ele.setAttribute('crossorigin', 'anonymous') - document.getElementById('fb-root').insertAdjacentElement('afterbegin',ele) - + function loadFBComment () { var themeNow = document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light' document.getElementsByClassName('fb-comments')[0].setAttribute('data-colorscheme',themeNow) if (typeof FB === 'object') FB.XFBML.parse() + else { + let ele = document.createElement('script') + ele.setAttribute('src','https://connect.facebook.net/!{theme.facebook_comments.lang}/sdk.js#xfbml=1&version=v7.0') + ele.setAttribute('async', 'true') + ele.setAttribute('defer', 'true') + ele.setAttribute('crossorigin', 'anonymous') + document.getElementById('fb-root').insertAdjacentElement('afterbegin',ele) + } } if ('!{defaultComment}' === 'Facebook Comments' || !{theme.comments.load_begin}) { - loadFBComent() + document.getElementsByClassName('fb-comments').length && loadFBComment() + !{theme.pjax} && document.addEventListener('pjax:complete', () => + document.getElementsByClassName('fb-comments').length && loadFBComment() + ) } else { function loadOtherComment () { - loadFBComent() + loadFBComment() } } diff --git a/layout/includes/comments/gitalk.pug b/layout/includes/comments/gitalk.pug index ef6c247..f80c59d 100644 --- a/layout/includes/comments/gitalk.pug +++ b/layout/includes/comments/gitalk.pug @@ -1,12 +1,12 @@ script. - function loadGitalk () { - function addGitalkSource () { - const ele = document.createElement('link') - ele.rel = 'stylesheet' - ele.href= '!{url_for(theme.CDN.gitalk_css)}' - document.getElementsByTagName('head')[0].appendChild(ele) - } + function addGitalkSource () { + const ele = document.createElement('link') + ele.rel = 'stylesheet' + ele.href= '!{url_for(theme.CDN.gitalk_css)}' + document.getElementsByTagName('head')[0].appendChild(ele) + } + function loadGitalk () { function initGitalk () { var gitalk = new Gitalk({ clientID: '!{theme.gitalk.client_id}', @@ -30,13 +30,11 @@ script. addGitalkSource() $.getScript('!{url_for(theme.CDN.gitalk)}', initGitalk) } - - function commentCount(n){ - try { - document.getElementsByClassName('gitalk-comment-count')[0].innerHTML= n - } catch (e) { - return false - } + } + + function commentCount(n){ + if (document.querySelector('#post-meta .gitalk-comment-count')) { + document.querySelector('#post-meta .gitalk-comment-count').innerHTML= n } } diff --git a/layout/includes/comments/index.pug b/layout/includes/comments/index.pug index 45e3268..b8ae62f 100644 --- a/layout/includes/comments/index.pug +++ b/layout/includes/comments/index.pug @@ -2,7 +2,7 @@ hr #post-comment .comment-head - .comment-headling + .comment-headline i.fas.fa-comments.fa-fw span= ' ' + _p('comment') diff --git a/layout/includes/comments/js-load-all.pug b/layout/includes/comments/js-load-all.pug new file mode 100644 index 0000000..45734de --- /dev/null +++ b/layout/includes/comments/js-load-all.pug @@ -0,0 +1,7 @@ +- let defaultComment = theme.comments.use[0] +each name in theme.comments.use + case name + when 'Valine' + include ./valine.pug + when 'Facebook Comments' + include ./facebook_comments.pug \ No newline at end of file diff --git a/layout/includes/comments/js.pug b/layout/includes/comments/js.pug index 7892f98..5eef692 100644 --- a/layout/includes/comments/js.pug +++ b/layout/includes/comments/js.pug @@ -3,8 +3,6 @@ each name in theme.comments.use case name when 'Disqus' include ./disqus.pug - when 'Valine' - include ./valine.pug when 'Disqusjs' include ./disqusjs.pug when 'Livere' @@ -13,5 +11,3 @@ each name in theme.comments.use include ./gitalk.pug when 'Utterances' include ./utterances.pug - when 'Facebook Comments' - include ./facebook_comments.pug \ No newline at end of file diff --git a/layout/includes/comments/livere.pug b/layout/includes/comments/livere.pug index d763a54..9b442e3 100644 --- a/layout/includes/comments/livere.pug +++ b/layout/includes/comments/livere.pug @@ -1,5 +1,5 @@ script. - function loadlivere () { + function loadLivere () { (function(d, s) { var j, e = d.getElementsByTagName(s)[0]; if (typeof LivereTower === 'function') { return; } @@ -11,13 +11,10 @@ script. } if ('!{defaultComment}' === 'Livere' || !{theme.comments.load_begin}) { - loadlivere() + loadLivere() } else { function loadOtherComment () { - loadlivere() + loadLivere() } - } - -noscript. - Please activate JavaScript for write a comment in LiveRe \ No newline at end of file + } \ No newline at end of file diff --git a/layout/includes/comments/utterances.pug b/layout/includes/comments/utterances.pug index 5f6c9cb..cc0d1ca 100644 --- a/layout/includes/comments/utterances.pug +++ b/layout/includes/comments/utterances.pug @@ -13,6 +13,18 @@ script. document.getElementById('utterances-wrap').insertAdjacentElement('afterbegin',ele) } + function utterancesTheme () { + if (document.querySelector('.utterances-frame')) { + const theme = document.documentElement.getAttribute('data-theme') === 'dark' ? '#{theme.utterances.dark_theme}' : '#{theme.utterances.light_theme}' + const message = { + type: 'set-theme', + theme: theme + }; + const iframe = document.querySelector('.utterances-frame'); + iframe.contentWindow.postMessage(message, 'https://utteranc.es'); + } + } + if ('!{defaultComment}' === 'Utterances' || !{theme.comments.load_begin}) { loadUtterances() } @@ -21,16 +33,4 @@ script. loadUtterances() } } - } - -if theme.darkmode.enable - script. - function utterancesTheme () { - var theme = document.documentElement.getAttribute('data-theme') === 'dark' ? '#{theme.utterances.dark_theme}' : '#{theme.utterances.light_theme}' - const message = { - type: 'set-theme', - theme: theme - }; - const iframe = document.querySelector('.utterances-frame'); - iframe.contentWindow.postMessage(message, 'https://utteranc.es'); - } + } \ No newline at end of file diff --git a/layout/includes/comments/valine.pug b/layout/includes/comments/valine.pug index fb8700a..f97975d 100644 --- a/layout/includes/comments/valine.pug +++ b/layout/includes/comments/valine.pug @@ -3,7 +3,7 @@ if site.data.valine - emojiMaps = JSON.stringify(site.data.valine) script. - function loadvaline () { + function loadValine () { function requestSetting (from, set) { var from = from var setting = set.split(',').filter(function(item){ @@ -18,10 +18,9 @@ script. function initValine () { window.valine = new Valine({ - el:'#vcomment', + el: '#vcomment', appId: '#{theme.valine.appId}', appKey: '#{theme.valine.appKey}', - path: window.location.pathname, placeholder: '#{theme.valine.placeholder}', avatar: '#{theme.valine.avatar}', meta: guestInfo, @@ -32,20 +31,22 @@ script. emojiCDN: '#{theme.valine.emojiCDN}', emojiMaps: !{emojiMaps}, enableQQ: #{theme.valine.enableQQ}, - requiredFields: requiredFields + requiredFields: requiredFields, + path: window.location.pathname, }); } - if (typeof window.valine ==='object') initValine() + if (typeof Valine === 'function') initValine() else $.getScript('!{url_for(theme.CDN.valine)}', initValine) } if ('!{defaultComment}' === 'Valine' || !{theme.comments.load_begin}) { - loadvaline() + document.querySelector('#vcomment') && loadValine() + !{theme.pjax} && document.addEventListener('pjax:complete', () => document.querySelector('#vcomment') && loadValine()) } else { function loadOtherComment () { - loadvaline() + loadValine() } } diff --git a/layout/includes/third-party/pjax.pug b/layout/includes/third-party/pjax.pug index 831eab9..8d27fa8 100644 --- a/layout/includes/third-party/pjax.pug +++ b/layout/includes/third-party/pjax.pug @@ -42,6 +42,8 @@ script. } } + typeof typed === 'object' && typed.destroy() + $(window).off('scroll') //reset readmode diff --git a/source/css/_layout/comments.styl b/source/css/_layout/comments.styl index 83205fc..7eac0ae 100644 --- a/source/css/_layout/comments.styl +++ b/source/css/_layout/comments.styl @@ -2,7 +2,7 @@ .comment-head margin-bottom: 1rem - .comment-headling + .comment-headline display: inline-block vertical-align: middle font-weight: 700 diff --git a/source/css/_layout/third-party.styl b/source/css/_layout/third-party.styl index e1af668..fff86cc 100644 --- a/source/css/_layout/third-party.styl +++ b/source/css/_layout/third-party.styl @@ -39,8 +39,9 @@ &[data-processed] opacity: 1 -.utterances - max-width: 100% +.utterances, +.fb-comments iframe + width: 100% !important #gitalk-container .gt-meta diff --git a/source/css/_mode/darkmode.styl b/source/css/_mode/darkmode.styl index 97142f1..48adae7 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' // Gitalk #gitalk-container - filter: brightness(.7) + filter: brightness(.8) svg fill: alpha(#FFFFFF, .8) !important diff --git a/source/js/main.js b/source/js/main.js index 5fdb72e..4609bea 100644 --- a/source/js/main.js +++ b/source/js/main.js @@ -28,7 +28,7 @@ const adjustMenu = function (n) { } // 初始化header -const initAjust = () => { +const initAdjust = () => { if (window.innerWidth < 768) adjustMenu(0) else adjustMenu(2) $('#nav').css({ opacity: '1', animation: 'headerNoOpacity 1s' }) @@ -197,7 +197,7 @@ const sidebarFn = () => { * 首頁top_img底下的箭頭 */ -const indexSrollDown = () => { +const indexScrollDown = () => { $('#scroll_down').on('click', function () { scrollToDest('#content-inner') }) @@ -207,7 +207,7 @@ const indexSrollDown = () => { * 代碼 * 只適用於Hexo默認的代碼渲染 */ -const addHightlightTool = function () { +const addHighlightTool = function () { const $figureHighlight = $('figure.highlight') if ($figureHighlight.length) { const isHighlightCopy = GLOBAL_CONFIG.highlightCopy @@ -333,7 +333,7 @@ function addPhotoFigcaption () { * justified-gallery 圖庫排版 */ -let dectectJGJsLoad = false +let detectJgJsLoad = false const justifiedGalleryRun = function () { const $justifiedGallery = $('.justified-gallery') if ($justifiedGallery.length) { @@ -346,13 +346,13 @@ const justifiedGalleryRun = function () { }) } - if (dectectJGJsLoad) initJustifiedGallery($justifiedGallery) + if (detectJgJsLoad) initJustifiedGallery($justifiedGallery) else { $('head').append(``) $.getScript(`${GLOBAL_CONFIG.justifiedGallery.js}`, function () { initJustifiedGallery($justifiedGallery) }) - dectectJGJsLoad = true + detectJgJsLoad = true } } } @@ -441,7 +441,7 @@ const scrollFn = function () { * 點擊滾回頂部 */ -const backtotop = function () { +const backToTop = function () { $('#go-up').on('click', function () { scrollToDest('body') }) @@ -485,7 +485,7 @@ const tocFn = function () { } // anchor - const isanchor = GLOBAL_CONFIG.isanchor + const isAnchor = GLOBAL_CONFIG.isanchor const updateAnchor = function (anchor) { if (window.history.replaceState && anchor !== window.location.hash) { window.history.replaceState(undefined, undefined, anchor) @@ -519,7 +519,7 @@ const tocFn = function () { const currentActive = $('.toc-link.active') if (currentId && currentActive.attr('href') !== currentId) { - if (isanchor) updateAnchor(currentId) + if (isAnchor) updateAnchor(currentId) $('.toc-link').removeClass('active') @@ -544,12 +544,12 @@ const tocFn = function () { const autoScrollToc = function (currentTop) { if ($('.toc-link').hasClass('active')) { const activePosition = $('.active').offset().top - const sidebarScrolltop = $('#sidebar .sidebar-toc__content').scrollTop() + const sidebarScrollTop = $('#sidebar .sidebar-toc__content').scrollTop() if (activePosition > (currentTop + $(window).height() - 100)) { - $('#sidebar .sidebar-toc__content').scrollTop(sidebarScrolltop + 100) + $('#sidebar .sidebar-toc__content').scrollTop(sidebarScrollTop + 100) } if (activePosition < currentTop + 100) { - $('#sidebar .sidebar-toc__content').scrollTop(sidebarScrolltop - 100) + $('#sidebar .sidebar-toc__content').scrollTop(sidebarScrollTop - 100) } } } @@ -660,6 +660,8 @@ const switchDarkmode = function () { $darkModeButton.click(function () { switchReadMode() typeof utterancesTheme === 'function' && utterancesTheme() + typeof FB === 'object' && window.loadFBComment() + window.DISQUS && $('#disqus_thread').children().length && setTimeout(() => window.disqusReset(), 200) }) } } @@ -730,13 +732,13 @@ const tabsClick = function () { const $tabItem = $this.parent() if (!$tabItem.hasClass('active')) { - const $tacbContent = $this.parents('.nav-tabs').next() + const $tabContent = $this.parents('.nav-tabs').next() $tabItem.siblings('.active').removeClass('active') $tabItem.addClass('active') const tabId = $this.attr('data-href') - $tacbContent.find('> .tab-item-content').removeClass('active') - $tacbContent.find(`> ${tabId}`).addClass('active') - const $isTabJustifiedGallery = $tacbContent.find(tabId).find('.justified-gallery') + $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) } @@ -808,7 +810,7 @@ if (GLOBAL_CONFIG.islazyload) { ) } -const unrefreshFn = function () { +const unRefreshFn = function () { $(window).on('resize', function () { if (window.innerWidth < 768) adjustMenu(0) else if ($('#sidebar').hasClass('tocOpenPc') && $('#nav').hasClass('fixed')) adjustMenu(1) @@ -821,7 +823,7 @@ const unrefreshFn = function () { } const refreshFn = function () { - initAjust() + initAdjust() if (GLOBAL_CONFIG_SITE.isPost) { sidebarAutoOpen() @@ -833,13 +835,13 @@ const refreshFn = function () { } sidebarFn() - GLOBAL_CONFIG_SITE.isHome && indexSrollDown() - addHightlightTool() + GLOBAL_CONFIG_SITE.isHome && indexScrollDown() + addHighlightTool() GLOBAL_CONFIG.isPhotoFigcaption && addPhotoFigcaption() justifiedGalleryRun() lightBox() scrollFn() - backtotop() + backToTop() rightsideConfigClick() switchDarkmode() GLOBAL_CONFIG.runtime && runtimeShow() @@ -852,5 +854,5 @@ const refreshFn = function () { $(function () { refreshFn() - unrefreshFn() + unRefreshFn() })