fix: cannot upload (#32)

empty folder got js error

close: #31

diff --git a/assets/index.css b/assets/index.css
index a4fa414bbd2f7a757d2ca79c113161b3f4787fea..bbc9f8e90cb8ea267c17526560dc51c4eb6fe58e 100644 (file)
--- a/assets/index.css
+++ b/assets/index.css
@@ -98,8 +98,8 @@ body {
 }
 
 .empty-folder {
-  display: block;
   padding-top: 1rem;
+  font-style: italic;
 }
 
 .uploaders-table th,

diff --git a/assets/index.html b/assets/index.html
index 7a2f54382aee991b6d73c239f76aa7cf7007ffd4..39caf9ccd9c7ea5fec7b4e1915fccf9e15e06997 100644 (file)
--- a/assets/index.html
+++ b/assets/index.html
@@ -31,6 +31,7 @@
     </form>
   </div>
   <div class="main">
+    <div class="empty-folder hidden"></div>
     <table class="uploaders-table hidden">
       <thead>
         <tr>

diff --git a/assets/index.js b/assets/index.js
index 4e3d9d34fc184e08e0157cb10400e6fa5bc8b8a8..a60286e4890bac88952ab3a8a0e2ee49f50788d8 100644 (file)
--- a/assets/index.js
+++ b/assets/index.js
@@ -17,7 +17,19 @@ const dirEmptyNote = params.q ? 'No results' : DATA.dir_exists ? 'Empty folder'
 /**
  * @type Element
  */
-let $pathsTable, $pathsTableBody, $uploadersTable;
+let $pathsTable;
+/**
+ * @type Element
+ */
+let $pathsTableBody;
+/**
+ * @type Element
+ */
+let $uploadersTable;
+/**
+ * @type Element
+ */
+let $emptyFolder;
 /**
  * @type string
  */
@@ -59,8 +71,8 @@ class Uploader {
     <td class="cell-status" id="uploadStatus${idx}"></td>
   </tr>`);
     $uploadersTable.classList.remove("hidden");
+    $emptyFolder.classList.add("hidden");
     this.$uploadStatus = document.getElementById(`uploadStatus${idx}`);
-    document.querySelector('.main i.empty-folder').remove();
 
     const ajax = new XMLHttpRequest();
     ajax.upload.addEventListener("progress", e => this.progress(e), false);
@@ -187,8 +199,8 @@ async function deletePath(index) {
         DATA.paths[index] = null;
         if (!DATA.paths.find(v => !!v)) {
           $pathsTable.classList.add("hidden");
-          document.querySelector('.main').insertAdjacentHTML("afterbegin", '<i class="empty-folder"></i>');
-          document.querySelector('.main .empty-folder').textContent = dirEmptyNote;
+          $emptyFolder.textContent = dirEmptyNote;
+          $emptyFolder.classList.remove("hidden");
         }
     } else {
       throw new Error(await res.text())
@@ -283,6 +295,7 @@ function ready() {
   $pathsTable = document.querySelector(".paths-table")
   $pathsTableBody = document.querySelector(".paths-table tbody");
   $uploadersTable = document.querySelector(".uploaders-table");
+  $emptyFolder = document.querySelector(".empty-folder");
 
   if (params.q) {
     document.getElementById('search').value = params.q;
@@ -298,8 +311,8 @@ function ready() {
       addPath(DATA.paths[i], i);
     }
     if (len == 0) {
-      document.querySelector('.main').insertAdjacentHTML("afterbegin", '<i class="empty-folder"></i>');
-      document.querySelector('.main .empty-folder').textContent = dirEmptyNote;
+      $emptyFolder.textContent = dirEmptyNote;
+      $emptyFolder.classList.remove("hidden");
     }
   }
   if (DATA.allow_upload) {