1 files changed, 52 insertions, 34 deletions
diff --git a/users/grfn/bbbg/resources/public/main.js b/users/grfn/bbbg/resources/public/main.js
index d4752f114167..2308ca595724 100644
--- a/users/grfn/bbbg/resources/public/main.js
+++ b/users/grfn/bbbg/resources/public/main.js
@@ -1,41 +1,59 @@
 window.onload = () => {
-  console.log("loaded");
   const input = document.getElementById("name-autocomplete");
   if (input != null) {
-    const eventID = document.getElementById("event-id").value;
-
-    const autocomplete = new autoComplete({
-      selector: "#name-autocomplete",
-      placeHolder: "Enter your name",
-      data: {
-        src: async (query) => {
-          const resp = await fetch(
-            `/attendees.json?q=${query}&event_id=${eventID}&attended=false`
-          );
-          console.log("got resp");
-          const { results } = await resp.json();
-          return results;
-        },
-        keys: ["bbbg.attendee/meetup-name"],
-      },
-      resultItem: {
-        highlight: {
-          render: true,
-        },
-      },
-    });
+    const attendeeList = document.getElementById("attendees-list");
+    const filterAttendees = (filter) => {
+      if (filter == "") {
+        for (let elt of attendeeList.querySelectorAll("li")) {
+          elt.classList.remove("hidden");
+        }
+
+        return;
+      }
+
+      let re = "";
+      for (let c of filter) {
+        re += `${c}.*`;
+      }
+      let filterRe = new RegExp(re, "i");
+
+      for (let elt of attendeeList.querySelectorAll("li")) {
+        const attendee = JSON.parse(elt.dataset.attendee);
+        if (attendee["bbbg.attendee/meetup-name"].match(filterRe) == null) {
+          elt.classList.add("hidden");
+        } else {
+          elt.classList.remove("hidden");
+        }
+      }
+    };
+
+    const attendeeIDInput = document.getElementById("attendee-id");
+    const submit = document.querySelector("#submit-button");
+    const signupForm = document.getElementById("signup-form");
+
+    input.oninput = (e) => {
+      filterAttendees(e.target.value);
+      attendeeIDInput.value = null;
+      submit.classList.add("hidden");
+      submit.setAttribute("disabled", "disabled");
+      signupForm.setAttribute("disabled", "disabled");
+    };
+
+    attendeeList.addEventListener("click", (e) => {
+      if (!(e.target instanceof HTMLLIElement)) {
+        return;
+      }
+      if (e.target.dataset.attendee == null) {
+        return;
+      }
+
+      const attendee = JSON.parse(e.target.dataset.attendee);
+      input.value = attendee["bbbg.attendee/meetup-name"];
+      attendeeIDInput.value = attendee["bbbg.attendee/id"];
 
-    input.addEventListener("selection", function (event) {
-      const attendee = event.detail.selection.value;
-      event.target.value = attendee["bbbg.attendee/meetup-name"];
-
-      const attendeeID = attendee["bbbg.attendee/id"];
-      document.getElementById("attendee-id").value = attendeeID;
-      document.getElementById("signup-form").removeAttribute("disabled");
-      document
-        .getElementById("signup-form")
-        .querySelector('input[type="submit"]')
-        .removeAttribute("disabled");
+      submit.classList.remove("hidden");
+      submit.removeAttribute("disabled");
+      signupForm.removeAttribute("disabled");
     });
   }