Update uptime percentage in Javascript

Signed-off-by: Dave Thaler <dthaler1968@gmail.com>
orcasound · Dec 21, 2024 · 811ff88 · 811ff88
1 parent f77d830
commit 811ff88
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 5 deletions.
diff --git a/OrcanodeMonitor/Pages/NodeEvents.cshtml b/OrcanodeMonitor/Pages/NodeEvents.cshtml
@@ -14,15 +14,23 @@
     <p></p>
 
     <div>
-        Uptime percentage: @Model.UptimePercentage%
+        Uptime percentage:
+        <span id="uptime-all-pastWeek" class="uptime-percentage" style="display: none;">@Model.GetUptimePercentage("all", "pastWeek")%</span>
+        <span id="uptime-hydrophoneStream-pastWeek" class="uptime-percentage" style="display: none;">@Model.GetUptimePercentage("hydrophoneStream", "pastWeek")%</span>
+        <span id="uptime-dataplicityConnection-pastWeek" class="uptime-percentage" style="display: none;">@Model.GetUptimePercentage("dataplicityConnection", "pastWeek")%</span>
+        <span id="uptime-mezmoLogging-pastWeek" class="uptime-percentage" style="display: none;">@Model.GetUptimePercentage("mezmoLogging", "pastWeek")%</span>
+        <span id="uptime-all-pastMonth" class="uptime-percentage">@Model.GetUptimePercentage("all", "pastMonth")%</span>
+        <span id="uptime-hydrophoneStream-pastMonth" class="uptime-percentage" style="display: none;">@Model.GetUptimePercentage("hydrophoneStream", "pastMonth")%</span>
+        <span id="uptime-dataplicityConnection-pastMonth" class="uptime-percentage" style="display: none;">@Model.GetUptimePercentage("dataplicityConnection", "pastMonth")%</span>
+        <span id="uptime-mezmoLogging-pastMonth" class="uptime-percentage" style="display: none;">@Model.GetUptimePercentage("mezmoLogging", "pastMonth")%</span>
         <p></p>
     </div>
 
     <!-- Filter Buttons for Time Range -->
     <div>
         Filter by Time Range:
         <button id="btn-timeRange-pastWeek" class="btn unselected" onclick="updateFilter('timeRange', 'pastWeek')">Past Week</button>
-        <button id="btn-timeRange-allTime" class="btn selected" onclick="updateFilter('timeRange', 'allTime')">Past Month</button>
+        <button id="btn-timeRange-pastMonth" class="btn selected" onclick="updateFilter('timeRange', 'pastMonth')">Past Month</button>
         <p></p>
     </div>
 
@@ -62,7 +70,7 @@
 
     <script>
         var currentFilters = {
-            timeRange: 'allTime',
+            timeRange: 'pastMonth',
             type: 'all' };
 
         function updateFilter(filterType, filterValue) {
@@ -97,6 +105,7 @@
             }
 
             filterTable();
+            showUptimePercentage("uptime-" + currentFilters.type + "-" + currentFilters.timeRange);
         }
 
         function filterTable() {
@@ -106,7 +115,7 @@
             // Loop through each row.
             rows.forEach(function(row) {
                 // Check if the row matches the selected time range and type
-                var matchesTimeRange = (currentFilters.timeRange === 'allTime' || row.classList.contains(currentFilters.timeRange));
+                var matchesTimeRange = (currentFilters.timeRange === 'pastMonth' || row.classList.contains(currentFilters.timeRange));
                 var matchesType = (currentFilters.type === 'all' || row.classList.contains(currentFilters.type));
                 
                 if (matchesTimeRange && matchesType) {
@@ -116,5 +125,16 @@
                 }
             });
         }
+
+        function showUptimePercentage(id) {
+            // Hide all uptime percentage elements.
+            var elements = document.querySelectorAll('.uptime-percentage');
+            elements.forEach(function(element) {
+                element.style.display = 'none';
+            });
+
+            // Show the selected uptime percentage.
+            document.getElementById(id).style.display = '';
+        }
     </script>
 </div>
diff --git a/OrcanodeMonitor/Pages/NodeEvents.cshtml.cs b/OrcanodeMonitor/Pages/NodeEvents.cshtml.cs
@@ -28,7 +28,18 @@ public class NodeEventsModel : PageModel
         private DateTime SinceTime => (TimePeriod == "week") ? DateTime.UtcNow.AddDays(-7) : DateTime.UtcNow.AddMonths(-1);
         private List<OrcanodeEvent> _events;
         public List<OrcanodeEvent> RecentEvents => _events;
-        public int UptimePercentage => Orcanode.GetUptimePercentage(Id, _events, SinceTime, (EventType == OrcanodeEventTypes.All) ? OrcanodeEventTypes.HydrophoneStream : EventType);
+        public int GetUptimePercentage(string type, string timeRange)
+        {
+            DateTime sinceTime = (timeRange == "pastWeek") ? DateTime.UtcNow.AddDays(-7) : DateTime.UtcNow.AddMonths(-1);
+            string eventType = type switch
+            {
+                "hydrophoneStream" => OrcanodeEventTypes.HydrophoneStream,
+                "dataplicityConnection" => OrcanodeEventTypes.DataplicityConnection,
+                "mezmoLogging" => OrcanodeEventTypes.MezmoLogging,
+                _ => OrcanodeEventTypes.HydrophoneStream
+            };
+            return Orcanode.GetUptimePercentage(Id, _events, sinceTime, eventType);
+        }
 
         public NodeEventsModel(OrcanodeMonitorContext context, ILogger<NodeEventsModel> logger)
         {