From dde859ff037f82eeaaa593170d6c9f0f802c527a Mon Sep 17 00:00:00 2001
From: aandrew-me <ahammadandrew@protonmail.com>
Date: Thu, 17 Nov 2022 18:12:02 +0600
Subject: [PATCH] UX and UI changes

---
 assets/css/extra.css  |  6 ++++++
 html/playlist.html    |  5 +----
 html/preferences.html |  2 +-
 src/playlist.js       | 43 ++++++++++++++++++-------------------------
 4 files changed, 26 insertions(+), 30 deletions(-)

diff --git a/assets/css/extra.css b/assets/css/extra.css
index 88d484e..2db37f3 100644
--- a/assets/css/extra.css
+++ b/assets/css/extra.css
@@ -26,7 +26,12 @@ input[type="text"]{
     display:flex;
     flex-direction: row;
     justify-content: space-between;
+    margin:0 15px;
+    border: 1px solid rgb(75, 75, 75);
+    padding:10px;
+    border-radius: 15px;
 }
+
 #save{
     padding:10px;
     border-radius: 8px;
@@ -76,6 +81,7 @@ input[type="checkbox"]{
 
 #selectLocation{
     padding:10px;
+    margin:0 15px;
     border:none;
     border-radius: 10px;
     font-size: large;
diff --git a/html/playlist.html b/html/playlist.html
index e0dae98..914de1d 100644
--- a/html/playlist.html
+++ b/html/playlist.html
@@ -47,12 +47,9 @@
         <span id="link"></span>
         <br><br>
 
-        <span id="downloadBestQualityTxt">Download best quality for all videos</span>
-        <input id="downloadBestQualityChecked" type="checkbox">
-        <br>
-
         <label id="videoFormat">Select Video Format </label>
         <select id="select">
+            <option value="best" id="bestVideoOption">Best</option>
             <option value="144">144p</option>
             <option value="240">240p</option>
             <option value="360">360p</option>
diff --git a/html/preferences.html b/html/preferences.html
index 3267032..7d32f53 100644
--- a/html/preferences.html
+++ b/html/preferences.html
@@ -20,7 +20,7 @@
     <h1 id="preferences">Preferences</h1>
     <br><br>
 
-    <div class="prefBox">
+    <div class="prefBox" style="border: none;">
         <strong id="dlText">Download location</strong>
     </div>
     <br>
diff --git a/src/playlist.js b/src/playlist.js
index c7b0294..c67f705 100644
--- a/src/playlist.js
+++ b/src/playlist.js
@@ -46,8 +46,8 @@ let playlistId = "";
 let folderLocation;
 
 function download(type) {
-	getId("list").innerHTML = ""
-	getId("playlistName").textContent = ""
+	getId("list").innerHTML = "";
+	getId("playlistName").textContent = "";
 
 	// Whether to use browser cookies or not
 	if (localStorage.getItem("browser")) {
@@ -60,11 +60,6 @@ function download(type) {
 	}
 	let count = 0;
 	let playlistName;
-	const date = new Date();
-	const today =
-		date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate();
-	let playlistDirName =
-		"Playlist" + Math.random().toFixed(5).toString().slice(2) + "_" + today;
 
 	getId("options").style.display = "none";
 	getId("pasteLink").style.display = "none";
@@ -73,9 +68,10 @@ function download(type) {
 	let quality, format, downloadProcess;
 	if (type === "video") {
 		quality = getId("select").value;
-		format = `"mp4[height<=${quality}]+m4a/mp4[height<=${quality}]/bv[height<=${quality}]+ba/best[height<=${quality}]/best"`;
-		if (getId("downloadBestQualityChecked").checked) {
-			format = "bv*+ba";
+		if (quality === "best") {
+			format = "bv*+ba/best";
+		} else {
+			format = `"mp4[height<=${quality}]+m4a/mp4[height<=${quality}]/bv[height<=${quality}]+ba/best[height<=${quality}]/best"`;
 		}
 	} else {
 		format = getId("audioSelect").value;
@@ -136,14 +132,19 @@ function download(type) {
 		if (eventData.includes(playlistIdTxt)) {
 			playlistId = eventData.split(" ")[3].split(";")[0];
 			// Opening folder
-			if (type === "video"){
-				folderLocation =  path.join(downloadDir, "Playlist_vid_" + playlistId);
-			}
-			else{
-				folderLocation =  path.join(downloadDir, "Playlist_aud_" + playlistId);
+			if (type === "video") {
+				folderLocation = path.join(
+					downloadDir,
+					"Playlist_vid_" + playlistId
+				);
+			} else {
+				folderLocation = path.join(
+					downloadDir,
+					"Playlist_aud_" + playlistId
+				);
 			}
 			if (platform() == "win32") {
-				folderLocation =  folderLocation.split(path.sep).join("\\\\");
+				folderLocation = folderLocation.split(path.sep).join("\\\\");
 			}
 			console.log(folderLocation);
 		}
@@ -215,15 +216,6 @@ function download(type) {
 	});
 }
 
-// Disable the option to select
-getId("downloadBestQualityChecked").addEventListener("click", () => {
-	if (getId("downloadBestQualityChecked").checked) {
-		getId("select").disabled = true;
-		return;
-	}
-	getId("select").disabled = false;
-});
-
 // Downloading video
 getId("download").addEventListener("click", () => {
 	download("video");
@@ -281,3 +273,4 @@ getId("audioFormat").textContent = i18n.__("Select Audio Format ");
 
 getId("download").textContent = i18n.__("Download");
 getId("audioDownload").textContent = i18n.__("Download");
+getId("bestVideoOption").textContent= i18n.__("Best")