From 8a0fba67e1c825b3b27e247e8156d05e0c1039b8 Mon Sep 17 00:00:00 2001
From: Pyro Nicampt <81565698+PyroNicampt@users.noreply.github.com>
Date: Sun, 22 Dec 2024 21:16:28 -0600
Subject: [PATCH] Add zoom display

---
 index.html | 1 +
 index.js   | 2 ++
 2 files changed, 3 insertions(+)

diff --git a/index.html b/index.html
index 3c8e858..58f5a6c 100644
--- a/index.html
+++ b/index.html
@@ -211,6 +211,7 @@
         </div>
     </div>
     <div id="footer" class="orange">
+        <div id="zoomLevelDisplay"></div>
         Map v0.2 alpha
         <br>
         Updated for Game Build 99.3
diff --git a/index.js b/index.js
index c96c525..d9bf156 100644
--- a/index.js
+++ b/index.js
@@ -33,6 +33,7 @@ const scaleCullThresholds = [
 // CODE
 const map = document.getElementById('map');
 const map_container = document.getElementById('mapContainer');
+const zoomLevelDisplay = document.getElementById('zoomLevelDisplay');
 const styleRoot = document.querySelector(':root');
 const svgns = map.getAttribute('xmlns');
 
@@ -124,6 +125,7 @@ function updateMapview(navData = {x:0, y:0, scale:1}){
     currentMapNav = navData;
     map.style.transform = `translate(${-navData.x}px, ${-navData.y}px) scale(${navData.scale})`;
     if(navData.scale !== previousMapScale){
+        zoomLevelDisplay.innerHTML = `Zoom: ${Math.round(navData.scale*100)/100}x`;
         let dirtyScale = previousMapScale < 0;
         for(const cullThreshold of scaleCullThresholds){
             if(dirtyScale || (previousMapScale < cullThreshold.scale && navData.scale > cullThreshold.scale) || (previousMapScale > cullThreshold.scale && navData.scale < cullThreshold.scale)){