implement search functions

Lab01/app/templates/tasks.tmpl

@@ -12,7 +12,7 @@
     <div class="mt-5 d-flex justify-content-between align-items-center">
         <div class="fs-3 text-center">{{ .title }}</div>
         <div class="col-6">
-            <input type="email" class="form-control" id="floatingInput" placeholder="search for task">
+            <input type="email" class="form-control" id="search" placeholder="search for task">
         </div>
     </div>
     <hr>
@@ -41,6 +41,19 @@
     const tasksEl = document.getElementById("tasks");
     const descriptionInput = document.getElementById("description");
     let tasks = [];
+    let timer;
+
+    document.getElementById("search").addEventListener('keyup', e => {
+        const enteredText = e.currentTarget.value;
+        clearTimeout(timer);
+        if (e.key === "Enter ") {
+            searchTask(enteredText);
+        } else {
+            timer = setTimeout(() => {
+                searchTask(enteredText);
+            }, 1000);
+        }
+    });
 
     function submitForm(formData) {
         axios.post("/tasks", formData, axiosConfig)
@@ -71,6 +84,12 @@
             });
     }
 
+    function searchTask(value) {
+        if (value !== "") {
+            console.log(value);
+        }
+    }
+
     function addTaskToTasks(task, number) {
         tasks.push(task);
         const newTask = document.createElement('div');