hexo-theme-shokax 0.4.25 → 0.5.0-beta1

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

@@ -1,11 +1,10 @@
 import { pageScroll } from '../library/anime'
-import { $dom } from '../library/dom'
 import { createChild } from '../library/proto'
 
 export const tabFormat = () => {
   // tab
   let first_tab:boolean
-  $dom.each('div.tab', (element) => {
+  document.querySelectorAll('div.tab').forEach((element) => {
     if (element.getAttribute('data-ready')) { return }
 
     const id = element.getAttribute('data-id')
@@ -41,17 +40,17 @@ export const tabFormat = () => {
     })
 
     if (first_tab) {
-      li.addClass('active')
-      element.addClass('active')
+      li.classList.add('active')
+      element.classList.add('active')
     }
 
     li.addEventListener('click', (event) => {
-      const target = event.currentTarget
-      box.find('.active').forEach((el) => {
-        el.removeClass('active')
+      const target = event.currentTarget as HTMLElement
+      box.querySelectorAll('.active').forEach((el) => {
+        el.classList.remove('active')
       })
-      element.addClass('active')
-      target.addClass('active')
+      element.classList.add('active')
+      target.classList.add('active')
     })
 
     box.appendChild(element)

package/source/js/_app/pjax/domInit.ts

@@ -5,20 +5,17 @@ import {
   loadCat,
   menuToggle,
   quickBtn, setBackToTop, setGoToComment, setShowContents, setToolBtn,
-  setToolPlayer,
   showContents,
   siteHeader,
   siteNav,
-  toolBtn,
-  toolPlayer
+  toolBtn
 } from '../globals/globalVars'
 import { Loader } from '../globals/thirdparty'
-import { $dom } from '../library/dom'
-import { mediaPlayer } from '../player'
 import { createChild } from '../library/proto'
+import { initAudioPlayer } from '../player'
 
-export default function domInit () {
-  $dom.each('.overview .menu > .item', (el) => {
+export default async function domInit () {
+  document.querySelectorAll('.overview .menu > .item').forEach((el) => {
     siteNav.querySelector('.menu').appendChild(el.cloneNode(true))
   })
 
@@ -32,11 +29,22 @@ export default function domInit () {
   if (!toolBtn) {
     setToolBtn(createChild(siteHeader, 'div', {
       id: 'tool',
-      innerHTML: '<div class="item player"></div><div class="item contents"><i class="ic i-list-ol"></i></div><div class="item chat"><i class="ic i-comments"></i></div><div class="item back-to-top"><i class="ic i-arrow-up"></i><span>0%</span></div>'
+      innerHTML: `<div class="item player">
+                    ${__shokax_player__ ? '<div class="play-pause btn" id="playBtn"></div><div class="music btn btn" id="showBtn"></div>' : ''}
+                  </div>
+                  <div class="item contents">
+                    <i class="ic i-list-ol"></i>
+                  </div>
+                  <div class="item chat">
+                    <i class="ic i-comments"></i>
+                  </div>
+                  <div class="item back-to-top">
+                    <i class="ic i-arrow-up"></i>
+                    <span>0%</span>
+                  </div>`
     }))
   }
 
-  setToolPlayer(toolBtn.querySelector('.player'))
   setBackToTop(toolBtn.querySelector('.back-to-top'))
   setGoToComment(toolBtn.querySelector('.chat'))
   setShowContents(toolBtn.querySelector('.contents'))
@@ -46,12 +54,9 @@ export default function domInit () {
   showContents.addEventListener('click', sideBarToggleHandle)
 
   if (__shokax_player__) {
-    mediaPlayer(toolPlayer)
-
-    document.querySelector('main').addEventListener('click', () => {
-      toolPlayer.player.mini()
-    })
+    await initAudioPlayer()
   }
+  
 
   const createIntersectionObserver = () => {
     // waves在视口外时停止动画

package/source/js/_app/pjax/refresh.ts

@@ -1,37 +1,13 @@
-import { $dom } from '../library/dom'
 import { cardActive } from '../page/common'
-import { pageScroll, transition } from '../library/anime'
-import { vendorCss, vendorJs } from '../library/loadFile'
-import { pjaxScript } from '../library/scriptPjax'
 import { resizeHandle } from '../globals/handles'
 import {
   CONFIG,
-  loadCat,
-  menuToggle,
   setLocalHash, setLocalUrl, setOriginTitle,
-  sideBar,
-  toolPlayer
 } from '../globals/globalVars'
-import { pagePosition, positionInit } from '../globals/tools'
+import { positionInit } from '../globals/tools'
 import { menuActive, sideBarTab, sidebarTOC } from '../components/sidebar'
 import { Loader, isOutime } from '../globals/thirdparty'
 import { tabFormat } from '../page/tab'
-import { lazyLoad } from 'unlazy'
-
-export const pjaxReload = () => {
-  pagePosition()
-
-  if (sideBar.hasClass('on')) {
-    transition(sideBar, 0, () => {
-      sideBar.removeClass('on')
-      menuToggle.removeClass('close')
-    }) // 'transition.slideRightOut'
-  }
-  const mainNode = document.getElementById('main')
-  mainNode.innerHTML = ''
-  mainNode.appendChild(loadCat.lastChild.cloneNode(true))
-  pageScroll(0)
-}
 
 export const siteRefresh = async (reload) => {
   if (__shokax_antiFakeWebsite__) {
@@ -45,9 +21,9 @@ export const siteRefresh = async (reload) => {
   setLocalHash(0)
   setLocalUrl(window.location.href)
 
-  vendorCss('katex');
+  // @ts-ignore
+  // await import('katex/dist/katex.min.css')
   await import('katex/dist/contrib/copy-tex.mjs')
-  vendorCss('mermaid')
 
   // 懒加载背景图
   const lazyBg = new IntersectionObserver(function (entries, observer) {
@@ -67,10 +43,6 @@ export const siteRefresh = async (reload) => {
     lazyBg.observe(el)
   })
 
-  if (reload !== 1) {
-    $dom.each('script[data-pjax]', pjaxScript)
-  }
-
   setOriginTitle(document.title)
 
   resizeHandle()
@@ -111,8 +83,6 @@ export const siteRefresh = async (reload) => {
     comment.observe(cpel)
   }
 
-  lazyLoad()
-
   if (__shokax_waline__) {
     import('../components/comments').then(async ({walineRecentComments}) => {
       await walineRecentComments()
@@ -129,10 +99,12 @@ export const siteRefresh = async (reload) => {
     tabFormat()
   }
 
-  if (__shokax_player__) {
-    toolPlayer.player.load(LOCAL.audio || CONFIG.audio || {})
+  if (sessionStorage.getItem('loaded') === 'true') {
+    Loader.hide(30)
+  } else {
+    sessionStorage.setItem('loaded', 'true')
+    Loader.hide(500)
   }
-  Loader.hide(100)
 
   setTimeout(() => {
     positionInit()

package/source/js/_app/pjax/siteInit.ts

@@ -1,37 +1,18 @@
 import domInit from './domInit'
-import { pjaxReload, siteRefresh } from './refresh'
-import { cloudflareInit } from '../components/cloudflare'
-import { BODY, CONFIG, pjax, setPjax, setSiteSearch, siteSearch } from '../globals/globalVars'
-import { autoDarkmode, themeColorListener } from '../globals/themeColor'
-import { resizeHandle, scrollHandle, visibilityListener } from '../globals/handles'
-import { pagePosition } from '../globals/tools'
-import Pjax from 'theme-shokax-pjax'
-import { initVue } from '../library/vue'
-import { $dom } from '../library/dom'
-import { createChild } from '../library/proto'
-import { transition } from '../library/anime'
+import {siteRefresh} from './refresh'
+import {cloudflareInit} from '../components/cloudflare'
+import {BODY, CONFIG, setSiteSearch, siteSearch} from '../globals/globalVars'
+import {autoDarkmode, themeColorListener} from '../globals/themeColor'
+import {resizeHandle, scrollHandle, visibilityListener} from '../globals/handles'
+import {pagePosition} from '../globals/tools'
+import {initVue} from '../library/vue'
+import {createChild} from '../library/proto'
+import {transition} from '../library/anime'
 
 const siteInit = async () => {
   initVue()
   domInit()
 
-  setPjax(new Pjax({
-    selectors: [
-      'head title',
-      '.languages',
-      '.twikoo',
-      '.pjax',
-      '.leancloud-recent-comment',
-      'script[data-config]'
-    ],
-    cacheBust: false
-  }))
-
-  CONFIG.quicklink.ignores = LOCAL.ignores
-  import('quicklink').then(({listen}) => {
-    listen(CONFIG.quicklink)
-  })
-
   autoDarkmode()
 
   if (__shokax_VL__) {
@@ -53,19 +34,16 @@ const siteInit = async () => {
       }
 
       import('../page/search').then(({algoliaSearch}) => {
-        algoliaSearch(pjax)
+        algoliaSearch()
       })
 
       // Handle and trigger popup window
-      // TODO search 只有一个，不需要 each
-      $dom.each('.search', (element) => {
-        element.addEventListener('click', () => {
+      document.querySelector('.search').addEventListener('click', () => {
           document.body.style.overflow = 'hidden'
           transition(siteSearch, 'shrinkIn', () => {
             (document.querySelector('.search-input') as HTMLInputElement).focus()
           }) // transition.shrinkIn
         })
-      })
     }, {once: true, capture: true})
   }
 
@@ -83,18 +61,11 @@ const siteInit = async () => {
     passive: true
   })
 
-  window.addEventListener('pjax:send', pjaxReload, {
-    passive: true
-  })
-
-  window.addEventListener('pjax:success', siteRefresh, {
-    passive: true
-  }) // 默认会传入一个event参数
-
-  window.addEventListener('beforeunload', () => {
+  window.addEventListener('visibilitychange', () => {
     pagePosition()
   })
   await siteRefresh(1)
+  // TODO 修复内页跳转后重复出现加载动画的问题
 }
 
 cloudflareInit()