[Scorecards] Added nation to main filter

mysociety · Oct 30, 2024 · 95ef41c · 95ef41c
1 parent e0f5980
commit 95ef41c
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 4 deletions.
diff --git a/scoring/static/scoring/js/main.js b/scoring/static/scoring/js/main.js
@@ -381,9 +381,33 @@ forEachElement('.js-section-council-autocomplete', function(input){
     });
 });
 
+function initializeFilterButtons() {
+    var form = document.getElementById("advancedFilterForm");
+    var countrySelect = document.getElementById("countrySelect");
+
+    function setCountryAndSubmit(countryValue) {
+        if (countrySelect) {
+            countrySelect.value = countryValue;
+            form.submit();
+        }
+    }
+
+    document.getElementById("js-filter-nation-england")?.addEventListener("click", function() {
+        setCountryAndSubmit("1");
+    });
+
+    document.getElementById("js-filter-nation-scotland")?.addEventListener("click", function() {
+        setCountryAndSubmit("2");
+    });
+
+    document.getElementById("js-filter-nation-wales")?.addEventListener("click", function() {
+        setCountryAndSubmit("3");
+    });
+}
+
 function ajaxLoadCouncilTypeScorecard(url) {
     var selectors = [
-        '#council-type-filter',
+        '#home-page-main-filter',
         '#advanced-filter-wrapper',
         '.scorecard-table'
     ];
@@ -403,6 +427,7 @@ function ajaxLoadCouncilTypeScorecard(url) {
             document.querySelector(selector).replaceWith(doc.querySelector(selector));
         });
         setUpTableSorting();
+        initializeFilterButtons();
     })
     .catch(function(err) {
         window.location.href = url;

diff --git a/scoring/templates/scoring/home.html b/scoring/templates/scoring/home.html
@@ -37,7 +37,7 @@ <h3 class="fs-3 mb-0">Filter Scorecard table</h3>
                 </div>
             </div>
             <div class="col-lg-7" id="advanced-filter-wrapper">
-                <div class="card h-100">
+                <div class="card">
                     <div class="card-header bg-100">
                         <h4 class="mb-1">Advanced filters</h4>
                         {% if filter_descs %}

diff --git a/scoring/templates/scoring/includes/main-filter.html b/scoring/templates/scoring/includes/main-filter.html
@@ -1,4 +1,4 @@
-<form class="form">
+<form class="form" id="home-page-main-filter">
     <label for="council-search-table" class="mb-2 fs-7 d-block">Show council in the Scorecard table</label>
     <input id="council-search-table" class="form-control searchbar js-location-jump-autocomplete" type="search" placeholder="Council name" aria-label="Council name">
     <!-- <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button> -->
@@ -8,6 +8,20 @@
         <a class="mb-1 btn btn-sm btn-outline-primary fs-6 {% if authority_type == 'district' %} active{% endif %}" href="{% include 'scoring/includes/scoring_url.html' with slug='district' %}">District</a>
         <a class="mb-1 btn btn-sm btn-outline-primary fs-6 {% if authority_type == 'county' %} active{% endif %}" href="{% include 'scoring/includes/scoring_url.html' with slug='county' %}">County</a>
         <a class="mb-1 btn btn-sm btn-outline-primary fs-6 {% if authority_type == 'combined' %} active{% endif %}" href="{% include 'scoring/includes/scoring_url.html' with slug='combined' %}">Combined Authority</a>
-        <a class="mb-1 btn btn-sm btn-outline-primary fs-6 {% if authority_type == 'northern-ireland' %} active{% endif %}" href="{% include 'scoring/includes/scoring_url.html' with slug='northern-ireland' %}">Northern Ireland</a>
     </div>
+    <p class="fs-7 mt-3 mb-2">Or filter by <b>nation</b></p>
+    {% if authority_type == 'single' %}
+
+        <a role="button" id="js-filter-nation-england" class="mb-1 btn btn-sm btn-outline-primary fs-6 {% if filter_params.country == '1' %}active{% endif %}">England</a>
+        <a role="button" id="js-filter-nation-scotland" class="mb-1 btn btn-sm btn-outline-primary fs-6 {% if filter_params.country == '2' %}active{% endif %}">Scotland</a>
+        <a role="button" id="js-filter-nation-wales" class="mb-1 btn btn-sm btn-outline-primary fs-6 {% if filter_params.country == '3' %}active{% endif %}">Wales</a>
+
+    {% endif %}
+    <a class="mb-1 btn btn-sm btn-outline-primary fs-6 {% if authority_type == 'northern-ireland' %} active{% endif %}" href="{% include 'scoring/includes/scoring_url.html' with slug='northern-ireland' %}">Northern Ireland</a>
 </form>
+
+<script>
+    document.addEventListener("DOMContentLoaded", function() {
+        initializeFilterButtons();
+    });
+</script>