From c52b217109e62b73dbc291884917c7c8bac67641 Mon Sep 17 00:00:00 2001 From: Crazypersonalph <93847055+Crazypersonalph@users.noreply.github.com> Date: Mon, 4 Dec 2023 12:13:36 +0800 Subject: [PATCH] fix animatedbk --- interface/package.json | 4 +++- interface/pnpm-lock.yaml | 14 ++++++++++++++ interface/src/hooks/ThemeManagment.tsx | 11 ++++++----- interface/src/hooks/settingsState.ts | 13 +++++++------ interface/src/main.tsx | 3 ++- interface/src/pages/Settings.tsx | 4 +++- pnpm-lock.yaml | 8 +++----- src/SEQTA.js | 6 +++++- 8 files changed, 43 insertions(+), 20 deletions(-) diff --git a/interface/package.json b/interface/package.json index 7a7f2365..381e2b97 100644 --- a/interface/package.json +++ b/interface/package.json @@ -11,12 +11,14 @@ }, "dependencies": { "@types/chrome": "^0.0.246", + "@types/webextension-polyfill": "^0.10.7", "framer-motion": "^10.16.4", "react": "^18.2.0", "react-best-gradient-color-picker": "2.2.24", "react-dom": "^18.2.0", "react-router-dom": "latest", - "tinycolor2": "^1.6.0" + "tinycolor2": "^1.6.0", + "webextension-polyfill": "^0.10.0" }, "devDependencies": { "@types/react": "^18.2.15", diff --git a/interface/pnpm-lock.yaml b/interface/pnpm-lock.yaml index 8a595000..7718c35e 100644 --- a/interface/pnpm-lock.yaml +++ b/interface/pnpm-lock.yaml @@ -8,6 +8,9 @@ dependencies: '@types/chrome': specifier: ^0.0.246 version: 0.0.246 + '@types/webextension-polyfill': + specifier: ^0.10.7 + version: 0.10.7 framer-motion: specifier: ^10.16.4 version: 10.16.12(react-dom@18.2.0)(react@18.2.0) @@ -26,6 +29,9 @@ dependencies: tinycolor2: specifier: ^1.6.0 version: 1.6.0 + webextension-polyfill: + specifier: ^0.10.0 + version: 0.10.0 devDependencies: '@types/react': @@ -709,6 +715,10 @@ packages: resolution: {integrity: sha512-dn1l8LaMea/IjDoHNd9J52uBbInB796CDffS6VdIxvqYCPSG0V0DzHp76GpaWnlhg88uYyPbXCDIowa86ybd5A==} dev: true + /@types/webextension-polyfill@0.10.7: + resolution: {integrity: sha512-10ql7A0qzBmFB+F+qAke/nP1PIonS0TXZAOMVOxEUsm+lGSW6uwVcISFNa0I4Oyj0884TZVWGGMIWeXOVSNFHw==} + dev: false + /@typescript-eslint/eslint-plugin@6.13.1(@typescript-eslint/parser@6.13.1)(eslint@8.55.0)(typescript@5.3.2): resolution: {integrity: sha512-5bQDGkXaxD46bPvQt08BUz9YSaO4S0fB1LB5JHQuXTfkGPI3+UUeS387C/e9jRie5GqT8u5kFTrMvAjtX4O5kA==} engines: {node: ^16.0.0 || >=18.0.0} @@ -2249,6 +2259,10 @@ packages: fsevents: 2.3.3 dev: true + /webextension-polyfill@0.10.0: + resolution: {integrity: sha512-c5s35LgVa5tFaHhrZDnr3FpQpjj1BB+RXhLTYUxGqBVN460HkbM8TBtEqdXWbpTKfzwCcjAZVF7zXCYSKtcp9g==} + dev: false + /which@2.0.2: resolution: {integrity: sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==} engines: {node: '>= 8'} diff --git a/interface/src/hooks/ThemeManagment.tsx b/interface/src/hooks/ThemeManagment.tsx index 5bd45538..51c8bf5f 100644 --- a/interface/src/hooks/ThemeManagment.tsx +++ b/interface/src/hooks/ThemeManagment.tsx @@ -1,3 +1,4 @@ +import browser from 'webextension-polyfill' interface ThemeList { themes: string[]; selectedTheme: string; @@ -5,7 +6,7 @@ interface ThemeList { export const downloadTheme = async (themeName: string, themeURL: string) => { // send message to the background script - const response = await chrome.runtime.sendMessage({ + const response = await browser.runtime.sendMessage({ type: 'currentTab', info: 'DownloadTheme', body: { @@ -19,7 +20,7 @@ export const downloadTheme = async (themeName: string, themeURL: string) => { export const setTheme = async (themeName: string, themeURL: string) => { // send message to the background script - const response = await chrome.runtime.sendMessage({ + const response = await browser.runtime.sendMessage({ type: 'currentTab', info: 'SetTheme', body: { @@ -33,7 +34,7 @@ export const setTheme = async (themeName: string, themeURL: string) => { export const listThemes = async () => { // send message to the background script - const response: ThemeList = await chrome.runtime.sendMessage({ + const response: ThemeList = await browser.runtime.sendMessage({ type: 'currentTab', info: 'ListThemes' }); @@ -45,14 +46,14 @@ export const listThemes = async () => { } export const disableTheme = async () => { - await chrome.runtime.sendMessage({ + await browser.runtime.sendMessage({ type: 'currentTab', info: 'DisableTheme', }); }; export const deleteTheme = async (themeName: string) => { - await chrome.runtime.sendMessage({ + await browser.runtime.sendMessage({ type: 'currentTab', info: 'DeleteTheme', body: { diff --git a/interface/src/hooks/settingsState.ts b/interface/src/hooks/settingsState.ts index 2c5f6ffd..1bbdf309 100644 --- a/interface/src/hooks/settingsState.ts +++ b/interface/src/hooks/settingsState.ts @@ -1,4 +1,4 @@ -/*global chrome*/ +import browser from 'webextension-polyfill' import { useEffect, useMemo } from "react"; import { SettingsProps } from "../types/SettingsProps"; import { MainConfig, SettingsState } from "../types/AppProps"; @@ -12,7 +12,8 @@ const useSettingsState = ({ settingsState, setSettingsState }: SettingsProps) => RanOnce = true; // get the current settings state - chrome.storage.local.get(function(result: MainConfig) { + // @ts-expect-error idk js/ts wizardry + browser.storage.local.get().then().then(function(result: MainConfig) { setSettingsState({ notificationCollector: result.notificationcollector, lessonAlerts: result.lessonalert, @@ -43,7 +44,7 @@ const useSettingsState = ({ settingsState, setSettingsState }: SettingsProps) => "transparencyEffects": "transparencyEffects" }), []); - const storageChangeListener = (changes: chrome.storage.StorageChange) => { + const storageChangeListener = (changes: browser.Storage.StorageChange) => { for (const [key, { newValue }] of Object.entries(changes)) { if (key === "DarkMode") { if (key === "DarkMode" && newValue) { @@ -66,14 +67,14 @@ const useSettingsState = ({ settingsState, setSettingsState }: SettingsProps) => }; useEffect(() => { - chrome.storage.onChanged.addListener(storageChangeListener); + browser.storage.onChanged.addListener(storageChangeListener); return () => { - chrome.storage.onChanged.removeListener(storageChangeListener); + browser.storage.onChanged.removeListener(storageChangeListener); }; }); const setStorage = (key: keyof MainConfig, value: any) => { - chrome.storage.local.set({ [key]: value }); + browser.storage.local.set({ [key]: value }); } useEffect(() => { diff --git a/interface/src/main.tsx b/interface/src/main.tsx index 39082ae5..04114747 100644 --- a/interface/src/main.tsx +++ b/interface/src/main.tsx @@ -4,7 +4,8 @@ import { HashRouter, Routes, Route } from 'react-router-dom'; import './index.css'; import { SettingsContextProvider } from './SettingsContext.js'; import SettingsPage from './SettingsPage.js'; -const fontURL = chrome.runtime.getURL("fonts/IconFamily.woff"); +import browser from 'webextension-polyfill' +const fontURL = browser.runtime.getURL("fonts/IconFamily.woff"); const style = document.createElement("style"); style.setAttribute("type", "text/css"); diff --git a/interface/src/pages/Settings.tsx b/interface/src/pages/Settings.tsx index 13689a2d..fa6840f6 100644 --- a/interface/src/pages/Settings.tsx +++ b/interface/src/pages/Settings.tsx @@ -5,6 +5,8 @@ import PickerSwatch from '../components/PickerSwatch'; import { SettingsList } from '../types/SettingsProps'; import { useSettingsContext } from '../SettingsContext'; +import browser from 'webextension-polyfill' + const Settings: React.FC = () => { const { settingsState, setSettingsState } = useSettingsContext(); @@ -51,7 +53,7 @@ const Settings: React.FC = () => { { title: "Edit Sidebar Layout", description: "Customise the sidebar layout.", - modifyElement: + modifyElement: }, { title: "Transparency Effects", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 764beb31..32ff2fcb 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1,7 +1,7 @@ lockfileVersion: '6.0' settings: - autoInstallPeers: true + autoInstallPeers: false excludeLinksFromLockfile: false dependencies: @@ -563,10 +563,8 @@ packages: hasBin: true dev: true - /ajv-formats@2.1.1(ajv@8.12.0): + /ajv-formats@2.1.1: resolution: {integrity: sha512-Wx0Kx52hxE7C18hkMEggYlEifqWZtYaRgouJor+WMdPnQyEK13vgEWyVNup7SoeeoLMsr4kf5h6dOW11I15MUA==} - peerDependencies: - ajv: ^8.0.0 peerDependenciesMeta: ajv: optional: true @@ -2057,7 +2055,7 @@ packages: dependencies: '@types/json-schema': 7.0.15 ajv: 8.12.0 - ajv-formats: 2.1.1(ajv@8.12.0) + ajv-formats: 2.1.1 ajv-keywords: 5.1.0(ajv@8.12.0) dev: true diff --git a/src/SEQTA.js b/src/SEQTA.js index 813505af..8a314818 100644 --- a/src/SEQTA.js +++ b/src/SEQTA.js @@ -311,6 +311,10 @@ async function DeleteWhatsNew() { } export function CreateBackground() { + var bkCheck = document.getElementsByClassName('bg'); + if (bkCheck.length !== 0) { + return; + } // Creating and inserting 3 divs containing the background applied to the pages var bklocation = document.getElementById('container'); var menu = document.getElementById('menu'); @@ -336,10 +340,10 @@ export function RemoveBackground() { var bk3 = document.getElementsByClassName('bg3'); if (bk.length == 0 || bk2.length == 0 || bk3.length == 0) return; - bk[0].remove(); bk2[0].remove(); bk3[0].remove(); + console.log('it deleted???') } export function waitForElm(selector) {