From 2fac50678e240ca4630d6d36c0f06216676dd1ae Mon Sep 17 00:00:00 2001 From: Andrew <66430340+aandrew-me@users.noreply.github.com> Date: Fri, 10 Mar 2023 13:36:24 +0600 Subject: [PATCH] Work on new playlist layout --- html/playlist_new.html | 21 +++++++++++ src/playlist_new.js | 79 +++++++++++++++++++++++++----------------- 2 files changed, 69 insertions(+), 31 deletions(-) diff --git a/html/playlist_new.html b/html/playlist_new.html index fcda07e..3a63056 100644 --- a/html/playlist_new.html +++ b/html/playlist_new.html @@ -23,6 +23,8 @@ + + Text copied
@@ -39,6 +41,25 @@ +
+ Loading + + + + + + + + + + + +
+ +

+ +
diff --git a/src/playlist_new.js b/src/playlist_new.js index 809d8b5..12bb7f2 100644 --- a/src/playlist_new.js +++ b/src/playlist_new.js @@ -3,7 +3,7 @@ const { default: YTDlpWrap } = require("yt-dlp-wrap-plus"); const path = require("path"); const os = require("os"); const fs = require("fs"); -const { execSync } = require("child_process"); +const { execSync, exec, spawnSync } = require("child_process"); let url; const ytDlp = localStorage.getItem("ytdlp"); const ytdlp = new YTDlpWrap(ytDlp); @@ -54,43 +54,60 @@ function getId(id) { function pasteLink() { const clipboardText = clipboard.readText(); - const data = execSync( + getId("loadingWrapper").style.display = "flex"; + getId("incorrectMsg").textContent = ""; + getId("errorBtn").style.display = "none"; + getId("errorDetails").style.display = "none"; + getId("errorDetails").textContent = ""; + + exec( `yt-dlp --yes-playlist --no-warnings -J --flat-playlist "${clipboardText}"`, - { - encoding: "utf8", + (error, stdout, stderr) => { + if (error) { + getId("loadingWrapper").style.display = "none"; + getId("incorrectMsg").textContent = i18n.__( + "Some error has occurred. Check your network and use correct URL" + ); + getId("errorDetails").innerHTML = ` + URL: ${clipboardText} +

+ ${error} + `; + getId("errorDetails").title = i18n.__("Click to copy"); + getId("errorBtn").style.display = "inline-block"; + } else { + const parsed = JSON.parse(stdout); + console.log(parsed); + let items = ""; + parsed.entries.forEach((entry) => { + const randId = Math.random().toFixed(10).toString().slice(2); + + if (entry.channel) { + items += ` +
+ No thumbnail + +
+
${entry.title}
+
${formatTime(entry.duration)}
+ +
+
+ `; + } + }); + getId("data").innerHTML = items; + getId("loadingWrapper").style.display = "none"; + } } ); - const parsed = JSON.parse(data); - console.log(parsed); - let items = ""; - parsed.entries.forEach((entry) => { - const randId = Math.random().toFixed(10).toString().slice(2); - - if (entry.channel) { - items += ` -
- No thumbnail -
-
${entry.title}
-
${formatTime(entry.duration)}
- -
-
- `; - } - }); - getId("data").innerHTML = items; } getId("pasteLink").addEventListener("click", (e) => { - try { - pasteLink(); - } catch (error) { - console.log(error); - } + pasteLink(); }); document.addEventListener("keydown", (event) => {