From c4163daaa3b7448f5560b6553fc466b535003d54 Mon Sep 17 00:00:00 2001
From: Jeremy Myers <inernestmusic@gmail.com>
Date: Tue, 8 Jul 2025 12:16:39 -0400
Subject: [PATCH 1/2] Patch zoom level bug in internal baselayers

---
 src/components/OpenLayersMap.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/OpenLayersMap.tsx b/src/components/OpenLayersMap.tsx
index 75e97da..3daf7c4 100644
--- a/src/components/OpenLayersMap.tsx
+++ b/src/components/OpenLayersMap.tsx
@@ -187,7 +187,7 @@ export function OpenLayersMap({
             resolutions: getBaselayerResolutions(
               180,
               band.tile_size,
-              band.levels
+              band.levels - 1
             ),
           }),
           interpolate: false,

From f6345cec5fee369f464f1a90f208ffbf61afe966 Mon Sep 17 00:00:00 2001
From: Jeremy Myers <inernestmusic@gmail.com>
Date: Tue, 8 Jul 2025 14:22:58 -0400
Subject: [PATCH 2/2] Use range of recommended cmap values for cmap
 keyboard-controlled slider step

---
 src/App.tsx                         |  1 +
 src/components/ColorMapControls.tsx |  4 ++++
 src/components/ColorMapSlider.tsx   | 24 +++++++++++++++++++-----
 src/reducers/baselayersReducer.ts   |  2 ++
 src/types/maps.ts                   |  1 +
 src/utils/fetchUtils.ts             |  1 +
 src/utils/numberUtils.ts            |  8 ++++++++
 7 files changed, 36 insertions(+), 5 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 59b1338..5102663 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -201,6 +201,7 @@ function App() {
               activeBaselayer.cmapValues.min,
               activeBaselayer.cmapValues.max,
             ]}
+            cmapRange={activeBaselayer.cmapValues.recommendedRange}
             onCmapValuesChange={onCmapValuesChange}
             cmap={activeBaselayer.cmap}
             onCmapChange={onCmapChange}
diff --git a/src/components/ColorMapControls.tsx b/src/components/ColorMapControls.tsx
index 9312682..8777246 100644
--- a/src/components/ColorMapControls.tsx
+++ b/src/components/ColorMapControls.tsx
@@ -20,6 +20,8 @@ import { CustomColorMapDialog } from './CustomColorMapDialog';
 export type ColorMapControlsProps = {
   /** the selected or default min and max values for the slider */
   values: number[];
+  /** used to determine increment/decrement value for keyboard controls */
+  cmapRange: number;
   /** handler to set new user-specified values for slider */
   onCmapValuesChange: (values: number[]) => void;
   /** the color map selected in the cmap selector */
@@ -44,6 +46,7 @@ export type ColorMapControlsProps = {
 export function ColorMapControls(props: ColorMapControlsProps) {
   const {
     values,
+    cmapRange,
     onCmapValuesChange,
     cmap,
     onCmapChange,
@@ -175,6 +178,7 @@ export function ColorMapControls(props: ColorMapControlsProps) {
           <ColorMapSlider
             cmapImage={cmapImage}
             values={values}
+            cmapRange={cmapRange}
             onCmapValuesChange={onCmapValuesChange}
             units={units}
             quantity={quantity}
diff --git a/src/components/ColorMapSlider.tsx b/src/components/ColorMapSlider.tsx
index cb8cb11..5589cc6 100644
--- a/src/components/ColorMapSlider.tsx
+++ b/src/components/ColorMapSlider.tsx
@@ -1,6 +1,6 @@
 import { useEffect, useRef, useState } from 'react';
 import { Range as RangeSlider, getTrackBackground } from 'react-range';
-import { formatNumberForDisplay } from '../utils/numberUtils';
+import { formatNumber, formatNumberForDisplay } from '../utils/numberUtils';
 import { ColorMapControlsProps } from './ColorMapControls';
 import './styles/color-map-controls.css';
 
@@ -26,6 +26,7 @@ export function ColorMapSlider(props: ColorMapSlideProps) {
     sliderAttributes,
     quantity,
     values,
+    cmapRange,
   } = props;
   /**
    * Create temporary values for range slider min/max to maintain component state without setting the global state;
@@ -34,6 +35,7 @@ export function ColorMapSlider(props: ColorMapSlideProps) {
   const [tempValues, setTempValues] = useState([values[0], values[1]]);
   const prevKeyUpHandler = useRef<(e: KeyboardEvent) => void>(null);
   const prevKeyDownHandler = useRef<(e: KeyboardEvent) => void>(null);
+  const stepValue = cmapRange * 0.05;
 
   useEffect(() => {
     if (prevKeyUpHandler.current) {
@@ -67,16 +69,28 @@ export function ColorMapSlider(props: ColorMapSlideProps) {
 
       switch (e.key) {
         case 'a':
-          setTempValues((prev) => [prev[0] - 1, prev[1] - 1]);
+          setTempValues((prev) => [
+            formatNumber(prev[0] - stepValue),
+            formatNumber(prev[1] - stepValue),
+          ]);
           break;
         case 'd':
-          setTempValues((prev) => [prev[0] + 1, prev[1] + 1]);
+          setTempValues((prev) => [
+            formatNumber(prev[0] + stepValue),
+            formatNumber(prev[1] + stepValue),
+          ]);
           break;
         case 'w':
-          setTempValues((prev) => [prev[0] - 1, prev[1] + 1]);
+          setTempValues((prev) => [
+            formatNumber(prev[0] - stepValue),
+            formatNumber(prev[1] + stepValue),
+          ]);
           break;
         case 's':
-          setTempValues((prev) => [prev[0] + 1, prev[1] - 1]);
+          setTempValues((prev) => [
+            formatNumber(prev[0] + stepValue),
+            formatNumber(prev[1] - stepValue),
+          ]);
           break;
       }
     };
diff --git a/src/reducers/baselayersReducer.ts b/src/reducers/baselayersReducer.ts
index c566365..916f911 100644
--- a/src/reducers/baselayersReducer.ts
+++ b/src/reducers/baselayersReducer.ts
@@ -90,6 +90,8 @@ export function baselayersReducer(state: BaselayersState, action: Action) {
           cmapValues: {
             min: action.cmapValues.min,
             max: action.cmapValues.max,
+            recommendedRange:
+              action.activeBaselayer.cmapValues.recommendedRange,
           },
         };
         return {
diff --git a/src/types/maps.ts b/src/types/maps.ts
index f9e5e3c..dc2134b 100644
--- a/src/types/maps.ts
+++ b/src/types/maps.ts
@@ -39,6 +39,7 @@ type BandCmapValues = {
   cmapValues: {
     min: number;
     max: number;
+    recommendedRange: number;
   };
 };
 
diff --git a/src/utils/fetchUtils.ts b/src/utils/fetchUtils.ts
index e8fd580..cd9b6a0 100644
--- a/src/utils/fetchUtils.ts
+++ b/src/utils/fetchUtils.ts
@@ -64,6 +64,7 @@ export async function fetchProducts(
               cmapValues: {
                 min: recommended_cmap_min,
                 max: recommended_cmap_max,
+                recommendedRange: recommended_cmap_max - recommended_cmap_min,
               },
             };
           }),
diff --git a/src/utils/numberUtils.ts b/src/utils/numberUtils.ts
index f8d363f..b8b5bce 100644
--- a/src/utils/numberUtils.ts
+++ b/src/utils/numberUtils.ts
@@ -73,3 +73,11 @@ export function safeLog(x: number) {
     return Math.log(x);
   }
 }
+
+export function formatNumber(number: number, toFixed: number = 2) {
+  if (Number.isInteger(number)) {
+    return number;
+  } else {
+    return Number(number.toFixed(toFixed));
+  }
+}