hexo-theme-solitude 1.2.3 → 1.2.6

package/_config.yml

@@ -407,12 +407,18 @@ thirdparty:
 # 评论
 comment:
   enable: false # 是否开启评论
-  type: 'twikoo' # valine, twikoo
+  type:  # valine, twikoo
+  lazyload: false # 是否开启懒加载
+  count: false  # 是否显示评论数
   # 评论系统
   twikoo:
     envId: # url: https://twikoo.sondy.top/
     lang: 'zh-CN' # 语言
     accessToken:  # accessToken
+  waline:
+    envId:  # url: https://waline.js.org/
+    pageview: false # 是否开启页面访问量统计
+    option: # waline配置项
 
 # 插入代码到头部 </head> 之前 和 底部 </body> 之前
 # 插入额外代码 如：统计，广告等
@@ -502,6 +508,8 @@ cdn:
     pacejs: https://cdn.bootcdn.net/ajax/libs/pace/1.2.4/pace.min.js
     echartsjs: https://cdn.bootcdn.net/ajax/libs/echarts/5.4.2/echarts.min.js
     lunrjs: https://cdn.bootcdn.net/ajax/libs/lunr.js/2.3.9/lunr.min.js
+    walinecss: https://cdn.bootcdn.net/ajax/libs/waline/2.15.7/waline.min.css
+    walinejs: https://cdn.bootcdn.net/ajax/libs/waline/2.15.7/waline.min.js
   body:
     viewimagejs: /lib/view-image.min.js
     waterfalljs: /lib/waterfall.min.js

package/layout/archive.pug

@@ -3,7 +3,7 @@ extends includes/layout.pug
 block content
     main.layout#content-inner
         div#archive
-            div.article-sort-title #{__('page.archives')}<sup>#{page.posts.length}</sup>
+            div.article-sort-title #{__('page.archives')}<sup>#{page.posts.find({ parent: { $exists: false } }).length}</sup>
             div.article-sort
                 include includes/mixins/articleSort
             include includes/mixins/pagination

package/layout/category.pug

@@ -1,16 +1,13 @@
 extends includes/layout.pug
 
 block content
-  main.layout#content-inner
-    div#category
-      div#category-bar
-        div.category-bar-items#category-bar-items
-          include includes/widgets/home/categoryBar
-      div.recent-posts#recent-posts
-        - const currentCategory = page.category
-        each post in site.posts.data
-          each category in post.categories.data
-            if category.name === currentCategory
-              include includes/widgets/home/postList
-      include includes/mixins/pagination
-    include includes/widgets/aside/aside
+    main.layout#content-inner
+        div#category
+            div#category-bar
+                div.category-bar-items#category-bar-items
+                    include includes/widgets/home/categoryBar
+            div.recent-posts#recent-posts
+                each post in page.posts.find({ parent: { $exists: false } }).data
+                    include includes/widgets/home/postList
+            include includes/mixins/pagination
+        include includes/widgets/aside/aside

package/layout/includes/console.pug

@@ -16,7 +16,7 @@ div#console(style="zoom: 1")
                         div.author-content-item-tips= "标签"
                         div.author-content-item-title= "寻找感兴趣的领域"
                     div.card-tag-cloud
-                        each tag in site.tags.data
+                        each tag in site.tags.find({ parent: { $exists: false } }).data
                             a(href=url_for(tag.path), style="font-size: 0.8rem; color: #d3d3d3")= tag.name
                                 sup= tag.length
 

package/layout/includes/head/config.pug

@@ -72,6 +72,9 @@ script.
                 url: '!{theme.comment.twikoo.envId}',
                 accessToken: '!{theme.comment.twikoo.accessToken}'
             },
+            waline: {
+                url: '!{theme.comment.waline.envId}',
+            }
         },
         rightside: {
             enable: !{theme.rightside.enable}

package/layout/includes/inject/body.pug

@@ -54,9 +54,13 @@ if theme.aside.welcome.enable
     script(src='/js/txmap.js')
 
 if theme.comment.enable
-    if theme.comment.type === 'twikoo'
-        script(src='/js/extend/comment/twikoo.js')
-        script(src='/js/commentBarrage.js')
+    case theme.comment.type
+        when 'twikoo'
+            script(src='/js/extend/comment/twikoo.js')
+            script(src='/js/commentBarrage.js')
+        when 'waline'
+            script(src='/js/extend/comment/waline.js')
+
 
 // pjax
 include ../widgets/third-party/pjax.pug
@@ -64,4 +68,4 @@ include ../widgets/third-party/pjax.pug
 // inject custom body
 if theme.extends.body
     each item in theme.extends.body
-       != item
+        != item

package/layout/includes/inject/head.pug

@@ -18,8 +18,12 @@ link(rel="stylesheet", href=cdn.snackbarcss)
 
 // comment
 if theme.comment.enable
-    if theme.comment.type === 'twikoo'
-        script(src=cdn.twikoojs)
+    case theme.comment.type
+        when 'twikoo'
+            script(src=cdn.twikoojs)
+        when 'waline'
+            script(src=cdn.walinejs)
+            link(rel="stylesheet", href=cdn.walinecss)
 
 // search
 if theme.thirdparty.search.enable

package/layout/includes/mixins/articleSort.pug

@@ -1,8 +1,8 @@
 - let year
-each post in page.posts.data
-    - if(year !== moment(post.date).year())
-    - year = moment(post.date).year()
-    div.article-sort-item.year #{year}
+each post in page.posts.find({ parent: { $exists: false } }).data
+    if(year !== post.date.year())
+        - year = post.date.year()
+        div.article-sort-item.year #{year}
     div.article-sort-item
         a.article-sort-item-img(href=url_for(post.path) title=post.title)
             img(src=post.cover alt=post.title)

package/layout/includes/widgets/third-party/comments/comment.pug

@@ -11,4 +11,6 @@ div#post-comment(view-image)
             when 'gitalk'
                 include ./gitalk.pug
             when 'valine'
-                include ./valine.pug
+                include ./valine.pug
+            when 'waline'
+                include ./waline.pug

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

@@ -0,0 +1,17 @@
+- const { envId, option, pageview } = theme.comment.waline
+- const { lazyload, count, type } = theme.comment
+
+script.
+    async function initComment() {
+        (() => {
+            const waline = Waline.init(Object.assign({
+                el: '#comment',
+                serverURL: '!{envId}',
+                pageview: !{lazyload ? false : pageview},
+                dark: 'html[data-theme="dark"]',
+                path: window.location.pathname,
+                search: false,
+                comment: !{lazyload ? false : count},
+            }, !{JSON.stringify(option)}))
+        })()
+    }

package/layout/tag.pug

@@ -1,19 +1,16 @@
 extends includes/layout.pug
 
 block content
-  main.layout#content-inner
-    div#tag
-      div#tag-page-tags
-        each tag in site.tags.find({ parent: { $exists: false } }).data
-          a(id=tag.name class=(tag.name === page.tag ? 'select' : '') href=url_for(tag.path))
-            span.tags-punctuation
-            | #{tag.name}
-            span.tagsPageCount #{tag.length}
-      div.recent-posts#recent-posts
-        - const currentTag = page.tag
-        each post in site.posts.data
-          each tag in post.tags.data
-            if tag.name === currentTag
-              include includes/widgets/home/postList
-      include includes/mixins/pagination
-    include includes/widgets/aside/aside
+    main.layout#content-inner
+        div#tag
+            div#tag-page-tags
+                each tag in site.tags.find({ parent: { $exists: false } }).data
+                    a(id=tag.name class=(tag.name === page.tag ? 'select' : '') href=url_for(tag.path))
+                        span.tags-punctuation
+                        | #{tag.name}
+                        span.tagsPageCount #{tag.length}
+            div.recent-posts#recent-posts
+                each post in page.posts.find({ parent: { $exists: false } }).data
+                    include includes/widgets/home/postList
+            include includes/mixins/pagination
+        include includes/widgets/aside/aside

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hexo-theme-solitude",
-  "version": "1.2.3",
+  "version": "1.2.6",
   "description": "A beautiful, powerful, and efficient Hexo theme developed by the DuoSco team",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"
@@ -20,4 +20,4 @@
     "url": "https://github.com/DuoSco/Hexo-theme-solitude/issues"
   },
   "homepage": "https://github.com/DuoSco/hexo-theme-solitude#readme"
-}
+}

package/source/css/_layout/index.styl

@@ -16,6 +16,7 @@
     border-radius 12px
     cursor pointer
     border var(--style-border)
+    margin 1rem 0 1rem
 
     &:hover
       box-shadow var(--card-hover-box-shadow)

package/source/css/_widgets/comment/waline.styl

@@ -0,0 +1,75 @@
+#comment
+  .wl-sort li
+    color var(--sco-gray)
+
+    &.active
+      color var(--sco-main) !important
+
+  .wl-comment
+    .wl-panel
+      margin 0 !important
+
+    .wl-footer
+      .wl-info
+        button
+          background-color var(--sco-card-bg)
+          border var(--style-border-always)
+          color var(--sco-fontcolor)
+
+        button:hover
+          background-color var(--sco-main)
+          border-color var(--sco-main)
+          color var(--sco-card-bg)
+
+    #wl-edit
+      font-size 13px
+      line-height 1.5
+      margin .75rem .25rem
+
+    .wl-action
+      transition .3s
+
+      &:hover
+        color var(--sco-main)
+
+  .wl-meta-head
+    .wl-count
+      color var(--sco-gray)
+      font-size 14px
+      font-weight normal
+
+  .wl-cards
+    font-size 16px!important
+    .wl-comment-actions
+      button
+        margin-right 15px
+        font-size 18px
+
+        &:hover
+          color var(--sco-main)
+    .wl-head .wl-nick
+      font-size 20px !important
+      color var(--sco-lighttext)
+      font-weight bolder
+
+    .wl-meta>span
+      background var(--sco-gray)
+      border-radius 5px
+      color var(--sco-card-bg)
+      margin-right 5px
+
+    .wl-user
+      img
+        flex-shrink 0
+        height 2.5rem
+        width 2.5rem
+        overflow hidden
+        text-align center
+        border-radius 2.5rem
+        border 2px solid var(--sco-white)
+
+[data-waline] a
+  color var(--sco-main) !important
+
+.wl-content pre, .wl-content pre[class*=language-]
+  padding .5rem!important

package/source/css/index.styl

@@ -15,8 +15,9 @@ if hexo-config('css_prefix')
 
 // comment
 if hexo-config('comment.enable')
-  @import '_comment/index.styl'
-  @import '_comment/twikoo.styl' when hexo-config('comment.type') == 'twikoo'
+  @import '_widgets/comment/index.styl'
+  @import '_widgets/comment/twikoo.styl' when hexo-config('comment.type') == 'twikoo'
+  @import '_widgets/comment/waline.styl' when hexo-config('comment.type') == 'waline'
 
 // commentBarrage
 if hexo-config('thirdparty.comment.enable')

package/source/js/extend/comment/waline.js

@@ -0,0 +1,61 @@
+const changeContent = (content) => {
+    if (content === '') return content
+
+    content = content.replace(/<img.*?src="(.*?)"?[^\>]+>|<a[^>]+?href=["']?([^"']+)["']?[^>]*>([^<]+)<\/a>|<pre><code>.*?<\/pre>|<[^>]+>/g, (match, img, link, code) => {
+        if (img) return '[图片]';
+        if (link) return '[链接]';
+        if (code) return '[代码]';
+        return '';
+    })
+
+    if (content.length > 150) {
+        content = content.substring(0, 150) + '...'
+    }
+    return content
+}
+
+const $asideList = document.querySelector('#card-newest-comments .aside-list')
+const newestCommentInit = () => {
+    if ($asideList) {
+        getComment()
+    }
+}
+
+const getComment = () => {
+    Waline.RecentComments(
+        options = {
+            serverURL: GLOBAL_CONFIG.comment.waline.url,
+            count: 6,
+        }
+    ).then(function (res) {
+        const walineArray = res.comments.map(item => ({
+            'content': changeContent(item.comment),
+            'avatar': item.avatar,
+            'nick': item.nick,
+            'url': `${item.url}#${item.objectId}`,
+            'date': new Date(item.insertedAt).toISOString()
+        }))
+        generateHtml(walineArray)
+    }).catch(
+        $asideList.innerHTML = "无法获取评论，请确认相关配置是否正确"
+    )
+}
+
+const generateHtml = array => {
+    const $dom = document.querySelector('#card-newest-comments .aside-list')
+    $dom.innerHTML = array.length ? array.map(item => `
+    <div class='aside-list-item'>
+      <a href='${item.url}' class='thumbnail'>
+        <img src='${item.avatar}' alt='${item.nick}'>
+        <div class='name'><span>${item.nick}</span></div>
+      </a>
+      <div class='content'>
+        <a class='comment' href='${item.url}'>${item.content}</a>
+        <time class="datetime" datetime="${item.date}"></time>
+      </div>
+    </div>
+  `).join('') : '没有评论'
+    window.lazyLoadInstance && window.lazyLoadInstance.update()
+    window.pjax && window.pjax.refresh($dom)
+    changeTimeFormat()
+}

package/source/js/main.js

@@ -846,7 +846,7 @@ let sco = {
 
         pageText.addEventListener("keydown", (event) => {
             if (event.keyCode === 13) {
-                heo.toPage();
+                sco.toPage();
                 pjax.loadUrl(pageButton.href);
             }
         });
@@ -881,7 +881,29 @@ let sco = {
                 cookiesWindow.style.display = 'none';
             }
         }
-    }
+    },
+    /**
+     * 首页分页跳转
+     */
+    toPage: function () {
+        const pageNumbers = document.querySelectorAll(".page-number");
+        const maxPageNumber = parseInt(pageNumbers[pageNumbers.length - 1].innerHTML);
+        const inputElement = document.getElementById("toPageText");
+        const inputPageNumber = parseInt(inputElement.value);
+
+        if (!isNaN(inputPageNumber) && inputPageNumber > 0 && inputPageNumber <= maxPageNumber) {
+            const currentPageUrl = window.location.href.replace(/\/page\/\d+\/$/, "/");
+            let targetPageUrl;
+
+            if (inputPageNumber === 1) {
+                targetPageUrl = currentPageUrl;
+            } else {
+                targetPageUrl = currentPageUrl + (currentPageUrl.endsWith("/") ? "" : "/") + "page/" + inputPageNumber + "/";
+            }
+
+            document.getElementById("toPageButton").href = targetPageUrl;
+        }
+    },
 }
 
 /*
@@ -889,63 +911,64 @@ let sco = {
  */
 class hightlight {
     static createEle(langEl, item) {
-        const fragment = document.createDocumentFragment();
-        const highlightCopyEle = '<i class="scoicon sco-copy-fill"></i>';
-        const highlightExpandEle = '<i class="scoicon sco-arrow-down expand" style="font-size: 16px"></i>';
+        const fragment = document.createDocumentFragment()
+        const highlightCopyEle = '<i class="scoicon sco-copy-fill"></i>'
+        const highlightExpandEle = '<i class="scoicon sco-arrow-down expand" style="font-size: 16px"></i>'
 
-        const hlTools = document.createElement('div');
-        hlTools.className = 'highlight-tools';
-        hlTools.innerHTML = `${highlightExpandEle}${langEl}${highlightCopyEle}`;
-
-        const itemHeight = item.clientHeight;
-        const $table = item.querySelector('table');
-        const $expand = item.getElementsByClassName('code-expand-btn');
-
-        let expand = true;
-        hlTools.children[0].addEventListener('click', () => {
-            expand = !expand;
-            hlTools.children[0].classList.toggle('closed');
-            $table.style.display = expand ? 'none' : 'block';
-            if ($expand.length !== 0) {
-                $expand[0].style.display = expand ? 'none' : 'block';
-            }
-            if (!expand) {
-                $table.style.height = itemHeight < 200 ? 'auto' : '200px';
-                if (itemHeight >= 200) {
-                    item.classList.remove("expand-done");
+        const hlTools = document.createElement('div')
+        hlTools.className = `highlight-tools`
+        hlTools.innerHTML = highlightExpandEle + langEl + highlightCopyEle
+        let expand = true
+        hlTools.children[0].addEventListener('click', (e) => {
+            if (expand) {
+                hlTools.children[0].classList.add('closed')
+                $table.setAttribute('style', 'display:none')
+                if ($expand.length !== 0) {
+                    $expand[0].setAttribute('style', 'display:none')
+                }
+            } else {
+                hlTools.children[0].classList.remove('closed')
+                $table.setAttribute('style', 'display:block')
+                if ($expand.length !== 0) {
+                    $expand[0].setAttribute('style', 'display:block')
+                }
+                if (itemHeight < 200) {
+                    $table.setAttribute('style', 'height: auto')
+                } else {
+                    $table.setAttribute('style', 'height:200px')
+                    ele.classList.remove("expand-done")
                 }
             }
-        });
-
-        hlTools.children[2].addEventListener('click', () => {
-            utils.copy($table.querySelector('.code').innerText);
-        });
-
-        fragment.appendChild(hlTools);
-
+            expand = !expand
+        })
+        hlTools.children[2].addEventListener('click', (e) => {
+            utils.copy($table.querySelector('.code').innerText)
+        })
+        const ele = document.createElement('div')
+        fragment.appendChild(hlTools)
+        const itemHeight = item.clientHeight, $table = item.querySelector('table'),
+            $expand = item.getElementsByClassName('code-expand-btn')
         if (GLOBAL_CONFIG.hightlight.limit && itemHeight > GLOBAL_CONFIG.hightlight.limit + 30) {
-            $table.style.height = `${GLOBAL_CONFIG.hightlight.limit}px`;
-            const ele = document.createElement('div');
-            ele.className = 'code-expand-btn';
-            ele.innerHTML = '<i class="scoicon sco-show-line" style="font-size: 1.2rem"></i>';
+            $table.setAttribute('style', `height: ${GLOBAL_CONFIG.hightlight.limit}px`)
+            ele.className = 'code-expand-btn'
+            ele.innerHTML = '<i class="scoicon sco-show-line" style="font-size: 1.2rem"></i>'
             ele.addEventListener('click', (e) => {
-                $table.style.height = `${itemHeight}px`;
-                const target = e.target.className !== 'code-expand-btn' ? e.target.parentNode : e.target;
-                target.classList.add('expand-done');
-            });
-            fragment.appendChild(ele);
+                $table.setAttribute('style', `height: ${itemHeight}px`)
+                e.target.className !== 'code-expand-btn' ? e.target.parentNode.classList.add('expand-done') : e.target.classList.add('expand-done')
+            })
+            fragment.appendChild(ele)
         }
-        item.insertBefore(fragment, item.firstChild);
+        item.insertBefore(fragment, item.firstChild)
     }
 
     static init() {
-        const $figureHighlight = document.querySelectorAll('figure.highlight');
-        $figureHighlight.forEach(item => {
-            let langName = item.classList[1] || 'Code';
-            if (langName === 'plaintext') langName = 'Code';
-            const highlightLangEle = `<div class="code-lang">${langName.toUpperCase()}</div>`;
-            this.createEle(highlightLangEle, item);
-        });
+        const $figureHighlight = document.querySelectorAll('figure.highlight'), that = this
+        $figureHighlight.forEach(function (item) {
+            let langName = item.getAttribute('class').split(' ')[1]
+            if (langName === 'plaintext' || langName === undefined) langName = 'Code'
+            const highlightLangEle = `<div class="code-lang">${langName.toUpperCase()}</div>`
+            that.createEle(highlightLangEle, item)
+        })
     }
 }
 
@@ -1005,7 +1028,6 @@ window.refreshFn = () => {
     GLOBAL_CONFIG.lazyload.enable && sco.lazyloadImg()
     GLOBAL_CONFIG.lightbox && sco.lightbox('')
     GLOBAL_CONFIG.randomlinks && randomLinksList()
-    GLOBAL_CONFIG.comment.enable && newestCommentInit()
     if (PAGE_CONFIG.comment) {
         initComment()
     }
@@ -1022,7 +1044,10 @@ window.refreshFn = () => {
     sco.initConsoleState()
     if (document.getElementById('history-baidu')) sco.card_history() // 那年今日
     if (document.getElementById('welcome-info')) sco.card_welcome() // 个性定位
-    if (GLOBAL_CONFIG.comment.type === "twikoo" && PAGE_CONFIG.comment) initializeCommentBarrage() // 热评
+    GLOBAL_CONFIG.comment.enable && newestCommentInit() // 最新评论
+    if (GLOBAL_CONFIG.comment.type === "twikoo" && PAGE_CONFIG.comment) {
+        initializeCommentBarrage() // 热评
+    }
 }
 
 sco.initTheme()