hexo-theme-shokax 0.5.0-beta2-dev-86064c8 → 0.5.0-beta2

package/README.md

@@ -20,7 +20,6 @@
 ## 📚子项目
 - [ShokaX docs](https://github.com/theme-shoka-x/shokaX-docs) ShokaX 主题文档 (正在编写中，欢迎加入！)
 - [HRMNMI](https://github.com/theme-shoka-x/hexo-renderer-multi-next-markdown-it) ShokaX 正在使用的 markdown 渲染器 (等待重构)
-- [ShokaX Pjax](https://github.com/theme-shoka-x/theme-shokax-pjax) ShokaX 提供的高效 Pjax 实现
 - [ShokaX Anime](https://github.com/theme-shoka-x/theme-shokax-anime) ShokaX 提供的精简版 Anime.js 实现
 
 # [许可证](https://github.com/theme-shoka-x/hexo-theme-shokaX/blob/main/LICENSE)

package/_config.yml

@@ -52,7 +52,6 @@ modules:
   visibilityListener: true # 启用可见度监听器
   tabs: true # 启用选项卡扩展支持，如需开启 summary 功能请一并开启
   quiz: true # 启用文章内问题扩展支持
-  fancybox: true # 启用 fancybox 支持（不建议禁用）
 
 # 优化性能区
 performance:
@@ -354,41 +353,13 @@ vendors:
   cdns:
     cdnjs: https://s4.zstatic.net/ajax/libs
   js:
-    jquery:
-      source: cdnjs
-      url: jquery/3.5.1/jquery.min.js
-      sri: "sha384-ZvpUoO/+PpLXR1lu4jmpXWu80pZlYUAfxl5NsBMWOEPSjUn/6Z/hRTt8+pR6L4N2"
-    fancybox:
-      source: cdnjs
-      url: fancybox/3.5.7/jquery.fancybox.min.js
-      sri: "sha384-Zm+UU4tdcfAm29vg+MTbfu//q5B/lInMbMCr4T8c9rQFyOv6PlfQYpB5wItcXWe7"
-    justifiedGallery:
-      source: cdnjs
-      url: justifiedGallery/3.8.1/js/jquery.justifiedGallery.min.js
-      sri: "sha384-TOxsBplaL96/QDWPIUg+ye3v89qSE3s22XNtJMmCeZEep3cVDmXy1zEfZvVv+y2m"
   async_js:
     copy_tex:
       source: cdnjs
       url: KaTeX/0.16.9/contrib/copy-tex.min.js
       sri: "sha384-ww/583aHhxWkz5DEVn6OKtNiIaLi2iBRNZXfJRiY1Ai7tnJ9UXpEsyvOITVpTl4A"
-    fancybox:
-      source: cdnjs
-      url: fancybox/3.5.7/jquery.fancybox.min.js
-      sri: "sha384-Zm+UU4tdcfAm29vg+MTbfu//q5B/lInMbMCr4T8c9rQFyOv6PlfQYpB5wItcXWe7"
-    justifiedGallery:
-      source: cdnjs
-      url: justifiedGallery/3.8.1/js/jquery.justifiedGallery.min.js
-      sri: "sha384-TOxsBplaL96/QDWPIUg+ye3v89qSE3s22XNtJMmCeZEep3cVDmXy1zEfZvVv+y2m"
   css:
     katex:
       source: cdnjs
       url: KaTeX/0.16.9/katex.min.css
       sri: "sha384-n8MVd4RsNIU0tAv4ct0nTaAbDJwPJzDEaqSD1odI+WdtXRGWt2kTvGFasHpSy3SV"
-    fancybox:
-      source: cdnjs
-      url: fancybox/3.5.7/jquery.fancybox.min.css
-      sri: "sha384-Q8BgkilbsFGYNNiDqJm69hvDS7NCJWOodvfK/cwTyQD4VQA0qKzuPpvqNER1UC0F"
-    justifiedGallery:
-      source: cdnjs
-      url: justifiedGallery/3.8.1/css/justifiedGallery.min.css
-      sri: "sha384-V/1Ew9pYm8xpy/L9i078ZXT6HSEOrGC6KNFYLbXOdtqb3+c6brpGqVzZtEPSQOiz"

package/layout/_partials/layout.pug

@@ -113,7 +113,6 @@ html(lang=page.language?page.language:config.language, style=theme.grayMode ? 'f
                 katex: #{!!page.math},
                 mermaid: #{!!page.mermaid},
                 audio: !{audioValue},
-                fancybox: #{page.fancybox !== false},
                 nocopy: #{!!page.nocopy},
                 outime: #{page.outime !== false},
                 template: `!{__('outime.template')}`,
@@ -131,10 +130,6 @@ html(lang=page.language?page.language:config.language, style=theme.grayMode ? 'f
         != partial('_partials/third-party/clarity.pug', {}, {cache: true})
         != partial('_partials/third-party/google-analytics.pug', {}, {cache: true})
 
-        != vendor_js('jquery')
-        != vendor_js('justifiedGallery')
-        != vendor_js('fancybox')
-
         if theme.polyfill.enable
             script(src=`https://cdnjs.cloudflare.com/polyfill/v3/polyfill.min.js?version=4.8.0&features=${theme.polyfill.features}` defer)
 

package/layout/page.pug

@@ -5,8 +5,6 @@ include _mixin/comment.pug
 block head
     != _css('post.css')
     // 临时处理
-    link(rel="stylesheet" media="none" onload="this.media='all'" href="https://s4.zstatic.net/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.css")
-    link(rel="stylesheet" media="none" onload="this.media='all'" href="https://s4.zstatic.net/ajax/libs/justifiedGallery/3.8.1/css/justifiedGallery.min.css")
     link(rel="stylesheet" media="none" onload="this.media='all'" href="https://s4.zstatic.net/ajax/libs/KaTeX/0.16.9/katex.min.css")
 
 block title

package/layout/post.pug

@@ -7,8 +7,6 @@ block head
     != _css('post.css')
     != _css('mermaid.css')
     // 临时处理
-    link(rel="stylesheet" media="none" onload="this.media='all'" href="https://s4.zstatic.net/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.css")
-    link(rel="stylesheet" media="none" onload="this.media='all'" href="https://s4.zstatic.net/ajax/libs/justifiedGallery/3.8.1/css/justifiedGallery.min.css")
     link(rel="stylesheet" media="none" onload="this.media='all'" href="https://s4.zstatic.net/ajax/libs/KaTeX/0.16.9/katex.min.css")
 
 block title

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "hexo-theme-shokax",
-    "version": "0.5.0-beta2-dev-86064c8",
+    "version": "0.5.0-beta2",
     "description": "a hexo theme based on shoka",
     "main": "index.js",
     "repository": "https://github.com/theme-shoka-x/hexo-theme-shokaX",
@@ -12,12 +12,9 @@
         "build": "node ./toolbox/compiler.mjs"
     },
     "devDependencies": {
-        "@types/fancybox": "^3.5.7",
-        "@types/jquery": "^3.5.32",
         "@types/js-yaml": "^4.0.9",
         "@types/katex": "^0.16.7",
         "@types/node": "^22.14.0",
-        "@types/quicklink": "^2.3.4",
         "@typescript-eslint/eslint-plugin": "^8.29.1",
         "@typescript-eslint/parser": "^8.29.1",
         "eslint": "^9.24.0",
@@ -34,6 +31,7 @@
         "dompurify": "^3.2.5",
         "es-toolkit": "^1.34.1",
         "esbuild": "^0.25.2",
+        "hana-img-viewer": "^1.2.1",
         "hexo": "^7.3.0",
         "hexo-algoliasearch": "^2.0.1",
         "hexo-feed": "^1.1.2",
@@ -48,7 +46,8 @@
         "nyx-player": "^0.0.2",
         "quicklink": "^2.3.0",
         "theme-shokax-anime": "^0.0.8",
-        "twikoo": "^1.6.42"
+        "twikoo": "^1.6.42",
+        "vue": "^3.5.13"
     },
     "engines": {
         "node": ">=20.0.0"

package/scripts/generaters/script.js

@@ -46,9 +46,7 @@ hexo.extend.generator.register("script", async function(locals) {
         url: theme.css + "/mermaid.css",
         local: true,
         sri: ""
-      },
-      fancybox: (0, import_utils.getVendorLink)(hexo, theme.vendors.css.fancybox),
-      justifiedGallery: (0, import_utils.getVendorLink)(hexo, theme.vendors.css.justifiedGallery)
+      }
     },
     loader: theme.loader,
     search: null,
@@ -127,7 +125,6 @@ hexo.extend.generator.register("script", async function(locals) {
       __shokax_outime__: theme.outime.enable ? "true" : "false",
       __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_antiFakeWebsite__: theme.experiments.antiFakeWebsite ? "true" : "false",

package/source/js/_app/components/sidebar.ts

@@ -108,14 +108,16 @@ export const sidebarTOC = () => {
     }
 
     document.querySelectorAll('.toc .active').forEach((element) => {
-      element && element.classList.remove('active current')
+      element && element.classList.remove('active')
+      element && element.classList.remove('current')
     })
 
     sections.forEach((element) => {
       element && element.classList.remove('active')
     })
 
-    target.classList.add('active current')
+    target.classList.add('active')
+    target.classList.add('current')
     sections[index] && sections[index].classList.add('active')
 
     let parent = <Element> target.parentNode

package/source/js/_app/globals/globalVars.ts

@@ -16,7 +16,7 @@ export const siteBrand = document.getElementById('brand')
 export let toolBtn = document.getElementById('tool')
 export let backToTop: HTMLElement
 export let goToComment
-export let showContents
+export let showContents: HTMLElement
 export let siteSearch = document.getElementById('search')
 export let siteNavHeight: number, headerHightInner: number, headerHight: number
 export let oWinHeight = window.innerHeight

package/source/js/_app/page/imageviewer.ts

@@ -0,0 +1,20 @@
+import DOMPurify from 'dompurify';
+import { HanaImgViewer } from 'hana-img-viewer'
+import { createApp } from 'vue';
+
+export const postImageViewer = (p: string) => {
+  document.querySelectorAll(`${p} .md img:not(.emoji):not(.vemoji)`).forEach((element) => {
+    const img = element as HTMLImageElement;
+    const imgSrc = DOMPurify.sanitize(img.dataset.src);
+
+    const wrapper = document.createElement('div');
+    console.log(wrapper)
+    img.replaceWith(wrapper);
+
+    console.log(imgSrc)
+    const app = createApp(HanaImgViewer, { src: imgSrc, maskOpacity: 0.8 });
+    console.log(app)
+    app.mount(wrapper);
+    console.log(app)
+  });
+};

package/source/js/_app/page/post.ts

@@ -1,4 +1,4 @@
-import { postFancybox } from './fancybox'
+import { postImageViewer } from './imageviewer'
 import { clipBoard, showtip } from '../globals/tools'
 import { CONFIG, BODY } from '../globals/globalVars'
 import { pageScroll, transition } from '../library/anime'
@@ -7,9 +7,7 @@ import { getDisplay, setDisplay, wrapObject } from '../library/proto'
 export const postBeauty = () => {
   if (!document.querySelector('.md')) { return }
 
-  if (__shokax_fancybox__) {
-    postFancybox('.post.block')
-  }
+  postImageViewer('.post.block');
 
   (document.querySelector('.post.block') as HTMLTextAreaElement).oncopy = (event) => {
     showtip(LOCAL.copyright)

package/source/js/_app/page/fancybox.ts

@@ -1,66 +0,0 @@
-import { insertAfter } from '../library/proto'
-import DOMPurify from 'dompurify';
-
-// TODO 使用PhotoSwipe替换Fancybox
-export const postFancybox = (p:string) => {
-  if (document.querySelector(p + ' .md img')) {
-    // vendorCss('fancybox')
-    // vendorCss('justifiedGallery')
-    document.querySelectorAll(p + ' p.gallery').forEach((element) => {
-      const box = document.createElement('div')
-      box.className = 'gallery'
-      box.setAttribute('data-height', String(element.getAttribute('data-height') || 220))
-
-      box.innerHTML = element.innerHTML.replace(/<br>/g, '')
-
-      element.parentNode.insertBefore(box, element)
-      element.remove()
-    })
-
-    document.querySelectorAll(p + ' .md img:not(.emoji):not(.vemoji)').forEach((element) => {
-      const $image = $(element)
-      const imageLink = DOMPurify.sanitize($image.attr('src')) // 替换
-      const $imageWrapLink = $image.wrap('<a class="fancybox" href="' + imageLink + '" itemscope itemtype="https://schema.org/ImageObject" itemprop="url"></a>').parent('a')
-      let info; let captionClass = 'image-info'
-      if (!$image.is('a img')) {
-        $image.data('safe-src', imageLink)
-        if (!$image.is('.gallery img')) {
-          $imageWrapLink.attr('data-fancybox', 'default').attr('rel', 'default')
-        } else {
-          captionClass = 'jg-caption'
-        }
-      }
-      if ((info = element.getAttribute('title'))) {
-        $imageWrapLink.attr('data-caption', info)
-        const para = document.createElement('span')
-        const txt = document.createTextNode(info)
-        para.appendChild(txt)
-        para.addClass(captionClass)
-        insertAfter(element, para)
-      }
-    })
-
-    document.querySelectorAll(p + ' div.gallery').forEach((el, i) => {
-      // @ts-ignore
-      $(el).justifiedGallery({
-        rowHeight: $(el).data('height') || 120,
-        rel: 'gallery-' + i
-      }).on('jg.complete', function () {
-        $(this).find('a').each((k, ele) => {
-          ele.setAttribute('data-fancybox', 'gallery-' + i)
-        })
-      })
-    })
-
-    $.fancybox.defaults.hash = false
-    $(p + ' .fancybox').fancybox({
-      loop: true,
-      // @ts-ignore
-      helpers: {
-        overlay: {
-          locked: false
-        }
-      }
-    })
-  }
-}