fixing: "das Suchfeld in der Tabelle wieder herstellen"

docs/BatchCodeTableInitializer.js

@@ -1,11 +1,12 @@
 class BatchCodeTableInitializer {
 
-    initialize({ batchCodeTableElement, showCountriesColumn }) {
+    initialize({ batchCodeTableElement, showCountriesColumn, showDataTablesFilter }) {
         // FK-TODO: show "Loading.." message or spinning wheel.
         this.#loadBarChartDescriptions(showCountriesColumn)
             .then(barChartDescriptions => {
                 const batchCodeTable = this.#createEmptyBatchCodeTable(batchCodeTableElement, showCountriesColumn, barChartDescriptions);
                 this.#setVisibilityOfCountriesColumn(batchCodeTable, showCountriesColumn);
+                this.#setDataTablesFilter(showDataTablesFilter);
                 fetch('data/batchCodeTables/Global.json')
                     .then(response => response.json())
                     .then(json => {
@@ -35,7 +36,7 @@ class BatchCodeTableInitializer {
                 searching: true,
                 search:
                 {
-                    return: true
+                    return: false
                 },
                 processing: true,
                 deferRender: true,
@@ -137,6 +138,13 @@ class BatchCodeTableInitializer {
             .visible(showCountriesColumn);
     }
 
+    #setDataTablesFilter(isEnabled) {
+        DataTablesFilter.setDataTablesFilter(
+            isEnabled ?
+                DataTablesFilter.FilterState.Enabled :
+                DataTablesFilter.FilterState.Disabled);
+    }
+
     #addCountriesColumn(json) {
         json.columns.push('Countries');
         json.data.forEach(row => row.push(null));

docs/DataTablesFilter.js

@@ -0,0 +1,26 @@
+class DataTablesFilter {
+
+    static FilterState = Object.freeze({
+        Enabled: Symbol("Enabled"),
+        Disabled: Symbol("Disabled")
+    })
+
+    static setDataTablesFilter(filterState) {
+        document.querySelector(".dataTables_filter").style.display = DataTablesFilter._getStyle(filterState);
+    }
+
+    static _getStyle(filterState) {
+        switch (filterState) {
+            case DataTablesFilter.FilterState.Enabled:
+                return "block";
+            case DataTablesFilter.FilterState.Disabled:
+                return "none";
+        }
+    }
+
+    static selectDataTablesFilter() {
+        const input = document.querySelector(".dataTables_filter input");
+        input.focus();
+        input.select();
+    }
+}

docs/HowBadIsMyBatch.html

@@ -28,6 +28,7 @@
   <link href="forkMeOnGitHub.css" rel="stylesheet" type="text/css" />
   <script src="./Utils.js"></script>
   <script src="./UIUtils.js"></script>
+  <script src="./DataTablesFilter.js"></script>
   <script src="./NumberWithBarElementFactory.js"></script>
   <script src="./GoogleAnalytics.js"></script>
   <script src="./BatchCodeSelectInitializer.js"></script>

docs/UIUtils.js

@@ -64,4 +64,8 @@ class UIUtils {
             urlParams.get(searchParam) :
             defaultValue;
     }
+
+    static isSearchParamYES(urlParams, searchParam) {
+        return UIUtils.getSearchParam(urlParams, searchParam, 'NO').toUpperCase() == 'YES';
+    }
 }

docs/VaccineDistributionByZipcode.html

@@ -13,10 +13,10 @@
         type="text/javascript"></script>
     <script src="./Utils.js"></script>
     <script src="./UIUtils.js"></script>
+    <script src="./DataTablesFilter.js"></script>
     <script src="./VaccineDistributionByZipcodeTableInitializer.js"></script>
     <script>
         $(document).ready(function () {
-            // FK-FIXME: das Suchfeld in der Tabelle wieder herstellen
             const tableInitializer =
                 new VaccineDistributionByZipcodeTableInitializer(
                     {

docs/VaccineDistributionByZipcodeTableInitializer.js

@@ -8,7 +8,7 @@ class VaccineDistributionByZipcodeTableInitializer {
 
     initialize() {
         this.#createTable();
-        this.#selectInput();
+        DataTablesFilter.selectDataTablesFilter();
     }
 
     #createTable() {
@@ -51,10 +51,4 @@ class VaccineDistributionByZipcodeTableInitializer {
                 return 5;
         }
     }
-
-    #selectInput() {
-        const input = document.querySelector(".dataTables_filter input");
-        input.focus();
-        input.select();
-    }
 }

docs/batchCodeTable.css

@@ -1,7 +1,3 @@
-.dataTables_filter {
-    display: none;
-}
-
 .chartWithSlider {
     display: flex;
     flex-wrap: nowrap;

docs/batchCodes.html

@@ -31,16 +31,19 @@
   <script src="https://cdn.jsdelivr.net/npm/chart.js@4.2.0/dist/chart.umd.min.js"></script>
   <script src="./Utils.js"></script>
   <script src="./UIUtils.js"></script>
+  <script src="./DataTablesFilter.js"></script>
   <script src="./ColumnSearch.js"></script>
   <script src="./BatchCodeTableInitializer.js"></script>
   <script src="./BatchcodeByCountryBarChartView.js"></script>
   <script src="./BatchcodeByCountryBarChart.js"></script>
   <script>
     $(document).ready(function () {
+      urlSearchParams = new URLSearchParams(window.location.search);
       new BatchCodeTableInitializer().initialize(
         {
           batchCodeTableElement: $('#batchCodeTable'),
-          showCountriesColumn: UIUtils.getSearchParam(new URLSearchParams(window.location.search), 'showCountriesColumn', '').toUpperCase() == 'YES'
+          showCountriesColumn: UIUtils.isSearchParamYES(urlSearchParams, 'showCountriesColumn'),
+          showDataTablesFilter: UIUtils.isSearchParamYES(urlSearchParams, 'showDataTablesFilter'),
         });
     });
   </script>