ref: random stuffs

src/BetterYTM.user.ts

@@ -3,13 +3,13 @@ import { dbg, info } from "./constants";
 import { getDomain, initSiteEvents } from "./utils";
 import {
   // layout
-  addMediaCtrlGeniusBtn, initQueueButtons, addWatermark,
+  initQueueButtons, addWatermark,
   preInitLayout, removeUpgradeTab, setVolSliderSize,
   setVolSliderStep,
   // lyrics
-  geniUrlBase,
+  addMediaCtrlGeniusBtn, geniUrlBase,
   // input
-  initArrowKeySkip, initSiteSwitch,
+  initArrowKeySkip, initSiteSwitch, addAnchorImprovements,
   // menu
   initMenu, addMenu,
 } from "./features/index";
@@ -65,6 +65,9 @@ async function onDomLoad() {
       if(typeof features.volumeSliderSize === "number")
         setVolSliderSize();
 
+      if(features.anchorImprovements)
+        addAnchorImprovements();
+
       setVolSliderStep();
     }
 

src/features/index.ts

@@ -6,8 +6,10 @@ export * from "./lyrics";
 export { initMenu } from "./menu/menu"; // TODO
 export * from "./menu/menu_old";
 
+export type FeatureCategory = "input" | "layout" | "lyrics";
+
 /** Contains all possible features with their default values and other config */
-export const featInfo = {
+export const featInfo = Object.freeze({
   //#SECTION input
   arrowKeySupport: {
     desc: "Arrow keys skip forwards and backwards by 10 seconds",
@@ -32,6 +34,12 @@ export const featInfo = {
       meta: false,
     },
   },
+  anchorImprovements: {
+    desc: "TODO: Make it so middle clicking a song to open it in a new tab is easier",
+    type: "toggle",
+    category: "input",
+    default: true,
+  },
 
   //#SECTION layout
   removeUpgradeTab: {
@@ -47,6 +55,7 @@ export const featInfo = {
     min: 10,
     max: 1000,
     step: 5,
+    unit: "px",
     default: 160,
   },
   volumeSliderStep: {
@@ -63,12 +72,6 @@ export const featInfo = {
     category: "layout",
     default: true,
   },
-  anchorAroundThumbnail: {
-    desc: "TODO: Make it so middle clicking a song to open in a new tab is easier",
-    type: "toggle",
-    category: "layout",
-    default: true,
-  },
   queueButtons: {
     desc: "TODO: Add buttons while hovering over a song in a queue to quickly remove it or open its lyrics",
     type: "toggle",
@@ -89,4 +92,4 @@ export const featInfo = {
     category: "lyrics",
     default: true,
   },
-};
+});

src/features/layout.ts

@@ -141,3 +141,9 @@ function addQueueButtons(queueItem: HTMLElement) {
   songInfo.appendChild(queueBtnsCont);
   queueItem.classList.add("bytm-has-queue-btns");
 }
+
+//#MARKER better clickable stuff
+
+export function addAnchorImprovements() {
+  void 0;
+}

src/features/menu/menu_old.ts

@@ -177,7 +177,10 @@ export async function addMenu() {
       if(type === "toggle" && typeof initialVal !== "undefined")
         inputElem.checked = Boolean(initialVal);
 
-      const fmtVal = (v: unknown) => String(v);
+      // @ts-ignore
+      const unitTxt = ftInfo?.unit ? " " + ftInfo.unit : "";
+
+      const fmtVal = (v: unknown) => String(v).trim();
       const toggleLabelText = (toggled: boolean) => toggled ? "On" : "Off";
 
       let labelElem: HTMLLabelElement | undefined;
@@ -187,7 +190,7 @@ export async function addMenu() {
         labelElem.style.marginRight = "20px";
         labelElem.style.fontSize = "16px";
         labelElem.htmlFor = inputElemId;
-        labelElem.innerText = fmtVal(initialVal);
+        labelElem.innerText = fmtVal(initialVal) + unitTxt;
 
         inputElem.addEventListener("input", () => {
           if(labelElem)
@@ -201,11 +204,11 @@ export async function addMenu() {
         labelElem.style.paddingRight = "5px";
         labelElem.style.fontSize = "16px";
         labelElem.htmlFor = inputElemId;
-        labelElem.innerText = toggleLabelText(Boolean(initialVal));
+        labelElem.innerText = toggleLabelText(Boolean(initialVal)) + unitTxt;
 
         inputElem.addEventListener("input", () => {
           if(labelElem)
-            labelElem.innerText = toggleLabelText(inputElem.checked);
+            labelElem.innerText = toggleLabelText(inputElem.checked) + unitTxt;
         });
       }
 
@@ -225,9 +228,9 @@ export async function addMenu() {
 
         if(labelElem) {
           if(type === "toggle")
-            labelElem.innerText = toggleLabelText(inputElem.checked);
+            labelElem.innerText = toggleLabelText(inputElem.checked) + unitTxt;
           else
-            labelElem.innerText = fmtVal(parseInt(inputElem.value));
+            labelElem.innerText = fmtVal(parseInt(inputElem.value)) + unitTxt;
         }
 
         if(typeof initialVal !== "undefined")

src/types.d.ts

@@ -15,6 +15,8 @@ export interface FeatureConfig {
     ctrl: boolean;
     meta: boolean;
   };
+  /** TODO: Make it so middle clicking a song to open it in a new tab (through thumbnail and song title) is easier */
+  anchorImprovements: boolean;
 
   //#SECTION layout
   /** Remove the \"Upgrade\" / YT Music Premium tab */
@@ -25,8 +27,6 @@ export interface FeatureConfig {
   volumeSliderStep: number;
   /** Show a BetterYTM watermark under the YTM logo */
   watermarkEnabled: boolean;
-  /** TODO: Add an <a>nchor around song thumbnails */
-  anchorAroundThumbnail: boolean;
   /** TODO: Add buttons while hovering over a song in a queue to quickly remove it or open its lyrics */
   queueButtons: boolean;
   /** TODO: Automatically dismisses the "are you still there" popup */