diff --git a/templates/spots.html b/templates/spots.html index efa6d27..76c437b 100644 --- a/templates/spots.html +++ b/templates/spots.html @@ -10,7 +10,7 @@
-
+

Loading...

@@ -22,7 +22,7 @@ - + diff --git a/webassets/css/style.css b/webassets/css/style.css index a8bc52c..334fa0a 100644 --- a/webassets/css/style.css +++ b/webassets/css/style.css @@ -345,13 +345,6 @@ div.band-spot:hover span.band-spot-info { max-height: 26em; overflow: scroll; } - /* No search on mobile */ - input#search { - display: none; - } - i#searchicon { - display: none; - } } @media (min-width: 992px) { diff --git a/webassets/js/spots.js b/webassets/js/spots.js index 7c3a5b2..2f03065 100644 --- a/webassets/js/spots.js +++ b/webassets/js/spots.js @@ -19,8 +19,11 @@ function loadSpots() { spots = jsonData; // Update table updateTable(); - // Start SSE connection to fetch updates in the background - startSSEConnection(); + // Start SSE connection to fetch updates in the background, if we are in "run" mode + let run = $('#runButton:checked').val(); + if (run) { + startSSEConnection(); + } }); } @@ -70,8 +73,8 @@ function startSSEConnection() { // Update the special timing display for the live spots page, which varies depending on run/pause selection. function updateTimingDisplayRunPause() { - // todo run/pause - $("#timing-container").html("Last spot received at " + lastUpdateTime.format('HH:mm') + " UTC."); + let run = $('#runButton:checked').val(); + $("#timing-container").html((run ? "Connected to server. Last update at " : "Paused at ") + lastUpdateTime.format('HH:mm') + " UTC."); } // Build a query string for the API, based on the filters that the user has selected. @@ -474,4 +477,19 @@ $(document).ready(function() { loadOptions(); // Display intro box displayIntroBox(); + + // Set up run/pause toggles + $("#runButton").change(function() { + // Need to start the SSE connection but also do a full re-query to catch up anything that we missed, so we + // might as well just call loadSpots again which will trigger it all + loadSpots(); + updateTimingDisplayRunPause(); + }); + $("#pauseButton").change(function() { + // If we are pausing and have an open SSE connection, stop it + if (evtSource != null) { + evtSource.close(); + } + updateTimingDisplayRunPause(); + }); }); \ No newline at end of file