Merge pull request #700 from Araxeus/rip-video-toggle-plugin

add different modes to video-toggle plugin

config/defaults.js

@@ -80,6 +80,7 @@ const defaultConfig = {
 		},
 		"video-toggle": {
 			enabled: false,
+			mode: "custom",
 			forceHide: false,
 		},
 	},

config/store.js

@@ -3,6 +3,11 @@ const Store = require("electron-store");
 const defaults = require("./defaults");
 
 const migrations = {
+	">=1.17.0": (store) => {
+		if (store.get("plugins.video-toggle.mode") === undefined) {
+			store.set("plugins.video-toggle.mode", "custom");
+		}
+	},
 	">=1.14.0": (store) => {
 		if (
 			typeof store.get("plugins.precise-volume.globalShortcuts") !== "object"

plugins/video-toggle/back.js

@@ -4,7 +4,7 @@ const path = require("path");
 module.exports = (win, options) => {
 	if (options.forceHide) {
 		injectCSS(win.webContents, path.join(__dirname, "force-hide.css"));
-	} else {
+	} else if (!options.mode || options.mode === "custom") {
 		injectCSS(win.webContents, path.join(__dirname, "button-switcher.css"));
 	}
 };

plugins/video-toggle/button-switcher.css

@@ -75,3 +75,8 @@
     transform: translateX(0);
     transition: transform 300ms;
 }
+
+/* disable the native toggler */
+#av-id {
+	display: none;
+}

plugins/video-toggle/front.js

@@ -14,9 +14,24 @@ const switchButtonDiv = ElementFromFile(
 
 module.exports = (_options) => {
     if (_options.forceHide) return;
-    options = _options;
+    switch (_options.mode) {
-    document.addEventListener('apiLoaded', setup, { once: true, passive: true });
+        case "native": {
+            $("ytmusic-player-page").setAttribute("has-av-switcher");
+            $("ytmusic-player").setAttribute("has-av-switcher");
+            return;
         }
+        case "disabled": {
+            $("ytmusic-player-page").removeAttribute("has-av-switcher");
+            $("ytmusic-player").removeAttribute("has-av-switcher");
+            return;
+        }
+        default:
+        case "custom": {
+            options = _options;
+            document.addEventListener("apiLoaded", setup, { once: true, passive: true });
+        }
+    }
+};
 
 function setup(e) {
     api = e.detail;
@@ -25,8 +40,6 @@ function setup(e) {
 
     $('ytmusic-player-page').prepend(switchButtonDiv);
 
-    $('#song-image.ytmusic-player').style.display = "block";
-
     if (options.hideVideo) {
         $('.video-switch-button-checkbox').checked = false;
         changeDisplay(false);
@@ -50,7 +63,10 @@ function setup(e) {
 function changeDisplay(showVideo) {
     player.style.margin = showVideo ? '' : 'auto 0px';
     player.setAttribute('playback-mode', showVideo ? 'OMV_PREFERRED' : 'ATV_PREFERRED');
-    $('#song-video.ytmusic-player').style.display = showVideo ? 'unset' : 'none';
+
+    $('#song-video.ytmusic-player').style.display = showVideo ? 'block' : 'none';
+    $('#song-image').style.display = showVideo ? 'none' : 'block';
+
     if (showVideo && !video.style.top) {
         video.style.top = `${(player.clientHeight - video.clientHeight) / 2}px`;
     }

plugins/video-toggle/menu.js

@@ -1,6 +1,38 @@
 const { setMenuOptions } = require("../../config/plugins");
 
 module.exports = (win, options) => [
+    {
+        label: "Mode",
+        submenu: [
+            {
+                label: "Custom toggle",
+                type: "radio",
+                checked: options.mode === 'custom',
+                click: () => {
+                    options.mode = 'custom';
+                    setMenuOptions("video-toggle", options);
+                }
+            },
+            {
+                label: "Native toggle",
+                type: "radio",
+                checked: options.mode === 'native',
+                click: () => {
+                    options.mode = 'native';
+                    setMenuOptions("video-toggle", options);
+                }
+            },
+            {
+                label: "Disabled",
+                type: "radio",
+                checked: options.mode === 'disabled',
+                click: () => {
+                    options.mode = 'disabled';
+                    setMenuOptions("video-toggle", options);
+                }
+            },
+        ]
+    },
     {
         label: "Force Remove Video Tab",
         type: "checkbox",