hexo-theme-shokax 0.4.6-dev5 → 0.4.6

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

@@ -1,115 +1,115 @@
-import { BODY, CONFIG, setSiteSearch, siteSearch } from '../globals/globalVars'
-import { transition } from '../library/anime'
-import { $dom } from '../library/dom'
-import { searchBox, configure, stats, hits, pagination } from 'instantsearch.js/es/widgets'
-import type { HitHighlightResult } from 'instantsearch.js/es/types/results'
-import instantsearch from 'instantsearch.js'
-import algoliasearch from 'algoliasearch/lite'
-
-export function algoliaSearch (pjax) {
-  const search = instantsearch({
-    indexName: CONFIG.search.indexName,
-    searchClient: algoliasearch(CONFIG.search.appID, CONFIG.search.apiKey),
-    // TODO 移除弃用函数
-    searchFunction (helper) {
-      const searchInput = document.querySelector('.search-input') as HTMLInputElement
-      if (searchInput.value) {
-        helper.search()
-      }
-    }
-  })
-
-  search.on('render', () => {
-    pjax.refresh(document.getElementById("search-hits"))
-  })
-
-  // Registering Widgets
-  search.addWidgets([
-    configure({
-      hitsPerPage: CONFIG.search.hits.per_page || 10
-    }),
-
-    searchBox({
-      container: '.search-input-container',
-      placeholder: LOCAL.search.placeholder,
-      // Hide default icons of algolia search
-      showReset: false,
-      showSubmit: false,
-      showLoadingIndicator: false,
-      cssClasses: {
-        input: 'search-input'
-      }
-    }),
-
-    stats({
-      container: '#search-stats',
-      templates: {
-        text (data) {
-          const stats = LOCAL.search.stats
-            .replace(/\$\{hits}/, data.nbHits.toString())
-            .replace(/\$\{time}/, data.processingTimeMS.toString())
-          return stats + '<span class="algolia-powered"></span><hr>'
-        }
-      }
-    }),
-
-    hits({
-      container: '#search-hits',
-      templates: {
-        item (data) {
-          const cats = data.categories ? '<span>' + data.categories.join('<i class="ic i-angle-right"></i>') + '</span>' : ''
-          return '<a href="' + CONFIG.root + data.path + '">' + cats + (data._highlightResult.title as HitHighlightResult).value + '</a>'
-        },
-        empty (data) {
-          return '<div id="hits-empty">' +
-            LOCAL.search.empty.replace(/\$\{query}/, data.query) +
-            '</div>'
-        }
-      },
-      cssClasses: {
-        item: 'item'
-      }
-    }),
-
-    pagination({
-      container: '#search-pagination',
-      scrollTo: false,
-      showFirst: false,
-      showLast: false,
-      templates: {
-        first: '<i class="ic i-angle-double-left"></i>',
-        last: '<i class="ic i-angle-double-right"></i>',
-        previous: '<i class="ic i-angle-left"></i>',
-        next: '<i class="ic i-angle-right"></i>'
-      },
-      cssClasses: {
-        root: 'pagination',
-        item: 'pagination-item',
-        link: 'page-number',
-        selectedItem: 'current',
-        disabledItem: 'disabled-item'
-      }
-    })
-  ])
-
-  search.start()
-
-  // Monitor main search box
-  const onPopupClose = () => {
-    document.body.style.overflow = ''
-    transition(siteSearch, 0) // "transition.shrinkOut"
-  }
-
-  siteSearch.addEventListener('click', (event) => {
-    if (event.target === siteSearch) {
-      onPopupClose()
-    }
-  })
-  document.querySelector('.close-btn').addEventListener('click', onPopupClose)
-  window.addEventListener('pjax:success', onPopupClose)
-  window.addEventListener('keyup', (event) => {
-    if (event.key === 'Escape') {
-      onPopupClose()
-    }
-  })
-}
+import { BODY, CONFIG, setSiteSearch, siteSearch } from '../globals/globalVars'
+import { transition } from '../library/anime'
+import { $dom } from '../library/dom'
+import { searchBox, configure, stats, hits, pagination } from 'instantsearch.js/es/widgets'
+import type { HitHighlightResult } from 'instantsearch.js/es/types/results'
+import instantsearch from 'instantsearch.js'
+import algoliasearch from 'algoliasearch/lite'
+
+export function algoliaSearch (pjax) {
+  const search = instantsearch({
+    indexName: CONFIG.search.indexName,
+    searchClient: algoliasearch(CONFIG.search.appID, CONFIG.search.apiKey),
+    // TODO 移除弃用函数
+    searchFunction (helper) {
+      const searchInput = document.querySelector('.search-input') as HTMLInputElement
+      if (searchInput.value) {
+        helper.search()
+      }
+    }
+  })
+
+  search.on('render', () => {
+    pjax.refresh(document.getElementById("search-hits"))
+  })
+
+  // Registering Widgets
+  search.addWidgets([
+    configure({
+      hitsPerPage: CONFIG.search.hits.per_page || 10
+    }),
+
+    searchBox({
+      container: '.search-input-container',
+      placeholder: LOCAL.search.placeholder,
+      // Hide default icons of algolia search
+      showReset: false,
+      showSubmit: false,
+      showLoadingIndicator: false,
+      cssClasses: {
+        input: 'search-input'
+      }
+    }),
+
+    stats({
+      container: '#search-stats',
+      templates: {
+        text (data) {
+          const stats = LOCAL.search.stats
+            .replace(/\$\{hits}/, data.nbHits.toString())
+            .replace(/\$\{time}/, data.processingTimeMS.toString())
+          return stats + '<span class="algolia-powered"></span><hr>'
+        }
+      }
+    }),
+
+    hits({
+      container: '#search-hits',
+      templates: {
+        item (data) {
+          const cats = data.categories ? '<span>' + data.categories.join('<i class="ic i-angle-right"></i>') + '</span>' : ''
+          return '<a href="' + CONFIG.root + data.path + '">' + cats + (data._highlightResult.title as HitHighlightResult).value + '</a>'
+        },
+        empty (data) {
+          return '<div id="hits-empty">' +
+            LOCAL.search.empty.replace(/\$\{query}/, data.query) +
+            '</div>'
+        }
+      },
+      cssClasses: {
+        item: 'item'
+      }
+    }),
+
+    pagination({
+      container: '#search-pagination',
+      scrollTo: false,
+      showFirst: false,
+      showLast: false,
+      templates: {
+        first: '<i class="ic i-angle-double-left"></i>',
+        last: '<i class="ic i-angle-double-right"></i>',
+        previous: '<i class="ic i-angle-left"></i>',
+        next: '<i class="ic i-angle-right"></i>'
+      },
+      cssClasses: {
+        root: 'pagination',
+        item: 'pagination-item',
+        link: 'page-number',
+        selectedItem: 'current',
+        disabledItem: 'disabled-item'
+      }
+    })
+  ])
+
+  search.start()
+
+  // Monitor main search box
+  const onPopupClose = () => {
+    document.body.style.overflow = ''
+    transition(siteSearch, 0) // "transition.shrinkOut"
+  }
+
+  siteSearch.addEventListener('click', (event) => {
+    if (event.target === siteSearch) {
+      onPopupClose()
+    }
+  })
+  document.querySelector('.close-btn').addEventListener('click', onPopupClose)
+  window.addEventListener('pjax:success', onPopupClose)
+  window.addEventListener('keyup', (event) => {
+    if (event.key === 'Escape') {
+      onPopupClose()
+    }
+  })
+}

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

@@ -1,60 +1,60 @@
-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) => {
-    if (element.getAttribute('data-ready')) { return }
-
-    const id = element.getAttribute('data-id')
-    const title = element.getAttribute('data-title')
-    let box = document.getElementById(id)
-    if (!box) {
-      box = document.createElement('div')
-      box.className = 'tabs'
-      box.id = id
-      box.innerHTML = '<div class="show-btn"></div>'
-
-      const showBtn = box.querySelector('.show-btn')
-      showBtn.addEventListener('click', () => {
-        pageScroll(box)
-      })
-
-      element.parentNode.insertBefore(box, element)
-      first_tab = true
-    } else {
-      first_tab = false
-    }
-
-    let ul = box.querySelector('.nav ul')
-    if (!ul) {
-      ul = createChild(box, 'div', {
-        className: 'nav',
-        innerHTML: '<ul></ul>'
-      }).querySelector('ul')
-    }
-
-    const li = createChild(ul, 'li', {
-      innerHTML: title
-    })
-
-    if (first_tab) {
-      li.addClass('active')
-      element.addClass('active')
-    }
-
-    li.addEventListener('click', (event) => {
-      const target = event.currentTarget
-      box.find('.active').forEach((el) => {
-        el.removeClass('active')
-      })
-      element.addClass('active')
-      target.addClass('active')
-    })
-
-    box.appendChild(element)
-    element.setAttribute('data-ready', String(true))
-  })
-}
+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) => {
+    if (element.getAttribute('data-ready')) { return }
+
+    const id = element.getAttribute('data-id')
+    const title = element.getAttribute('data-title')
+    let box = document.getElementById(id)
+    if (!box) {
+      box = document.createElement('div')
+      box.className = 'tabs'
+      box.id = id
+      box.innerHTML = '<div class="show-btn"></div>'
+
+      const showBtn = box.querySelector('.show-btn')
+      showBtn.addEventListener('click', () => {
+        pageScroll(box)
+      })
+
+      element.parentNode.insertBefore(box, element)
+      first_tab = true
+    } else {
+      first_tab = false
+    }
+
+    let ul = box.querySelector('.nav ul')
+    if (!ul) {
+      ul = createChild(box, 'div', {
+        className: 'nav',
+        innerHTML: '<ul></ul>'
+      }).querySelector('ul')
+    }
+
+    const li = createChild(ul, 'li', {
+      innerHTML: title
+    })
+
+    if (first_tab) {
+      li.addClass('active')
+      element.addClass('active')
+    }
+
+    li.addEventListener('click', (event) => {
+      const target = event.currentTarget
+      box.find('.active').forEach((el) => {
+        el.removeClass('active')
+      })
+      element.addClass('active')
+      target.addClass('active')
+    })
+
+    box.appendChild(element)
+    element.setAttribute('data-ready', String(true))
+  })
+}

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

@@ -1,97 +1,97 @@
-import { backToTopHandle, goToBottomHandle, goToCommentHandle, sideBarToggleHandle } from '../components/sidebar'
-import {
-  backToTop,
-  goToComment,
-  loadCat,
-  menuToggle,
-  quickBtn, setBackToTop, setGoToComment, setShowContents, setToolBtn,
-  setToolPlayer,
-  showContents,
-  siteHeader,
-  siteNav,
-  toolBtn,
-  toolPlayer
-} from '../globals/globalVars'
-import { Loader } from '../globals/thirdparty'
-import { $dom } from '../library/dom'
-import { mediaPlayer } from '../player'
-import { createChild } from '../library/proto'
-
-export default function domInit () {
-  $dom.each('.overview .menu > .item', (el) => {
-    siteNav.querySelector('.menu').appendChild(el.cloneNode(true))
-  })
-
-  loadCat.addEventListener('click', Loader.vanish)
-  menuToggle.addEventListener('click', sideBarToggleHandle)
-  document.querySelector('.dimmer').addEventListener('click', sideBarToggleHandle)
-
-  quickBtn.querySelector('.down').addEventListener('click', goToBottomHandle)
-  quickBtn.querySelector('.up').addEventListener('click', backToTopHandle)
-
-  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>'
-    }))
-  }
-
-  setToolPlayer(toolBtn.querySelector('.player'))
-  setBackToTop(toolBtn.querySelector('.back-to-top'))
-  setGoToComment(toolBtn.querySelector('.chat'))
-  setShowContents(toolBtn.querySelector('.contents'))
-
-  backToTop.addEventListener('click', backToTopHandle)
-  goToComment.addEventListener('click', goToCommentHandle)
-  showContents.addEventListener('click', sideBarToggleHandle)
-
-  if (__shokax_player__) {
-    mediaPlayer(toolPlayer)
-
-    document.querySelector('main').addEventListener('click', () => {
-      toolPlayer.player.mini()
-    })
-  }
-
-  const createIntersectionObserver = () => {
-    // waves在视口外时停止动画
-    new IntersectionObserver(([entry]) => {
-      if (entry.isIntersecting) {
-        document.querySelectorAll('.parallax>use').forEach(i => {
-          i.classList.remove('stop-animation')
-        })
-        document.querySelectorAll('#imgs .item').forEach(i => {
-          i.classList.remove('stop-animation')
-        })
-      } else {
-        document.querySelectorAll('.parallax>use').forEach(i => {
-          i.classList.add('stop-animation')
-        })
-        // waves不可见时imgs也应该不可见了
-        document.querySelectorAll('#imgs .item').forEach(i => {
-          i.classList.add('stop-animation')
-        })
-      }
-    }, {
-      root: null,
-      threshold: 0.2
-    }).observe(document.getElementById('waves'))
-
-    // sakura在视口外时停止动画
-    new IntersectionObserver(([entry]) => {
-      if (entry.isIntersecting) {
-        document.querySelectorAll('.with-love>i').forEach(i => {
-          i.classList.remove('stop-animation')
-        })
-      } else {
-        document.querySelectorAll('.with-love>i').forEach(i => {
-          i.classList.add('stop-animation')
-        })
-      }
-    }, {
-      root: null,
-      threshold: 0.2
-    }).observe(document.querySelector('.with-love'))
-  }
-  createIntersectionObserver()
-}
+import { backToTopHandle, goToBottomHandle, goToCommentHandle, sideBarToggleHandle } from '../components/sidebar'
+import {
+  backToTop,
+  goToComment,
+  loadCat,
+  menuToggle,
+  quickBtn, setBackToTop, setGoToComment, setShowContents, setToolBtn,
+  setToolPlayer,
+  showContents,
+  siteHeader,
+  siteNav,
+  toolBtn,
+  toolPlayer
+} from '../globals/globalVars'
+import { Loader } from '../globals/thirdparty'
+import { $dom } from '../library/dom'
+import { mediaPlayer } from '../player'
+import { createChild } from '../library/proto'
+
+export default function domInit () {
+  $dom.each('.overview .menu > .item', (el) => {
+    siteNav.querySelector('.menu').appendChild(el.cloneNode(true))
+  })
+
+  loadCat.addEventListener('click', Loader.vanish)
+  menuToggle.addEventListener('click', sideBarToggleHandle)
+  document.querySelector('.dimmer').addEventListener('click', sideBarToggleHandle)
+
+  quickBtn.querySelector('.down').addEventListener('click', goToBottomHandle)
+  quickBtn.querySelector('.up').addEventListener('click', backToTopHandle)
+
+  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>'
+    }))
+  }
+
+  setToolPlayer(toolBtn.querySelector('.player'))
+  setBackToTop(toolBtn.querySelector('.back-to-top'))
+  setGoToComment(toolBtn.querySelector('.chat'))
+  setShowContents(toolBtn.querySelector('.contents'))
+
+  backToTop.addEventListener('click', backToTopHandle)
+  goToComment.addEventListener('click', goToCommentHandle)
+  showContents.addEventListener('click', sideBarToggleHandle)
+
+  if (__shokax_player__) {
+    mediaPlayer(toolPlayer)
+
+    document.querySelector('main').addEventListener('click', () => {
+      toolPlayer.player.mini()
+    })
+  }
+
+  const createIntersectionObserver = () => {
+    // waves在视口外时停止动画
+    new IntersectionObserver(([entry]) => {
+      if (entry.isIntersecting) {
+        document.querySelectorAll('.parallax>use').forEach(i => {
+          i.classList.remove('stop-animation')
+        })
+        document.querySelectorAll('#imgs .item').forEach(i => {
+          i.classList.remove('stop-animation')
+        })
+      } else {
+        document.querySelectorAll('.parallax>use').forEach(i => {
+          i.classList.add('stop-animation')
+        })
+        // waves不可见时imgs也应该不可见了
+        document.querySelectorAll('#imgs .item').forEach(i => {
+          i.classList.add('stop-animation')
+        })
+      }
+    }, {
+      root: null,
+      threshold: 0.2
+    }).observe(document.getElementById('waves'))
+
+    // sakura在视口外时停止动画
+    new IntersectionObserver(([entry]) => {
+      if (entry.isIntersecting) {
+        document.querySelectorAll('.with-love>i').forEach(i => {
+          i.classList.remove('stop-animation')
+        })
+      } else {
+        document.querySelectorAll('.with-love>i').forEach(i => {
+          i.classList.add('stop-animation')
+        })
+      }
+    }, {
+      root: null,
+      threshold: 0.2
+    }).observe(document.querySelector('.with-love'))
+  }
+  createIntersectionObserver()
+}