🏠 Home 

滴答清单自动深色模式

根据系统设置自动切换深色模式,深色用的是官方的样式

// ==UserScript==
// @name         滴答清单自动深色模式
// @version      1.0.7
// @description  根据系统设置自动切换深色模式,深色用的是官方的样式
// @namespace    https://dida365.com/
// @match        https://dida365.com/webapp*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=dida365.com
// @author       bowencool
// @license      MIT
// @homepageURL  https://greasyfork.org/scripts/447649
// @supportURL   https://github.com/bowencool/Tampermonkey-Scripts/issues
// @require      https://cdn.jsdelivr.net/gh/bowencool/Tampermonkey-Scripts@f59cc91442dd34eb28e0d270486da5c7ac8d2d50/shared/waitForElementToExist.js
// @grant        none
// ==/UserScript==
(function () {
"use strict";
function sleep(ms) {
return new Promise((resolve) => setTimeout(resolve, ms));
}
async function toggle(
isDarkMode = window.matchMedia("(prefers-color-scheme: dark)").matches
) {
/* 有两个事件会触发,而且有循环,必须加判断 */
const currentTheme = document.body.getAttribute("data-theme");
console.log({ isDarkMode, currentTheme });
if (isDarkMode) {
if (currentTheme === "night-dark-theme") return;
(await waitForElementToExist("#tl-bar-user")).click();
(
await waitForElementToExist(
'.dropdown-menu [role="menuitem"] :has(.icon-setting-sidebar)'
)
).click();
(await waitForElementToExist('[data-tab="appearance"] a')).click();
await sleep(200);
(
await waitForElementToExist('[data-id="night"]:not(:has(.select-tip))')
).click();
await sleep(200);
(
await waitForElementToExist(
"#settings-view div:has(> .icon-panel-close)"
)
).click();
localStorage.setItem("appTheme", "night");
await sleep(200);
document.querySelector(".icon-sidebar-sync")?.parentElement.click();
// document.body.setAttribute("data-theme", "night-dark-theme");
// document.body.classList.add("dark");
} else {
if (currentTheme !== "night-dark-theme") return;
(await waitForElementToExist("#tl-bar-user")).click();
(
await waitForElementToExist(
'.dropdown-menu [role="menuitem"] :has(.icon-setting-sidebar)'
)
).click();
(await waitForElementToExist('[data-tab="appearance"] a')).click();
await sleep(200);
(
await waitForElementToExist('[data-id="grey"]:not(:has(.select-tip))')
).click();
await sleep(200);
(
await waitForElementToExist(
"#settings-view div:has(> .icon-panel-close)"
)
).click();
localStorage.setItem("appTheme", "grey");
await sleep(200);
document.querySelector(".icon-sidebar-sync")?.parentElement.click();
// document.body.setAttribute("data-theme", "white-theme");
// document.body.classList.remove("dark");
}
}
window
.matchMedia("(prefers-color-scheme: dark)")
.addEventListener("change", (e) => {
toggle(e.matches);
});
const observer = new MutationObserver(() => {
/* 页面半身是异步设置的,太傻逼了 */
// if (!document.body.getAttribute("data-input-type")) return;
const dataTheme = document.body.getAttribute("data-theme");
if (!dataTheme) return;
console.log(
"attr changed",
{
dataTheme,
},
document.body.getAttribute("data-input-type")
);
observer.disconnect();
console.log("disconnected.");
// setTimeout(() => {
toggle();
// }, 100);
});
observer.observe(document.body, {
attributes: true,
childList: false,
subtree: false,
});
})();