refactor: clean up and fix bg durations

src/SEQTA.ts

@@ -86,8 +86,8 @@ function SetDisplayNone(ElementName: string) {
   return `li[data-key=${ElementName}]{display:var(--menuHidden) !important; transition: 1s;}`
 }
 
-export function enableAnimatedBackground(item: any) {
+export function enableAnimatedBackground() {
-  if (item.animatedbk) {
+  if (settingsState.animatedbk) {
     CreateBackground()
   } else {
     RemoveBackground()

src/seqta/ui/AddBetterSEQTAElements.ts

@@ -7,11 +7,9 @@ import { settingsState } from "../utils/listeners/SettingsState";
 import { updateAllColors } from "./colors/Manager";
 
 export async function AddBetterSEQTAElements(toggle: any) {
-  if (toggle) {
+  if (toggle) {    
-    const result = await browser.storage.local.get();
+    initializeSettings();
-    
+    addDarkMode(settingsState.DarkMode);
-    initializeSettings(result);
-    addDarkMode(result.DarkMode);
     createHomeButton();
     await handleUserInfo();
     handleStudentData();
@@ -32,9 +30,9 @@ export async function AddBetterSEQTAElements(toggle: any) {
   setupSettingsButton();
 }
 
-function initializeSettings(result: any) {
+function initializeSettings() {
-  enableAnimatedBackground(result);
+  enableAnimatedBackground();
-  updateBgDurations(result);
+  updateBgDurations();
 }
 
 function addDarkMode(DarkMode: boolean) {

src/seqta/ui/Animation.ts

@@ -1,20 +1,18 @@
+import { settingsState } from "../utils/listeners/SettingsState";
+
 /**
  * Update the background animation durations based on the slider input.
  * @param {Object} item - The object containing the bksliderinput property.
  * @param {number} [minDuration=1] - The minimum animation duration in seconds.
  * @param {number} [maxDuration=10] - The maximum animation duration in seconds.
  */
-export function updateBgDurations(speed: any, minDuration = 0.5, maxDuration = 10) {
+export function updateBgDurations(minDuration: number = 0.5, maxDuration: number = 10) {
   // Class names to look for
   const bgClasses = ['bg', 'bg2', 'bg3'];
   let reversedValue: any;
 
-  if (speed.bksliderinput === undefined) {
+  // Reverse the slider direction to align with the animation
-    // Reverse the slider direction to align with the animation
+  reversedValue = 150 - parseInt(settingsState.bksliderinput);
-    reversedValue = 150 - speed;
-  } else {
-    reversedValue = 150 - speed.bksliderinput;
-  }
   
   // Range of possible animation durations
   const durationRange = maxDuration - minDuration;