From 9bdd0ab1dee916b77ed1cfc52b24ff6b0ce5d328 Mon Sep 17 00:00:00 2001 From: Ian Renton Date: Wed, 26 Nov 2025 21:43:10 +0000 Subject: [PATCH] Add filtering based on SIG to the web UI. #84 --- views/webpage_bands.tpl | 30 ++++++++++++------- views/webpage_map.tpl | 30 ++++++++++++------- views/webpage_spots.tpl | 30 ++++++++++++------- webassets/js/bands.js | 3 +- webassets/js/map.js | 3 +- webassets/js/spots.js | 3 +- .../js/{spotandmap.js => spotsbandsandmap.js} | 12 ++++++++ 7 files changed, 75 insertions(+), 36 deletions(-) rename webassets/js/{spotandmap.js => spotsbandsandmap.js} (61%) diff --git a/views/webpage_bands.tpl b/views/webpage_bands.tpl index d02410f..9bc73ea 100644 --- a/views/webpage_bands.tpl +++ b/views/webpage_bands.tpl @@ -26,7 +26,7 @@
-
+
@@ -35,8 +35,24 @@
+
+
+
+
SIGs
+

+
+
+
+
+
+
+
Sources
+

+
+
+
-
+
@@ -61,14 +77,6 @@
-
-
-
-
Sources
-

-
-
-
@@ -108,6 +116,6 @@
- + \ No newline at end of file diff --git a/views/webpage_map.tpl b/views/webpage_map.tpl index 5712ffe..b904d64 100644 --- a/views/webpage_map.tpl +++ b/views/webpage_map.tpl @@ -25,7 +25,7 @@
-
+
@@ -34,8 +34,24 @@
+
+
+
+
SIGs
+

+
+
+
+
+
+
+
Sources
+

+
+
+
-
+
@@ -60,14 +76,6 @@
-
-
-
-
Sources
-

-
-
-
@@ -126,6 +134,6 @@ - + \ No newline at end of file diff --git a/views/webpage_spots.tpl b/views/webpage_spots.tpl index 2e785ae..d46256b 100644 --- a/views/webpage_spots.tpl +++ b/views/webpage_spots.tpl @@ -37,7 +37,7 @@
-
+
@@ -46,8 +46,24 @@
+
+
+
+
SIGs
+

+
+
+
+
+
+
+
Sources
+

+
+
+
-
+
@@ -72,14 +88,6 @@
-
-
-
-
Sources
-

-
-
-
@@ -188,6 +196,6 @@
- + \ No newline at end of file diff --git a/webassets/js/bands.js b/webassets/js/bands.js index 52f4945..eaca368 100644 --- a/webassets/js/bands.js +++ b/webassets/js/bands.js @@ -23,7 +23,7 @@ function loadSpots() { // Build a query string for the API, based on the filters that the user has selected. function buildQueryString() { var str = "?"; - ["dx_continent", "de_continent", "mode_type", "source", "band"].forEach(fn => { + ["dx_continent", "de_continent", "mode_type", "source", "band", "sig"].forEach(fn => { if (!allFilterOptionsSelected(fn)) { str = str + getQueryStringFor(fn) + "&"; } @@ -230,6 +230,7 @@ function loadOptions() { // Populate the filters panel generateBandsMultiToggleFilterCard(options["bands"]); + generateSIGsMultiToggleFilterCard(options["sigs"]); generateMultiToggleFilterCard("#dx-continent-options", "dx_continent", options["continents"]); generateMultiToggleFilterCard("#de-continent-options", "de_continent", options["continents"]); generateMultiToggleFilterCard("#mode-options", "mode_type", options["mode_types"]); diff --git a/webassets/js/map.js b/webassets/js/map.js index 0837d21..db61445 100644 --- a/webassets/js/map.js +++ b/webassets/js/map.js @@ -17,7 +17,7 @@ function loadSpots() { // Build a query string for the API, based on the filters that the user has selected. function buildQueryString() { var str = "?"; - ["dx_continent", "de_continent", "mode_type", "source", "band"].forEach(fn => { + ["dx_continent", "de_continent", "mode_type", "source", "band", "sig"].forEach(fn => { if (!allFilterOptionsSelected(fn)) { str = str + getQueryStringFor(fn) + "&"; } @@ -158,6 +158,7 @@ function loadOptions() { // Populate the filters panel generateBandsMultiToggleFilterCard(options["bands"]); + generateSIGsMultiToggleFilterCard(options["sigs"]); generateMultiToggleFilterCard("#dx-continent-options", "dx_continent", options["continents"]); generateMultiToggleFilterCard("#de-continent-options", "de_continent", options["continents"]); generateMultiToggleFilterCard("#mode-options", "mode_type", options["mode_types"]); diff --git a/webassets/js/spots.js b/webassets/js/spots.js index aa33f35..fcaad5a 100644 --- a/webassets/js/spots.js +++ b/webassets/js/spots.js @@ -14,7 +14,7 @@ function loadSpots() { // Build a query string for the API, based on the filters that the user has selected. function buildQueryString() { var str = "?"; - ["dx_continent", "de_continent", "mode_type", "source", "band"].forEach(fn => { + ["dx_continent", "de_continent", "mode_type", "source", "band", "sig"].forEach(fn => { if (!allFilterOptionsSelected(fn)) { str = str + getQueryStringFor(fn) + "&"; } @@ -282,6 +282,7 @@ function loadOptions() { // Populate the filters panel generateBandsMultiToggleFilterCard(options["bands"]); + generateSIGsMultiToggleFilterCard(options["sigs"]);console.log(options["sigs"]); generateMultiToggleFilterCard("#dx-continent-options", "dx_continent", options["continents"]); generateMultiToggleFilterCard("#de-continent-options", "de_continent", options["continents"]); generateMultiToggleFilterCard("#mode-options", "mode_type", options["mode_types"]); diff --git a/webassets/js/spotandmap.js b/webassets/js/spotsbandsandmap.js similarity index 61% rename from webassets/js/spotandmap.js rename to webassets/js/spotsbandsandmap.js index 58a8c37..fd43f28 100644 --- a/webassets/js/spotandmap.js +++ b/webassets/js/spotsbandsandmap.js @@ -30,6 +30,18 @@ function generateBandsMultiToggleFilterCard(band_options) { $("#band-options").append(`  `); } +// Generate SIGs filter card. This one is also a special case. +function generateSIGsMultiToggleFilterCard(sig_options) { + // Create a button for each option + sig_options.forEach(o => { + $("#sig-options").append(` `); + }); + // Create a bonus "NO_SIG" / "General DX" option + $("#sig-options").append(` `); + // Create All/None buttons + $("#sig-options").append(`  `); +} + // Method called when any filter is changed to reload the spots and persist the filter settings. function filtersUpdated() { loadSpots();