performance improvements

LukePrior · Mar 6, 2024 · a5097d3 · a5097d3
1 parent bb22e53
commit a5097d3
Showing 1 changed file with 19 additions and 20 deletions.
diff --git a/site/index.html b/site/index.html
@@ -110,29 +110,25 @@
         // add suburb dropdown
         fetch("https://raw.githubusercontent.com/LukePrior/nbn-upgrade-map/main/results/combined-suburbs.json").then(res => res.json()).then(data => {
             combined_info = data;
-            // TODO: use addControlWithHTML?
-            var dropdown = L.control({ position: 'topright' });
-            var dropdownHTML = '<select id="suburb" class="suburb-selector" onchange="loadSuburb(this.value, &quot;main&quot;)" style="width: 300px;">';
-            dropdown.onAdd = function (map) {
-                var div = L.DomUtil.create('div', 'dropdown');
-                dropdownHTML += '<option value="" disabled selected>Select a suburb</option>';
-                // add options for each state
-                for (const [state, suburbs] of Object.entries(data)) {
-                    dropdownHTML += '<optgroup label="' + state + '">';
-                    for (var suburb of suburbs) {
-                        if (suburb.processed_date == null) continue;
-                        file = suburb.name.toLowerCase().replace(/ /g, "-") // any other sanitisation required? apostrophe OK
-                        selected_text = ((file == default_suburb && state == default_state) ? "selected" : "")
-                        dropdownHTML += '<option value="' + state + '/' + file + '" ' + selected_text + '>' + suburb.name + '</option>';
+            let formatted_data = [];
+            for (var state in data) {
+                let state_data = {text: state, children: []};
+                for (var suburb of data[state]) {
+                    if (default_state == state && default_suburb == suburb.name.toLowerCase().replace(/ /g, "-")) {
+                        state_data.children.push({id: state + "/" + suburb.name.toLowerCase().replace(/ /g, "-"), text: suburb.name, selected: true});
+                    } else {
+                        state_data.children.push({id: state + "/" + suburb.name.toLowerCase().replace(/ /g, "-"), text: suburb.name });
                     }
-                    dropdownHTML += '</optgroup>';
                 }
-                dropdownHTML += '</select>';
-                div.innerHTML = dropdownHTML;
-                return div;
+                formatted_data.push(state_data);
             }
-            dropdown.addTo(map);
-            $('.suburb-selector').select2();
+            addControlWithHTML('suburb-selector-container', '<select id="suburb" class="suburb-selector" onchange="loadSuburb(this.value, default_commit)" style="width: 300px;"><option></option></select>');
+            $('.suburb-selector').select2({
+                placeholder: "Select a suburb",
+                allowClear: true,
+                data: formatted_data,
+                minimumInputLength: 3
+            });
         });
 
         // add legend
@@ -234,6 +230,9 @@
 
         // load GeoJSON from an external file
         async function loadSuburb(state_file, commit, first_load=false) {
+            if (state_file == "") {
+                return;
+            }
             url = "https://raw.githubusercontent.com/LukePrior/nbn-upgrade-map/" + commit + "/results/" + state_file + ".geojson"
             default_state = state_file.split('/')[0]
             default_suburb = state_file.split('/')[1]