From df5e644a9440395f3d10c6dabafb6478ed9d3a8f Mon Sep 17 00:00:00 2001 From: sethburkart123 Date: Wed, 19 Jun 2024 22:28:15 +1000 Subject: [PATCH] refactor: Optimize element search and remove unused code in SEQTA.ts and injected.scss --- src/SEQTA.ts | 11 +++- src/css/documentload.scss | 70 ++++++++++++++++++++++++++ src/css/injected.scss | 69 ------------------------- src/seqta/ui/AddBetterSEQTAElements.ts | 21 ++++---- 4 files changed, 90 insertions(+), 81 deletions(-) diff --git a/src/SEQTA.ts b/src/SEQTA.ts index 022dc7d0..1d003689 100644 --- a/src/SEQTA.ts +++ b/src/SEQTA.ts @@ -700,7 +700,13 @@ export function tryLoad() { updateIframesWithDarkMode() // Waits for page to call on load, run scripts - removeThemeTagsFromNotices() + document.addEventListener( + 'load', + function () { + removeThemeTagsFromNotices() + }, + true, + ) } function ChangeMenuItemPositions(storage: any) { @@ -770,7 +776,7 @@ function main() { } const handleDisabled = () => { - waitForElm('.code').then(AppendElementsToDisabledPage) + waitForElm('.code', true, 50).then(AppendElementsToDisabledPage) } if (settingsState.onoff) { @@ -789,6 +795,7 @@ function main() { tryLoad() } else { handleDisabled() + window.addEventListener('load', handleDisabled) } } diff --git a/src/css/documentload.scss b/src/css/documentload.scss index 8d332a3f..e80d0410 100644 --- a/src/css/documentload.scss +++ b/src/css/documentload.scss @@ -22,3 +22,73 @@ html { background-color: #161616; font-family: Rubik, Roboto !important; } + +.tooltip svg { + fill: var(--theme-primary); +} +.tooltip { + display: inline-block; + z-index: 5 !important; + width: 28px; + background: none; + box-shadow: none; + padding: 2px; + position: absolute; +} +.tooltip .tooltiptext { + width: 120px; + transform: scale(0); + transition: transform 0.2s; + transform-origin: top; + background: var(--background-primary); + color: var(--text-primary); + text-align: center; + border-radius: 6px; + padding: 2px; + position: absolute; + z-index: 1; + top: 105%; + left: 50%; + margin-left: -62px; +} +.tooltip .tooltiptext::after { + content: ""; + position: absolute; + bottom: 100%; + left: 50%; + margin-left: -5px; + border-width: 5px; + border-style: solid; + border-color: transparent transparent var(--text-primary) transparent; +} +.tooltiptext p:hover { + cursor: pointer; + background: rgba(0, 0, 0, 0.3) !important; + transition: 200ms; +} +.tooltiptext p { + border-radius: 8px !important; + padding-top: 2px; + padding-bottom: 2px; + margin: 2px; +} +.tooltip:hover .tooltiptext { + transform: scale(1); + transform-origin: top; + transition: transform 0.2s; +} +body:has(.outside-container:not(.hide)) #AddedSettings.tooltip:hover > .tooltiptext { + transform: scale(0); +} +.assessmenttooltip svg { + fill: var(--text-primary); +} +.assessmenttooltip { + bottom: 0px; + left: 5px; +} +.topmenutooltip { + top: 115% !important; + background: var(--text-primary) !important; + color: var(--theme-primary) !important; +} \ No newline at end of file diff --git a/src/css/injected.scss b/src/css/injected.scss index c8283396..54c0ef43 100644 --- a/src/css/injected.scss +++ b/src/css/injected.scss @@ -2811,80 +2811,11 @@ li.MessageList__unread___3imtO { background: var(--auto-background); outline: solid 1px black; } -.tooltip svg { - fill: var(--theme-primary); -} -.tooltip { - display: inline-block; - z-index: 5 !important; - width: 28px; - background: none; - box-shadow: none; - padding: 2px; - position: absolute; -} -.tooltip .tooltiptext { - width: 120px; - transform: scale(0); - transition: transform 0.2s; - transform-origin: top; - background: var(--background-primary); - color: var(--text-primary); - text-align: center; - border-radius: 6px; - padding: 2px; - position: absolute; - z-index: 1; - top: 105%; - left: 50%; - margin-left: -62px; -} -.tooltip .tooltiptext::after { - content: ""; - position: absolute; - bottom: 100%; - left: 50%; - margin-left: -5px; - border-width: 5px; - border-style: solid; - border-color: transparent transparent var(--text-primary) transparent; -} -.tooltiptext p:hover { - cursor: pointer; - background: rgba(0, 0, 0, 0.3) !important; - transition: 200ms; -} -.tooltiptext p { - border-radius: 8px !important; - padding-top: 2px; - padding-bottom: 2px; - margin: 2px; -} -.tooltip:hover .tooltiptext { - transform: scale(1); - transform-origin: top; - transition: transform 0.2s; -} -body:has(.outside-container:not(.hide)) #AddedSettings.tooltip:hover > .tooltiptext { - transform: scale(0); -} -.assessmenttooltip svg { - fill: var(--text-primary); -} -.assessmenttooltip { - bottom: 0px; - left: 5px; -} .DarkLightButton { right: 145px !important; z-index: 21 !important; top: 17.5px; } -.topmenutooltip { - top: 115% !important; - background: var(--text-primary) !important; - color: var(--theme-primary) !important; -} .whatsnewContainer { position: absolute; width: 38em; diff --git a/src/seqta/ui/AddBetterSEQTAElements.ts b/src/seqta/ui/AddBetterSEQTAElements.ts index 5ceaa7b4..77b4ea6a 100644 --- a/src/seqta/ui/AddBetterSEQTAElements.ts +++ b/src/seqta/ui/AddBetterSEQTAElements.ts @@ -16,18 +16,15 @@ export async function AddBetterSEQTAElements() { handleStudentData(); createNewsButton(); setupEventListeners(); - } - - appendBackgroundToUI(); - addExtensionSettings(); - if (settingsState.onoff) { + appendBackgroundToUI(); await createSettingsButton(); await addDarkLightToggle(); customizeMenuToggle(); - } else { - await createSettingsButton(); } + addExtensionSettings(); + if (!settingsState.onoff) await createSettingsButton(); + setupSettingsButton(); } @@ -212,9 +209,13 @@ function setupEventListeners() { } async function createSettingsButton() { - let SettingsButton = stringToHTML( - '' - ); + let SettingsButton = stringToHTML( /* html */` + + `); let ContentDiv = document.getElementById('content'); ContentDiv!.append(SettingsButton.firstChild!); }