From e13cafe070885b0bc5c2642324342a8e957006b2 Mon Sep 17 00:00:00 2001
From: Emile Bangma <ewjbangma@hotmail.com>
Date: Wed, 06 Mar 2024 17:45:31 +0000
Subject: [PATCH] feat: support youtube playlist iframe (#968)
---
quartz/plugins/transformers/ofm.ts | 18 +++++++++++++++++-
1 files changed, 17 insertions(+), 1 deletions(-)
diff --git a/quartz/plugins/transformers/ofm.ts b/quartz/plugins/transformers/ofm.ts
index 237d683..48428af 100644
--- a/quartz/plugins/transformers/ofm.ts
+++ b/quartz/plugins/transformers/ofm.ts
@@ -123,6 +123,7 @@
)
const blockReferenceRegex = new RegExp(/\^([-_A-Za-z0-9]+)$/, "g")
const ytLinkRegex = /^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=|\&v=)([^#\&\?]*).*/
+const ytPlaylistLinkRegex = /[?&]list=([^#?&]*)/
const videoExtensionRegex = new RegExp(/\.(mp4|webm|ogg|avi|mov|flv|wmv|mkv|mpg|mpeg|3gp|m4v)$/)
const wikilinkImageEmbedRegex = new RegExp(
/^(?<alt>(?!^\d*x?\d*$).*?)?(\|?\s*?(?<width>\d+)(x(?<height>\d+))?)?$/,
@@ -574,7 +575,9 @@
if (node.tagName === "img" && typeof node.properties.src === "string") {
const match = node.properties.src.match(ytLinkRegex)
const videoId = match && match[2].length == 11 ? match[2] : null
+ const playlistId = node.properties.src.match(ytPlaylistLinkRegex)?.[1]
if (videoId) {
+ // YouTube video (with optional playlist)
node.tagName = "iframe"
node.properties = {
class: "external-embed",
@@ -582,7 +585,20 @@
frameborder: 0,
width: "600px",
height: "350px",
- src: `https://www.youtube.com/embed/${videoId}`,
+ src: playlistId
+ ? `https://www.youtube.com/embed/${videoId}?list=${playlistId}`
+ : `https://www.youtube.com/embed/${videoId}`,
+ }
+ } else if (playlistId) {
+ // YouTube playlist only.
+ node.tagName = "iframe"
+ node.properties = {
+ class: "external-embed",
+ allow: "fullscreen",
+ frameborder: 0,
+ width: "600px",
+ height: "350px",
+ src: `https://www.youtube.com/embed/videoseries?list=${playlistId}`,
}
}
}
--
Gitblit v1.10.0