diff options
| -rw-r--r-- | static/table.html | 47 |
1 files changed, 34 insertions, 13 deletions
diff --git a/static/table.html b/static/table.html index 3ff7a0c..c9fd8f6 100644 --- a/static/table.html +++ b/static/table.html @@ -103,6 +103,7 @@ var app = new Vue({ rawData: {}, serverMap: {}, timespan: 120, + firstTimestamp: undefined, peak: false, ports: false, canvasWidth: 0, @@ -125,10 +126,33 @@ var app = new Vue({ } }) return servers + }, + timespanStartTime () { + return Math.min(this.firstTimestamp, this.rawData.timestamp - this.timespan * 1000) } }, watch: { rawData () { + if (!this.firstTimestamp) this.firstTimestamp = this.rawData.timestamp + + // Remove outdated values + for (let serverIp in this.serverMap) { + const server = this.serverMap[serverIp] + server.log = server.log.filter(x => x.timestamp > this.timespanStartTime) + if (server.log.length === 0) { + this.smoothie.removeTimeSeries(server.graphLine) + this.graphColors.unshift(server.graphColor) + Vue.delete(this.serverMap, serverIp) + } else { + for (let clientIp in server.clientMap) { + const client = server.clientMap[clientIp] + client.log = client.log.filter(x => x.timestamp > this.timespanStartTime) + if (client.log.length === 0) Vue.delete(server.clientMap, clientIp) + } + } + } + + // Process new data if (this.rawData.servers) { this.rawData.servers.forEach(serverData => { // Update server @@ -146,6 +170,7 @@ var app = new Vue({ } server.log.push(serverData) this.calcSpeed(server, serverData) + server.updated = true server.graphLine.append(server.timestamp, server.uploadSpeed) // Update clients @@ -156,24 +181,20 @@ var app = new Vue({ client = server.clientMap[clientData.address] client.log.push(clientData) this.calcSpeed(client, clientData) + client.updated = true }) }) } - // Remove outdated values + // Calculate speed of servers/clients not included in the latest data for (let serverIp in this.serverMap) { const server = this.serverMap[serverIp] - server.log = server.log.filter(x => x.timestamp > this.rawData.timestamp - this.timespan * 1000) - if (server.log.length === 0) { - this.smoothie.removeTimeSeries(server.graphLine) - this.graphColors.unshift(server.graphColor) - Vue.delete(this.serverMap, serverIp) - } else { - for (let clientIp in server.clientMap) { - const client = server.clientMap[clientIp] - client.log = client.log.filter(x => x.timestamp > this.rawData.timestamp - this.timespan * 1000) - if (client.log.length === 0) Vue.delete(server.clientMap, clientIp) - } + if (server.updated) server.updated = false + else this.calcSpeed(server, {}) + for (let clientIp in server.clientMap) { + const client = server.clientMap[clientIp] + if (client.updated) client.updated = false + else this.calcSpeed(client, {}) } } } @@ -200,8 +221,8 @@ var app = new Vue({ objData.peakDownloadSpeed = Math.max(...obj.log.map(x => x.downloadSpeed || 0)) // Calculate average speeds + time = (this.rawData.timestamp - this.timespanStartTime) / 1000 a = obj.log[0] - time = (b.timestamp - a.timestamp) / 1000 objData.avgUploadSpeed = (b.bytesSent - a.bytesSent) / time objData.avgDownloadSpeed = (b.bytesReceived - a.bytesReceived) / time |