feat: 增加twikoo 最新評論 close #433

feat: 增加twikoo評論數顯示
feat: 增加toc簡潔模式
feat: 最新評論頭像增加lazyload
feat: fontawesome和google字體增加異步加載
fix: 修復上個版本導致的圖庫報沒有jQuery的bugs
fix: 修復上個版本導致aside 分類展開/收縮按鈕的bugs
improvement: toc點擊時改用document.getElementById獲取參數，避免有些字符導致無法跳轉 close #426
improvement: icp圖片限制大小  close #434
improvement: 最新評論優化，當沒有評論時顯示 '沒有評論'
improvement: 若瀏覽器支持,scroll將採用原生瀏覽器支持的滾動方法
improvement: 當屏幕沒有滾動條時，rightside會直接顯示

layout/includes/third-party/aplayer.pug

@@ -1,3 +1,3 @@
-link(rel='stylesheet' href=url_for(theme.CDN.aplayer_css))
+link(rel='stylesheet' href=url_for(theme.CDN.aplayer_css) media="print" onload="this.media='all'")
 script(src=url_for(theme.CDN.aplayer_js))
 script(src=url_for(theme.CDN.meting_js))

layout/includes/third-party/comments/index.pug

@@ -30,7 +30,7 @@ hr
           when 'Utterances'
             #utterances-wrap
           when 'Twikoo'
-            #twikoo
+            #twikoo-wrap
           when 'Facebook Comments'
             .fb-comments(data-colorscheme = theme.display_mode === 'dark' ? 'dark' : 'light'
                         data-numposts= theme.facebook_comments.pageSize || 10

layout/includes/third-party/comments/twikoo.pug

@@ -1,24 +1,43 @@
 script.
-  function loadTwikoo () {
-    function init () {
-      twikoo.init({ 
-        envId: '!{theme.twikoo}' 
+  (()=>{
+    const $countDom = document.getElementById('twikoo-count')
+    const init = () => {
+      twikoo.init({
+        envId: '!{theme.twikoo}',
+        el: '#twikoo-wrap'
       })
     }
 
-    if (typeof twikoo.init === 'function') {
-      init()
+    const getCount = () => {
+      twikoo.getCommentsCount({
+        envId: '!{theme.twikoo}',
+        urls: [window.location.pathname],
+        includeReply: false
+      }).then(function (res) {
+        $countDom.innerText = res[0].count
+      }).catch(function (err) {
+        console.error(err);
+      });
+    }
+
+    const loadTwikoo = (bool = false) => {
+      if (typeof twikoo === 'object') {
+        init()
+        bool && $countDom && setTimeout(()=>{getCount()},0)
+      } else {
+        getScript('!{theme.CDN.twikoo}').then(()=> {
+          init()
+          bool && $countDom && setTimeout(()=>{getCount()},0)
+        })
+      }
+    }
+
+    if ('!{theme.comments.use[0]}' === 'Twikoo' || !!{theme.comments.lazyload}) {
+      if (!{theme.comments.lazyload}) btf.loadComment(document.getElementById('twikoo'), loadTwikoo)
+      else loadTwikoo(true)
     } else {
-      getScript('!{theme.CDN.twikoo}').then(init)
+      window.loadOtherComment = () => {
+        loadTwikoo()
+      }
     }
-  }
-
-  if ('!{theme.comments.use[0]}' === 'Twikoo' || !!{theme.comments.lazyload}) {
-    if (!{theme.comments.lazyload}) btf.loadComment(document.getElementById('twikoo'), loadTwikoo)
-    else loadTwikoo()
-  } else {
-    function loadOtherComment () {
-      loadTwikoo()
-    }
-  }
-
+  })()