feat: made as many features not require reload as possible

src/features/behavior.ts

@@ -31,7 +31,6 @@ export async function initBeforeUnloadHook() {
 export async function initAutoCloseToasts() {
   try {
     const animTimeout = 300;
-    const closeTimeout = Math.max(getFeatures().closeToastsTimeout * 1000 + animTimeout, animTimeout);
 
     addSelectorListener("popupContainer", "tp-yt-paper-toast#toast", {
       all: true,
@@ -45,6 +44,7 @@ export async function initAutoCloseToasts() {
             continue;
           toastElem.classList.add("bytm-closing");
 
+          const closeTimeout = Math.max(getFeatures().closeToastsTimeout * 1000 + animTimeout, animTimeout);
           await pauseFor(closeTimeout);
 
           toastElem.classList.remove("paper-toast-open");

src/features/index.ts

@@ -126,6 +126,8 @@ export const featInfo = {
       { value: "never", label: t("thumbnail_overlay_behavior_never") },
     ],
     default: "songsOnly",
+    reloadRequired: false,
+    enable: noop,
   },
   thumbnailOverlayToggleBtnShown: {
     type: "toggle",
@@ -155,6 +157,8 @@ export const featInfo = {
     type: "toggle",
     category: "layout",
     default: true,
+    reloadRequired: false,
+    enable: noop,
   },
   hideCursorOnIdleDelay: {
     type: "slider",
@@ -165,9 +169,9 @@ export const featInfo = {
     default: 3,
     unit: "s",
     advanced: true,
+    textAdornment: adornments.advanced,
     reloadRequired: false,
     enable: noop,
-    textAdornment: adornments.advanced,
   },
 
   //#region volume
@@ -224,6 +228,8 @@ export const featInfo = {
     default: 100,
     unit: "%",
     textAdornment: () => getFeatures().volumeSharedBetweenTabs ? adornments.warning(t("feature_warning_setInitialTabVolume_volumeSharedBetweenTabs_incompatible").replace(/"/g, "'")) : undefined,
+    reloadRequired: false,
+    enable: noop,
   },
 
   //#region song lists
@@ -261,6 +267,8 @@ export const featInfo = {
     step: 0.5,
     default: 0,
     unit: "s",
+    reloadRequired: false,
+    enable: noop,
   },
   rememberSongTime: {
     type: "toggle",
@@ -284,6 +292,8 @@ export const featInfo = {
     unit: "s",
     advanced: true,
     textAdornment: adornments.advanced,
+    reloadRequired: false,
+    enable: noop,
   },
   rememberSongTimeReduction: {
     type: "number",
@@ -295,6 +305,8 @@ export const featInfo = {
     unit: "s",
     advanced: true,
     textAdornment: adornments.advanced,
+    reloadRequired: false,
+    enable: noop,
   },
   rememberSongTimeMinPlayTime: {
     type: "slider",
@@ -306,6 +318,8 @@ export const featInfo = {
     unit: "s",
     advanced: true,
     textAdornment: adornments.advanced,
+    reloadRequired: false,
+    enable: noop,
   },
 
   //#region input
@@ -313,6 +327,8 @@ export const featInfo = {
     type: "toggle",
     category: "input",
     default: true,
+    reloadRequired: false,
+    enable: noop,
   },
   arrowKeySkipBy: {
     type: "number",
@@ -321,11 +337,15 @@ export const featInfo = {
     max: 60,
     step: 0.5,
     default: 5,
+    reloadRequired: false,
+    enable: noop,
   },
   switchBetweenSites: {
     type: "toggle",
     category: "input",
     default: true,
+    reloadRequired: false,
+    enable: noop,
   },
   switchSitesHotkey: {
     type: "hotkey",
@@ -348,6 +368,8 @@ export const featInfo = {
     type: "toggle",
     category: "input",
     default: true,
+    reloadRequired: false,
+    enable: noop,
   },
 
   //#region lyrics
@@ -363,6 +385,8 @@ export const featInfo = {
     normalize: (val: string) => val.trim().replace(/\/+$/, ""),
     advanced: true,
     textAdornment: adornments.advanced,
+    reloadRequired: false,
+    enable: noop,
   },
   geniUrlToken: {
     type: "text",
@@ -372,6 +396,8 @@ export const featInfo = {
     normalize: (val: string) => val.trim(),
     advanced: true,
     textAdornment: adornments.advanced,
+    reloadRequired: false,
+    enable: noop,
   },
   lyricsCacheMaxSize: {
     type: "slider",
@@ -383,6 +409,8 @@ export const featInfo = {
     unit: (val: number) => " " + tp("unit_entries", val),
     advanced: true,
     textAdornment: adornments.advanced,
+    reloadRequired: false,
+    enable: noop,
   },
   lyricsCacheTTL: {
     type: "slider",
@@ -394,11 +422,12 @@ export const featInfo = {
     unit: (val: number) => " " + tp("unit_days", val),
     advanced: true,
     textAdornment: adornments.advanced,
+    reloadRequired: false,
+    enable: noop,
   },
   clearLyricsCache: {
     type: "button",
     category: "lyrics",
-    default: undefined,
     async click() {
       const entries = getLyricsCache().length;
       if(confirm(tp("lyrics_clear_cache_confirm_prompt", entries, entries))) {
@@ -416,6 +445,8 @@ export const featInfo = {
     change: () => setTimeout(() => confirm(t("lyrics_cache_changed_clear_confirm")) && clearLyricsCache(), 200),
     advanced: true,
     textAdornment: adornments.experimental,
+    reloadRequired: false,
+    enable: noop,
   },
 
   //#region general
@@ -434,7 +465,6 @@ export const featInfo = {
   checkVersionNow: {
     type: "button",
     category: "general",
-    default: undefined,
     click: () => doVersionCheck(true),
   },
   logLevel: {

src/features/input.ts

@@ -13,6 +13,9 @@ export const inputIgnoreTagNames = ["INPUT", "TEXTAREA", "SELECT", "BUTTON", "A"
 
 export async function initArrowKeySkip() {
   document.addEventListener("keydown", (evt) => {
+    if(!getFeatures().arrowKeySupport)
+      return;
+
     if(!["ArrowLeft", "ArrowRight"].includes(evt.code))
       return;
     // discard the event when a (text) input is currently active, like when editing a playlist
@@ -45,11 +48,15 @@ let siteSwitchEnabled = true;
 /** Initializes the site switch feature */
 export async function initSiteSwitch(domain: Domain) {
   document.addEventListener("keydown", (e) => {
+    if(!getFeatures().switchBetweenSites)
+      return;
     const hk = getFeatures().switchSitesHotkey;
     if(siteSwitchEnabled && e.code === hk.code && e.shiftKey === hk.shift && e.ctrlKey === hk.ctrl && e.altKey === hk.alt)
       switchSite(domain === "yt" ? "ytm" : "yt");
   });
   siteEvents.on("hotkeyInputActive", (state) => {
+    if(!getFeatures().switchBetweenSites)
+      return;
     siteSwitchEnabled = !state;
   });
   log("Initialized site switch listener");
@@ -108,6 +115,8 @@ const numKeysIgnoreIds = ["progress-bar", "song-media-window"];
 /** Adds the ability to skip to a certain time in the video by pressing a number key (0-9) */
 export async function initNumKeysSkip() {
   document.addEventListener("keydown", (e) => {
+    if(!getFeatures().numKeysSkipToTime)
+      return;
     if(!e.key.trim().match(/^[0-9]$/))
       return;
     if(isCfgMenuOpen)

src/features/layout.ts

@@ -431,9 +431,8 @@ export async function addScrollToActiveBtn() {
 let invertOverlay = false;
 
 export async function initThumbnailOverlay() {
-  const behavior = getFeatures().thumbnailOverlayBehavior;
   const toggleBtnShown = getFeatures().thumbnailOverlayToggleBtnShown;
-  if(behavior === "never" && !toggleBtnShown)
+  if(getFeatures().thumbnailOverlayBehavior === "never" && !toggleBtnShown)
     return;
 
   await waitVideoElementReady();
@@ -449,6 +448,8 @@ export async function initThumbnailOverlay() {
     if(!domLoaded)
       return;
 
+    const behavior = getFeatures().thumbnailOverlayBehavior;
+
     let showOverlay = behavior === "always";
     const isVideo = currentMediaType() === "video";
 
@@ -607,6 +608,8 @@ export async function initHideCursorOnIdle() {
       let hideTransTimer: ReturnType<typeof setTimeout> | undefined;
 
       const hide = () => {
+        if(!getFeatures().hideCursorOnIdle)
+          return;
         if(vidContainer.classList.contains("bytm-cursor-hidden"))
           return;
         overlayElem.style.opacity = ".000001 !important";

src/features/lyricsCache.ts

@@ -110,8 +110,8 @@ export function addLyricsCacheEntryBest(artist: string, song: string, url: strin
   cache.push(entry);
   cache.sort((a, b) => b.viewed - a.viewed);
 
-  if(cache.length > getFeatures().lyricsCacheMaxSize)
-    cache.pop();
+  // always keep the cache <= max size
+  cache.splice(getFeatures().lyricsCacheMaxSize);
 
   log("Added cache entry for best result", artist, "-", song, "\n", entry);
 
@@ -150,8 +150,8 @@ export function addLyricsCacheEntryPenalized(artist: string, song: string, url:
   cache.push(entry);
   cache.sort((a, b) => b.viewed - a.viewed);
 
-  if(cache.length > getFeatures().lyricsCacheMaxSize)
-    cache.pop();
+  // always keep the cache <= max size
+  cache.splice(getFeatures().lyricsCacheMaxSize);
 
   log("Added penalized cache entry for", artist, "-", song, "with penalty fraction", penaltyFr, "\n", entry);
 

src/index.ts

@@ -185,14 +185,12 @@ async function onDomLoad() {
 
       //#region (ytm) input
 
-      if(features.arrowKeySupport)
-        ftInit.push(initArrowKeySkip());
+      ftInit.push(initArrowKeySkip());
 
       if(features.anchorImprovements)
         ftInit.push(addAnchorImprovements());
 
-      if(features.numKeysSkipToTime)
-        ftInit.push(initNumKeysSkip());
+      ftInit.push(initNumKeysSkip());
 
       //#region (ytm) lyrics
 
@@ -220,8 +218,7 @@ async function onDomLoad() {
 
       //#region (ytm+yt) input
 
-      if(features.switchBetweenSites)
-        ftInit.push(initSiteSwitch(domain));
+      ftInit.push(initSiteSwitch(domain));
 
       // TODO: for hot reloading features
       // ftInit.push(new Promise((resolve) => {

src/types.ts

@@ -251,14 +251,14 @@ type FeatureTypeProps = ({
     type: "hotkey";
     default: HotkeyObj;
   } & FeatureFuncProps)
-  | {
+  | ({
     type: "text";
     default: string;
     normalize?: (val: string) => string;
-  }
+  } & FeatureFuncProps)
   | {
     type: "button";
-    default: undefined;
+    default?: undefined;
     click: () => Promise<void> | void;
   }