fix: clear search input also clear query (#178)

close #161

diff --git a/assets/index.html b/assets/index.html
index b3d7a33c92e8cb9cc9ec47d3fb9143118bc5833f..a882fde22e01b96fe76c49aaa09d38a49a6dfbbe 100644 (file)
--- a/assets/index.html
+++ b/assets/index.html
@@ -37,7 +37,7 @@
       <div class="icon">
         <svg width="16" height="16" fill="currentColor" viewBox="0 0 16 16"><path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z"/></svg>
       </div>
-      <input id="search" name="q" type="text" maxlength="128" autocomplete="off" tabindex="1" required>
+      <input id="search" name="q" type="text" maxlength="128" autocomplete="off" tabindex="1">
       <input type="submit" hidden />
     </form>
   </div>

diff --git a/assets/index.js b/assets/index.js
index f9e6b83f36acf4a1f38942df28ac738c62a21541..02593080407035cc0049d0c7689b69baed3785d0 100644 (file)
--- a/assets/index.js
+++ b/assets/index.js
@@ -453,6 +453,7 @@ async function addFileEntries(entries, dirs) {
 function getUrl(name) {
     let url = location.href.split('?')[0];
     if (!url.endsWith("/")) url += "/";
+    if (!name) return url;
     url += name.split("/").map(encodeURIComponent).join("/");
     return url;
 }
@@ -522,10 +523,21 @@ function ready() {
   $pathsTableBody = document.querySelector(".paths-table tbody");
   $uploadersTable = document.querySelector(".uploaders-table");
   $emptyFolder = document.querySelector(".empty-folder");
+  $searchForm = document.querySelector(".searchbar");
   $newFolder = document.querySelector(".new-folder");
 
   if (DATA.allow_search) {
-    document.querySelector(".searchbar").classList.remove("hidden");
+    $searchForm.classList.remove("hidden");
+    $searchForm.addEventListener("submit", event => {
+        event.preventDefault();
+        const formData = new FormData($searchForm);
+        const q = formData.get("q");
+        let href = getUrl();
+        if (q) {
+          href += "?q=" + q;
+        }
+        location.href = href;
+    });
     if (PARAMS.q) {
       document.getElementById('search').value = PARAMS.q;
     }