use serverId in protocol instead of legacy info object

assets/js/app.js

@@ -99,7 +99,7 @@ export class App {
     // error = defined with "Waiting" description
     // info = safely defined with configured data
     const latestPing = pings[pings.length - 1]
-    const serverRegistration = this.serverRegistry.createServerRegistration(latestPing.info.name)
+    const serverRegistration = this.serverRegistry.createServerRegistration(latestPing.serverId)
 
     serverRegistration.initServerStatus(latestPing)
 

assets/js/graph.js

@@ -148,11 +148,7 @@ export class GraphDisplayManager {
       this.loadLocalStorage()
     }
 
-    // Remap the incoming data from being string (serverName) keyed into serverId keys
+    this._graphData = graphData
-    for (const serverName of Object.keys(graphData)) {
-      const serverRegistration = this._app.serverRegistry.getServerRegistration(serverName)
-      this._graphData[serverRegistration.serverId] = graphData[serverName]
-    }
 
     // Explicitly define a height so flot.js can rescale the Y axis
     document.getElementById('big-graph').style.height = '400px'

assets/js/main.js

@@ -5,7 +5,7 @@ import io from 'socket.io-client'
 const app = new App()
 
 document.addEventListener('DOMContentLoaded', function () {
-  const socket = io.connect({
+  const socket = io.connect('http://localhost:8080', {
     reconnect: true,
     reconnectDelay: 1000,
     reconnectionAttempts: 10
@@ -34,7 +34,10 @@ document.addEventListener('DOMContentLoaded', function () {
     let lastRowCounter = 0
     let controlsHTML = ''
 
-    Object.keys(data).sort().forEach(function (serverName) {
+    app.serverRegistry.getServerRegistrations()
+      .map(serverRegistration => serverRegistration.data.name)
+      .sort()
+      .forEach(serverName => {
         const serverRegistration = app.serverRegistry.getServerRegistration(serverName)
 
         controlsHTML += '<td>' +
@@ -66,7 +69,7 @@ document.addEventListener('DOMContentLoaded', function () {
       return
     }
 
-    const serverRegistration = app.serverRegistry.getServerRegistration(data.name)
+    const serverRegistration = app.serverRegistry.getServerRegistration(data.serverId)
 
     if (serverRegistration) {
       app.graphDisplayManager.addGraphPoint(serverRegistration.serverId, data.timestamp, data.playerCount)
@@ -86,7 +89,7 @@ document.addEventListener('DOMContentLoaded', function () {
     // The backend may send "update" events prior to receiving all "add" events
     // A server has only been added once it's ServerRegistration is defined
     // Checking undefined protects from this race condition
-    const serverRegistration = app.serverRegistry.getServerRegistration(data.info.name)
+    const serverRegistration = app.serverRegistry.getServerRegistration(data.serverId)
 
     if (serverRegistration) {
       serverRegistration.updateServerStatus(data, false, app.publicConfig.minecraftVersions)
@@ -121,26 +124,6 @@ document.addEventListener('DOMContentLoaded', function () {
     app.handleSyncComplete()
   })
 
-  socket.on('updatePeak', function (data) {
-    const serverRegistration = app.serverRegistry.getServerRegistration(data.name)
-
-    if (serverRegistration) {
-      serverRegistration.updateServerPeak(data.timestamp, data.playerCount)
-    }
-  })
-
-  socket.on('peaks', function (data) {
-    Object.keys(data).forEach(function (serverName) {
-      const serverRegistration = app.serverRegistry.getServerRegistration(serverName)
-
-      if (serverRegistration) {
-        const graphPeak = data[serverName]
-
-        serverRegistration.updateServerPeak(graphPeak.timestamp, graphPeak.playerCount)
-      }
-    })
-  })
-
   window.addEventListener('resize', function () {
     app.percentageBar.redraw()
 

assets/js/servers.js

@@ -48,8 +48,7 @@ export class ServerRegistry {
     }
   }
 
-  createServerRegistration (serverName) {
+  createServerRegistration (serverId) {
-    const serverId = this._serverIdsByName[serverName]
     const serverData = this._serverDataById[serverId]
     const serverRegistration = new ServerRegistration(this._app, serverId, serverData)
     this._registeredServers[serverId] = serverRegistration
@@ -139,7 +138,7 @@ export class ServerRegistration {
       if (pushToGraph) {
         // Only update graph for successful pings
         // This intentionally pauses the server graph when pings begin to fail
-        this._graphData.push([payload.info.timestamp, this.playerCount])
+        this._graphData.push([payload.timestamp, this.playerCount])
 
         // Trim graphData to within the max length by shifting out the leading elements
         if (this._graphData.length > SERVER_GRAPH_DATA_MAX_LENGTH) {
@@ -174,7 +173,7 @@ export class ServerRegistration {
     document.getElementById('ranking_' + this.serverId).innerText = '#' + (rankIndex + 1)
   }
 
-  updateServerPeak (time, playerCount) {
+  updateServerPeak (data) {
     const peakLabelElement = document.getElementById('peak_' + this.serverId)
 
     // Always set label once any peak data has been received
@@ -182,13 +181,10 @@ export class ServerRegistration {
 
     const peakValueElement = document.getElementById('peak-value_' + this.serverId)
 
-    peakValueElement.innerText = formatNumber(playerCount)
+    peakValueElement.innerText = formatNumber(data.playerCount)
-    peakLabelElement.title = 'At ' + formatTimestamp(time)
+    peakLabelElement.title = 'At ' + formatTimestamp(data.timestamp)
 
-    this.lastPeakData = {
+    this.lastPeakData = data
-      timestamp: time,
-      playerCount: playerCount
-    }
   }
 
   updateServerStatus (ping, isInitialUpdate, minecraftVersions) {
@@ -229,6 +225,10 @@ export class ServerRegistration {
       }
     }
 
+    if (ping.graphPeakData) {
+      this.updateServerPeak(ping.graphPeakData)
+    }
+
     const playerCountLabelElement = document.getElementById('player-count_' + this.serverId)
     const errorElement = document.getElementById('error_' + this.serverId)
 

lib/app.js

@@ -39,24 +39,11 @@ class App {
       client.on('requestHistoryGraph', () => {
         // Send historical graphData built from all serverRegistrations
         const graphData = {}
-        const graphPeaks = {}
 
         this.serverRegistrations.forEach((serverRegistration) => {
-          graphData[serverRegistration.data.name] = serverRegistration.graphData
+          graphData[serverRegistration.serverId] = serverRegistration.graphData
-
-          // Send current peak, if any
-          const graphPeak = serverRegistration.getGraphPeak()
-          if (graphPeak) {
-            graphPeaks[serverRegistration.data.name] = graphPeak
-          }
         })
 
-        // Send current peaks, if any
-        // Emit peaks first since graphData may take a while to receive
-        if (Object.keys(graphPeaks).length > 0) {
-          client.emit('peaks', graphPeaks)
-        }
-
         client.emit('historyGraph', graphData)
       })
     }

lib/ping.js

@@ -107,8 +107,6 @@ class PingController {
   handlePing (serverRegistration, resp, err, version) {
     const timestamp = new Date().getTime()
 
-    this._app.server.broadcast('update', serverRegistration.getUpdate(timestamp, resp, err, version))
-
     serverRegistration.addPing(timestamp, resp)
 
     if (config.logToDatabase) {
@@ -119,24 +117,14 @@ class PingController {
 
       if (serverRegistration.addGraphPoint(resp !== undefined, playerCount, timestamp)) {
         this._app.server.broadcast('updateHistoryGraph', {
-          name: serverRegistration.data.name,
+          serverId: serverRegistration.serverId,
           playerCount: playerCount,
           timestamp: timestamp
         })
       }
-
-      // Update calculated graph peak regardless if the graph is being updated
-      // This can cause a (harmless) desync between live and stored data, but it allows it to be more accurate for long surviving processes
-      if (serverRegistration.findNewGraphPeak()) {
-        const graphPeak = serverRegistration.getGraphPeak()
-
-        this._app.server.broadcast('updatePeak', {
-          name: serverRegistration.data.name,
-          playerCount: graphPeak.playerCount,
-          timestamp: graphPeak.timestamp
-        })
-      }
     }
+
+    this._app.server.broadcast('update', serverRegistration.getUpdate(timestamp, resp, err, version))
   }
 }
 

lib/servers.js

@@ -2,23 +2,23 @@ const config = require('../config')
 const minecraftVersions = require('../minecraft_versions')
 
 class ServerRegistration {
+  serverId
   lastFavicon
   versions = []
   recordData
   graphData = []
 
-  constructor (data) {
+  constructor (serverId, data) {
+    this.serverId = serverId
     this.data = data
     this._pingHistory = []
   }
 
   getUpdate (timestamp, resp, err, version) {
     const update = {
-      info: {
+      serverId: this.serverId,
-        name: this.data.name,
       timestamp: timestamp
     }
-    }
 
     if (resp) {
       if (resp.version && this.updateProtocolVersionCompat(resp.version, version.protocolId, version.protocolIndex)) {
@@ -48,6 +48,14 @@ class ServerRegistration {
       update.result = {
         players: resp.players
       }
+
+      if (config.logToDatabase) {
+        // Update calculated graph peak regardless if the graph is being updated
+        // This can cause a (harmless) desync between live and stored data, but it allows it to be more accurate for long surviving processes
+        if (this.findNewGraphPeak()) {
+          update.graphPeakData = this.getGraphPeak()
+        }
+      }
     } else if (err) {
       // Append a filtered copy of err
       // This ensures any unintended data is not leaked
@@ -94,15 +102,21 @@ class ServerRegistration {
       const lastPing = this._pingHistory[this._pingHistory.length - 1]
 
       const payload = {
-        info: {
+        serverId: this.serverId,
-          name: this.data.name
-        },
         timestamp: lastPing.timestamp,
         versions: this.versions,
         recordData: this.recordData,
         favicon: this.lastFavicon
       }
 
+      // Only append graphPeakData if defined
+      // The value is lazy computed and conditional that config->logToDatabase == true
+      const graphPeakData = this.getGraphPeak()
+
+      if (graphPeakData) {
+        payload.graphPeakData = graphPeakData
+      }
+
       // Conditionally append to avoid defining fields with undefined values
       if (lastPing.result) {
         payload.result = lastPing.result
@@ -118,14 +132,12 @@ class ServerRegistration {
     }
 
     return [{
+      serverId: this.serverId,
+      timestamp: new Date().getTime(),
       error: {
         message: 'Waiting...',
         placeholder: true
       },
-      timestamp: new Date().getTime(),
-      info: {
-        name: this.data.name
-      },
       recordData: this.recordData
     }]
   }

main.js

@@ -8,7 +8,7 @@ const servers = require('./servers')
 
 const app = new App()
 
-servers.forEach(server => {
+servers.forEach((server, serverId) => {
   // Assign a generated color for each servers.json entry if not manually defined
   // These will be passed to the frontend for use in rendering
   if (!server.color) {
@@ -22,7 +22,7 @@ servers.forEach(server => {
   }
 
   // Init a ServerRegistration instance of each entry in servers.json
-  app.serverRegistrations.push(new ServerRegistration(server))
+  app.serverRegistrations.push(new ServerRegistration(serverId, server))
 })
 
 if (!config.logToDatabase) {