feat: 修改newest_comments的leancloud為valine，並刪除其配置，改為讀取valine配置

feat: 增加waline最新評論模塊
feat: 增加waline評論數顯示
feat: 增加waline評論
fix: 修復jquery在一些界面仍然加載問題

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

@@ -31,6 +31,8 @@ hr
             #utterances-wrap
           when 'Twikoo'
             #twikoo-wrap
+          when 'Waline'
+            #waline
           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/js.pug

@@ -14,5 +14,7 @@ each name in theme.comments.use
       !=partial('includes/third-party/comments/utterances', {}, {cache:theme.fragment_cache})
     when 'Twikoo'
       !=partial('includes/third-party/comments/twikoo', {}, {cache:theme.fragment_cache})
+    when 'Waline'
+      !=partial('includes/third-party/comments/waline', {}, {cache:theme.fragment_cache})
     when 'Facebook Comments'
       !=partial('includes/third-party/comments/facebook_comments', {}, {cache:theme.fragment_cache})

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

@@ -0,0 +1,34 @@
+- let option = theme.waline.option ? JSON.stringify(theme.waline.option) : false
+
+script.
+  function loadWaline () {
+    function initWaline () {
+      let initData = {
+        el: '#waline',
+        serverURL: '!{theme.waline.serverURL}',
+        avatar: '#{theme.waline.avatar}',
+        path: location.pathname,
+      }
+      
+      if (!{Boolean(option)}) {
+        const otherData = !{option}
+        initData = Object.assign({}, initData, otherData)
+      }
+      
+      const waline = new Waline(initData)
+    }
+
+    if (typeof Waline === 'function') initWaline() 
+    else getScript('!{url_for(theme.CDN.waline)}').then(initWaline)
+  }
+
+  if ('!{theme.comments.use[0]}' === 'Waline' || !!{theme.comments.lazyload}) {
+    if (!{theme.comments.lazyload}) btf.loadComment(document.querySelector('#waline'),loadWaline)
+    else setTimeout(loadWaline, 0)
+  } else {
+    function loadOtherComment () {
+      loadWaline()
+    }
+  }
+  
+

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

@@ -1,8 +1,12 @@
-if theme.newest_comments.leancloud.enable
-  include ./leancloud.pug
-else if theme.newest_comments.github_issues.enable
+- let config = theme.newest_comments
+
+if config.valine
+  include ./valine.pug
+else if config.waline
+  include ./waline.pug
+else if config.github_issues.enable
   include ./github-issues.pug
-else if theme.newest_comments.disqus.enable
+else if config.disqus.enable
   include ./disqus-comment.pug
-else if theme.newest_comments.twikoo
+else if config.twikoo
   include ./twikoo-comment.pug

layout/includes/third-party/newest-comments/valine.pug

@@ -1,3 +1,5 @@
+- let default_avatar = theme.valine.avatar
+
 script(src="https://cdn.jsdelivr.net/npm/blueimp-md5@2.17.0/js/md5.min.js")
 script.
   window.addEventListener('load', () => {
@@ -17,7 +19,7 @@ script.
     const getIcon = (icon, mail) => {
       if (icon) return icon
       
-      let defaultIcon = '!{ theme.newest_comments.leancloud.default_avatar ? `?d=${theme.newest_comments.leancloud.default_avatar}` : ''}'
+      let defaultIcon = '!{ default_avatar ? `?d=${default_avatar}` : ''}'
       let iconUrl = `https://gravatar.loli.net/avatar/${md5(mail.toLowerCase()) + defaultIcon}`
       return iconUrl
     }
@@ -54,17 +56,17 @@ script.
 
     const getComment = () => {
         let serverURL = ''
-        if (!{Boolean(theme.newest_comments.leancloud.serverURL)}) {
-          serverURL = '!{theme.newest_comments.leancloud.serverURL}'
+        if (!{Boolean(theme.valine.serverURLs)}) {
+          serverURL = '!{theme.valine.serverURLs}'
         } else {
-          serverURL = 'https://!{theme.newest_comments.leancloud.appId.substring(0,8)}.api.lncldglobal.com'
+          serverURL = 'https://!{theme.valine.appId.substring(0,8)}.api.lncldglobal.com'
         }
 
       var settings = {
         "method": "GET",
         "headers": {
-          "X-LC-Id": '!{theme.newest_comments.leancloud.appId}',
-          "X-LC-Key": '!{theme.newest_comments.leancloud.appKey}',
+          "X-LC-Id": '!{theme.valine.appId}',
+          "X-LC-Key": '!{theme.valine.appKey}',
           "Content-Type": "application/json"
         },
       }

layout/includes/third-party/newest-comments/waline.pug

@@ -0,0 +1,95 @@
+- let default_avatar = theme.waline.avatar
+
+script.
+  window.addEventListener('load', () => {
+    const changeContent = (content) => {
+      if (content === '') return content
+
+      content = content.replace(/<[^>]+>/g,"") // remove html tag
+      content = content.replace(/(http(s?):)([/|.|\w|\s|-])*\.(?:jpg|jpeg|gif|png|webp)/g, '') // remove image link
+      content = content.replace(/(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/gi, '') // remove url
+
+      if (content.length > 150) {
+        content = content.substring(0,150) + '...'
+      }
+      return content
+    }
+
+    const getIcon = (mail) => {
+      let defaultIcon = '!{ default_avatar ? `?d=${default_avatar}` : ''}'
+      let iconUrl = `https://gravatar.loli.net/avatar/${mail + defaultIcon}`
+      return iconUrl
+    }
+
+    const generateHtml = array => {
+      let result = ''
+
+      if (array.length) {
+        for (let i = 0; i < array.length; i++) {
+          result += '<div class=\'aside-list-item\'>'
+
+          if (!{theme.newest_comments.avatar}) {
+            let name = 'src'
+            if(!{theme.lazyload.enable}) {
+              name = 'data-lazy-src'
+            }
+            result += `<a href='${array[i].url}' class="thumbnail"><img ${name}='${getIcon(array[i].mail)}' alt='${array[i].nick}'></a>`
+          }
+
+          result += `<div class='content'>
+          <a class='comment' href='${array[i].url}'>${array[i].content}</a>
+          <div class='name'><span>${array[i].nick}</span><time> / ${btf.diffDate(array[i].date, true)}</time></div>
+          </div></div>`
+        }
+      } else {
+        result += '!{_p("aside.card_newest_comments.zero")}'
+      }
+
+      let $dom = document.querySelector('#card-newest-comments .aside-list')
+      $dom.innerHTML= result
+      window.lazyLoadInstance && window.lazyLoadInstance.update()
+      window.pjax && window.pjax.refresh($dom)
+    }
+
+    const getComment = () => {
+      const loadWaline = () => {
+        Waline.Widget.RecentComments({
+          el: '#card-newest-comments .aside-list',
+          serverURL: '!{theme.waline.serverURL}',
+          count: !{theme.newest_comments.limit}
+        }).then(comments => {
+          const walineArray = comments.map(function (e) {
+            return {
+              'content': changeContent(e.comment),
+              'mail': e.mail,
+              'nick': e.nick,
+              'url': e.url,
+              'date': e.createdAt,
+            }
+          })
+          saveToLocal.set('waline-newest-comments', JSON.stringify(walineArray), 10/(60*24))
+          generateHtml(walineArray)
+        }).catch(e => {
+          const $dom = document.querySelector('#card-newest-comments .aside-list')
+          $dom.innerHTML= "!{_p('aside.card_newest_comments.error')}"
+        }) 
+      }
+
+      if (typeof Waline === 'function') loadWaline() 
+      else getScript('!{url_for(theme.CDN.waline)}').then(loadWaline)
+    }
+
+    const newestCommentInit = () => {
+      if (document.querySelector('#card-newest-comments .aside-list')) {
+        const data = saveToLocal.get('waline-newest-comments')
+        if (data) {
+          generateHtml(JSON.parse(data))
+        } else {
+          getComment()
+        }
+      }
+    }
+
+    newestCommentInit()
+    document.addEventListener('pjax:complete', newestCommentInit)
+  })