From 405fcdbe2b407d0015c86a0044272e0fc31fa829 Mon Sep 17 00:00:00 2001
From: "Michael J. Radwin" <michael@radwin.org>
Date: Tue, 25 Jun 2024 15:32:37 -0700
Subject: [PATCH] More intelligently handle focus and backspace in city
 selector

---
 package.json           |  2 +-
 static/i/hebcal-app.js | 24 ++++++++++++++----------
 2 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/package.json b/package.json
index 327b653a..d1a5f244 100644
--- a/package.json
+++ b/package.json
@@ -13,7 +13,7 @@
   "config": {
     "sprite": "sprite12.svg",
     "csprite": "color-icons4.svg",
-    "clientapp": "hebcal-app-5.1.0.min.js"
+    "clientapp": "hebcal-app-5.1.1.min.js"
   },
   "type": "module",
   "engines": {
diff --git a/static/i/hebcal-app.js b/static/i/hebcal-app.js
index ccfc4667..21558b7a 100644
--- a/static/i/hebcal-app.js
+++ b/static/i/hebcal-app.js
@@ -108,7 +108,8 @@ const hebcalClient = {
       readyToSubmit = true;
     }
 
-    function keyupOrKeypress(event) {
+    let backspaceClearsEverything = false;
+    cityTypeaheadEl.addEventListener('keydown', function(event) {
       if (!autoSubmit && !cityTypeaheadEl.value.length) {
         clearGeo();
       }
@@ -123,8 +124,7 @@ const hebcalClient = {
         const zip5 = val.substring(0, 5);
         selectSuggestion({geo: 'zip', id: zip5});
       }
-      const code = event.keyCode || event.which;
-      if (code === 13) {
+      if (event.key === 'Enter') {
         const selection = autocomplete.getSelection();
         if (!selection) {
           autocomplete._moveSelection('next');
@@ -134,15 +134,19 @@ const hebcalClient = {
         }
         event.preventDefault();
         return false;
+      } else if (event.key === 'Backspace') {
+        if (backspaceClearsEverything) {
+          clearGeo();
+          autocomplete.hideSuggestions();
+          autocomplete.clear();
+        }
       }
-    }
-    cityTypeaheadEl.addEventListener('keyup', keyupOrKeypress);
-    cityTypeaheadEl.addEventListener('keypress', keyupOrKeypress);
+      backspaceClearsEverything = false;
+      return true;
+    });
 
-    cityTypeaheadEl.addEventListener('focus', function(e) {
-      clearGeo();
-      autocomplete.hideSuggestions();
-      autocomplete.clear();
+    cityTypeaheadEl.addEventListener('focus', function() {
+      backspaceClearsEverything = true;
     });
   },
 };