Merge branch 'master' into pip-part-2

plugins/bypass-age-restrictions/front.js

@@ -0,0 +1,4 @@
+module.exports = () => {
+	// See https://github.com/zerodytrash/Simple-YouTube-Age-Restriction-Bypass#userscript
+	require("simple-youtube-age-restriction-bypass/Simple-YouTube-Age-Restriction-Bypass.user.js");
+};

plugins/in-app-menu/front.js

@@ -4,7 +4,7 @@ const { Titlebar, Color } = require("custom-electron-titlebar");
 const { isEnabled } = require("../../config/plugins");
 function $(selector) { return document.querySelector(selector); }
 
-module.exports = () => {
+module.exports = (options) => {
 	let visible = !config.get("options.hideMenu");
 	const bar = new Titlebar({
 		backgroundColor: Color.fromHex("#050505"),
@@ -15,6 +15,10 @@ module.exports = () => {
 	bar.updateTitle(" ");
 	document.title = "Youtube Music";
 
+	const hideIcon = hide => $('.cet-window-icon').style.display = hide ? 'none' : 'flex';
+
+	if (options.hideIcon) hideIcon(true);
+
 	ipcRenderer.on("refreshMenu", (_, showMenu) => {
 		if (showMenu === undefined && !visible) return;
 		if (showMenu === false) {
@@ -32,6 +36,8 @@ module.exports = () => {
 		});
 	}
 
+	ipcRenderer.on("hideIcon", (_, hide) => hideIcon(hide));
+
 	// Increases the right margin of Navbar background when the scrollbar is visible to avoid blocking it (z-index doesn't affect it)
 	document.addEventListener('apiLoaded', () => {
 		setNavbarMargin();

plugins/in-app-menu/menu.js

@@ -0,0 +1,14 @@
+const { setOptions } = require("../../config/plugins");
+
+module.exports = (win, options) => [
+    {
+        label: "Hide Icon",
+        type: "checkbox",
+        checked: options.hideIcon,
+        click: (item) => {
+            win.webContents.send("hideIcon", item.checked);
+            options.hideIcon = item.checked;
+            setOptions("in-app-menu", options);
+        },
+    }
+];

plugins/in-app-menu/style.css

@@ -57,10 +57,10 @@ yt-page-navigation-progress,
 
 /* The scrollbar 'thumb' ...that marque oval shape in a scrollbar */
 ::-webkit-scrollbar-thumb:vertical {
-	background-clip: padding-box;
 	border: 2px solid rgba(0, 0, 0, 0);
 
 	background: #3a3a3a;
+	background-clip: padding-box;
 	border-radius: 100px;
 	-moz-border-radius: 100px;
 	-webkit-border-radius: 100px;
@@ -71,3 +71,7 @@ yt-page-navigation-progress,
 	-moz-border-radius: 100px;
 	-webkit-border-radius: 100px;
 }
+
+.cet-menubar-menu-container .cet-action-item {
+	background-color: inherit
+}

plugins/last-fm/back.js

@@ -89,6 +89,7 @@ const postSongDataToAPI = async (songInfo, config, data) => {
 		track: songInfo.title,
 		duration: songInfo.songDuration,
 		artist: songInfo.artist,
+		...(songInfo.album ? { album: songInfo.album } : undefined), // will be undefined if current song is a video
 		api_key: config.api_key,
 		sk: config.session_key,
 		format: 'json',
@@ -157,4 +158,4 @@ const lastfm = async (_win, config) => {
 	});
 }
 
-module.exports = lastfm;
+module.exports = lastfm;

plugins/navigation/style.css

@@ -3,7 +3,6 @@
 	font-size: 20px;
 	line-height: var(--ytmusic-title-1_-_line-height);
 	font-weight: 500;
-	color: #fff;
 	--yt-endpoint-color: #fff;
 	--yt-endpoint-hover-color: #fff;
 	--yt-endpoint-visited-color: #fff;

plugins/playback-speed/front.js

@@ -85,7 +85,7 @@ function forcePlaybackRate(e) {
 }
 
 module.exports = () => {
-	document.addEventListener('apiLoaded', e => {
+	document.addEventListener('apiLoaded', () => {
 		observePopupContainer();
 		observeVideo();
 		setupWheelListener();

plugins/precise-volume/preload.js

@@ -1,4 +1,3 @@
-const { ipcRenderer } = require("electron");
 const is = require("electron-is");
 
 let ignored = {

plugins/skip-silences/front.js

@@ -3,7 +3,7 @@ const hark = require("hark/hark.bundle.js");
 module.exports = () => {
 	let isSilent = false;
 
-	document.addEventListener("apiLoaded", (apiEvent) => {
+	document.addEventListener("apiLoaded", () => {
 		const video = document.querySelector("video");
 		const speechEvents = hark(video, {
 			threshold: -100, // dB (-100 = absolute silence, 0 = loudest)

plugins/utils.js

@@ -42,15 +42,22 @@ module.exports.fileExists = (path, callbackIfExists) => {
 	});
 };
 
+const cssToInject = new Map();
 module.exports.injectCSS = (webContents, filepath, cb = undefined) => {
-	webContents.on("did-finish-load", async () => {
-		await webContents.insertCSS(fs.readFileSync(filepath, "utf8"));
-		if (cb) {
-			cb();
-		}
-	});
+	if (!cssToInject.size) setupCssInjection(webContents);
+
+	cssToInject.set(filepath, cb);
 };
 
+const setupCssInjection = (webContents) => {
+	webContents.on("did-finish-load", () => {
+		cssToInject.forEach(async (cb, filepath) => {
+			await webContents.insertCSS(fs.readFileSync(filepath, "utf8"));
+			cb?.();
+		})
+	});
+}
+
 module.exports.getAllPlugins = () => {
 	const isDirectory = (source) => fs.lstatSync(source).isDirectory();
 	return fs

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;
-    document.addEventListener('apiLoaded', setup, { once: true, passive: true });
-}
+    switch (_options.mode) {
+        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",