From 2e2ef826b721e55947ee03629dcb5d51169b7981 Mon Sep 17 00:00:00 2001 From: hayao Date: Thu, 26 Oct 2023 12:20:22 +0900 Subject: [PATCH] Rename: Utils --- src/class/Kyomu/index.ts | 8 ++-- src/class/Moodle/DisableRainbow.ts | 4 +- src/class/Moodle/EnableRainbow.ts | 2 +- src/class/MyLibrary/index.ts | 2 +- src/class/SSO/index.ts | 2 +- src/class/StorageTool/index.ts | 2 +- src/class/UnivWebsite/index.ts | 7 +-- src/components/SwitchItem.tsx | 2 +- src/options/pages/Top.tsx | 2 +- src/popup/components/Footer.tsx | 2 +- src/scripts/background.ts | 6 +-- src/scripts/content_kyomu.ts | 2 +- src/scripts/content_media.ts | 2 +- src/scripts/content_moodle.ts | 2 +- src/scripts/content_mylib.ts | 2 +- src/scripts/content_sso.ts | 2 +- src/utils/addClass.ts | 71 ++++++++++++++++++++++++++++++ src/utils/changeQueryInnerHTML.ts | 6 +++ src/utils/isTrue.ts | 4 ++ src/utils/loadGamingWebsite.ts | 15 +++++++ src/utils/openOptions.ts | 7 +++ 21 files changed, 128 insertions(+), 24 deletions(-) create mode 100644 src/utils/addClass.ts create mode 100644 src/utils/changeQueryInnerHTML.ts create mode 100644 src/utils/isTrue.ts create mode 100644 src/utils/loadGamingWebsite.ts create mode 100644 src/utils/openOptions.ts diff --git a/src/class/Kyomu/index.ts b/src/class/Kyomu/index.ts index ae2f3ab..66f6da8 100644 --- a/src/class/Kyomu/index.ts +++ b/src/class/Kyomu/index.ts @@ -1,6 +1,6 @@ // 教務は学生の未来を担い、ゲーミングは学生の人生に彩りを加える // この二つのシステムを統合することで、学生の人生をより豊かにすることができる -import ChangeQueryInnerHTML from "../../utils/ChangeQueryInnerHTML"; +import changeQueryInnerHTML from "../../utils/changeQueryInnerHTML"; import { GundaiWebSite } from "../UnivWebsite"; export const Kyomu = new GundaiWebSite("kyomu"); @@ -29,14 +29,14 @@ Kyomu.enableRainbow = function () { this.rainbowBg.apply(".top_title_header", ".top_now_title"); // トップページのウェルカムメッセージ - ChangeQueryInnerHTML("#loginHeader_lblWelcome_1_lbl", "よおこそ、群馬大学ゲーミング教務システムへ"); - ChangeQueryInnerHTML( + changeQueryInnerHTML("#loginHeader_lblWelcome_1_lbl", "よおこそ、群馬大学ゲーミング教務システムへ"); + changeQueryInnerHTML( "#loginHeader_lblWelcome_2_lbl", "このサイトでは、プレーヤーの群馬大学での𝑮𝒂𝒎𝒊𝒏𝒈 𝑳𝒊𝒇𝒆 𝑺𝒕𝒚𝒍𝒆をいい感じにします", ); // トップページのお知らせ - ChangeQueryInnerHTML("#AllAnnualList_LblTitle", "ゲーミング ライフ スタイル"); + changeQueryInnerHTML("#AllAnnualList_LblTitle", "ゲーミング ライフ スタイル"); // 受信メッセージ一覧 this.rainbowBg.apply("#ctl00_phContents_ctlMesReceive_gridMes tr"); diff --git a/src/class/Moodle/DisableRainbow.ts b/src/class/Moodle/DisableRainbow.ts index cefa17d..8d34612 100644 --- a/src/class/Moodle/DisableRainbow.ts +++ b/src/class/Moodle/DisableRainbow.ts @@ -1,4 +1,4 @@ -import ChangeQueryInnerHTML from "../../utils/ChangeQueryInnerHTML"; +import changeQueryInnerHTML from "../../utils/changeQueryInnerHTML"; import { Moodle } from "./type"; export const DisableRainbowBg = (moodle: Moodle) => { @@ -8,5 +8,5 @@ export const DisableRainbowBg = (moodle: Moodle) => { }; export const ReplaceImagesToDefault = () => { - ChangeQueryInnerHTML("#instance-320-header", "現在のログイン人数"); + changeQueryInnerHTML("#instance-320-header", "現在のログイン人数"); }; diff --git a/src/class/Moodle/EnableRainbow.ts b/src/class/Moodle/EnableRainbow.ts index 0612171..03e218c 100644 --- a/src/class/Moodle/EnableRainbow.ts +++ b/src/class/Moodle/EnableRainbow.ts @@ -1,4 +1,4 @@ -import changeQueryInnerHTML from "../../utils/ChangeQueryInnerHTML"; +import changeQueryInnerHTML from "../../utils/changeQueryInnerHTML"; import { GundaiWebSite } from "../UnivWebsite"; import { Moodle } from "./type"; import { MoodleAdditionalInfo } from "./type"; diff --git a/src/class/MyLibrary/index.ts b/src/class/MyLibrary/index.ts index d3d4801..4c204bd 100644 --- a/src/class/MyLibrary/index.ts +++ b/src/class/MyLibrary/index.ts @@ -1,4 +1,4 @@ -import ChangeQueryInnerHTML from "../../utils/ChangeQueryInnerHTML"; +import ChangeQueryInnerHTML from "../../utils/changeQueryInnerHTML"; import { GundaiWebSite } from "../UnivWebsite"; export const MyLibrary = new GundaiWebSite("mylibrary"); diff --git a/src/class/SSO/index.ts b/src/class/SSO/index.ts index e8b9019..7a71e29 100644 --- a/src/class/SSO/index.ts +++ b/src/class/SSO/index.ts @@ -1,7 +1,7 @@ // 情報は自身の資産である ログインとはその証明である // 古代において古墳は富の象徴とされた ログインは現代の古墳であると言える -import changeQueryInnerHTML from "../../utils/ChangeQueryInnerHTML"; +import changeQueryInnerHTML from "../../utils/changeQueryInnerHTML"; import { GundaiWebSite } from "../UnivWebsite"; export const SSO = new GundaiWebSite("sso"); diff --git a/src/class/StorageTool/index.ts b/src/class/StorageTool/index.ts index 1bb89af..33dc4c2 100644 --- a/src/class/StorageTool/index.ts +++ b/src/class/StorageTool/index.ts @@ -1,4 +1,4 @@ -import IsTrue from "../../utils/IsTrue"; +import IsTrue from "../../utils/isTrue"; export class StorageTool { id: string; diff --git a/src/class/UnivWebsite/index.ts b/src/class/UnivWebsite/index.ts index 42342cc..381a6ad 100644 --- a/src/class/UnivWebsite/index.ts +++ b/src/class/UnivWebsite/index.ts @@ -1,7 +1,7 @@ // 無駄とは人生である。無駄を極めよ。無駄を愛せ。無駄を生きろ。 // 無駄を以て物を成す者は、無駄を以て物を滅ぼす者に勝る。x -import { AddClass, Elements, RemoveClass } from "../../utils/AddClass"; +import { addClass, Elements, removeClass } from "../../utils/addClass"; import { StorageTool } from "../StorageTool"; //import Storage from "../../utils/Storage"; @@ -19,6 +19,7 @@ export class UnivWebsite { rainbowText: Rainbow; rainbowBg: Rainbow; + rainbowTextShadow: Rainbow; rainbowBgShadow: Rainbow; @@ -72,9 +73,9 @@ export class Rainbow { } apply(...elements: Elements[]) { - AddClass(elements, [this.base, ...this.classes]); + addClass(elements, [this.base, ...this.classes]); } remove(...elements: Elements[]) { - RemoveClass(elements, [this.base, ...this.classes]); + removeClass(elements, [this.base, ...this.classes]); } } diff --git a/src/components/SwitchItem.tsx b/src/components/SwitchItem.tsx index d0bd4bf..b3a0c08 100644 --- a/src/components/SwitchItem.tsx +++ b/src/components/SwitchItem.tsx @@ -5,7 +5,7 @@ import { useCallback, useEffect, useState } from "react"; import { WebSites } from "../class"; import { FrontConfig } from "../popup/config"; -import IsTrue from "../utils/IsTrue"; +import IsTrue from "../utils/isTrue"; export function SwitchItem({ config, className }: { config: FrontConfig; className?: string }) { const [enabled, setEnabled] = useState(false); diff --git a/src/options/pages/Top.tsx b/src/options/pages/Top.tsx index 26e21da..1b94885 100644 --- a/src/options/pages/Top.tsx +++ b/src/options/pages/Top.tsx @@ -4,7 +4,7 @@ import { useEffect, useState } from "react"; import { StorageTool } from "../../class/StorageTool"; import Heading from "../../components/Heading"; import { Switches } from "../../components/Switches"; -import IsTrue from "../../utils/IsTrue"; +import IsTrue from "../../utils/isTrue"; export default function Top() { return ( diff --git a/src/popup/components/Footer.tsx b/src/popup/components/Footer.tsx index 0cc2398..70caf47 100644 --- a/src/popup/components/Footer.tsx +++ b/src/popup/components/Footer.tsx @@ -1,4 +1,4 @@ -import OpenOptions from "../../utils/OpenOptions"; +import OpenOptions from "../../utils/openOptions"; export default function Footer() { return ( diff --git a/src/scripts/background.ts b/src/scripts/background.ts index 6756a02..f7a2508 100644 --- a/src/scripts/background.ts +++ b/src/scripts/background.ts @@ -1,12 +1,12 @@ import { StorageTool } from "../class/StorageTool"; -import IsTrue from "../utils/IsTrue"; -import OpenOptions from "../utils/OpenOptions"; +import isTrue from "../utils/isTrue"; +import OpenOptions from "../utils/openOptions"; chrome.runtime.onInstalled.addListener(async () => { const storage = new StorageTool("other"); const isInstalled = await storage.get("installed"); console.log(isInstalled); - if (isInstalled != undefined && IsTrue(isInstalled)) return; + if (isInstalled != undefined && isTrue(isInstalled)) return; OpenOptions("thanks").then(() => { storage.set("installed", "true"); }); diff --git a/src/scripts/content_kyomu.ts b/src/scripts/content_kyomu.ts index 78255cf..e46f5d2 100644 --- a/src/scripts/content_kyomu.ts +++ b/src/scripts/content_kyomu.ts @@ -1,6 +1,6 @@ import "/styles/kyomu.css"; import { Kyomu } from "../class"; -import LoadGamingWebsite from "../utils/LoadGamingWebsite"; +import LoadGamingWebsite from "../utils/loadGamingWebsite"; LoadGamingWebsite(Kyomu); diff --git a/src/scripts/content_media.ts b/src/scripts/content_media.ts index 44e7b58..1f63608 100644 --- a/src/scripts/content_media.ts +++ b/src/scripts/content_media.ts @@ -1,6 +1,6 @@ import "/styles/media.css"; import { Media } from "../class"; -import loadGamingWebsite from "../utils/LoadGamingWebsite"; +import loadGamingWebsite from "../utils/loadGamingWebsite"; loadGamingWebsite(Media); diff --git a/src/scripts/content_moodle.ts b/src/scripts/content_moodle.ts index dc6665d..6e791a2 100644 --- a/src/scripts/content_moodle.ts +++ b/src/scripts/content_moodle.ts @@ -1,7 +1,7 @@ import "/styles/moodle.scss"; import { Moodle } from "../class"; -import loadGamingWebsite from "../utils/LoadGamingWebsite"; +import loadGamingWebsite from "../utils/loadGamingWebsite"; //window.addEventListener("load", async () => await runFuncIfEnabled(Moodle.EnableRainbow)); loadGamingWebsite(Moodle); diff --git a/src/scripts/content_mylib.ts b/src/scripts/content_mylib.ts index 47bd3b6..d98e109 100644 --- a/src/scripts/content_mylib.ts +++ b/src/scripts/content_mylib.ts @@ -1,6 +1,6 @@ import "/styles/mylibrary.css"; import { MyLibrary } from "../class"; -import LoadGamingWebsite from "../utils/LoadGamingWebsite"; +import LoadGamingWebsite from "../utils/loadGamingWebsite"; LoadGamingWebsite(MyLibrary); diff --git a/src/scripts/content_sso.ts b/src/scripts/content_sso.ts index ef80850..3bf50e1 100644 --- a/src/scripts/content_sso.ts +++ b/src/scripts/content_sso.ts @@ -1,7 +1,7 @@ import "/styles/sso.css"; import { SSO } from "../class"; -import loadGamingWebsite from "../utils/LoadGamingWebsite"; +import loadGamingWebsite from "../utils/loadGamingWebsite"; //window.addEventListener("load", async () => await runFuncIfEnabled(SSO.EnableRainbow)); diff --git a/src/utils/addClass.ts b/src/utils/addClass.ts new file mode 100644 index 0000000..077e531 --- /dev/null +++ b/src/utils/addClass.ts @@ -0,0 +1,71 @@ +export type Elements = HTMLElement | NodeListOf | string; + +export function addClass(elements: Elements[], classNames: string[]) { + elements.forEach((element) => { + if (typeof element === "string") { + const elements = document.querySelectorAll(element); + elements.forEach((element) => { + //console.log("adding classes to", element); + element.classList.add(...classNames); + }); + } else { + let list: HTMLElement[]; + if (element instanceof HTMLElement) list = [element]; + else list = Array.from(element); + + list.forEach((element) => { + //console.log("adding classes to", element); + element.classList.add(...classNames); + }); + } + }); +} + +export function removeClass(elements: Elements[], classNames: string[]) { + elements.forEach((element) => { + if (typeof element === "string") { + const elements = document.querySelectorAll(element); + elements.forEach((element) => { + element.classList.remove(...classNames); + }); + } else { + let list: HTMLElement[]; + if (element instanceof HTMLElement) list = [element]; + else list = Array.from(element); + + list.forEach((element) => { + element.classList.remove(...classNames); + }); + } + }); +} + +/* +export function AddRainbowBg(...queries: string[]) { + AddClass(queries, ["rainbow-bg"]); +} + +export function AddRainbowBgWithShadow(...queries: string[]) { + AddClass(queries, ["rainbow-bg", "rainbow-bg-shadow"]); +} + +export function AddRainbowText(...queries: string[]) { + AddClass(queries, ["rainbow-text"]); +} + +export function AddRainbowTextWithShadow(...queries: string[]) { + AddClass(queries, ["rainbow-text", "rainbow-text-shadow"]); +} + +export function RemoveRainbowBg(...queries: string[]) { + RemoveClass(queries, ["rainbow-bg"]); +} + +export function RemoveRainbowBgWithShadow(...queries: string[]) { + RemoveClass(queries, ["rainbow-bg", "rainbow-bg-shadow"]); +} + +export function RemoveRainbowText(...queries: string[]) { + RemoveClass(queries, ["rainbow-text", "rainbow-text-shadow"]); +} +*/ diff --git a/src/utils/changeQueryInnerHTML.ts b/src/utils/changeQueryInnerHTML.ts new file mode 100644 index 0000000..0e5e449 --- /dev/null +++ b/src/utils/changeQueryInnerHTML.ts @@ -0,0 +1,6 @@ +export default function changeQueryInnerHTML(query: string, innerHTML: string) { + const elements = document.querySelectorAll(query); + elements.forEach((element) => { + element.innerHTML = innerHTML; + }); +} diff --git a/src/utils/isTrue.ts b/src/utils/isTrue.ts new file mode 100644 index 0000000..2d8a642 --- /dev/null +++ b/src/utils/isTrue.ts @@ -0,0 +1,4 @@ +// eslint-disable-next-line @typescript-eslint/no-explicit-any +export default function isTrue(value: any) { + return value === true || value === "true" || value === undefined; +} diff --git a/src/utils/loadGamingWebsite.ts b/src/utils/loadGamingWebsite.ts new file mode 100644 index 0000000..46d728e --- /dev/null +++ b/src/utils/loadGamingWebsite.ts @@ -0,0 +1,15 @@ +import { UnivWebsite } from "../class/UnivWebsite"; +import isTrue from "./isTrue"; +//import RunFuncIfEnabled from "./RunFuncIfEnabled"; + +// ウィンドウが読み込まれたらGundaiWebsiteのEnableRainbowを実行する +export default function loadGamingWebsite(website: UnivWebsite) { + window.addEventListener("load", async () => { + const isEnabled = await website.storage.get("enabled"); + if (isTrue(isEnabled)) { + website.enable(); + } else { + website.disable(); + } + }); +} diff --git a/src/utils/openOptions.ts b/src/utils/openOptions.ts new file mode 100644 index 0000000..fca88ab --- /dev/null +++ b/src/utils/openOptions.ts @@ -0,0 +1,7 @@ +type OpenOptionsArgs = "home" | "about" | "thanks" | undefined; + +export default function openOptions(args: OpenOptionsArgs) { + if (!args || args === "home") return chrome.tabs.create({ url: "options.html" }); + + return chrome.tabs.create({ url: `options.html#/${args}` }); +}