forked from RDCNWebs/rd.rdlevel.cn
Merge pull request '添加了本地状态记录' (#4) from others into main
Reviewed-on: RDCNWebs/rd.rdlevel.cn#4
This commit is contained in:
commit
1d9514bd7b
@ -1,5 +1,8 @@
|
||||
# 更新信息
|
||||
|
||||
#### 2025-07-21
|
||||
- 添加了本地状态存储
|
||||
|
||||
#### 2025-07-19
|
||||
- 补充了目录图标
|
||||
- 整理并添加了新的板块
|
||||
|
||||
@ -10,8 +10,11 @@ var ottos = [
|
||||
"/images/otto-rd2-xmas-compressed.png",
|
||||
"/images/otto-traditional.png",
|
||||
]
|
||||
function getCurrentImage() {
|
||||
ottoIndex = (ottoIndex) % ottos.length;
|
||||
return ottos[ottoIndex];
|
||||
}
|
||||
var ottoIndex = 0;
|
||||
|
||||
function showOtto(callback) {
|
||||
node.style.opacity = 1;
|
||||
anim = node.animate([
|
||||
@ -37,13 +40,13 @@ function hideOtto(callback) {
|
||||
}
|
||||
}
|
||||
|
||||
window.onload = function () {
|
||||
window.addEventListener("load", function () {
|
||||
fetch("tips.json").then(response => response.json()).then(data => {
|
||||
tipTexts = data;
|
||||
});
|
||||
addOtto(document);
|
||||
showOtto()
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
window.$docsify.onOttoShow = function () {
|
||||
@ -57,9 +60,14 @@ window.$docsify.onOttoShow = function () {
|
||||
} else {
|
||||
hideOtto();
|
||||
ottoIndex++;
|
||||
window.localStorage.setItem('ottoIndex', ottoIndex);
|
||||
}
|
||||
}
|
||||
function addOtto(document) {
|
||||
let localStorageOttoIndex = window.localStorage.getItem('ottoIndex');
|
||||
if (localStorageOttoIndex !== null) {
|
||||
ottoIndex = parseInt(localStorageOttoIndex);
|
||||
}
|
||||
node = document.createElement("div");
|
||||
node.className = "otto";
|
||||
image = document.createElement("img");
|
||||
@ -117,8 +125,3 @@ function playTips() {
|
||||
function randomTips() {
|
||||
return tipTexts[Math.floor(Math.random() * tipTexts.length)];
|
||||
}
|
||||
|
||||
function getCurrentImage() {
|
||||
ottoIndex = (ottoIndex) % ottos.length;
|
||||
return ottos[ottoIndex];
|
||||
}
|
||||
@ -14,37 +14,22 @@ var switchLightDarkModeOptions = {
|
||||
svgColor: '#7d7b75',
|
||||
}
|
||||
|
||||
window.$docsify.currentThemeModeIndex = 2;
|
||||
const themeModes = ['light', 'dark', 'auto',]
|
||||
|
||||
// Docsify plugin functions
|
||||
function plugin(hook, vm) {
|
||||
var switchSpan = document.createElement('span')
|
||||
|
||||
if (!switchLightDarkModeOptions.useSwitchMode) {
|
||||
return
|
||||
}
|
||||
switchSpan.id = 'switchLightDarkModeDivBeforeArticle'
|
||||
switchSpan.style.position = 'fixed'
|
||||
switchSpan.style.right = switchLightDarkModeOptions.right.toString() + 'px'
|
||||
switchSpan.style.top = switchLightDarkModeOptions.top.toString() + 'px'
|
||||
|
||||
let themeModes = ['light', 'dark', 'auto',]
|
||||
|
||||
let currentThemeModeIndex = 2
|
||||
|
||||
hook.mounted(function () {
|
||||
// let lightTheme = Docsify.dom.findAll('[href="/style/light.css"]')[0]
|
||||
// let darkTheme = Docsify.dom.findAll('[href="/style/dark.css"]')[0]
|
||||
|
||||
var switchSpan = document.createElement('span')
|
||||
|
||||
switchSpan.id = 'switchLightDarkModeDivBeforeArticle'
|
||||
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="' + switchLightDarkModeOptions.svgColor + '" 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="' + switchLightDarkModeOptions.svgColor + '" 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="' + switchLightDarkModeOptions.svgColor + '" 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="' + switchLightDarkModeOptions.svgColor + '" 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="' + switchLightDarkModeOptions.svgColor + '" 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="' + switchLightDarkModeOptions.svgColor + '" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>'
|
||||
const ottoIconXml = `
|
||||
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="' + switchLightDarkModeOptions.svgColor + '" 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="' + switchLightDarkModeOptions.svgColor + '" 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="' + switchLightDarkModeOptions.svgColor + '" 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="' + switchLightDarkModeOptions.svgColor + '" 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="' + switchLightDarkModeOptions.svgColor + '" 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="' + switchLightDarkModeOptions.svgColor + '" 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"/>
|
||||
@ -61,38 +46,59 @@ function plugin(hook, vm) {
|
||||
<line class="st0" x1="16.8" y1="11.1" x2="16.8" y2="1.4"/>
|
||||
</svg>
|
||||
`
|
||||
let setThemeMode = function (currentTheme) {
|
||||
switch (currentTheme) {
|
||||
case 'light':
|
||||
// lightTheme.disabled = false
|
||||
// darkTheme.disabled = true
|
||||
document.body.classList.remove('dark')
|
||||
document.body.classList.add('light')
|
||||
switchSpan.innerHTML = lightModeIconXml
|
||||
break
|
||||
case 'dark':
|
||||
// lightTheme.disabled = true
|
||||
// darkTheme.disabled = false
|
||||
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
|
||||
// lightTheme.disabled = isDarkMode
|
||||
// darkTheme.disabled = !isDarkMode
|
||||
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
|
||||
}
|
||||
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
|
||||
console.log(window.localStorage)
|
||||
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 () {
|
||||
@ -111,6 +117,8 @@ function plugin(hook, vm) {
|
||||
}
|
||||
window.$docsify.currentThemeModeIndex = currentThemeModeIndex
|
||||
setThemeMode(themeModes[currentThemeModeIndex])
|
||||
window.localStorage.setItem('currentThemeModeIndex', currentThemeModeIndex)
|
||||
console.log('currentThemeModeIndex', window.localStorage.getItem('currentThemeModeIndex'))
|
||||
if (window.$docsify.onLightDarkModeChange) {
|
||||
window.$docsify.onLightDarkModeChange();
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user