Drop debounced search on input, search only on Enter

2026-07-21 10:14:26 -04:00
parent 6a10051d78
commit 5b956f8d95
3 changed files with 73 additions and 111 deletions
@@ -534,6 +534,7 @@
        li.addEventListener("click", () => {
          const input = document.getElementById("search-input");
          input.value = entry;
+          this._suppressNext = true;
          input.dispatchEvent(new Event("input", { bubbles: true }));
          this.hide();
          _triggerAdvancedSearch(entry);
@@ -602,6 +603,7 @@
            const base = words.filter(w => w).join(" ");
            input.value = (base ? base + " " : "") + "tag:" + item.tag + " ";
          }
+          this._suppressNext = true;
          input.dispatchEvent(new Event("input", { bubbles: true }));
          this.hide();
          input.focus();
@@ -4985,7 +4987,7 @@
    // Initially hide clear button
    if (clearBtn) clearBtn.style.display = "none";

-    // --- Input handler: debounced search + autocomplete dropdown ---
+    // --- Input handler: autocomplete dropdown only (search triggered on Enter or selection) ---
    input.addEventListener("input", () => {
      const hasText = input.value.length > 0;
      clearBtn.style.display = hasText ? "flex" : "none";
@@ -4993,23 +4995,11 @@
      // Show autocomplete dropdown while typing
      AutocompleteDropdown.populate(input.value, input.selectionStart);

-      // Debounced search execution
-      clearTimeout(searchTimeout);
-      searchTimeout = setTimeout(
-        () => {
-          const q = input.value.trim();
-          const vault = document.getElementById("vault-filter").value;
-          const tagFilter = selectedTags.length > 0 ? selectedTags.join(",") : null;
-          advancedSearchOffset = 0;
-          if (q.length >= _getEffective("min_query_length", MIN_SEARCH_LENGTH) || tagFilter) {
-            performAdvancedSearch(q, vault, tagFilter);
-          } else if (q.length === 0) {
-            SearchChips.clear();
-            showWelcome();
-          }
-        },
-        _getEffective("debounce_ms", 300),
-      );
+      // Clear results when input becomes empty
+      if (!hasText) {
+        SearchChips.clear();
+        showWelcome();
+      }
    });

    // --- Focus handler: show history dropdown ---
@@ -5033,7 +5023,7 @@
          AutocompleteDropdown.navigateUp();
        } else if (e.key === "Enter") {
          // First: check dropdown suggestions (higher priority than search results)
-          if (AutocompleteDropdown.isVisible() && AutocompleteDropdown.selectActive()) {
+          if (AutocompleteDropdown.selectActive()) {
            e.preventDefault();
            return;
          }
@@ -5059,30 +5049,28 @@
            performAdvancedSearch(q, vault, tagFilter);
          }
          e.preventDefault();
-        } else if (e.key === "ArrowDown" && !AutocompleteDropdown.isVisible()) {
-          // Navigate search results when dropdown is closed
-          if (window.navigateSearchResults) { window.navigateSearchResults(1); e.preventDefault(); }
-        } else if (e.key === "ArrowUp" && !AutocompleteDropdown.isVisible()) {
-          if (window.navigateSearchResults) { window.navigateSearchResults(-1); e.preventDefault(); }
        } else if (e.key === "Escape") {
          AutocompleteDropdown.hide();
          e.stopPropagation();
        }
-      } else if (e.key === "Enter") {
-        if (AutocompleteDropdown.isVisible() && AutocompleteDropdown.selectActive()) {
+      } else {
+        // Dropdown not visible: navigate search results or execute search
+        if (e.key === "ArrowDown") {
+          if (window.navigateSearchResults) { window.navigateSearchResults(1); e.preventDefault(); }
+        } else if (e.key === "ArrowUp") {
+          if (window.navigateSearchResults) { window.navigateSearchResults(-1); e.preventDefault(); }
+        } else if (e.key === "Enter") {
+          const q = input.value.trim();
+          if (q) {
+            SearchHistory.add(q);
+            clearTimeout(searchTimeout);
+            advancedSearchOffset = 0;
+            const vault = document.getElementById("vault-filter").value;
+            const tagFilter = selectedTags.length > 0 ? selectedTags.join(",") : null;
+            performAdvancedSearch(q, vault, tagFilter);
+          }
          e.preventDefault();
-          return;
        }
-        const q = input.value.trim();
-        if (q) {
-          SearchHistory.add(q);
-          clearTimeout(searchTimeout);
-          advancedSearchOffset = 0;
-          const vault = document.getElementById("vault-filter").value;
-          const tagFilter = selectedTags.length > 0 ? selectedTags.join(",") : null;
-          performAdvancedSearch(q, vault, tagFilter);
-        }
-        e.preventDefault();
      }
    });

@@ -166,7 +166,7 @@ function initSearch() {
  // Initially hide clear button
  if (clearBtn) clearBtn.style.display = "none";

-  // Input handler: debounced search + autocomplete dropdown
+  // Input handler: autocomplete dropdown only (search triggered on Enter or selection)
  input.addEventListener("input", () => {
    const hasText = input.value.length > 0;
    clearBtn.style.display = hasText ? "flex" : "none";
@@ -174,23 +174,11 @@ function initSearch() {
    // Show autocomplete dropdown while typing
    AutocompleteDropdown.populate(input.value, input.selectionStart);

-    // Debounced search execution
-    clearTimeout(state.searchTimeout);
-    state.searchTimeout = setTimeout(
-      () => {
-        const q = input.value.trim();
-        const vault = document.getElementById("vault-filter").value;
-        const tagFilter = state.selectedTags.length > 0 ? state.selectedTags.join(",") : null;
-        state.advancedSearchOffset = 0;
-        if (q.length >= _getEffective("min_query_length", state.MIN_SEARCH_LENGTH) || tagFilter) {
-          performAdvancedSearch(q, vault, tagFilter);
-        } else if (q.length === 0) {
-          SearchChips.clear();
-          showWelcome();
-        }
-      },
-      _getEffective("debounce_ms", 300),
-    );
+    // Clear results when input becomes empty
+    if (!hasText) {
+      SearchChips.clear();
+      showWelcome();
+    }
  });

  // Focus handler: show history dropdown
@@ -214,7 +202,7 @@ function initSearch() {
        AutocompleteDropdown.navigateUp();
      } else if (e.key === "Enter") {
        // First: check dropdown suggestions (higher priority than search results)
-        if (AutocompleteDropdown.isVisible() && AutocompleteDropdown.selectActive()) {
+        if (AutocompleteDropdown.selectActive()) {
          e.preventDefault();
          return;
        }
@@ -240,30 +228,28 @@ function initSearch() {
          performAdvancedSearch(q, vault, tagFilter);
        }
        e.preventDefault();
-      } else if (e.key === "ArrowDown" && !AutocompleteDropdown.isVisible()) {
-        // Navigate search results when dropdown is closed
-        if (window.navigateSearchResults) { window.navigateSearchResults(1); e.preventDefault(); }
-      } else if (e.key === "ArrowUp" && !AutocompleteDropdown.isVisible()) {
-        if (window.navigateSearchResults) { window.navigateSearchResults(-1); e.preventDefault(); }
      } else if (e.key === "Escape") {
        AutocompleteDropdown.hide();
        e.stopPropagation();
      }
-    } else if (e.key === "Enter") {
-      if (AutocompleteDropdown.isVisible() && AutocompleteDropdown.selectActive()) {
+    } else {
+      // Dropdown not visible: navigate search results or execute search
+      if (e.key === "ArrowDown") {
+        if (window.navigateSearchResults) { window.navigateSearchResults(1); e.preventDefault(); }
+      } else if (e.key === "ArrowUp") {
+        if (window.navigateSearchResults) { window.navigateSearchResults(-1); e.preventDefault(); }
+      } else if (e.key === "Enter") {
+        const q = input.value.trim();
+        if (q) {
+          SearchHistory.add(q);
+          clearTimeout(state.searchTimeout);
+          state.advancedSearchOffset = 0;
+          const vault = document.getElementById("vault-filter").value;
+          const tagFilter = state.selectedTags.length > 0 ? state.selectedTags.join(",") : null;
+          performAdvancedSearch(q, vault, tagFilter);
+        }
        e.preventDefault();
-        return;
      }
-      const q = input.value.trim();
-      if (q) {
-        SearchHistory.add(q);
-        clearTimeout(state.searchTimeout);
-        state.advancedSearchOffset = 0;
-        const vault = document.getElementById("vault-filter").value;
-        const tagFilter = state.selectedTags.length > 0 ? state.selectedTags.join(",") : null;
-        performAdvancedSearch(q, vault, tagFilter);
-      }
-      e.preventDefault();
    }
  });

@@ -288,6 +288,7 @@ export const AutocompleteDropdown = {
      li.addEventListener("click", () => {
        const input = document.getElementById("search-input");
        input.value = entry;
+        this._suppressNext = true;
        input.dispatchEvent(new Event("input", { bubbles: true }));
        this.hide();
        _triggerAdvancedSearch(entry);
@@ -356,6 +357,7 @@ export const AutocompleteDropdown = {
          const base = words.filter(w => w).join(" ");
          input.value = (base ? base + " " : "") + "tag:" + item.tag + " ";
        }
+        this._suppressNext = true;
        input.dispatchEvent(new Event("input", { bubbles: true }));
        this.hide();
        input.focus();
@@ -600,7 +602,7 @@ export function initSearch() {
  // Initially hide clear button
  if (clearBtn) clearBtn.style.display = "none";

-  // --- Input handler: debounced search + autocomplete dropdown ---
+  // --- Input handler: autocomplete dropdown only (search triggered on Enter or selection) ---
  input.addEventListener("input", () => {
    const hasText = input.value.length > 0;
    clearBtn.style.display = hasText ? "flex" : "none";
@@ -608,23 +610,11 @@ export function initSearch() {
    // Show autocomplete dropdown while typing
    AutocompleteDropdown.populate(input.value, input.selectionStart);

-    // Debounced search execution
-    clearTimeout(state.searchTimeout);
-    state.searchTimeout = setTimeout(
-      () => {
-        const q = input.value.trim();
-        const vault = document.getElementById("vault-filter").value;
-        const tagFilter = state.selectedTags.length > 0 ? state.selectedTags.join(",") : null;
-        state.advancedSearchOffset = 0;
-        if (q.length >= _getEffective("min_query_length", state.MIN_SEARCH_LENGTH) || tagFilter) {
-          performAdvancedSearch(q, vault, tagFilter);
-        } else if (q.length === 0) {
-          SearchChips.clear();
-          showWelcome();
-        }
-      },
-      _getEffective("debounce_ms", 300),
-    );
+    // Clear results when input becomes empty
+    if (!hasText) {
+      SearchChips.clear();
+      showWelcome();
+    }
  });

  // --- Focus handler: show history dropdown ---
@@ -648,7 +638,7 @@ export function initSearch() {
        AutocompleteDropdown.navigateUp();
      } else if (e.key === "Enter") {
        // First: check dropdown suggestions (higher priority than search results)
-        if (AutocompleteDropdown.isVisible() && AutocompleteDropdown.selectActive()) {
+        if (AutocompleteDropdown.selectActive()) {
          e.preventDefault();
          return;
        }
@@ -674,30 +664,28 @@ export function initSearch() {
          performAdvancedSearch(q, vault, tagFilter);
        }
        e.preventDefault();
-      } else if (e.key === "ArrowDown" && !AutocompleteDropdown.isVisible()) {
-        // Navigate search results when dropdown is closed
-        if (window.navigateSearchResults) { window.navigateSearchResults(1); e.preventDefault(); }
-      } else if (e.key === "ArrowUp" && !AutocompleteDropdown.isVisible()) {
-        if (window.navigateSearchResults) { window.navigateSearchResults(-1); e.preventDefault(); }
      } else if (e.key === "Escape") {
        AutocompleteDropdown.hide();
        e.stopPropagation();
      }
-    } else if (e.key === "Enter") {
-      if (AutocompleteDropdown.isVisible() && AutocompleteDropdown.selectActive()) {
+    } else {
+      // Dropdown not visible: navigate search results or execute search
+      if (e.key === "ArrowDown") {
+        if (window.navigateSearchResults) { window.navigateSearchResults(1); e.preventDefault(); }
+      } else if (e.key === "ArrowUp") {
+        if (window.navigateSearchResults) { window.navigateSearchResults(-1); e.preventDefault(); }
+      } else if (e.key === "Enter") {
+        const q = input.value.trim();
+        if (q) {
+          SearchHistory.add(q);
+          clearTimeout(state.searchTimeout);
+          state.advancedSearchOffset = 0;
+          const vault = document.getElementById("vault-filter").value;
+          const tagFilter = state.selectedTags.length > 0 ? state.selectedTags.join(",") : null;
+          performAdvancedSearch(q, vault, tagFilter);
+        }
        e.preventDefault();
-        return;
      }
-      const q = input.value.trim();
-      if (q) {
-        SearchHistory.add(q);
-        clearTimeout(state.searchTimeout);
-        state.advancedSearchOffset = 0;
-        const vault = document.getElementById("vault-filter").value;
-        const tagFilter = state.selectedTags.length > 0 ? state.selectedTags.join(",") : null;
-        performAdvancedSearch(q, vault, tagFilter);
-      }
-      e.preventDefault();
    }
  });