Merge branch 'master' into release

GunmaRamens · Nov 24, 2023 · 9e1f212 · 9e1f212
2 parents b55e37e + 22e55cd
commit 9e1f212
Show file tree

Hide file tree

Showing 16 changed files with 154 additions and 40 deletions.
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -13,7 +13,13 @@
     "parserOptions": {
         "sourceType": "module"
     },
-    "plugins": ["tailwindcss", "unused-imports", "prettier", "simple-import-sort"],
+    "root": true,
+    "settings": {
+        "react": {
+            "version": "detect"
+        }
+    },
+    "plugins": ["tailwindcss", "unused-imports", "prettier", "simple-import-sort", "no-unsanitized"],
     "rules": {
         "simple-import-sort/imports": "warn",
         "simple-import-sort/exports": "warn",
@@ -25,13 +31,9 @@
             {
                 "whitelist": ["rainbow\\-bg", "rainbow\\-text", "rainbow\\-bg\\-shadow", "rainbow\\-text\\-shadow"]
             }
-        ]
-    },
-    "root": true,
-    "settings": {
-        "react": {
-            "version": "detect"
-        }
+        ],
+        "no-unsanitized/method": "warn",
+        "no-unsanitized/property": "warn"
     },
     "overrides": [
         {

diff --git a/package.json b/package.json
@@ -2,7 +2,7 @@
     "name": "gunma-univ-gaming-edition",
     "description": "The browser extension of Gunma University Gaming Edition",
     "license": "MIT",
-    "version": "2.1.1",
+    "version": "2.2.1",
     "scripts": {
         "build": "pnpm run build-chrome",
         "build:dev": "pnpm run build-chrome:dev",
@@ -44,6 +44,7 @@
         "daisyui": "^3.9.4",
         "eslint": "^8.53.0",
         "eslint-config-prettier": "^9.0.0",
+        "eslint-plugin-no-unsanitized": "^4.0.2",
         "eslint-plugin-prettier": "^5.0.1",
         "eslint-plugin-react": "^7.33.2",
         "eslint-plugin-simple-import-sort": "^10.0.0",

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/public/manifest_chrome.json b/public/manifest_chrome.json
@@ -1,7 +1,7 @@
 {
     "manifest_version": 3,
     "name": "ゲーミング群馬大学 -Gaming Gunma University-",
-    "version": "2.1.1",
+    "version": "2.2.1",
     "description": "辺境の地にある群馬大学のウェブサイトをゲーミングでエキサイティングにします",
     "author": "[email protected]",
     "permissions": ["storage", "tabs"],

diff --git a/public/manifest_firefox.json b/public/manifest_firefox.json
@@ -1,7 +1,7 @@
 {
     "manifest_version": 3,
     "name": "ゲーミング群馬大学 -Gaming Gunma University-",
-    "version": "2.1.1",
+    "version": "2.2.1",
     "description": "辺境の地にある群馬大学のウェブサイトをゲーミングでエキサイティングにします",
     "author": "[email protected]",
     "permissions": ["storage", "tabs"],
@@ -59,7 +59,7 @@
     "browser_specific_settings": {
         "gecko": {
             "id": "[email protected]",
-            "strict_min_version": "42.0"
+            "strict_min_version": "109.0"
         }
     }
 }
diff --git a/src/class/Kyomu/index.ts b/src/class/Kyomu/index.ts
@@ -1,6 +1,7 @@
 // 教務は学生の未来を担い、ゲーミングは学生の人生に彩りを加える
 // この二つのシステムを統合することで、学生の人生をより豊かにすることができる
-import changeQueryInnerHTML from "../../utils/changeQueryInnerHTML";
+import changeQueryTextContent from "@/utils/changeQueryTextContent";
+
 import { GundaiWebSite } from "../UnivWebsite";
 
 export const Kyomu = new GundaiWebSite("kyomu");
@@ -30,14 +31,14 @@ Kyomu.rainbow.enable = function () {
     this.bg.apply(".top_title_header", ".top_now_title");
 
     // トップページのウェルカムメッセージ
-    changeQueryInnerHTML("#loginHeader_lblWelcome_1_lbl", "よおこそ、群馬大学ゲーミング教務システムへ");
-    changeQueryInnerHTML(
+    changeQueryTextContent("#loginHeader_lblWelcome_1_lbl", "よおこそ、群馬大学ゲーミング教務システムへ");
+    changeQueryTextContent(
         "#loginHeader_lblWelcome_2_lbl",
         "このサイトでは、プレーヤーの群馬大学での𝑮𝒂𝒎𝒊𝒏𝒈 𝑳𝒊𝒇𝒆 𝑺𝒕𝒚𝒍𝒆をいい感じにします",
     );
 
     // トップページのお知らせ
-    changeQueryInnerHTML("#AllAnnualList_LblTitle", "ゲーミング ライフ スタイル");
+    changeQueryTextContent("#AllAnnualList_LblTitle", "ゲーミング ライフ スタイル");
 
     // 受信メッセージ一覧
     this.bgShadow.apply("#ctl00_phContents_ctlMesReceive_gridMes tr");
@@ -48,7 +49,7 @@ Kyomu.rainbow.enable = function () {
             '<tr><td align="center">ゲーミング群馬大学についての問い合わせは<a href="https://twitter.com/Hayao0819" style="font-size: small;">@Hayao0819</a>までお願いします。</td></tr>';
         document.querySelectorAll(".footerTable").forEach((e) => {
             const tbody = e.querySelector("tbody");
-            if (tbody) tbody.innerHTML += linkHTML;
+            if (tbody) tbody.innerText += linkHTML;
         });
     }
 

diff --git a/src/class/Moodle/common.ts b/src/class/Moodle/common.ts
@@ -1,13 +1,35 @@
 import Browser from "webextension-polyfill";
 
+import { createElem } from "@/utils/createElem";
+
 import changeQueryInnerHTML from "../../utils/changeQueryInnerHTML";
+import Moodle from ".";
 
-export const injectLink = () => {
+export const injectLink = async () => {
+    if (Moodle.options.linkInjected) return;
     const supportSection = document.querySelector(".footer-support-link");
-    if (supportSection)
-        supportSection.innerHTML =
-            supportSection.innerHTML +
-            `<a href="https://twitter.com/Hayao0819" target="blank" class="rainbow-text">Gaming Edition開発者に連絡する<i class="icon fa fa-external-link fa-fw ml-1" aria-hidden="true"></i></a>`;
+    if (supportSection) {
+        const link = createElem(
+            "a",
+            { href: "https://twitter.com/Hayao0819", class: "rainbow-text" },
+            (await Moodle.isRainbowEnabled())
+                ? createElem("span", {}, "Gaming Edition開発者に連絡する")
+                : createElem("span", {}, "ダークモード開発者に連絡する"),
+            createElem("i", { class: "icon fa fa-external-link fa-fw ml-1", "aria-hidden": "true" }),
+        );
+        supportSection.appendChild(link);
+        Moodle.options.linkInjected = true;
+    }
+
+    const userMenu = document.getElementById("usermenu-carousel");
+    if (userMenu) {
+        const link = createElem(
+            "a",
+            { href: "https://twitter.com/Hayao0819", class: "dropdown-item", role: "menuitem", tabindex: "-1" },
+            "ゲーミング群馬大学",
+        );
+        userMenu.appendChild(link);
+    }
 };
 
 export const replaceLMSLogo = () => {

diff --git a/src/class/Moodle/dark.ts b/src/class/Moodle/dark.ts
@@ -1,8 +1,9 @@
 import { DarkApplicator } from "../ClassApplicator";
 import { Moodle } from ".";
-import { replaceLMSLogo } from "./common";
+import { injectLink, replaceLMSLogo } from "./common";
 
 export default async function enableDark(this: DarkApplicator) {
+    injectLink();
     // 画像差し替え
     replaceLMSLogo();
 

diff --git a/src/class/Moodle/enableRainbow.ts b/src/class/Moodle/enableRainbow.ts
@@ -31,6 +31,8 @@ const replaceIconToGamimg = () => {
         if (e.getAttribute("src")) e.setAttribute("src", Browser.runtime.getURL("assets/partyparrot.gif"));
     });
 };
+
+/* eslint-disable no-unsanitized/property */
 const replaceTextToGaimg = (moodle: GundaiWebSite<MoodleAdditionalInfo>) => {
     const headerText = moodle.options.headerText;
 
@@ -43,6 +45,7 @@ const replaceTextToGaimg = (moodle: GundaiWebSite<MoodleAdditionalInfo>) => {
 
     changeQueryInnerHTML("#instance-320-header", "現在のプレイ人数");
 };
+/* eslint-enable no-unsanitized/property */
 
 const headerHover = () => {
     // メニューバーでホバー時にclassを追加

diff --git a/src/class/Moodle/index.ts b/src/class/Moodle/index.ts
@@ -12,6 +12,7 @@ export default Moodle;
 
 Moodle.options = {
     headerText: " Gaming Edition 🎮",
+    linkInjected: false,
 };
 
 Moodle.rainbow.enable = enableRainbow;

diff --git a/src/class/Moodle/type.ts b/src/class/Moodle/type.ts
@@ -2,6 +2,7 @@ import { GundaiWebSite } from "../UnivWebsite";
 
 export interface MoodleAdditionalInfo {
     headerText: string;
+    linkInjected: boolean;
 }
 
 export type Moodle = GundaiWebSite<MoodleAdditionalInfo>;
diff --git a/src/options/pages/Why.tsx b/src/options/pages/Why.tsx
@@ -1,19 +1,26 @@
+import classNames from "classnames";
+
 import Heading from "../../components/Heading";
 
 export default function Why() {
+    const paragraphStyle = classNames("indent-4", "leading-10");
+
     return (
         <>
             <Heading.h2>なぜこんなものを作ったのか</Heading.h2>
-            <p>
+            <p className={paragraphStyle}>
                 この拡張機能は<a href="https://github.com/appare45/gaming-manaba">gaming-manaba</a>
                 という筑波大学の学習支援システムのゲーミング化を行う拡張機能に由来しています。
+                直接的なきっかけはたったこれだけですが、根本的な理由に私のスキルの向上と個人的な思想の表明があります。
             </p>
-            <p>直接的なきっかけは上記ですが、根本的な理由に私のスキルの向上と個人的な思想の表明があります。</p>
             <Heading.h2>技術的観点</Heading.h2>
-            <p>この拡張機能の開発にはTypeScriptやReactを用いています。</p>
-            <p>今までこれらをNext.js上でしか使っていなかったので、WebPackを一から自力で設定して構築してみようとしました。</p>
+            <p className={paragraphStyle}>
+                この拡張機能の開発にはTypeScriptやReactを用いています。今までこれらをNext.js上でしか使っていなかったので、WebPackを一から自力で設定して構築してみようとしました。
+                フロントエンドのこういった技術は歴史的背景も相まってすごい複雑ですね…
+            </p>
+
             <Heading.h2>個人的思想</Heading.h2>
-            <p>
+            <p className={paragraphStyle}>
                 突然ですが、私は先日に新しいPCを自作しました。初めて簡易水冷に挑戦したのですが、色々気づいたことがあります。
                 というのも、最近のPCパーツはハイエンドになればなるほどゲーミングを銘打ったもの以外がなくなっていきます。
                 個人的には開発とかクリエイターとか、ゲーミング用途以外でハイスペックを要求するシチュエーションは非常に多いと思うんですがね。
@@ -22,7 +29,7 @@ export default function Why() {
                 特に簡易水冷クーラーにおいてはその傾向が非常に顕著で、光らないクーラーを製造しているのはほんの数社しかありません。
                 設定でLEDをオフにすればいいとかの話ではなく、そもそも光らずにかっこいいデザインというものがほぼありません。
             </p>
-            <p>
+            <p className={paragraphStyle}>
                 私はあまりAppleは好きではないのですが、iPhone5の頃のAppleのデザインは大好きなんです。
                 （これは今でも言えますが）Appleはゲーミングを銘打ってバカみたいに虹色に光らせたことがありますか？？
                 Appleの設計思想そのものは非常に好きではないので、あまりApple製品は持っていない上に、最近のAppleのデザインもあまり好きではないのですが、それでもまだゲーミングを名乗る程落ちぶれているとも思えません。
@@ -36,18 +43,18 @@ export default function Why() {
                 また、Apple製品では外部サービスとの連携の融通が恐ろしいほど効きません。Androidデバイスを仮にUSB接続をしても中のファイルシステムを覗くことはデフォルトではできません。
                 これはおそらく、Appleがユーザーに対して「あなたは自分のデバイスの中身を知る必要はない」という完璧人間な素晴らしい考えを持っているからなのではないかとさえ思ってしまいます。
             </p>
-            <p>
+            <p className={paragraphStyle}>
                 だらだらと嫌いなものについてのヘイトを吐き出していましたが、言いたいのは「無意味に単純化しすぎる」ことも「センスもなしに煌びやかにする」ことの双方が完全に邪悪であるということです。
                 そして、この拡張機能は（ウェブ業界を独占している）GoogleChromeでのみ動作し、ゲーミングという素晴らしいデザインを群馬大学のウェブサイトに提供しています。
                 ゲーミングという謎の虹色に光らせる文化は、ぶっちゃけセンスのない陰キャがただ光らせればかっこいいだろうというだけの理由で流行ったとしか思えません。
                 が、こんなことをSNS上に書き込んでは速攻で炎上するので、ここで吐き出しておきます。
             </p>
-            <p>
+            <p className={paragraphStyle}>
                 ここまで世間のゲーミングデバイスとAppleの双方に対して自分の意見をぶつけてきましたが、最も文句を言いたいのは現代の市場であるとしか言いようがありません。
                 資本主義においては資本が正義であり、企業が資本を生み出す原点は需要です。こんなゲーミングが世間に蔓延っているのも消費者の多くがそれを望んだからに他なりません。
                 つまり自作パーツのデザインの単調化と、ゲーミングとかいうデザインとも呼べない何かの流行の原因の一端は消費者にあると言っても過言ではありません。
             </p>
-            <p>
+            <p className={paragraphStyle}>
                 現在のWindowsに代表されるように一度そのもので市場が定着してしまうと、そこから改革を起こすのは難しくなってしまいます。
                 （Windowsに対するヘイトはおまけで語ります。）
                 デザインというのは比較的流行り廃りが激しいものであり、Googleのマテリアルデザインのように同じ思想のデザインの中でもバリエーションが生まれるものです。
@@ -59,30 +66,28 @@ export default function Why() {
                 </a>
                 最高にかっこいいデザインを是非紹介してあげたい。
             </p>
-            <p>
+            <p className={paragraphStyle}>
                 そんなわけで、この拡張機能はゲーミングデバイスを嫌っている私が、ゲーミングを銘打って虹色に光らせることが如何に素晴らしく馬鹿らしいかを証明するために作りました。
             </p>
             <Heading.h2>おまけ -Windowsのシェアに対する市場の責任-</Heading.h2>
-            <p>
+            <p className={paragraphStyle}>
                 私が最初に触ったWindowsはXPで、その後に歴史的興味の元でWindows 2000やMe、95などを少し触りました。
                 当時の歴史から見ると、Windowsの普及はDOSの普及の引き継ぎであったと認識しています。MS-DOSはCP/M-86との争いに勝ち、IBMがMS-DOSを採用したことで普及しました。
                 まだLinuxの発達が十分ではなく、Unixも商業としてフレームワーク等で動作するOSだったと考えると致し方ないのかもしれません。
-            </p>
-            <p>
                 その後日本国内ではPC-98が爆発的な人気を誇ったが、それもPC/AT互換機の普及によって終焉を迎えました。個人的にはその終焉は日本のバブル崩壊によって投資が行われなくなったことに起因していると考えていますが、海外でPC/AT互換機が流行し淘汰された経緯はあまり詳しく理解できていません。（この頃の事情を詳しく知っている人がいたら連絡をください。）
                 この段階でPC/AT互換機のスタンダードOSとして確固たる地位を築き上げました。PC/AT互換ではないPCで結局現代まで生き残ったのはAppleのMackintoshだけだと考えています。(PC-98以降で独自路線を征こうとした企業はあったのだろうか)
                 結局現代ではWindowsかOS
                 X（macOS）という状況になってしまいました。私はもう少し選択肢があってもいいのではないかと思います。
             </p>
-            <p>
+            <p className={paragraphStyle}>
                 もちろん多くの人間にLinuxを使えと強要する気は一切ありません。Linuxもハードウェアのサポートが完全とは言えず、私の最新機でも一部のMBの機能は正常に動作しないのが現状です。
                 Appleが今後Apple
                 Silicone上でまともにmacOS以外のOSが動作することを保証するとは全く想定できないのですが、AsahiLinuxのようなものの登場は非常に喜ばしいですね。
                 Windowsはすでに多くの技術的負債を抱えており、解消にはWin32を捨て去った全く別のOSが必要だと考えています。市場の消費者の一員として少しでもこの2社によるオペレーティングシステムの寡占状態の解消のために何か行動を起こすべきでしょう。
                 まずはコーディング環境として、Windows Subsystem for
                 Linuxを使うことをおすすめします。CRLFやShiftJISなどのWindowsの遺産を捨て去るべきです。
             </p>
-            <p>
+            <p className={paragraphStyle}>
                 私自身はデジタルゆとり世代なので、かつてのメモリが数MBしかなかった時代を知らず、富豪のようにメモリを食い尽くすような頭の悪いコードを書いていますが、かつてアセンブリのみでコードをかいてた人たちは本当に尊敬しています。
                 けれども技術の進化が進んでいる今、その頃の痕跡を残す必要は全くありません。市場の流行や世間に流されることなく、合理的な選択を私は願っています。
             </p>