Initial commit

2025-05-22 18:08:15 +02:00
commit 364ffa15de
33 changed files with 900 additions and 0 deletions
--- a/radio/templates/trains.tmpl
+++ b/radio/templates/trains.tmpl
@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>prettysunflower - The trains radio</title>
+    <link rel="stylesheet" type="text/css" href="/static/static/css/style.css">
+</head>
+<body class="page-radio-trains">
+<div class="video-zone">
+    <video id="video-player" controls></video>
+</div>
+
+<h1>The trains radio</h1>
+
+<main>
+    {{ range .PlaylistItems }}
+    <div class="playlist-item" data-videoid="{{ .VideoId }}">
+        <img src="{{ .ThumbnailUrl }}">
+        <p>
+            <a href="https://invidious.prettysunflower.moe/watch?v={{ .VideoId }}">
+                <strong>{{ .Title }}</strong><br>
+                {{ .Channel.Name }}
+            </a>
+        </p>
+    </div>
+    {{ end }}
+</main>
+
+<script>
+    const playlistItems = document.getElementsByClassName("playlist-item");
+    const videoBlock = document.querySelector(".video-zone video");
+
+    function loadVideo(videoId) {
+        videoBlock.src = `https://invidious.prettysunflower.moe/latest_version?local=true&id=${videoId}`;
+        videoBlock.currentTime = 0;
+        videoBlock.play();
+    }
+
+    let index = 0;
+
+    playlistItems[index].classList.add('active');
+    loadVideo(playlistItems[index].dataset.videoid);
+
+    videoBlock.addEventListener('ended', () => {
+        playlistItems[index].classList.remove('active');
+        index = index + 1;
+
+        if (index < playlistItems.length) {
+            playlistItems[index].classList.add('active');
+            loadVideo(playlistItems[index].dataset.videoid);
+        }
+    })
+</script>
+</body>
+</html>