highperfocused/nostrudel
1
0
Fork 0
mirror of https://github.com/hzrd149/nostrudel.git synced 2025-04-11 21:29:26 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix youtube playlist embed

Browse Source
This commit is contained in:
hzrd149 2023-06-09 09:28:28 -04:00
parent 56988de14c
commit 009352ac62
3 changed files with 53 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
cypress/e2e/embeds.cy.ts
View File

@ -65,4 +65,15 @@ describe("Embeds", () => {
});
});
});
describe("youtube", () => {
it("should embed playlists", () => {
cy.visit(
"#/n/nevent1qqs8w6e63smpr5ccmz4l0w5pvnkp6r7z2fxaadjwu2g74y95pl9xv0cpzpmhxue69uhkummnw3ezuamfdejszrthwden5te0dehhxtnvdakqqkgf54"
);
cy.findByTitle(/youtube video player/i).should("be.visible");
cy.findByTitle(/youtube video player/i).should("have.attr", "src");
});
});
});

55
src/components/embed-types/youtube.tsx
View File

@ -1,4 +1,4 @@
import { AspectRatio } from "@chakra-ui/react";
import { AspectRatio, list } from "@chakra-ui/react";
import appSettings from "../../services/app-settings";
// copied from https://github.com/SimonBrazell/privacy-redirect/blob/master/src/assets/javascripts/helpers/youtube.js
@ -21,21 +21,42 @@ export function renderYoutubeUrl(match: URL) {
const { youtubeRedirect } = appSettings.value;
var videoId = match.searchParams.get("v");
if (match.hostname === "youtu.be") videoId = match.pathname.split("/")[1];
if (!videoId) throw new Error("cant find video id");
const embedUrl = new URL(`/embed/${videoId}`, youtubeRedirect || "https://youtube.com");
if (match.pathname.startsWith("/playlist")) {
const listId = match.searchParams.get("list");
if (!listId) throw new Error("missing list id");
return (
<AspectRatio ratio={16 / 10} maxWidth="40rem">
<iframe
src={embedUrl.toString()}
title="YouTube video player"
frameBorder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowFullScreen
width="100%"
></iframe>
</AspectRatio>
);
const embedUrl = new URL(`embed/videoseries`, youtubeRedirect || "https://www.youtube-nocookie.com");
embedUrl.searchParams.set("list", listId);
return (
<AspectRatio ratio={560 / 315} maxWidth="40rem">
<iframe
src={embedUrl.toString()}
title="YouTube video player"
frameBorder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
allowFullScreen
width="100%"
></iframe>
</AspectRatio>
);
} else {
var videoId = match.searchParams.get("v");
if (match.hostname === "youtu.be") videoId = match.pathname.split("/")[1];
if (!videoId) throw new Error("cant find video id");
const embedUrl = new URL(`/embed/${videoId}`, youtubeRedirect || "https://www.youtube-nocookie.com");
return (
<AspectRatio ratio={16 / 10} maxWidth="40rem">
<iframe
src={embedUrl.toString()}
title="YouTube video player"
frameBorder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowFullScreen
width="100%"
></iframe>
</AspectRatio>
);
}
}

6
src/helpers/embeds.ts
View File

@ -43,8 +43,10 @@ export function embedUrls(content: EmbedableContent, handlers: LinkEmbedHandler[
try {
const url = new URL(match[0]);
for (const handler of handlers) {
const content = handler(url);
if (content) return content;
try {
const content = handler(url);
if (content) return content;
} catch (e) {}
}
} catch (e) {
if (e instanceof Error) {