From caec763e21a8c321597e015be939808323686c71 Mon Sep 17 00:00:00 2001
From: Nelson Chan <chakflying@hotmail.com>
Date: Sat, 23 Dec 2023 00:53:53 +0800
Subject: [PATCH] Fix: Use hourly data for chart

Fix: Do not aggregate too few datapoints
---
 server/socket-handlers/chart-socket-handler.js |  2 ++
 src/components/PingChart.vue                   | 11 +++++++++--
 2 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/server/socket-handlers/chart-socket-handler.js b/server/socket-handlers/chart-socket-handler.js
index f5a5a6af..0087c0d8 100644
--- a/server/socket-handlers/chart-socket-handler.js
+++ b/server/socket-handlers/chart-socket-handler.js
@@ -19,6 +19,8 @@ module.exports.chartSocketHandler = (socket) => {
 
             if (period <= 24) {
                 data = uptimeCalculator.getDataArray(period * 60, "minute");
+            } else if (period <= 720) {
+                data = uptimeCalculator.getDataArray(period, "hour");
             } else {
                 data = uptimeCalculator.getDataArray(period / 24, "day");
             }
diff --git a/src/components/PingChart.vue b/src/components/PingChart.vue
index 4e4156c8..ede196af 100644
--- a/src/components/PingChart.vue
+++ b/src/components/PingChart.vue
@@ -224,17 +224,18 @@ export default {
                             continue;
                         }
 
-                        if (datapoint.up > 0) {
+                        if (datapoint.up > 0 && this.chartRawData.length > aggregatePoints * 2) {
                             // Aggregate Up data using a sliding window
                             aggregateBuffer.push(datapoint);
 
                             if (aggregateBuffer.length === aggregatePoints) {
                                 const average = this.getAverage(aggregateBuffer);
                                 this.pushDatapoint(average, avgPingData, minPingData, maxPingData, downData, colorData);
+                                // Remove the first half of the buffer
                                 aggregateBuffer = aggregateBuffer.slice(Math.floor(aggregatePoints / 2));
                             }
                         } else {
-                            // datapoint is fully down, no need to aggregate
+                            // datapoint is fully down or too few datapoints, no need to aggregate
                             // Clear the aggregate buffer
                             if (aggregateBuffer.length > 0) {
                                 const average = this.getAverage(aggregateBuffer);
@@ -245,6 +246,12 @@ export default {
                             this.pushDatapoint(datapoint, avgPingData, minPingData, maxPingData, downData, colorData);
                         }
                     }
+                    // Clear the aggregate buffer if there are still datapoints
+                    if (aggregateBuffer.length > 0) {
+                        const average = this.getAverage(aggregateBuffer);
+                        this.pushDatapoint(average, avgPingData, minPingData, maxPingData, downData, colorData);
+                        aggregateBuffer = [];
+                    }
                 }
 
                 return {