From a7993781648fefb51444e208d92e7efb7f3ab783 Mon Sep 17 00:00:00 2001
From: Astound <kirito@disroot.org>
Date: Tue, 4 Mar 2025 11:06:04 +0800
Subject: Renew plyr UI and simplify elements

---
 youtube/static/js/plyr-start.js | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

(limited to 'youtube/static/js/plyr-start.js')

diff --git a/youtube/static/js/plyr-start.js b/youtube/static/js/plyr-start.js
index 3838acc..4188829 100644
--- a/youtube/static/js/plyr-start.js
+++ b/youtube/static/js/plyr-start.js
@@ -133,4 +133,23 @@
   // Needed so controls won't be hidden before playback has started
   player.started = false;
   player.once('playing', function(){this.started = true});
+
+  // Custom styles for plyr similar to shaka-player
+  const playerUI = document.querySelector(".plyr");
+  if (playerUI) {
+    playerUI.classList.add("plyr--minimal");
+    const controls = document.querySelector(".plyr__controls");
+    const progressContainer = document.querySelector(".plyr__progress__container");
+    const topControls = document.createElement("div");
+    topControls.classList.add("plyr__controls__top");
+    document.querySelectorAll(".plyr__controls__item").forEach((item) => {
+      if (!item.classList.contains("plyr__progress__container")) {
+        topControls.appendChild(item);
+      }
+    });
+    // Insert new structure to player
+    controls.prepend(topControls);
+    controls.appendChild(progressContainer);
+  }
+  // End of custom styles
 })();
-- 
cgit v1.2.3