From 375c082ffb737ec01d99913df1b122dda44c6f61 Mon Sep 17 00:00:00 2001
From: John McClumpha <1267217+johnmcclumpha@users.noreply.github.com>
Date: Sat, 6 Sep 2025 16:43:30 +1000
Subject: [PATCH] Adds highPass filter option (improved) (#457)

* adds additional highPass filter value with programatic formatting of values

* fixes NaN being returned for "off"

* fix: Match formatting for LowPass
---
 homepage/static/custom-audio-player.js | 18 +++++++++++++++---
 1 file changed, 15 insertions(+), 3 deletions(-)

diff --git a/homepage/static/custom-audio-player.js b/homepage/static/custom-audio-player.js
index f07db77..3fa0b54 100644
--- a/homepage/static/custom-audio-player.js
+++ b/homepage/static/custom-audio-player.js
@@ -47,6 +47,18 @@ function initCustomAudioPlayers() {
     } catch {}
   };
 
+  // Helper for readable/friendly display of numbers
+  const compactFormatter = new Intl.NumberFormat(undefined, { notation: 'compact' });
+
+  const formatCompactOrEcho = (value) => {
+    const n = (typeof value === 'number') ? value : Number(value);
+    if (!Number.isFinite(n)) {
+      return String(value);
+    }
+    const out = compactFormatter.format(n);
+    return out;
+  };
+
   // Retrieve saved user preferences
   const savedGain = safeGet("customAudioPlayerGain", "Off");
   const savedHighpass = safeGet("customAudioPlayerFilterHigh", "Off");
@@ -586,12 +598,12 @@ Channels: ${channels}`
       })
     );
 
-    const highpassOptions = ["Off", "250", "500", "1000"];
+    const highpassOptions = ["Off", "250", "500", "1000", "1500"];
     let activeHighpassOption = highpassOptions.includes(savedHighpass) ? savedHighpass : "Off";
     const highpassContainer = createOptionSection("HighPass (Hz):");
     const highpassButtons = highpassOptions.map((opt) =>
       createButton(highpassContainer, {
-        text: opt,
+        text: formatCompactOrEcho(opt),
         data: { filter: opt },
         styles: optionBtnStyle,
         onClick: () => setActiveHighpass(opt),
@@ -603,7 +615,7 @@ Channels: ${channels}`
     const lowpassContainer = createOptionSection("LowPass (Hz):");
     const lowpassButtons = lowpassOptions.map((opt) =>
       createButton(lowpassContainer, {
-        text: opt,
+        text: formatCompactOrEcho(opt),
         data: { filter: opt },
         styles: optionBtnStyle,
         onClick: () => setActiveLowpass(opt),