Merge branch 'master' into fix-restart-on-config-change

index.js

@@ -127,9 +127,27 @@ function createMainWindow() {
 		autoHideMenuBar: config.get("options.hideMenu"),
 	});
 	remote.enable(win.webContents);
+
 	if (windowPosition) {
 		const { x, y } = windowPosition;
-		win.setPosition(x, y);
+		const winSize = win.getSize();
+		const displaySize =
+			electron.screen.getDisplayNearestPoint(windowPosition).bounds;
+		if (
+			x + winSize[0] < displaySize.x - 8 ||
+			x - winSize[0] > displaySize.x + displaySize.width ||
+			y < displaySize.y - 8 ||
+			y > displaySize.y + displaySize.height
+		) {
+			//Window is offscreen
+			if (is.dev()) {
+				console.log(
+					`Window tried to render offscreen, windowSize=${winSize}, displaySize=${displaySize}, position=${windowPosition}`
+				);
+			}
+		} else {
+			win.setPosition(x, y);
+		}
 	}
 	if (windowMaximized) {
 		win.maximize();

package.json

@@ -15,6 +15,15 @@
 		"productName": "YouTube Music",
 		"mac": {
 			"identity": null,
+			"target": [
+				{
+					"target": "dmg",
+					"arch": [
+						"x64",
+						"arm64"
+					]
+				}
+			],
 			"icon": "assets/generated/icons/mac/icon.icns"
 		},
 		"win": {
@@ -58,7 +67,8 @@
 		"clean": "rimraf dist",
 		"build": "yarn run clean && electron-builder --win --mac --linux",
 		"build:linux": "yarn run clean && electron-builder --linux",
-		"build:mac": "yarn run clean && electron-builder --mac",
+		"build:mac": "yarn run clean && electron-builder --mac dmg:x64",
+		"build:mac:arm64": "yarn run clean && electron-builder --mac dmg:arm64",
 		"build:win": "yarn run clean && electron-builder --win",
 		"lint": "xo",
 		"plugins": "yarn run plugin:adblocker",
@@ -72,35 +82,35 @@
 		"npm": "Please use yarn and not npm"
 	},
 	"dependencies": {
-		"@cliqz/adblocker-electron": "^1.23.1",
-		"@electron/remote": "^2.0.1",
+		"@cliqz/adblocker-electron": "^1.23.4",
+		"@electron/remote": "^2.0.4",
 		"@ffmpeg/core": "^0.10.0",
-		"@ffmpeg/ffmpeg": "^0.10.0",
+		"@ffmpeg/ffmpeg": "^0.10.1",
 		"async-mutex": "^0.3.2",
 		"browser-id3-writer": "^4.4.0",
-		"chokidar": "^3.5.2",
+		"chokidar": "^3.5.3",
 		"custom-electron-prompt": "^1.4.0",
 		"custom-electron-titlebar": "^3.2.10",
-		"discord-rpc": "^3.2.0",
+		"discord-rpc": "^4.0.1",
 		"electron-better-web-request": "^1.0.1",
 		"electron-debug": "^3.2.0",
 		"electron-is": "^3.0.0",
 		"electron-localshortcut": "^3.2.1",
-		"electron-store": "^7.0.3",
+		"electron-store": "^8.0.1",
 		"electron-unhandled": "^3.0.2",
 		"electron-updater": "^4.6.3",
 		"filenamify": "^4.3.0",
 		"hark": "^1.2.3",
 		"md5": "^2.3.0",
 		"mpris-service": "^2.1.2",
-		"node-fetch": "^2.6.6",
-		"node-notifier": "^9.0.1",
-		"ytdl-core": "^4.10.0",
+		"node-fetch": "^2.6.7",
+		"node-notifier": "^10.0.1",
+		"ytdl-core": "^4.10.1",
 		"ytpl": "^2.2.3"
 	},
 	"devDependencies": {
-		"electron": "^16.0.5",
-		"electron-builder": "^22.10.5",
+		"electron": "^17.0.0",
+		"electron-builder": "^22.14.5",
 		"electron-devtools-installer": "^3.1.1",
 		"electron-icon-maker": "0.0.5",
 		"jest": "^27.3.1",

plugins/downloader/menu.js

@@ -5,6 +5,7 @@ const { dialog, ipcMain } = require("electron");
 const is = require("electron-is");
 const ytpl = require("ytpl");
 const chokidar = require('chokidar');
+const filenamify = require('filenamify');
 
 const { setMenuOptions } = require("../../config/plugins");
 const { sendError } = require("./back");
@@ -94,10 +95,10 @@ async function downloadPlaylist(givenUrl, win, options) {
 		sendError(win, e);
 		return;
 	}
-	const playlistTitle = playlist.title;
+	const safePlaylistTitle = filenamify(playlist.title, {replacement: ' '});
 
 	const folder = getFolder(options.downloadFolder);
-	const playlistFolder = join(folder, playlistTitle);
+	const playlistFolder = join(folder, safePlaylistTitle);
 	if (existsSync(playlistFolder)) {
 		sendError(
 			win,
@@ -111,13 +112,13 @@ async function downloadPlaylist(givenUrl, win, options) {
 		type: "info",
 		buttons: ["OK"],
 		title: "Started Download",
-		message: `Downloading Playlist "${playlistTitle}"`,
+		message: `Downloading Playlist "${playlist.title}"`,
 		detail: `(${playlist.items.length} songs)`,
 	});
 
 	if (is.dev()) {
 		console.log(
-			`Downloading playlist "${playlistTitle}" - ${playlist.items.length} songs (${playlistId})`
+			`Downloading playlist "${playlist.title}" - ${playlist.items.length} songs (${playlistId})`
 		);
 	}
 
@@ -143,7 +144,7 @@ async function downloadPlaylist(givenUrl, win, options) {
 		win.webContents.send(
 			"downloader-download-playlist",
 			song.url,
-			playlistTitle,
+			safePlaylistTitle,
 			options
 		);
 	});

plugins/lyrics-genius/style.css

@@ -9,4 +9,5 @@
 #contents.genius-lyrics {
     font-size: 1vw;
     opacity: 0.9;
+    text-align: center;
 }

plugins/precise-volume/front.js

@@ -1,7 +1,7 @@
 const { ipcRenderer } = require("electron");
 const { globalShortcut } = require('@electron/remote');
 
-const { setOptions, setMenuOptions } = require("../../config/plugins");
+const { setOptions, setMenuOptions, isEnabled } = require("../../config/plugins");
 
 function $(selector) { return document.querySelector(selector); }
 let api;
@@ -13,6 +13,8 @@ module.exports = (options) => {
 	}, { once: true, passive: true })
 };
 
+module.exports.moveVolumeHud = moveVolumeHud;
+
 /** Restore saved volume and setup tooltip */
 function firstRun(options) {
 	if (typeof options.savedVolume === "number") {
@@ -34,6 +36,11 @@ function firstRun(options) {
 	injectVolumeHud(noVid);
 	if (!noVid) {
 		setupVideoPlayerOnwheel(options);
+		if (!isEnabled('video-toggle')) {
+			//video-toggle handles hud positioning on its own
+			const videoMode = () => api.getPlayerResponse().videoDetails?.musicVideoType !== 'MUSIC_VIDEO_TYPE_ATV';
+			$("video").addEventListener("srcChanged", () => moveVolumeHud(videoMode()));
+		}
 	}
 
 	// Change options from renderer to keep sync
@@ -61,6 +68,16 @@ function injectVolumeHud(noVid) {
 	}
 }
 
+let hudMoveTimeout;
+function moveVolumeHud(showVideo) {
+	clearTimeout(hudMoveTimeout);
+	const volumeHud = $('#volumeHud');
+	if (!volumeHud) return;
+	hudMoveTimeout = setTimeout(() => {
+		volumeHud.style.top = showVideo ? `${($('ytmusic-player').clientHeight - $('video').clientHeight) / 2}px` : 0;
+	}, 250)
+}
+
 let hudFadeTimeout;
 
 function showVolumeHud(volume) {

plugins/video-toggle/front.js

@@ -1,6 +1,8 @@
 const { ElementFromFile, templatePath } = require("../utils");
 
-const { setOptions } = require("../../config/plugins");
+const { setOptions, isEnabled } = require("../../config/plugins");
+
+const moveVolumeHud = isEnabled("precise-volume") ? require("../precise-volume/front").moveVolumeHud : ()=>{};
 
 function $(selector) { return document.querySelector(selector); }
 
@@ -39,7 +41,7 @@ function setup(e) {
         changeDisplay(e.target.checked);
         setOptions("video-toggle", options);
     })
-  
+
     video.addEventListener('srcChanged', videoStarted);
 
     observeThumbnail();
@@ -89,13 +91,6 @@ function forcePlaybackMode() {
     playbackModeObserver.observe(player, { attributeFilter: ["playback-mode"] });
 }
 
-// if precise volume plugin is enabled, move its hud to be on top of the video
-function moveVolumeHud(showVideo) {
-    const volumeHud = $('#volumeHud');
-    if (volumeHud)
-        volumeHud.style.top = showVideo ? `${(player.clientHeight - video.clientHeight) / 2}px` : 0;
-}
-
 function observeThumbnail() {
     const playbackModeObserver = new MutationObserver(mutations => {
         if (!player.videoMode_) return;

readme.md

@@ -34,25 +34,53 @@ You can check out the [latest release](https://github.com/th-ch/youtube-music/re
 Install the `youtube-music-bin` package from the AUR. For AUR installation instructions, take a look at this [wiki page](https://wiki.archlinux.org/index.php/Arch_User_Repository#Installing_packages).
 
 ## Available plugins:
-- **Ad Blocker**: block all ads and tracking out of the box
-- **Audio compressor**: apply compression to audio (lowers the volume of the loudest parts of the signal and raises the volume of the softest parts)
-- **Blur navigation bar**: makes navigation bar transparent and blurry
-- **Disable autoplay**: makes every song start in "paused" mode
-- [**Discord**](https://discord.com/): show your friends what you listen to with [Rich Presence](https://user-images.githubusercontent.com/28219076/104362104-a7a0b980-5513-11eb-9744-bb89eabe0016.png)
+
+- **Ad Blocker**: Block all ads and tracking out of the box
+
+- **Audio Compressor**: Apply compression to audio (lowers the volume of the loudest parts of the signal and raises the volume of the softest parts)
+
+- **Blur Nav Bar**: makes navigation bar transparent and blurry
+
+- **Disable Autoplay**: Makes every song start in "paused" mode
+
+- [**Discord**](https://discord.com/): Show your friends what you listen to with [Rich Presence](https://user-images.githubusercontent.com/28219076/104362104-a7a0b980-5513-11eb-9744-bb89eabe0016.png)
+
 - **Downloader**: downloads MP3 [directly from the interface](https://user-images.githubusercontent.com/61631665/129977677-83a7d067-c192-45e1-98ae-b5a4927393be.png) [(youtube-dl)](https://github.com/ytdl-org/youtube-dl)
-- **In-app menu**: [gives bars a fancy, dark look](https://user-images.githubusercontent.com/78568641/112215894-923dbf00-8c29-11eb-95c3-3ce15db27eca.png)
+
+- **Exponential Volume**: Makes the volume slider [exponential](https://greasyfork.org/en/scripts/397686-youtube-music-fix-volume-ratio/) so it's easier to select lower volumes.
+
+- **In-App Menu**: [gives bars a fancy, dark look](https://user-images.githubusercontent.com/78568641/112215894-923dbf00-8c29-11eb-95c3-3ce15db27eca.png)
+
   > (see [this post](https://github.com/th-ch/youtube-music/issues/410#issuecomment-952060709) if you have problem accessing the menu after enabling this plugin and hide-menu option)
-- [**Last.fm**](https://www.last.fm/): scrobbles support
-- **Navigation**: next/back navigation arrows directly integrated in the interface, like in your favorite browser
-- **No Google Login**: remove Google login buttons and links from the interface
-- **Notifications**: display a notification when a song starts playing ([interactive notifications](https://user-images.githubusercontent.com/78568641/114102651-63ce0e00-98d0-11eb-9dfe-c5a02bb54f9c.png) are available on windows)
-- **Playback speed**: listen fast, listen slow! [Adds a slider that controls song speed](https://user-images.githubusercontent.com/61631665/129976003-e55db5ba-bf42-448c-a059-26a009775e68.png)
-- **Precise volume**: customizable volume steps for more comfort, allows controlling the volume precisely using mousewheel
-- **Quality changer**: Allows changing the video quality with a [button](https://user-images.githubusercontent.com/78568641/138574366-70324a5e-2d64-4f6a-acdd-dc2a2b9cecc5.png) on the video overlay
+
+- [**Last.fm**](https://www.last.fm/): Scrobbles support
+
+- **Lyrics Genius**: Adds lyrics support for most songs
+
+- **Navigation**: Next/Back navigation arrows directly integrated in the interface, like in your favorite browser
+
+- **No Google Login**: Remove Google login buttons and links from the interface
+
+- **Notifications**: Display a notification when a song starts playing ([interactive notifications](https://user-images.githubusercontent.com/78568641/114102651-63ce0e00-98d0-11eb-9dfe-c5a02bb54f9c.png) are available on windows)
+
+- **Playback Speed**: Listen fast, listen slow! [Adds a slider that controls song speed](https://user-images.githubusercontent.com/61631665/129976003-e55db5ba-bf42-448c-a059-26a009775e68.png)
+
+- **Precise Volume**: Control the volume precisely using mousewheel/hotkeys, with a custom hud and customizable volume steps
+
+- **Quality Changer**: Allows changing the video quality with a [button](https://user-images.githubusercontent.com/78568641/138574366-70324a5e-2d64-4f6a-acdd-dc2a2b9cecc5.png) on the video overlay
+
 - **Shortcuts**: Allows setting global hotkeys for playback (play/pause/next/previous) + disable [media osd](https://user-images.githubusercontent.com/84923831/128601225-afa38c1f-dea8-4209-9f72-0f84c1dd8b54.png) by overriding media keys + enable Ctrl/CMD + F to search + enable linux mpris support for mediakeys + [custom hotkeys](https://github.com/Araxeus/youtube-music/blob/1e591d6a3df98449bcda6e63baab249b28026148/providers/song-controls.js#L13-L50) for [advanced users](https://github.com/th-ch/youtube-music/issues/106#issuecomment-952156902)
-- [**SponsorBlock**](https://github.com/ajayyy/SponsorBlock): skips non-music parts
-- **Taskbar media control**: control playback from your [Windows taskbar](https://user-images.githubusercontent.com/78568641/111916130-24a35e80-8a82-11eb-80c8-5021c1aa27f4.png)
-- **Touchbar**: custom TouchBar layout for macOS
+
+- **Skip-Silences** - Automatically skip silenced sections
+
+- [**SponsorBlock**](https://github.com/ajayyy/SponsorBlock): Automatically Skips non-music parts like intro/outro or parts of music videos where the song isn't playing
+
+- **Taskbar Media Control**: Control playback from your [Windows taskbar](https://user-images.githubusercontent.com/78568641/111916130-24a35e80-8a82-11eb-80c8-5021c1aa27f4.png)
+
+- **Touchbar**: Custom TouchBar layout for macOS
+
+- **Tuna-OBS**: Integration with [OBS](https://obsproject.com/)'s plugin [Tuna](https://obsproject.com/forum/resources/tuna.843/)
+
 - **Video Toggle**: Adds a button to switch between Video/Song mode. can also optionally remove the whole video tab
 
 ---