From 0702cc828a590515a680d72445d1c74122f4cdd0 Mon Sep 17 00:00:00 2001
From: SkyG0D <silvanosilvino@hotmail.com>
Date: Tue, 26 Jan 2021 16:15:50 -0200
Subject: [PATCH] :bug: Search bugfix

---
 src/css/style.css                         | 12 +++----
 src/js/setup.js                           | 43 ++++++++++++-----------
 src/scss/components/_download-status.scss |  2 +-
 src/scss/components/_info.scss            |  8 ++---
 src/scss/helpers/_variables.scss          |  3 +-
 src/scss/layout/_principal.scss           |  2 +-
 6 files changed, 37 insertions(+), 33 deletions(-)

diff --git a/src/css/style.css b/src/css/style.css
index 1d2f7b2..0be0d66 100644
--- a/src/css/style.css
+++ b/src/css/style.css
@@ -200,7 +200,7 @@ select {
 }
 
 .progress-title {
-  font-size: 10px;
+  font-size: 25px;
 }
 
 .loading {
@@ -222,7 +222,7 @@ select {
 @media screen and (min-height: 700px) {
   .downloading__wrapper {
     flex-direction: column;
-    min-width: 400px;
+    min-width: 500px;
     max-width: 600px;
     width: auto;
   }
@@ -334,9 +334,9 @@ select {
   content: ":";
 }
 
-@media screen and (min-height: 700px) {
+@media (min-width: 900px) {
   .info__group p {
-    font-size: 25px;
+    font-size: 30px;
   }
 }
 
@@ -346,9 +346,9 @@ select {
   word-wrap: break-word;
 }
 
-@media screen and (min-height: 700px) {
+@media (min-width: 900px) {
   .info__group output {
-    font-size: 20px;
+    font-size: 22px;
   }
 }
 
diff --git a/src/js/setup.js b/src/js/setup.js
index b3fc713..f66dc6f 100644
--- a/src/js/setup.js
+++ b/src/js/setup.js
@@ -70,7 +70,7 @@ const hideMenusAndShowFirstScreen = () => (
     ])
 );
 
-const showStatusMsg = (msg, cssClass = '', timeout) => {
+const showStatusMsg = (msg, cssClass = "", timeout) => {
     $statusElt.innerHTML = `<span class="${cssClass}" >${msg}</span>`;
 
     if (timeout) {
@@ -121,35 +121,37 @@ const setVideoInfo = async () => {
 }
 
 const searchURL = () => {
-    clearTimeout(lastestSearchId);
+    if (!isDownloading) {
+        clearTimeout(lastestSearchId);
 
-    hideMenusAndShowFirstScreen();
+        hideMenusAndShowFirstScreen();
 
-    let msg = "Insira uma URL válida!";
-    let msgClass = "error";
+        let msg = "Insira uma URL válida!";
+        let msgClass = "error";
 
-    if (ytdl.validateURL($urlInput.value)) {
-        changeElementsDisplay([
-            eltDisplay($firstScreen),
-            eltDisplay($loading, 'flex'),
-        ]);
+        if (ytdl.validateURL($urlInput.value)) {
+            changeElementsDisplay([
+                eltDisplay($firstScreen),
+                eltDisplay($loading, 'flex'),
+            ]);
 
-        $selectTypeElt.value = "video";
+            $selectTypeElt.value = "video";
 
-        msg = "URL encontrada!";
-        msgClass = "success";
+            msg = "URL encontrada!";
+            msgClass = "success";
 
-        url = $urlInput.value;
-        setVideoInfo();
-    }
+            url = $urlInput.value;
+            setVideoInfo();
+        }
 
-    showStatusMsg(msg, msgClass);
-    $urlInput.value = '';
+        showStatusMsg(msg, msgClass);
+        $urlInput.value = '';
+    }
 }
 
 const unlockDownload = () => {
     $downloadBtn.addEventListener("click", saveAs);
-    changeElementDisplay(eltDisplay($downloadArea, "flex"));
+    changeElementDisplay(eltDisplay($downloadArea, "block"));
     isDownloading = false;
 }
 
@@ -173,7 +175,6 @@ const downloadStarted = downloader => {
     return () => {
         const cancelButton = $statusElt.querySelector('button.cancel');
         cancelButton.addEventListener('click', () => cancelDownload(downloader));
-        isDownloading = true;
     }
 }
 
@@ -183,6 +184,7 @@ const downloadFinished = () => {
 }
 
 const showProgress = ({ audio, video }) => {
+
     const downloaded = audio.downloaded + video.downloaded;
     const total = audio.total + video.total;
 
@@ -244,6 +246,7 @@ const download = path => {
 
     setStatusProgressBarHTML();
     configDownloaderEvents(downloader);
+    isDownloading = true;
 }
 
 const handleVideoDownload = ({ canceled, filePath }) => {
diff --git a/src/scss/components/_download-status.scss b/src/scss/components/_download-status.scss
index dc62b42..5f44317 100644
--- a/src/scss/components/_download-status.scss
+++ b/src/scss/components/_download-status.scss
@@ -21,5 +21,5 @@
 }
 
 .progress-title {
-    font-size: 10px;
+    font-size: 25px;
 }
diff --git a/src/scss/components/_info.scss b/src/scss/components/_info.scss
index 8704878..d0c0f72 100644
--- a/src/scss/components/_info.scss
+++ b/src/scss/components/_info.scss
@@ -38,8 +38,8 @@
                 content: ":";
             }
 
-            @media #{$mq-min-height} {
-                font-size: 25px;
+            @media #{$mq-min-width} {
+                font-size: 30px;
             }
 
         }
@@ -49,8 +49,8 @@
             font-weight: bold;
             word-wrap: break-word;
 
-            @media #{$mq-min-height} {
-                font-size: 20px;
+            @media #{$mq-min-width} {
+                font-size: 22px;
             }
 
         }
diff --git a/src/scss/helpers/_variables.scss b/src/scss/helpers/_variables.scss
index 715d8f5..b33803e 100644
--- a/src/scss/helpers/_variables.scss
+++ b/src/scss/helpers/_variables.scss
@@ -7,4 +7,5 @@ $success-color: #2ecc71;
 
 $border: 1px solid $secondary-color;
 
-$mq-min-height: "screen and (min-height: 700px)"
+$mq-min-height: "screen and (min-height: 700px)";
+$mq-min-width: "(min-width: 900px)";
diff --git a/src/scss/layout/_principal.scss b/src/scss/layout/_principal.scss
index e339c32..f6f5e6c 100644
--- a/src/scss/layout/_principal.scss
+++ b/src/scss/layout/_principal.scss
@@ -5,7 +5,7 @@
 
     @media #{$mq-min-height} {
         flex-direction: column;
-        min-width: 400px;
+        min-width: 500px;
         max-width: 600px;
         width: auto;
     }