Selaa lähdekoodia

Merge pull request #25 from ColinEspinas/search-debounce

Added debounce on search input
Daoud Clarke 3 vuotta sitten
vanhempi
commit
02bcef640c
1 muutettua tiedostoa jossa 11 lisäystä ja 2 poistoa
  1. 11 2
      mwmbl/tinysearchengine/static/index.js

+ 11 - 2
mwmbl/tinysearchengine/static/index.js

@@ -10,7 +10,7 @@ window.onload = (event) => {
     const length = searchInput.value.length;
     searchInput.setSelectionRange(length, length);
 
-    searchInput.oninput = e => {
+    searchInput.oninput = debounce(e => {
         console.log("Key", e.key);
         console.log(searchInput.value);
 
@@ -27,7 +27,7 @@ window.onload = (event) => {
                 ts.numItems = content.length;
             });
         });
-    };
+    });
 
     // Handle moving the selected item up and down
     document.addEventListener('keydown', (e) => {
@@ -57,6 +57,15 @@ window.onload = (event) => {
 };
 
 
+function debounce(callback, timeout = 100){
+    let timer;
+    return (...args) => {
+        clearTimeout(timer);
+        timer = setTimeout(() => { callback.apply(this, args); }, timeout);
+    };
+}
+
+
 function selectNextItem() {
     if (ts.selected === null) {
         ts.selected = 0;