diff --git a/frontend/src/main.ts b/frontend/src/main.ts index 1b0b738..702cab7 100644 --- a/frontend/src/main.ts +++ b/frontend/src/main.ts @@ -126,7 +126,7 @@ function setupMap( const mapImg = document.querySelector("#map")!; const fetcher = new Throttler(200); - mapImg.onmousemove = async (event: MouseEvent) => { + mapImg.addEventListener('mousemove', async (event: MouseEvent) => { const mousePosition: Position = { x: event.offsetX, y: event.offsetY }; displayMousePosition(mousePositionElement, mousePosition); @@ -139,9 +139,9 @@ function setupMap( displayCoords(coordsElement, coords); fetcher.call(async () => await fetchAndDisplayZipCode(coords)); - }; + }); - mapImg.onmouseup = async (event: MouseEvent) => { + mapImg.addEventListener("mouseup", async (event: MouseEvent) => { const mousePosition: Position = { x: event.offsetX, y: event.offsetY }; displayMousePosition(mousePositionElement, mousePosition); @@ -154,7 +154,7 @@ function setupMap( displayCoords(coordsElement, coords); fetcher.call(async () => await fetchAndDisplayZipCode(coords)); - } + }); mapImg.onmouseleave = (_event: MouseEvent) => { displayZipCode(zipCodeElement, null, null, null, null); @@ -167,10 +167,10 @@ function setupSearchBar(zipCodeElement: HTMLParagraphElement) { const searchInput = document.querySelector("#search-input")!; - // Prevent typing letters - searchBar.onkeypress = event => { - event.key !== "Enter" || !isNaN(parseInt(event.key)); - } + searchInput.addEventListener("keydown", (event) => { + if (event.key.length === 1 && !"0123456789".includes(event.key)) + event.preventDefault(); + }); searchBar.addEventListener("submit", async (event: Event) => { event.preventDefault();