From 3b113ed4f8a15850932dc1fcf5046fc2518a032d Mon Sep 17 00:00:00 2001
From: stjet <49297268+stjet@users.noreply.github.com>
Date: Sun, 7 Jul 2024 21:36:12 +0000
Subject: [PATCH] playlists and queue item go up

---
 build.ts              |  7 ++++++
 host.ts               |  2 +-
 templates/player.html | 58 +++++++++++++++++++++++++++++++++++--------
 3 files changed, 55 insertions(+), 12 deletions(-)

diff --git a/build.ts b/build.ts
index 06cb931..9eea8ed 100644
--- a/build.ts
+++ b/build.ts
@@ -62,6 +62,12 @@ for (let listing_type of ["anime", "manga", "music"]) {
   ));
 }
 
+//get playlists if any (will add to player at a later step)
+let playlists: string[] = [];
+if (existsSync(path.join(__dirname, "/static_assets/playlists"))) {
+  playlists.push(...readdirSync(path.join(__dirname, "/static_assets/playlists")).map((name: string) => name));
+}
+
 let renderer: Renderer = new Renderer("templates", "components");
 let builder: Builder = new Builder("/build");
 
@@ -156,6 +162,7 @@ builder.serve_template(renderer, "/stats", "stats", {
 });
 
 builder.serve_template(renderer, "/player", "player", {
+  playlists,
   songs,
   artists: listings.filter((l) => l.type === "music").map(
     (l) => (
diff --git a/host.ts b/host.ts
index 3db5d0d..8fb0bdf 100644
--- a/host.ts
+++ b/host.ts
@@ -34,7 +34,7 @@ const request_handler = (req, res) => {
     req_path = path.join(__dirname, "build", decodeURI(req.url), "index.html");
   } else {
     //is file
-    if (url_obj.pathname.startsWith("/anime_assets") || url_obj.pathname.startsWith("/manga_assets") || url_obj.pathname.startsWith("/music_assets") || url_obj.pathname.startsWith("/music_subtitle_assets")) {
+    if (url_obj.pathname.startsWith("/anime_assets") || url_obj.pathname.startsWith("/manga_assets") || url_obj.pathname.startsWith("/music_assets") || url_obj.pathname.startsWith("/music_subtitle_assets") || "/playlists") {
       req_path = path.join(__dirname, "static_assets", decodeURI(req.url));
     } else {
       req_path = path.join(__dirname, "build", decodeURI(req.url));
diff --git a/templates/player.html b/templates/player.html
index ab11931..8c4c5cb 100644
--- a/templates/player.html
+++ b/templates/player.html
@@ -38,6 +38,9 @@
         margin: 0px;
         padding-left: 2px;
       }
+      .q-item-button {
+        margin-left: 5px;
+      }
       label:hover > .add-to-queue-btns {
         display: inline-block;
       }
@@ -75,6 +78,14 @@
           <label for="playlist-upload">Upload Playlist (Adds to Queue Randomly):</label>
           <input id="playlist-upload" type="file" accept=".playlist" onchange="upload_playlist()"/>
           <br>
+          <label for="playlist-select">Or Select Playlist:</label>
+          <select id="playlist-select">
+            [[ for:playlists:playlist ]]
+              <option value="[[ playlist ]]">[[ playlist ]]</option>
+            [[ endfor ]]
+          </select>
+          <input type="button" value="Add Playlist" onclick="add_selected_playlist()"/>
+          <br>
           <input type="button" value="Download History" onclick="download_history()"/>
         </div>
       </div>
@@ -173,7 +184,23 @@
         let queue_name = document.createElement("B");
         queue_name.innerText = name;
         queue_item.appendChild(queue_name);
+        let queue_up = document.createElement("BUTTON");
+        queue_up.className = "q-item-button";
+        queue_up.innerText = "^";
+        queue_up.onclick = () => {
+          if (queue.length === 1) return;
+          let i = queue.findIndex((item) => item[1] === queue_id);
+          if (i === 0) return;
+          let qir = document.getElementById(queue_id);
+          qir.remove();
+          let t = queue.find((item) => item[1] === queue_id);
+          queue = queue.filter((item) => item[1] !== queue_id);
+          queue.splice(i-1, 0, t);
+          in_queue_ele.insertBefore(qir, in_queue_ele.children.item(i-1));
+        };
+        queue_item.appendChild(queue_up);
         let queue_remove = document.createElement("BUTTON");
+        queue_remove.className = "q-item-button";
         queue_remove.innerText = "Remove From Queue";
         queue_remove.onclick = () => {
           document.getElementById(queue_id).remove();
@@ -244,32 +271,41 @@
         a.click();
       }
 
+      function add_playlist(playlist_songs) {
+        let randomized = [];
+        while (randomized.length < playlist_songs.length) {
+          let rand = Math.floor(Math.random() * playlist_songs.length);
+          if (!randomized.includes(playlist_songs[rand])) {
+            randomized.push(playlist_songs[rand]);
+          }
+        }
+        for (const n of randomized) {
+          add_to_queue(n);
+        }
+      }
+
       function upload_playlist() {
         let reader = new FileReader();
         reader.readAsText(document.getElementById("playlist-upload").files[0]);
         reader.addEventListener("load", () => {
           let playlist_songs = reader.result.split("\n");
-          let randomized = [];
-          while (randomized.length < playlist_songs.length) {
-            let rand = Math.floor(Math.random() * playlist_songs.length);
-            if (!randomized.includes(playlist_songs[rand])) {
-              randomized.push(playlist_songs[rand]);
-            }
-          }
-          for (const n of randomized) {
-            add_to_queue(n);
-          }
+          add_playlist(playlist_songs);
         });
       }
 
       function download_history() {
         let a = document.createElement("A");
         a.href = `data:text/plain;charset=utf-8,${encodeURIComponent(JSON.stringify(history))}`;
-        a.download = "queue.playlist";
+        a.download = `${Date.now()}.history`;
         a.style.display = "none";
         document.body.appendChild(a);
         a.click();
       }
+
+      async function add_selected_playlist() {
+        let playlist_songs = (await (await fetch(`/playlists/${document.getElementById("playlist-select").value}`)).text()).split("\n");
+        add_playlist(playlist_songs);
+      }
     </script>
   </body>
 </html>