Merge pull request #224 from zkz098/refactor_comment

Refactor comment
theme-shoka-x · Feb 4, 2024 · dbeed09 · dbeed09
2 parents e918185 + b4c80db
commit dbeed09
Show file tree

Hide file tree

Showing 12 changed files with 92 additions and 90 deletions.
diff --git a/layout/_mixin/comment.pug b/layout/_mixin/comment.pug
@@ -1,41 +1,6 @@
 mixin CommentRender()
     != shokax_inject('comment')
-    - var tk = theme?.twikoo?.enable,wl = theme?.waline?.enable
-    if page.comment !== false && !theme.experiments.disableThemeComment
-        if tk
-            div(class="wrap" id="comments")
-            script(type="text/javascript" data-pjax).
-                setTimeout(function () {
-                    twikoo.init({
-                        envId: '#{ theme.twikoo.envId }',
-                        el: '#comments',
-                        region: '#{theme.twikoo.region}'
-                    })
-                }, 1000)
-        else if wl
-            div(class="wrap" id="comments")
-            - var locale = JSON.stringify(theme.waline.locale)
-            - var emoji = JSON.stringify(theme.waline.emoji)
-            - var meta = JSON.stringify(theme.waline.meta)
-            - var requiredMeta = JSON.stringify(theme.waline.requiredMeta)
-            script(type="module" data-pjax).
-                import { init } from 'https://npm.webcache.cn/@waline/client@v2/dist/waline.mjs';
-
-                setTimeout(function () {
-                    init({
-                        el: '#comments',
-                        serverURL: '#{theme.waline.serverURL.replace(/\/+$/, '')}',
-                        lang: '#{theme.waline.lang}',
-                        locale: !{locale},
-                        emoji: !{emoji},
-                        meta: !{meta},
-                        requiredMeta: !{requiredMeta},
-                        wordLimit: #{theme.waline.wordLimit},
-                        pageSize: #{theme.waline.pageSize},
-                        pageview: #{theme.waline.pageview},
-                        path: window.location.pathname,
-                        dark: 'html[data-theme="dark"]'
-                    });
-                }, 1000)
+    if page.comment !== false
+        div(class="wrap" id="comments")
 
 
diff --git a/layout/_partials/head/head.pug b/layout/_partials/head/head.pug
@@ -50,8 +50,6 @@ if theme.polyfill.enable
 != _js('siteInit.js')
 
 include pwa.pug
-if tk
-    script(src=theme.twikoo.link )
 else if wl
     link(rel="stylesheet" href="https://npm.webcache.cn/@waline/client@v2/dist/waline.css" media="none" onload="this.media='all'")
 

diff --git a/layout/_partials/layout.pug b/layout/_partials/layout.pug
@@ -82,6 +82,7 @@ html(lang=page.language?page.language:config.language, style=theme.grayMode ? 'f
 
         script(data-config type="text/javascript").
             var LOCAL = {
+                ispost: !{is_post()},
                     path: `#{_permapath(page.path)}`,
                     favicon: {
                     show: `#{__('favicon.show')}`,

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "hexo-theme-shokax",
-    "version": "0.4.0-alpha.2",
+    "version": "0.4.0-alpha.3",
     "description": "a hexo theme based on shoka",
     "main": "index.js",
     "repository": "https://github.com/theme-shoka-x/hexo-theme-shokaX",
@@ -43,7 +43,7 @@
         "quicklink": "^2.3.0",
         "theme-shokax-anime": "^0.0.6",
         "theme-shokax-pjax": "^0.0.3",
-        "twikoo": "github:twikoojs/twikoo",
+        "twikoo": "^1.6.31",
         "unlazy": "^0.10.4"
     },
     "engines": {

diff --git a/scripts/generaters/script.ts b/scripts/generaters/script.ts
@@ -44,7 +44,22 @@ hexo.extend.generator.register('script', function (locals) {
     audio: undefined,
     fireworks: (theme.fireworks && theme.fireworks.enable && theme.fireworks.options)
       ? theme.fireworks.options
-      : undefined
+      : undefined,
+    waline: {
+      serverURL: theme.waline.serverURL,
+      lang: theme.waline.lang,
+      locale: theme.waline.locale,
+      emoji: theme.waline.emoji,
+      meta: theme.waline.meta,
+      requiredMeta: theme.waline.requiredMeta,
+      wordLimit: theme.waline.wordLimit,
+      pageSize: theme.waline.pageSize,
+      pageview: theme.waline.pageview
+    },
+    twikoo: {
+      envId: theme.twikoo.envId,
+      region: theme.twikoo.region
+    },
   }
 
   if (config?.algolia) {
@@ -97,8 +112,10 @@ hexo.extend.generator.register('script', function (locals) {
       __shokax_tabs__: theme.modules.tabs ? 'true' : 'false',
       __shokax_quiz__: theme.modules.quiz ? 'true' : 'false',
       __shokax_fancybox__: theme.modules.fancybox ? 'true' : 'false',
+      __shokax_waline__: theme.waline.enable ? 'true' : 'false',
+      __shokax_twikoo__: theme.twikoo.enable ? 'true' : 'false',
       shokax_CONFIG: JSON.stringify(siteConfig),
-      shokax_siteURL: `\`${config.url}\``
+      shokax_siteURL: "'" + config.url + "'"
     },
     alias: {
       'algoliasearch/lite': 'algoliasearch/dist/algoliasearch-lite.esm.browser.js'

diff --git a/scripts/helpers/asset.ts b/scripts/helpers/asset.ts
@@ -5,43 +5,9 @@ import theme_env from '../../package.json'
 import { htmlTag, url_for, stripHTML } from 'hexo-util'
 import { getVendorLink } from '../utils'
 
+// TODO 弃用函数
 hexo.extend.helper.register('_new_comments', function (mode) {
-  const root = this.config.url.replace(/^(https?:\/\/)?[^\/]*/, '')
-  if (mode === 'twikoo') {
-    return `<script data-pjax type="module">
-            let comments = []
-           twikoo.getRecentComments({
-           envId: "${hexo.theme.config?.twikoo?.envId}",
-           pageSize: 10
-           }).then(function (res) {
-                res.forEach(function (item) {
-                    let cText = item.commentText
-                    if (item.commentText.length > 50) {
-                        cText = item.commentText.substring(0,50)+'...'
-                    }
-                    const siteLink = item.url + "#" + item.id
-                    comments.push({
-                        href: siteLink,
-                        nick: item.nick,
-                        time: item.relativeTime,
-                        text: cText
-                    })
-                });
-                Vue.createApp({
-                  data() {
-                      return {
-                          coms: comments,
-                          root: '${root}'
-                      }
-                  }
-                  }).mount('#new-comment')
-            }).catch(function (err) {
-                console.error(err)
-            })
-        </script>`
-  } else {
-    console.log(`${mode} is not supported recent comment`)
-  }
+  return ''
 })
 
 hexo.extend.helper.register('_safedump', (source) => {

diff --git a/source/js/_app/components/comments.ts b/source/js/_app/components/comments.ts
@@ -1,5 +1,6 @@
 import { CONFIG } from '../globals/globalVars'
 import { init, pageviewCount, RecentComments } from '@waline/client'
+
 import { createApp } from 'vue'
 
 // await import('@waline/client/style')

diff --git a/source/js/_app/components/tcomments.ts b/source/js/_app/components/tcomments.ts
@@ -0,0 +1,41 @@
+import twikoo from 'twikoo'
+import { CONFIG } from '../globals/globalVars'
+import { createApp } from 'vue'
+
+export const twikooComment = function () {
+  twikoo.init({
+    envId: CONFIG.twikoo.envId,
+    el: '#comments',
+    region: CONFIG.twikoo.region
+  })
+}
+
+export const twikooRecentComments = async function () {
+  let comments = []
+  const root = shokax_siteURL.replace(/^(https?:\/\/)?[^/]*/, '')
+  const res = await twikoo.getRecentComments({
+    envId: CONFIG.twikoo.envId,
+    pageSize: 10
+  })
+  res.forEach(function (item) {
+    let cText = item.commentText
+    if (item.commentText.length > 50) {
+      cText = item.commentText.substring(0, 50) + '...'
+    }
+    const siteLink = item.url + '#' + item.id
+    comments.push({
+      href: siteLink,
+      nick: item.nick,
+      time: item.relativeTime,
+      text: cText
+    })
+  })
+  createApp({
+    data () {
+      return {
+        coms: comments,
+        root
+      }
+    }
+  }).mount('#new-comment')
+}
diff --git a/source/js/_app/library/declare.d.ts b/source/js/_app/library/declare.d.ts
@@ -30,6 +30,7 @@ declare interface EventTarget {
 type walineMeta = 'nick'|'mail'|'link'
 
 declare const LOCAL: {
+  ispost: boolean;
   path: string;
   ignores: Array<(uri:string)=>boolean>;
   audio: string[];
@@ -105,6 +106,10 @@ interface configType {
     pageSize: number
     pageview: boolean
   }
+  twikoo: {
+    envId: string
+    region: string
+  }
   walinePageView: boolean
   quicklink: {
     ignores: any
@@ -123,5 +128,6 @@ declare const __shokax_tabs__: boolean
 declare const __shokax_quiz__: boolean
 declare const __shokax_fancybox__: boolean
 declare const __shokax_waline__:boolean
+declare const __shokax_twikoo__:boolean
 declare const shokax_CONFIG:configType
 declare const shokax_siteURL:string
diff --git a/source/js/_app/library/proto.ts b/source/js/_app/library/proto.ts
@@ -37,9 +37,9 @@ export const createChild = function (parent: HTMLElement, tag: string, obj: obje
 export const wrapObject = function (parent: HTMLElement, obj: any): void {
   const box = document.createElement('div')
   Object.assign(box, obj)
-  parent.insertBefore(box, obj)
-  parent.removeChild(obj)
-  box.appendChild(obj)
+  parent.parentNode.insertBefore(box, parent)
+  parent.parentNode.removeChild(parent)
+  box.appendChild(parent)
 }
 
 export const getHeight = function (el: HTMLElement): number {

diff --git a/source/js/_app/pjax/refresh.ts b/source/js/_app/pjax/refresh.ts
@@ -57,6 +57,21 @@ export const siteRefresh = (reload) => {
     postBeauty()
   })
 
+  if (__shokax_waline__ && LOCAL.ispost) {
+    import('../components/comments').then(async ({ walineComment, walinePageview, walineRecentComments }) => {
+      walineComment()
+      walinePageview()
+      await walineRecentComments()
+    })
+  }
+
+  if (__shokax_twikoo__ && LOCAL.ispost) {
+    import('../components/tcomments').then(async ({ twikooComment, twikooRecentComments }) => {
+      twikooComment()
+      await twikooRecentComments()
+    })
+  }
+
   if (__shokax_tabs__) {
     tabFormat()
   }

diff --git a/source/js/_app/pjax/siteInit.ts b/source/js/_app/pjax/siteInit.ts
@@ -49,14 +49,6 @@ const siteInit = () => {
   }
   lazyLoad()
 
-  if (__shokax_waline__) {
-    import('../components/comments').then(async ({ walineComment, walinePageview, walineRecentComments }) => {
-      walineComment()
-      walinePageview()
-      await walineRecentComments()
-    })
-  }
-
   window.addEventListener('scroll', scrollHandle)
 
   window.addEventListener('resize', resizeHandle)