From 6fd4abdf203990ae4089021379419859781cdadd Mon Sep 17 00:00:00 2001
From: s-ol <s+removethis@s-ol.nu>
Date: Sun, 12 Jul 2026 21:28:33 +0200
Subject: save settings/pos in hash

---
 index.html | 24 ++++++++++++++++++------
 1 file changed, 18 insertions(+), 6 deletions(-)
diff --git a/index.html b/index.html
index 554ebd6..633ec2a 100644
--- a/index.html
+++ b/index.html
@@ -2,6 +2,7 @@
 <html>
   <head>
     <title>GPS coordinate precision viewer</title>
+    <meta charset="UTF-8">
     <meta name="description" content="a tool for visualizing the precision of GPS coordinates at different rounding factors" />
 
     <script src="maplibre-gl.js"></script>
@@ -53,21 +54,31 @@
       <span id="preview"></span>
       <label>
         <span>precision:</span>
-        <input id="precision" type="range" min="0" max="12" value="3" />
+        <input id="precision" type="range" min="0" max="6" />
       </label>
     </nav>
     <div id="map"></div>
     <script>
+      const preview = document.getElementById('preview');
+      const precision = document.getElementById('precision');
+
+      let center = [13.40, 52.52];
+      let digits = 2;
+      if (location.hash) {
+        const values = location.hash.slice(1).split(',');
+        digits = (values[0].split('.')[1] ?? '').length;
+        center = values.map(parseFloat);
+      }
+
+      precision.value = digits;
+
       const map = new maplibregl.Map({
         style: 'https://tiles.openfreemap.org/styles/positron',
-        center: [13.405, 52.520],
-        zoom: 11.5,
+        center,
+        zoom: (digits * 3.32) + 5,
         container: 'map',
       });
 
-      const preview = document.getElementById('preview');
-      const precision = document.getElementById('precision');
-
       const round = (n, digits) => {
         const exp = 10 ** digits;
         const middle = Math.round(n * exp);
@@ -87,6 +98,7 @@
         const [lat, flat, clat] = round(center.lat, digits);
 
         preview.innerText = `${lng.toFixed(digits)}°, ${lat.toFixed(digits)}°`;
+        location.hash =  `#${lng.toFixed(digits)},${lat.toFixed(digits)}`;
 
         map.getSource('center').setData({
           'type': 'Feature',
-- 
cgit v1.2.3

