forked from RDCNWebs/rd.rdlevel.cn
203 lines
12 KiB
JavaScript
203 lines
12 KiB
JavaScript
/*
|
|
* @Author: pikapikapikaori pikapikapi_kaori@icloud.com
|
|
* @Date: 2023-04-30 12:57:52
|
|
* @LastEditors: pikapikapikaori pikapikapi_kaori@icloud.com
|
|
* @LastEditTime: 2023-05-05 22:29:02
|
|
* @FilePath: /pikapikapi-blog/docs/utils/countWords.js
|
|
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
|
*/
|
|
// default values
|
|
var switchLightDarkModeOptions = {
|
|
useSwitchMode: true,
|
|
top: 130,
|
|
right: 26,
|
|
svgColor: '#7d7b75',
|
|
}
|
|
|
|
const themeModes = ['light', 'dark', 'auto',]
|
|
|
|
var switchSpan = document.createElement('span')
|
|
|
|
switchSpan.id = 'switchLightDarkModeDivBeforeArticle'
|
|
switchSpan.classList.add('controlSpan')
|
|
switchSpan.style.position = 'fixed'
|
|
switchSpan.style.right = switchLightDarkModeOptions.right.toString() + 'px'
|
|
switchSpan.style.top = switchLightDarkModeOptions.top.toString() + 'px'
|
|
|
|
const lightModeIconXml = '<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="' + switchLightDarkModeOptions.svgColor + '"><path d="M12 18a6 6 0 100-12 6 6 0 000 12zM22 12h1M12 2V1M12 23v-1M20 20l-1-1M20 4l-1 1M4 20l1-1M4 4l1 1M1 12h1" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>'
|
|
const darkModeIconXml = '<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="' + switchLightDarkModeOptions.svgColor + '"><path d="M3 11.507a9.493 9.493 0 0018 4.219c-8.507 0-12.726-4.22-12.726-12.726A9.494 9.494 0 003 11.507z" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>'
|
|
const autoModeIconXml = '<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="' + switchLightDarkModeOptions.svgColor + '"><path d="M3 15c2.483 0 4.345-3 4.345-3s1.862 3 4.345 3c2.482 0 4.965-3 4.965-3s2.483 3 4.345 3M3 20c2.483 0 4.345-3 4.345-3s1.862 3 4.345 3c2.482 0 4.965-3 4.965-3s2.483 3 4.345 3M19 10a7 7 0 10-14 0" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>'
|
|
const zoomInIconXml = '<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" viewBox="0 0 24 24" stroke-width="1.5" fill="none" xmlns="http://www.w3.org/2000/svg" color="' + switchLightDarkModeOptions.svgColor + '"><path d="M8 11h3m3 0h-3m0 0V8m0 3v3M17 17l4 4M3 11a8 8 0 1016 0 8 8 0 00-16 0z" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>'
|
|
const zoomOutIconXml = '<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" viewBox="0 0 24 24" stroke-width="1.5" fill="none" xmlns="http://www.w3.org/2000/svg" color="' + switchLightDarkModeOptions.svgColor + '"><path d="M17 17l4 4M3 11a8 8 0 1016 0 8 8 0 00-16 0zM8 11h6" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>'
|
|
const zoomDefaultIconXml = '<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="' + switchLightDarkModeOptions.svgColor + '"><path d="M12 19a7 7 0 100-14 7 7 0 000 14zM12 19v2M5 12H3M12 5V3M19 12h2" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>'
|
|
const ottoIconXml = `
|
|
<?xml version="1.0" encoding="UTF-8"?>
|
|
<svg width="26px" height="30px" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 24 24" color="` + switchLightDarkModeOptions.svgColor + `" stroke="` + switchLightDarkModeOptions.svgColor + `" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
|
<path class="st0" d="M17.5,12.9c0,1-.1,1.8-1,1.8s-1.6-.8-1.6-1.8.7-1.8,1.6-1.8,1,.8,1,1.8Z"/>
|
|
<path class="st0" d="M17.5,19.1c0,1-.1,1.8-1,1.8s-1.6-.8-1.6-1.8.7-1.8,1.6-1.8,1,.8,1,1.8Z"/>
|
|
<path class="st0" d="M6.7,9.4c-.8-.6-1.3-3.4-1.2-3.8,0-.3,2.9-.3,3.4-.1"/>
|
|
<path class="st0" d="M12.6,4.2c.2-.3,2.2-2.2,2.7-2.2s1.2,3.2,1.3,3.8"/>
|
|
<path class="st0" d="M9.9,16.7c.3-.8,1.1-1.1,1.5-1.1,1.3,0,2.9-.4,4.3-1.2"/>
|
|
<path class="st0" d="M8.7,21.6c0,0,0,.2,0,.3-.1.5.4,1.2,1,1.4,2.5.8,7.2-1,7.2-1"/>
|
|
<path class="st0" d="M12.7,18.2c0,.8,0,1-.3,1.6"/>
|
|
<path class="st0" d="M11.3,20.3c.3-.2.6-.4,1.1-.5.9-.2,2-.5,2.5-.6,0,0,0-.1,0-.2,0-1,.7-1.8,1.6-1.8s.2,0,.3,0v-2.9c0,0-.2,0-.3,0-.3,0-.5,0-.7-.2-.4-.2-.7-.6-.8-1.1,0-.1,0-.3,0-.4,0-1,.7-1.8,1.6-1.8s.2,0,.3,0"/>
|
|
<path class="st0" d="M16.5,5.9s0,5.2,0,5.2c-.6-.5-.8-1.1-1.2-1.7,0,0,0-.1-.1-.2-.1-.2-.2-.4-.3-.5,0,0-.1-.2-.2-.3-.1-.2-.2-.4-.3-.6h0c0-.1,0-.1,0-.2,0-.1-.1-.2-.2-.3,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0-.1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0-.1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0-.1-.1-.2-.2-.3,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0-.2,0,.6,2.6.3,2.8-.2.2-.8-.5-.8-.5,0,0,.1.7,0,1-.1.2-2,1-2.4,1.1,0,0,0,0,0,0-.4,0-.9-.7-.9-.7,0,0-.1,1-.3,1s0,0,0,0c-.2-.1-1.6-3.1-1.5-2.1,0,.5.8,2.5,1.3,5,.2,1,.3,2,.4,3,0,1.5,0,3-.5,4.3-.3.2-.5.3-.7.4,0,0-.1,0-.2.1-.2,0-.3.1-.7.2.4-5.2-1.7-9-1.5-12.2,0-2,1.1-3.4,2.1-4.4.6-.5,1.2-.9,1.7-1.1.6-.3,1.6-.4,2.7-.3,1.4,0,2.9.5,3.7,1.5,0,0,.1.1.2.2,0,.1.2.3.3.4Z"/>
|
|
<path class="st0" d="M16.8,11.1s0,0,0,0c0,0-.2,0-.3,0-.9,0-1.6.8-1.6,1.8s0,.3,0,.4,0,0,0,0c-.4.2-.8.4-1.2.6-1.5.6-3.1.5-4.2-.2s0,0,0,0c-.5-2.5-1.2-4.5-1.3-5,0-1,1.3,2,1.5,2.1,0,0,0,0,0,0,.2,0,.3-.8.3-.9s0,0,0,0c0,.1.5.8.9.7,0,0,0,0,0,0,.4-.2,2.2-.9,2.4-1.1.1-.2,0-.8,0-.9s0,0,0,0c0,.1.5.6.7.4.2-.2-.6-2.9-.3-2.8,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0s0,0,0,0c0,0,0,0,0,0,0,0,.1.2.2.3,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,.1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,.1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,.1.2.2.3,0,0,0,0,0,0h0c0,.3.2.4.3.6,0,0,.1.2.2.3,0,.2.2.3.3.5,0,0,0,.1.1.2.3.6.7,1.2,1.2,1.9Z"/>
|
|
<path class="st0" d="M16.8,11.1c.4.1.6.5.6,1.1,0,.2,0,.4,0,.7,0,.4,0,.7,0,1,0,.4-.3.6-.6.7v2.9c.5.2.7.8.7,1.5,0,0,0,.1,0,.2,0,.8-.1,1.5-.7,1.7v3.1"/>
|
|
<line class="st0" x1="16.8" y1="11.1" x2="16.8" y2="1.4"/>
|
|
</svg>
|
|
`
|
|
let setThemeMode = function (currentTheme) {
|
|
switch (currentTheme) {
|
|
case 'light':
|
|
document.body.classList.remove('dark')
|
|
document.body.classList.add('light')
|
|
switchSpan.innerHTML = lightModeIconXml
|
|
break
|
|
case 'dark':
|
|
document.body.classList.remove('light')
|
|
document.body.classList.add('dark')
|
|
switchSpan.innerHTML = darkModeIconXml
|
|
break
|
|
case 'auto':
|
|
var isDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches
|
|
if (isDarkMode) {
|
|
document.body.classList.remove('light')
|
|
document.body.classList.add('dark')
|
|
}
|
|
else {
|
|
document.body.classList.remove('dark')
|
|
document.body.classList.add('light')
|
|
}
|
|
switchSpan.innerHTML = autoModeIconXml
|
|
break
|
|
}
|
|
}
|
|
|
|
window.$docsify.currentThemeModeIndex = 2;
|
|
|
|
// Docsify plugin functions
|
|
function plugin(hook, vm) {
|
|
|
|
if (!switchLightDarkModeOptions.useSwitchMode) {
|
|
return
|
|
}
|
|
|
|
let localStorageCurrentThemeModeIndex = window.localStorage.getItem('currentThemeModeIndex')
|
|
let currentThemeModeIndex = 2
|
|
if (localStorageCurrentThemeModeIndex !== null) {
|
|
currentThemeModeIndex = parseInt(window.localStorage.getItem('currentThemeModeIndex'))
|
|
}
|
|
window.$docsify.currentThemeModeIndex = currentThemeModeIndex
|
|
setThemeMode(themeModes[currentThemeModeIndex])
|
|
window.localStorage.setItem('currentThemeModeIndex', currentThemeModeIndex)
|
|
if (window.$docsify.onLightDarkModeChange) {
|
|
window.$docsify.onLightDarkModeChange();
|
|
}
|
|
|
|
hook.mounted(function () {
|
|
// let lightTheme = Docsify.dom.findAll('[href="/style/light.css"]')[0]
|
|
// let darkTheme = Docsify.dom.findAll('[href="/style/dark.css"]')[0]
|
|
|
|
|
|
setThemeMode(themeModes[currentThemeModeIndex])
|
|
let preferredThemeChangeEventListenerFunction = function () {
|
|
if (currentThemeModeIndex === 2) {
|
|
setThemeMode(themeModes[currentThemeModeIndex])
|
|
}
|
|
}
|
|
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', preferredThemeChangeEventListenerFunction)
|
|
|
|
switchSpan.onclick = function (e) {
|
|
if (currentThemeModeIndex === 2) {
|
|
currentThemeModeIndex = 0
|
|
}
|
|
else {
|
|
currentThemeModeIndex ++
|
|
}
|
|
window.$docsify.currentThemeModeIndex = currentThemeModeIndex
|
|
setThemeMode(themeModes[currentThemeModeIndex])
|
|
window.localStorage.setItem('currentThemeModeIndex', currentThemeModeIndex)
|
|
if (window.$docsify.onLightDarkModeChange) {
|
|
window.$docsify.onLightDarkModeChange();
|
|
}
|
|
}
|
|
|
|
|
|
var zoomInSpan = document.createElement('span')
|
|
zoomInSpan.id = 'zoomInSpan'
|
|
zoomInSpan.classList.add('controlSpan')
|
|
zoomInSpan.style.position = 'fixed'
|
|
zoomInSpan.style.right = switchLightDarkModeOptions.right.toString() + 'px'
|
|
zoomInSpan.style.top = (switchLightDarkModeOptions.top + 35).toString() + 'px'
|
|
zoomInSpan.innerHTML = zoomInIconXml
|
|
|
|
var zoomOutSpan = document.createElement('span')
|
|
zoomOutSpan.id = 'zoomOutSpan'
|
|
zoomOutSpan.classList.add('controlSpan')
|
|
zoomOutSpan.style.position = 'fixed'
|
|
zoomOutSpan.style.right = switchLightDarkModeOptions.right.toString() + 'px'
|
|
zoomOutSpan.style.top = (switchLightDarkModeOptions.top + 70).toString() + 'px'
|
|
zoomOutSpan.innerHTML = zoomOutIconXml
|
|
|
|
var zoomDefaultSpan = document.createElement('span')
|
|
zoomDefaultSpan.id = 'zoomDefaultSpan'
|
|
zoomDefaultSpan.classList.add('controlSpan')
|
|
zoomDefaultSpan.style.position = 'fixed'
|
|
zoomDefaultSpan.style.right = switchLightDarkModeOptions.right.toString() + 'px'
|
|
zoomDefaultSpan.style.top = (switchLightDarkModeOptions.top + 105).toString() + 'px'
|
|
zoomDefaultSpan.innerHTML = zoomDefaultIconXml
|
|
|
|
var ottoSpan = document.createElement('span')
|
|
ottoSpan.id = 'ottoSpan'
|
|
ottoSpan.classList.add('controlSpan')
|
|
ottoSpan.style.position = 'fixed'
|
|
ottoSpan.style.right = switchLightDarkModeOptions.right.toString() + 'px'
|
|
ottoSpan.style.top = (switchLightDarkModeOptions.top + 140).toString() + 'px'
|
|
ottoSpan.innerHTML = ottoIconXml
|
|
|
|
let defaultSize = 1.0
|
|
let currentSize = defaultSize
|
|
|
|
function set(targetSize) {
|
|
document.body.style.zoom = targetSize
|
|
document.body.style.cssText += '; -moz-transform: scale(' + targetSize + ');-moz-transform-origin: 0 0; '
|
|
}
|
|
|
|
function showOtto(show) {
|
|
window.$docsify.onOttoShow(show)
|
|
}
|
|
|
|
zoomInSpan.onclick = function () {
|
|
currentSize = currentSize + 0.1
|
|
set(currentSize)
|
|
}
|
|
|
|
zoomOutSpan.onclick = function () {
|
|
currentSize = currentSize - 0.1
|
|
set(currentSize)
|
|
}
|
|
|
|
zoomDefaultSpan.onclick = function () {
|
|
currentSize = defaultSize
|
|
set(currentSize)
|
|
}
|
|
|
|
ottoSpan.onclick = function () {
|
|
showOtto()
|
|
}
|
|
|
|
document.body.appendChild(switchSpan)
|
|
document.body.appendChild(zoomInSpan)
|
|
document.body.appendChild(zoomOutSpan)
|
|
document.body.appendChild(zoomDefaultSpan)
|
|
document.body.appendChild(ottoSpan)
|
|
})
|
|
}
|
|
|
|
// Docsify plugin options
|
|
window.$docsify['switchLightDarkMode'] = Object.assign(
|
|
switchLightDarkModeOptions,
|
|
window.$docsify['switchLightDarkMode']
|
|
)
|
|
window.$docsify.plugins = [].concat(plugin, window.$docsify.plugins) |