💥 支持雙評論系統配置/評論配置整理

✨ 增加mac light 代碼框
✨ 增加文章過期提醒配置
✨ 文章copyright 可單獨配置
✨ card-category 中category名稱和數字限制一行顯示
✨ 簡繁轉換優化，placeholder文字也會被轉換
🐛 修復配置PWA參數時，如果網站是子目錄時，會出現加載不到文件的bugs
調整當card-category有收縮按鈕時的顯示佈局

layout/includes/comments/disqus.pug

@@ -1,18 +1,28 @@
 #disqus_thread
 script.
-  var disqus_config = function () {
-    this.page.url = '!{ page.permalink }';
-    this.page.identifier = '!{ page.path }';
-    this.page.title = '!{ page.title }';
-  };
-  (function() { 
+  function loadDisqus () {
+    var disqus_config = function () {
+      this.page.url = '!{ page.permalink }';
+      this.page.identifier = '!{ page.path }';
+      this.page.title = '!{ page.title }';
+    };
+
     var d = document, s = d.createElement('script');
     s.src = 'https://!{theme.disqus.shortname}.disqus.com/embed.js';
     s.setAttribute('data-timestamp', +new Date());
     (d.head || d.body).appendChild(s);
-  })();
+  }
 
-if is_post() && theme.disqus.count
+  if ('!{defaultComment}' === 'Disqus' || !{theme.comments.load_begin}) {
+    window.addEventListener('load', loadDisqus)
+  }
+  else {
+    function loadOtherComment () {
+      loadDisqus()
+    }
+  }
+
+if is_post() && theme.comments.count && defaultComment === 'Disqus'
   script.
     function getDisqusCount() {
       var d = document, s = d.createElement('script');

layout/includes/comments/disqusjs.pug

@@ -1,20 +1,38 @@
 #disqus_thread
-script(src=url_for(theme.CDN.disqusjs))
 script.
-  var dsqjs = new DisqusJS({
-    shortname: '!{theme.disqusjs.shortname}',
-    siteName: '!{theme.disqusjs.siteName}',
-    identifier: '!{ page.path }',
-    url: '!{ page.permalink }',
-    title: '!{ page.title }',
-    api: '!{theme.disqusjs.api}',
-    apikey: '!{theme.disqusjs.apikey}',
-    nocomment: '!{theme.disqusjs.nocomment}',
-    admin: '!{theme.disqusjs.admin}',
-    adminLabel: '!{theme.disqusjs.adminLabel}'
-  });
+  function loadDisqusjs () {
+    const ele = document.createElement('link')
+    ele.rel = 'stylesheet'
+    ele.href= '!{url_for(theme.CDN.disqusjs_css)}'
+    document.getElementsByTagName('head')[0].appendChild(ele)
 
-if is_post() && theme.disqusjs.count
+    loadScript('!{url_for(theme.CDN.disqusjs)}', function() {
+      var dsqjs = new DisqusJS({
+        shortname: '!{theme.disqusjs.shortname}',
+        siteName: '!{theme.disqusjs.siteName}',
+        identifier: '!{ page.path }',
+        url: '!{ page.permalink }',
+        title: '!{ page.title }',
+        api: '!{theme.disqusjs.api}',
+        apikey: '!{theme.disqusjs.apikey}',
+        nocomment: '!{theme.disqusjs.nocomment}',
+        admin: '!{theme.disqusjs.admin}',
+        adminLabel: '!{theme.disqusjs.adminLabel}'
+      });
+    })
+  }
+
+  if ('!{defaultComment}' === 'Disqusjs' || !{theme.comments.load_begin}) {
+    window.addEventListener('load', loadDisqusjs)
+  }
+  else {
+    function loadOtherComment () {
+      loadDisqusjs()
+    }
+  }
+
+
+if is_post() && theme.comments.count && defaultComment === 'Disqusjs'
   script.
     function getDisqusCount() {
       var d = document, s = d.createElement('script');

layout/includes/comments/facebook_comments.pug

@@ -1,11 +1,29 @@
 #fb-root
-script(async defer crossorigin="anonymous" src=`https://connect.facebook.net/${theme.facebook_comments.lang}/sdk.js#xfbml=1&version=v6.0`)
 .fb-comments(data-colorscheme = theme.display_mode === 'dark' ? 'dark' : 'light'
             data-href=urlNoIndex() 
             data-numposts= theme.facebook_comments.pageSize || 10
             data-order-by= theme.facebook_comments.order_by || 'social'
             data-width="100%")
 
+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)
+  }
+
+  if ('!{defaultComment}' === 'Facebook Comments' || !{theme.comments.load_begin}) {
+    window.addEventListener('load', loadFBComent)
+  }
+  else {
+    function loadOtherComment () {
+      loadFBComent()
+    }
+  }
+
 if theme.darkmode.enable
   script.
     var themeNow = document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light'

layout/includes/comments/gitalk.pug

@@ -1,26 +1,46 @@
 #gitalk-container
-script.
-  var gitalk = new Gitalk({
-    clientID: '!{theme.gitalk.client_id}',
-    clientSecret: '!{theme.gitalk.client_secret}',
-    repo: '!{theme.gitalk.repo}',
-    owner: '!{theme.gitalk.owner}',
-    admin: ['!{theme.gitalk.admin}'],
-    id: md5(decodeURI(location.pathname)),
-    language: '!{theme.gitalk.language}',
-    perPage: !{theme.gitalk.perPage},
-    distractionFreeMode: !{theme.gitalk.distractionFreeMode},
-    pagerDirection: '!{theme.gitalk.pagerDirection}',
-    createIssueManually: !{theme.gitalk.createIssueManually},
-    updateCountCallback: commentCount
-  })
-  gitalk.render('gitalk-container')
+script(src=url_for(theme.CDN.blueimp_md5))
 
-  function commentCount(n){
-    try {
-      document.getElementsByClassName('gitalk-comment-count')[0].innerHTML= n
-    } catch (e) {
-      return false
+script.
+  function loadGitalk () {
+    const ele = document.createElement('link')
+    ele.rel = 'stylesheet'
+    ele.href= '!{url_for(theme.CDN.gitalk_css)}'
+    document.getElementsByTagName('head')[0].appendChild(ele)
+
+    loadScript('!{url_for(theme.CDN.gitalk)}', function () {
+      var gitalk = new Gitalk({
+        clientID: '!{theme.gitalk.client_id}',
+        clientSecret: '!{theme.gitalk.client_secret}',
+        repo: '!{theme.gitalk.repo}',
+        owner: '!{theme.gitalk.owner}',
+        admin: ['!{theme.gitalk.admin}'],
+        id: md5(decodeURI(location.pathname)),
+        language: '!{theme.gitalk.language}',
+        perPage: !{theme.gitalk.perPage},
+        distractionFreeMode: !{theme.gitalk.distractionFreeMode},
+        pagerDirection: '!{theme.gitalk.pagerDirection}',
+        createIssueManually: !{theme.gitalk.createIssueManually},
+        updateCountCallback: commentCount
+      })
+      gitalk.render('gitalk-container')
+    })
+
+    function commentCount(n){
+      try {
+        document.getElementsByClassName('gitalk-comment-count')[0].innerHTML= n
+      } catch (e) {
+        return false
+      }
+    }
+  }
+
+  if ('!{defaultComment}' === 'Gitalk' || !{theme.comments.load_begin}) {
+    window.addEventListener('load', loadGitalk)
+  }
+  else {
+    function loadOtherComment () {
+      loadGitalk()
     }
   }
 

layout/includes/comments/index.pug

@@ -1,29 +1,36 @@
-- var d = theme.disqus && theme.disqus.enable
-- var dj = theme.disqusjs && theme.disqusjs.enable
-- var l = theme.livere && theme.livere.enable
-- var gt = theme.gitalk && theme.gitalk.enable
-- var v = theme.valine && theme.valine.enable
-- var u = theme.utterances && theme.utterances.enable
-- var fb = theme.facebook_comments && theme.facebook_comments.enable
-- var isComment = d || dj || l || gt || v || u || fb
-
-if isComment
+if theme.comments && theme.comments.use
+  - const defaultComment = theme.comments.use[0]
   hr
   #post-comment
-    .comment_headling
-      i.fas.fa-comments.fa-fw
-      span= ' ' + _p('comment')
-    if d
-      include ./disqus.pug
-    else if dj
-      include ./disqusjs.pug
-    else if l
-      include ./livere.pug
-    else if gt
-      include ./gitalk.pug
-    else if v
-      include ./valine.pug
-    else if u
-      include ./utterances.pug
-    else if fb
-      include ./facebook_comments.pug
+    .comment-head
+      .comment-headling
+        i.fas.fa-comments.fa-fw
+        span= ' ' + _p('comment')
+      
+      if theme.comments.use.length > 1
+        .comment-switch
+          span.first-comment=defaultComment
+          label
+            input#switch-comments-btn(type="checkbox")
+            span.slider
+          span.second-comment=theme.comments.use[1]
+
+
+    .comment-wrap
+      each name, index in theme.comments.use
+        div(class=`comments-items-${index+1}` data-name=`${name}`)
+          case name
+            when 'Disqus'
+              include ./disqus.pug
+            when 'Valine'
+              include ./valine.pug
+            when 'Disqusjs'
+              include ./disqusjs.pug
+            when 'Livere'
+              include ./livere.pug
+            when 'Gitalk'
+              include ./gitalk.pug
+            when 'Utterances'
+              include ./utterances.pug
+            when 'Facebook Comments'
+              include ./facebook_comments.pug

layout/includes/comments/livere.pug

@@ -1,10 +1,21 @@
 #lv-container(data-id="city" data-uid=theme.livere.uid)
   script.
-    (function(d, s) {
-        var j, e = d.getElementsByTagName(s)[0];
-        if (typeof LivereTower === 'function') { return; }
-        j = d.createElement(s);
-        j.src = 'https://cdn-city.livere.com/js/embed.dist.js';
-        j.async = true;
-        e.parentNode.insertBefore(j, e);
-    })(document, 'script');
+    function loadlivere () {
+      (function(d, s) {
+          var j, e = d.getElementsByTagName(s)[0];
+          if (typeof LivereTower === 'function') { return; }
+          j = d.createElement(s);
+          j.src = 'https://cdn-city.livere.com/js/embed.dist.js';
+          j.async = true;
+          e.parentNode.insertBefore(j, e);
+      })(document, 'script');
+    }
+
+    if ('!{defaultComment}' === 'Livere' || !{theme.comments.load_begin}) {
+      window.addEventListener('load', loadlivere)
+    }
+    else {
+      function loadOtherComment () {
+        loadlivere()
+      }
+    }

layout/includes/comments/utterances.pug

@@ -1,15 +1,30 @@
-script#utterances_comment(src=theme.CDN.utterances
-        repo=theme.utterances.repo
-        issue-term=theme.utterances.issue_term
-        theme= theme.display_mode === 'dark' ? theme.utterances.dark_theme : theme.utterances.light_theme
-        crossorigin="anonymous"
-        async)
+#utterances-wrap
+
+script.
+  function loadUtterances () {
+    let ele = document.createElement('script')
+    ele.setAttribute('id', 'utterances_comment')
+    ele.setAttribute('src', '!{url_for(theme.CDN.utterances)}')
+    ele.setAttribute('repo', '!{theme.utterances.repo}')
+    ele.setAttribute('issue-term', '!{theme.utterances.issue_term}')
+    let nowTheme = document.documentElement.getAttribute('data-theme') === 'dark' ? '#{theme.utterances.dark_theme}' : '#{theme.utterances.light_theme}'
+    ele.setAttribute('theme', nowTheme)
+    ele.setAttribute('crossorigin', 'anonymous')
+    ele.setAttribute('async', 'true')
+    document.getElementById('utterances-wrap').insertAdjacentElement('afterbegin',ele)
+  }
+
+  if ('!{defaultComment}' === 'Utterances' || !{theme.comments.load_begin}) {
+    window.addEventListener('load', loadUtterances)
+  }
+  else {
+    function loadOtherComment () {
+      loadUtterances()
+    }
+  }
 
 if theme.darkmode.enable
   script.
-    var themeNow = document.documentElement.getAttribute('data-theme') === 'dark' ? '#{theme.utterances.dark_theme}' : '#{theme.utterances.light_theme}'
-    document.getElementById('utterances_comment').setAttribute('theme',themeNow)
-
     function utterancesTheme () {
     var theme = document.documentElement.getAttribute('data-theme') === 'dark' ? '#{theme.utterances.dark_theme}' : '#{theme.utterances.light_theme}'
     const message = {

layout/includes/comments/valine.pug

@@ -3,33 +3,47 @@ if site.data.valine
   - emojiMaps = JSON.stringify(site.data.valine)
 
 #vcomment.vcomment
-script(src=url_for(theme.CDN.valine))
 script.
-  var requestSetting = function (from,set) {
-    var from = from
-    var setting = set.split(',').filter(function(item){
-    return from.indexOf(item) > -1
-    });
-    setting = setting.length == 0 ? from :setting;
-    return setting
+  function loadvaline () {  
+    var requestSetting = function (from,set) {
+      var from = from
+      var setting = set.split(',').filter(function(item){
+      return from.indexOf(item) > -1
+      });
+      setting = setting.length == 0 ? from :setting;
+      return setting
+    }
+
+    var guestInfo = requestSetting(['nick','mail','link'],'#{ theme.valine.guest_info }')
+    var requiredFields = requestSetting(['nick','mail'],'#{ theme.valine.requiredFields }')
+
+    function initValine () {
+      window.valine = new Valine({
+        el:'#vcomment',
+        appId: '#{theme.valine.appId}',
+        appKey: '#{theme.valine.appKey}',
+        placeholder: '#{theme.valine.placeholder}',
+        avatar: '#{theme.valine.avatar}',
+        meta: guestInfo,
+        pageSize: '#{theme.valine.pageSize}',
+        lang: '#{theme.valine.lang}',
+        recordIP: #{theme.valine.recordIP},
+        serverURLs: '#{theme.valine.serverURLs}',
+        emojiCDN: '#{theme.valine.emojiCDN}',
+        emojiMaps: !{emojiMaps},
+        enableQQ: #{theme.valine.enableQQ},
+        requiredFields: requiredFields
+      });
+    }
+    loadScript('!{url_for(theme.CDN.valine)}', initValine)
   }
 
-  var guestInfo = requestSetting(['nick','mail','link'],'#{ theme.valine.guest_info }')
-  var requiredFields = requestSetting(['nick','mail'],'#{ theme.valine.requiredFields }')
+  if ('!{defaultComment}' === 'Valine' || !{theme.comments.load_begin}) {
+    window.addEventListener('load', loadvaline)
+  }
+  else {
+    function loadOtherComment () {
+      loadvaline()
+    }
+  }
 
-  window.valine = new Valine({
-    el:'#vcomment',
-    appId: '#{theme.valine.appId}',
-    appKey: '#{theme.valine.appKey}',
-    placeholder: '#{theme.valine.placeholder}',
-    avatar: '#{theme.valine.avatar}',
-    meta: guestInfo,
-    pageSize: '#{theme.valine.pageSize}',
-    lang: '#{theme.valine.lang}',
-    recordIP: #{theme.valine.recordIP},
-    serverURLs: '#{theme.valine.serverURLs}',
-    emojiCDN: '#{theme.valine.emojiCDN}',
-    emojiMaps: !{emojiMaps},
-    enableQQ: #{theme.valine.enableQQ},
-    requiredFields: requiredFields
-  });