fix(YouTube): add support for new layout

websites/Y/YouTube/metadata.json

@@ -75,7 +75,7 @@
 		"*://www.youtube.com/*",
 		"*://studio.youtube.com/*"
 	],
-	"version": "5.10.3",
+	"version": "5.10.4",
 	"logo": "https://cdn.rcd.gg/PreMiD/websites/Y/YouTube/assets/logo.png",
 	"thumbnail": "https://cdn.rcd.gg/PreMiD/websites/Y/YouTube/assets/thumbnail.jpg",
 	"color": "#E40813",

websites/Y/YouTube/presence.ts

@@ -4,6 +4,7 @@ import youtubeEmbedResolver from "./video_sources/embed";
 import youtubeMoviesResolver from "./video_sources/movies";
 import youtubeTVResolver from "./video_sources/tv";
 import youtubeResolver from "./video_sources/default";
+import youtubeMiniplayerResolver from "./video_sources/miniplayer";
 import youtubeApiResolver from "./video_sources/api";
 import {
 	Resolver,
@@ -79,6 +80,7 @@ presence.on("UpdateData", async () => {
 				youtubeOldResolver,
 				youtubeTVResolver,
 				youtubeResolver,
+				youtubeMiniplayerResolver,
 				youtubeMoviesResolver,
 				youtubeApiResolver,
 				nullResolver,
@@ -114,11 +116,14 @@ presence.on("UpdateData", async () => {
 		}
 
 		if (logo === LogoMode.Channel) {
-			pfp = document
-				.querySelector<HTMLImageElement>(
-					"#avatar.ytd-video-owner-renderer > img"
-				)
-				?.src.replace(/=s\d+/, "=s512");
+			pfp =
+				resolver === youtubeMiniplayerResolver
+					? ""
+					: document
+							.querySelector<HTMLImageElement>(
+								"#avatar.ytd-video-owner-renderer > img"
+							)
+							?.src.replace(/=s\d+/, "=s512");
 		}
 		const unlistedPathElement = document.querySelector<SVGPathElement>(
 				"g#privacy_unlisted > path"

websites/Y/YouTube/video_sources/api.ts

@@ -71,11 +71,11 @@ function isActive(): boolean {
 }
 
 function getTitle(): string {
-	return videoCache.get(getVideoID())?.videoDetails.title;
+	return videoCache.get(getVideoID())?.videoDetails?.title;
 }
 
 function getUploader(): string {
-	return videoCache.get(getVideoID())?.videoDetails.author;
+	return videoCache.get(getVideoID())?.videoDetails?.author;
 }
 
 export function getVideoID(): string {
@@ -84,7 +84,7 @@ export function getVideoID(): string {
 
 export function getChannelURL(): string {
 	return `https://www.youtube.com/channel/${
-		videoCache.get(getVideoID())?.videoDetails.channelId
+		videoCache.get(getVideoID())?.videoDetails?.channelId
 	}`;
 }
 

websites/Y/YouTube/video_sources/default.ts

@@ -5,35 +5,36 @@ function isActive(): boolean {
 }
 
 function getTitle(): string {
-	if (document.location.pathname.includes("/watch")) {
-		return document
-			.querySelector("h1 yt-formatted-string.ytd-video-primary-info-renderer")
-			?.textContent.trim();
-	} else
-		return document.querySelector(".ytd-miniplayer .title")?.textContent.trim();
+	return getBaseSection()
+		?.querySelector("h1 yt-formatted-string.ytd-video-primary-info-renderer")
+		?.textContent.trim();
 }
 
 function getUploader(): string {
-	return (
-		document
-			.querySelector("ytd-video-owner-renderer .ytd-channel-name a")
-			?.textContent.trim() ||
-		document.querySelector("yt-formatted-string#owner-name")?.textContent.trim()
-	);
+	return getBaseSection()
+		?.querySelector("ytd-video-owner-renderer .ytd-channel-name a")
+		?.textContent.trim();
 }
 
 export function getVideoID(): string {
-	return document
-		.querySelector("#page-manager > ytd-watch-flexy")
-		?.getAttribute("video-id");
+	return (
+		getBaseSection()
+			?.querySelector("#page-manager > [video-id]")
+			?.getAttribute("video-id") ??
+		new URLSearchParams(document.location.search).get("v")
+	);
 }
 
 export function getChannelURL(): string {
-	return document.querySelector<HTMLLinkElement>(
-		"#top-row ytd-video-owner-renderer > a"
+	return getBaseSection()?.querySelector<HTMLAnchorElement>(
+		"#upload-info #channel-name a"
 	)?.href;
 }
 
+function getBaseSection(): HTMLElement | null {
+	return document.querySelector(".ytd-page-manager:not([hidden])");
+}
+
 const resolver: Resolver = {
 	isActive,
 	getTitle,

websites/Y/YouTube/video_sources/miniplayer.ts

@@ -0,0 +1,37 @@
+import { Resolver } from "../util";
+
+function isActive(): boolean {
+	return !!getTitle() && !!getUploader() && !!getVideoID() && !!getChannelURL();
+}
+
+function getTitle(): string {
+	return document.querySelector(".ytd-miniplayer .title")?.textContent.trim();
+}
+
+function getUploader(): string {
+	return document.querySelector("#owner-name")?.textContent.trim();
+}
+
+function getVideoID(): string {
+	const link =
+		document.querySelector<HTMLAnchorElement>("#video-title-link").href;
+	if (!link) return null;
+	const url = new URL(link);
+	return url.searchParams.get("v");
+}
+
+function getChannelURL(): string {
+	return document.querySelector<HTMLAnchorElement>(
+		"#ytd-player .ytp-ce-channel-title.ytp-ce-link"
+	)?.href;
+}
+
+const resolver: Resolver = {
+	isActive,
+	getTitle,
+	getUploader,
+	getChannelURL,
+	getVideoID,
+};
+
+export default resolver;

websites/Y/YouTube/video_sources/old.ts

@@ -1,5 +1,5 @@
 import { Resolver } from "../util";
-import { getChannelURL, getVideoID } from "./default";
+import { getVideoID } from "./default";
 
 function isActive(): boolean {
 	return (
@@ -12,6 +12,12 @@ function isActive(): boolean {
 	);
 }
 
+function getChannelURL(): string {
+	return document.querySelector<HTMLLinkElement>(
+		"#top-row ytd-video-owner-renderer > a"
+	)?.href;
+}
+
 function getTitle(): string {
 	return document.querySelector(".watch-title")?.textContent.trim();
 }