Numerous graph fixes

assets/js/site.js

@@ -231,6 +231,8 @@ $(document).ready(function() {
     var mojangServicesUpdater;
     var sortServersTask;
 
+    var graphDuration;
+
 	socket.on('connect', function() {
         $('#tagline-text').text('Loading...');
 
@@ -262,6 +264,10 @@ $(document).ready(function() {
         $('#big-graph-controls').css('display', 'none');
     });
 
+    socket.on('setGraphDuration', function(value) {
+        graphDuration = value;
+    });
+
     socket.on('historyGraph', function(rawData) {
         displayedGraphData = rawData;
 
@@ -295,23 +301,25 @@ $(document).ready(function() {
     });
 
     socket.on('updateHistoryGraph', function(rawData) {
-        var targetGraphData = displayedGraphData[rawData.ip];
-
-        // If it's not in our display group, push it to the hidden group instead so it can be restored and still be up to date.
-        if (!targetGraphData) {
-            targetGraphData = hiddenGraphData[rawData.ip];
+        // Prevent race conditions.
+        if (!graphDuration) {
+            return;
         }
 
-        if (targetGraphData.length > 24 * 60) {
-            targetGraphData.shift();
+        // If it's not in our display group, use the hidden group instead.
+        var targetGraphData = displayedGraphData[rawData.ip] ? displayedGraphData : hiddenGraphData;
+
+        trimOldPings(targetGraphData, graphDuration);
+
+        targetGraphData[rawData.ip].push([rawData.timestamp, rawData.players]);
+
+        // Redraw if we need to.
+        if (displayedGraphData[rawData.ip]) {
+            historyPlot.setData(convertGraphData(displayedGraphData));
+            historyPlot.setupGrid();
+
+            historyPlot.draw();
         }
-
-        targetGraphData.push([rawData.timestamp, rawData.players]);
-
-        historyPlot.setData(convertGraphData(displayedGraphData));
-        historyPlot.setupGrid();
-
-        historyPlot.draw();
     });
 
 	socket.on('add', function(servers) {

assets/js/util.js

@@ -36,6 +36,30 @@ function isMobileBrowser() {
   return check;
 }
 
+function trimOldPings(data, graphDuration) {
+	var keys = Object.keys(data);
+
+	var timeMs = new Date().getTime();
+
+	for (var x = 0; x < keys.length; x++) {
+		var listing = data[keys[x]];
+
+		var toSplice = [];
+
+		for (var i = 0; i < listing.length; i++) {
+			var entry = listing[i];
+
+			if (timeMs - entry[0] > graphDuration) {
+				toSplice.push(i);
+			}
+		}
+
+		for (var i = 0; i < toSplice.length; i++) {
+			listing.splice(toSplice[i], 1);
+		}
+	}
+}
+
 function handlePlotHover(event, pos, item) {
     if (item) {
         var text = getTimestamp(item.datapoint[0] / 1000) + '\