Graphs now load again similarly to overview content

Plan/common/src/main/resources/assets/plan/web/js/graphs.js

@@ -1,4 +1,4 @@
-var linegraphButtons = [{
+const linegraphButtons = [{
     type: 'hour',
     count: 12,
     text: '12h'
@@ -19,7 +19,7 @@ var linegraphButtons = [{
     text: 'All'
 }];
 
-var graphs = [];
+const graphs = [];
 window.calendars = {};
 
 function activityPie(id, activitySeries) {
@@ -406,15 +406,15 @@ function serverPie(id, serverSeries) {
 }
 
 function formatTimeAmount(ms) {
-    var out = "";
+    let out = "";
 
-    var seconds = Math.floor(ms / 1000);
+    let seconds = Math.floor(ms / 1000);
 
-    var dd = Math.floor(seconds / 86400);
+    const dd = Math.floor(seconds / 86400);
     seconds -= (dd * 86400);
-    var dh = Math.floor(seconds / 3600);
+    const dh = Math.floor(seconds / 3600);
     seconds -= (dh * 3600);
-    var dm = Math.floor(seconds / 60);
+    const dm = Math.floor(seconds / 60);
     seconds -= (dm * 60);
     seconds = Math.floor(seconds);
     if (dd !== 0) {
@@ -610,9 +610,9 @@ function worldMap(id, colorMin, colorMax, mapSeries) {
 }
 
 function worldPie(id, worldSeries, gmSeries) {
-    var defaultTitle = '';
+    const defaultTitle = '';
-    var defaultSubtitle = 'Click to expand';
+    const defaultSubtitle = 'Click to expand';
-    var chart = Highcharts.chart(id, {
+    const chart = Highcharts.chart(id, {
         chart: {
             plotBackgroundColor: null,
             plotBorderWidth: null,

Plan/common/src/main/resources/assets/plan/web/js/server-values.js

@@ -346,3 +346,236 @@ function loadPerformanceValues(json, error) {
     element.querySelector('#data_low_tps_chunks').innerText = data.low_tps_chunks;
     element.querySelector('#data_low_tps_cpu').innerText = data.low_tps_cpu;
 }
+
+function loadOptimizedPerformanceGraph(json, error) {
+    if (json) {
+        const zones = {
+            tps: [{
+                value: json.zones.tpsThresholdMed,
+                color: json.colors.low
+            }, {
+                value: json.zones.tpsThresholdHigh,
+                color: json.colors.med
+            }, {
+                value: 30,
+                color: json.colors.high
+            }],
+            disk: [{
+                value: json.zones.diskThresholdMed,
+                color: json.colors.low
+            }, {
+                value: json.zones.tpsThresholdHigh,
+                color: json.colors.med
+            }, {
+                value: Number.MAX_VALUE,
+                color: json.colors.high
+            }]
+        };
+        const dataSeries = mapToDataSeries(json.values);
+        const series = {
+            playersOnline: {
+                name: s.name.playersOnline, type: s.type.areaSpline, tooltip: s.tooltip.zeroDecimals,
+                data: dataSeries.playersOnline, color: json.colors.playersOnline, yAxis: 0
+            },
+            tps: {
+                name: s.name.tps, type: s.type.spline, color: json.colors.high,
+                zones: zones.tps, tooltip: s.tooltip.twoDecimals, data: dataSeries.tps,
+                yAxis: 1
+            },
+            cpu: {
+                name: s.name.cpu, type: s.type.spline, tooltip: s.tooltip.twoDecimals,
+                data: dataSeries.cpu, color: json.colors.cpu, yAxis: 2
+            },
+            cpu_alt: {
+                name: s.name.cpu, type: s.type.spline, tooltip: s.tooltip.twoDecimals,
+                data: dataSeries.cpu, color: json.colors.cpu, yAxis: 1
+            },
+            ram: {
+                name: s.name.ram, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
+                data: dataSeries.ram, color: json.colors.ram, yAxis: 3
+            },
+            ram_alt: {
+                name: s.name.ram, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
+                data: dataSeries.ram, color: json.colors.ram, yAxis: 2
+            },
+            entities: {
+                name: s.name.entities, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
+                data: dataSeries.entities, color: json.colors.entities, yAxis: 4
+            },
+            entities_alt: {
+                name: s.name.entities, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
+                data: dataSeries.entities, color: json.colors.entities, yAxis: 1
+            },
+            chunks: {
+                name: s.name.chunks, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
+                data: dataSeries.chunks, color: json.colors.chunks, yAxis: 5
+            },
+            chunks_alt: {
+                name: s.name.chunks, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
+                data: dataSeries.chunks, color: json.colors.chunks, yAxis: 2
+            },
+            disk: {
+                name: s.name.disk, type: s.type.spline, color: json.colors.high,
+                zones: zones.disk, tooltip: s.tooltip.zeroDecimals, data: dataSeries.disk
+            }
+        };
+        playersChart('playersOnlineChart', series.playersOnline, 2);
+        performanceChart('performanceGraph', series.playersOnline, series.tps, series.cpu, series.ram, series.entities, series.chunks);
+        tpsChart('tpsGraph', series.tps, series.playersOnline);
+        resourceChart('resourceGraph', series.cpu_alt, series.ram_alt, series.playersOnline);
+        worldChart('worldGraph', series.entities_alt, series.chunks_alt, series.playersOnline);
+        diskChart('diskGraph', [series.disk]);
+    } else if (error) {
+        const errorMessage = `Failed to load graph data: ${error}`;
+        document.getElementById('playersOnlineChart').innerText = errorMessage;
+        document.getElementById('performanceGraph').innerText = errorMessage;
+        document.getElementById('tpsGraph').innerText = errorMessage;
+        document.getElementById('resourceGraph').innerText = errorMessage;
+        document.getElementById('worldGraph').innerText = errorMessage;
+        document.getElementById('diskGraph').innerText = errorMessage;
+    }
+}
+
+function loadPingGraph(json, error) {
+    if (json) {
+        const series = {
+            avgPing: {
+                name: s.name.avgPing,
+                type: s.type.spline,
+                tooltip: s.tooltip.twoDecimals,
+                data: json.avg_ping_series,
+                color: json.colors.avg
+            },
+            maxPing: {
+                name: s.name.maxPing,
+                type: s.type.spline,
+                tooltip: s.tooltip.zeroDecimals,
+                data: json.max_ping_series,
+                color: json.colors.max
+            },
+            minPing: {
+                name: s.name.minPing,
+                type: s.type.spline,
+                tooltip: s.tooltip.zeroDecimals,
+                data: json.min_ping_series,
+                color: json.colors.min
+            }
+        };
+        lineChart('pingGraph', [series.avgPing, series.maxPing, series.minPing]);
+    } else if (error) {
+        document.getElementById('pingGraph').innerText = `Failed to load graph data: ${error}`;
+    }
+}
+
+function loadWorldPie(json, error) {
+    if (json) {
+        const worldSeries = {name: 'World Playtime', colorByPoint: true, data: json.world_series};
+        const gmSeries = json.gm_series;
+        worldPie("worldPie", worldSeries, gmSeries);
+    } else if (error) {
+        document.getElementById('worldPie').innerText = `Failed to load graph data: ${error}`;
+    }
+}
+
+function loadActivityGraph(json, error) {
+    if (json) {
+        activityPie('activityPie', {
+            name: s.name.unit_players, colorByPoint: true, data: json.activity_pie_series
+        });
+        stackChart('activityStackGraph', json.activity_labels, json.activity_series, s.name.unit_players);
+    } else if (error) {
+        const errorMessage = `Failed to load graph data: ${error}`;
+        document.getElementById('activityPie').innerText = errorMessage;
+        document.getElementById('activityStackGraph').innerText = errorMessage;
+    }
+}
+
+function loadGeolocationGraph(json, error) {
+    if (json) {
+        const geolocationSeries = {
+            name: s.name.unit_players,
+            type: 'map',
+            mapData: Highcharts.maps['custom/world'],
+            data: json.geolocation_series,
+            joinBy: ['iso-a3', 'code']
+        };
+        const geolocationBarSeries = {
+            color: json.colors.bars,
+            name: s.name.unit_players,
+            data: json.geolocation_bar_series.map(function (bar) {
+                return bar.value
+            })
+        };
+        const geolocationBarCategories = json.geolocation_bar_series.map(function (bar) {
+            return bar.label
+        });
+        worldMap('worldMap', json.colors.low, json.colors.high, geolocationSeries);
+        horizontalBarChart('countryBarChart', geolocationBarCategories, [geolocationBarSeries], s.name.unit_players);
+    } else if (error) {
+        const errorMessage = `Failed to load graph data:  ${error}`;
+        document.getElementById('worldMap').innerText = errorMessage;
+        document.getElementById('countryBarChart').innerText = errorMessage;
+    }
+}
+
+function loadUniqueAndNewGraph(json, error) {
+    if (json) {
+        const uniquePlayers = {
+            name: s.name.uniquePlayers, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
+            data: json.uniquePlayers, color: json.colors.playersOnline
+        };
+        const newPlayers = {
+            name: s.name.newPlayers, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
+            data: json.newPlayers, color: json.colors.newPlayers
+        };
+        dayByDay('uniqueChart', [uniquePlayers, newPlayers]);
+    } else if (error) {
+        document.getElementById('uniqueChart').innerText = `Failed to load graph data: ${error}`;
+    }
+}
+
+function loadHourlyUniqueAndNewGraph(json, error) {
+    if (json) {
+        const uniquePlayers = {
+            name: s.name.uniquePlayers, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
+            data: json.uniquePlayers, color: json.colors.playersOnline
+        };
+        const newPlayers = {
+            name: s.name.newPlayers, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
+            data: json.newPlayers, color: json.colors.newPlayers
+        };
+        dayByDay('hourlyUniqueChart', [uniquePlayers, newPlayers]);
+    } else if (error) {
+        document.getElementById('uniqueChart').innerText = `Failed to load graph data: ${error}`;
+    }
+}
+
+function loadServerCalendar(json, error) {
+    if (json) {
+        document.getElementById('calendar').innerText = '';
+        onlineActivityCalendar('#calendar', json.data, json.firstDay);
+        document.getElementById('online-calendar-tab').addEventListener('click', function () {
+            // Wrapping this in a 0ms setTimeout waits for all other event handlers
+            // to finish. We need this because if the calendar is rendered
+            // immediately, it renders for a width of 0.
+            setTimeout(function () {
+                window.calendars.online_activity.render();
+            }, 0);
+        });
+    } else if (error) {
+        document.getElementById('calendar').innerText = `Failed to load calendar data: ${error}`;
+    }
+}
+
+function loadPunchCard(json, error) {
+    if (json) {
+        const punchCardSeries = {
+            name: 'Relative Join Activity',
+            color: json.color,
+            data: json.punchCard
+        };
+        punchCard('punchCard', punchCardSeries);
+    } else if (error) {
+        document.getElementById('punchCard').innerText = `Failed to load graph data: ${error}`;
+    }
+}

Plan/common/src/main/resources/assets/plan/web/js/xmlhttprequests.js

@@ -1,3 +1,6 @@
+// Stored by tab {'tab-id': ['address', 'address']}
+const currentlyRefreshing = {};
+
 function refreshingJsonRequest(address, callback, tabID) {
     const timestamp = Date.now();
     const addressWithTimestamp = address.includes('?')
@@ -6,12 +9,18 @@ function refreshingJsonRequest(address, callback, tabID) {
 
     const refreshElement = document.querySelector(`#${tabID} .refresh-element`);
     refreshElement.querySelector('i').addEventListener('click', () => {
+        if (currentlyRefreshing[tabID].includes(address)) {
+            return;
+        }
         refreshElement.querySelector('.refresh-notice').innerHTML = '<i class="fa fa-fw fa-cog fa-spin"></i> Updating..';
         refreshingJsonRequest(address, callback, tabID);
     });
 
     let timeout = 1000;
 
+    if (!currentlyRefreshing[tabID]) currentlyRefreshing[tabID] = [];
+    currentlyRefreshing[tabID].push(address);
+
     function makeTheRequest() {
         jsonRequest(addressWithTimestamp, (json, error) => {
             if (error) {
@@ -32,7 +41,10 @@ function refreshingJsonRequest(address, callback, tabID) {
                 setTimeout(makeTheRequest, timeout);
                 timeout = timeout >= 12000 ? timeout : timeout * 2;
             } else {
-                refreshElement.querySelector('.refresh-notice').innerHTML = "";
+                currentlyRefreshing[tabID].splice(currentlyRefreshing[tabID].indexOf(address), 1);
+                if (!currentlyRefreshing[tabID].length) {
+                    refreshElement.querySelector('.refresh-notice').innerHTML = "";
+                }
             }
             callback(json, error);
         })

Plan/common/src/main/resources/assets/plan/web/network.html

@@ -27,7 +27,7 @@
 
 <body>
 <script>
-    var gmPieColors = [${gmPieColors}];
+    const gmPieColors = [${gmPieColors}];
 </script>
 <div class="page-loader">
     <span class="loader"></span>
@@ -846,7 +846,7 @@
         setLoadingText('Rendering graphs..');
 
         // TODO remove
-        var v = {
+        const v = {
             colors: {
                 playersOnline: '${playersGraphColor}',
                 newPlayers: '#8BC34A',
@@ -867,7 +867,7 @@
         });
 
         // HighCharts Series
-        var s = {
+        const s = {
             name: {
                 playersOnline: 'Players Online',
                 uniquePlayers: 'Unique Players',
@@ -890,9 +890,9 @@
             }
         };
 
-        jsonRequest("./v1/graph?type=playersOnline&server=${serverUUID}", function (json, error) {
+        refreshingJsonRequest("./v1/graph?type=playersOnline&server=${serverUUID}", function (json, error) {
             if (json) {
-                var series = {
+                const series = {
                     playersOnline: {
                         name: s.name.playersOnline, type: s.type.areaSpline, tooltip: s.tooltip.zeroDecimals,
                         data: json.playersOnline, color: v.colors.playersOnline, yAxis: 0
@@ -902,15 +902,15 @@
             } else if (error) {
                 $('#playersOnlineChart').text("Failed to load graph data: " + error);
             }
-        });
+        }, 'network-overview');
 
-        jsonRequest("./v1/graph?type=uniqueAndNew", function (json, error) {
+        refreshingJsonRequest("./v1/graph?type=uniqueAndNew", function (json, error) {
             if (json) {
-                var uniquePlayers = {
+                const uniquePlayers = {
                     name: s.name.uniquePlayers, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
                     data: json.uniquePlayers, color: v.colors.playersOnline
                 };
-                var newPlayers = {
+                const newPlayers = {
                     name: s.name.newPlayers, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
                     data: json.newPlayers, color: v.colors.newPlayers
                 };
@@ -918,15 +918,15 @@
             } else if (error) {
                 $('#uniqueChart').text("Failed to load graph data: " + error)
             }
-        });
+        }, 'network-overview');
 
-        jsonRequest("./v1/graph?type=hourlyUniqueAndNew", function (json, error) {
+        refreshingJsonRequest("./v1/graph?type=hourlyUniqueAndNew", function (json, error) {
             if (json) {
-                var uniquePlayers = {
+                const uniquePlayers = {
                     name: s.name.uniquePlayers, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
                     data: json.uniquePlayers, color: v.colors.playersOnline
                 };
-                var newPlayers = {
+                const newPlayers = {
                     name: s.name.newPlayers, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
                     data: json.newPlayers, color: v.colors.newPlayers
                 };
@@ -934,9 +934,9 @@
             } else if (error) {
                 $('#uniqueChart').text("Failed to load graph data: " + error)
             }
-        });
+        }, 'network-overview');
 
-        jsonRequest("./v1/graph?type=serverPie", function (json, error) {
+        refreshingJsonRequest("./v1/graph?type=serverPie", function (json, error) {
             if (json) {
                 serverPieSeries = {
                     name: 'Server Playtime',
@@ -948,9 +948,9 @@
             } else if (error) {
                 $('#serverPie').text("Failed to load graph data: " + error)
             }
-        });
+        }, 'sessions-overview');
 
-        jsonRequest("./v1/graph?type=activity", function (json, error) {
+        refreshingJsonRequest("./v1/graph?type=activity", function (json, error) {
             if (json) {
                 activityPie('activityPie', {
                     name: 'Players', colorByPoint: true, data: json.activity_pie_series
@@ -960,25 +960,25 @@
                 $('#activityPie').text("Failed to load graph data: " + error);
                 $('#activityStackGraph').text("Failed to load graph data: " + error);
             }
-        });
+        }, 'playerbase-overview');
 
-        jsonRequest("./v1/graph?type=geolocation", function (json, error) {
+        refreshingJsonRequest("./v1/graph?type=geolocation", function (json, error) {
             if (json) {
-                var geolocationSeries = {
+                const geolocationSeries = {
                     name: 'Players',
                     type: 'map',
                     mapData: Highcharts.maps['custom/world'],
                     data: json.geolocation_series,
                     joinBy: ['iso-a3', 'code']
                 };
-                var geolocationBarSeries = {
+                const geolocationBarSeries = {
                     color: json.colors.bars,
                     name: 'Players',
                     data: json.geolocation_bar_series.map(function (bar) {
                         return bar.value
                     })
                 };
-                var geolocationBarCategories = json.geolocation_bar_series.map(function (bar) {
+                const geolocationBarCategories = json.geolocation_bar_series.map(function (bar) {
                     return bar.label
                 });
                 worldMap('worldMap', json.colors.low, json.colors.high, geolocationSeries);
@@ -987,7 +987,7 @@
                 $('#worldMap').text("Failed to load graph data: " + error);
                 $('#countryBarChart').text("Failed to load graph data: " + error);
             }
-        });
+        }, 'geolocations');
 
         setLoadingText('Sorting out plugin tables..');
 

Plan/common/src/main/resources/assets/plan/web/server.html

@@ -1325,6 +1325,34 @@
 <script src="../js/server-values.js"></script>
 
 <script id="mainScript">
+
+    // HighCharts Series
+    const s = {
+        name: {
+            playersOnline: 'Players Online',
+            uniquePlayers: 'Unique Players',
+            newPlayers: 'New Players',
+            tps: 'TPS',
+            cpu: 'CPU (%)',
+            ram: 'RAM (MB)',
+            entities: 'Entities',
+            chunks: 'Chunks',
+            maxPing: 'Worst Ping',
+            minPing: 'Best Ping',
+            avgPing: 'Average Ping',
+            disk: 'Free Disk Space (MB)',
+            unit_players: 'Players'
+        },
+        tooltip: {
+            twoDecimals: {valueDecimals: 2},
+            zeroDecimals: {valueDecimals: 0}
+        },
+        type: {
+            areaSpline: 'areaspline',
+            spline: 'spline'
+        }
+    };
+
     try {
         setLoadingText('Calculating values..');
         refreshingJsonRequest("../v1/serverOverview?server=${serverUUID}", loadserverOverviewValues, 'server-overview');
@@ -1340,265 +1368,15 @@
             time: {timezoneOffset: (${timeZone}) * 60}
         });
 
-        // HighCharts Series
+        refreshingJsonRequest("../v1/graph?type=optimizedPerformance&server=${serverUUID}", loadOptimizedPerformanceGraph, 'performance');
-        const s = {
+        refreshingJsonRequest("../v1/graph?type=aggregatedPing&server=${serverUUID}", loadPingGraph, 'performance');
-            name: {
+        refreshingJsonRequest("../v1/graph?type=worldPie&server=${serverUUID}", loadWorldPie, 'sessions-overview');
-                playersOnline: 'Players Online',
+        refreshingJsonRequest("../v1/graph?type=activity&server=${serverUUID}", loadActivityGraph, 'playerbase-overview');
-                uniquePlayers: 'Unique Players',
+        refreshingJsonRequest("../v1/graph?type=geolocation&server=${serverUUID}", loadGeolocationGraph, 'geolocations');
-                newPlayers: 'New Players',
+        refreshingJsonRequest("../v1/graph?type=uniqueAndNew&server=${serverUUID}", loadUniqueAndNewGraph, 'online-activity-overview');
-                tps: 'TPS',
+        refreshingJsonRequest("../v1/graph?type=hourlyUniqueAndNew&server=${serverUUID}", loadHourlyUniqueAndNewGraph, 'online-activity-overview');
-                cpu: 'CPU (%)',
+        jsonRequest("../v1/graph?type=serverCalendar&server=${serverUUID}", loadServerCalendar, 'online-activity-overview');
-                ram: 'RAM (MB)',
+        refreshingJsonRequest("../v1/graph?type=punchCard&server=${serverUUID}", loadPunchCard, 'online-activity-overview');
-                entities: 'Entities',
-                chunks: 'Chunks',
-                maxPing: 'Worst Ping',
-                minPing: 'Best Ping',
-                avgPing: 'Average Ping',
-                disk: 'Free Disk Space (MB)'
-            },
-            tooltip: {
-                twoDecimals: {
-                    valueDecimals: 2
-                },
-                zeroDecimals: {
-                    valueDecimals: 0
-                }
-            },
-            type: {
-                areaSpline: 'areaspline',
-                spline: 'spline'
-            }
-        };
-
-        jsonRequest("../v1/graph?type=optimizedPerformance&server=${serverUUID}", function (json, error) {
-            if (json) {
-                const zones = {
-                    tps: [{
-                        value: json.zones.tpsThresholdMed,
-                        color: json.colors.low
-                    }, {
-                        value: json.zones.tpsThresholdHigh,
-                        color: json.colors.med
-                    }, {
-                        value: 30,
-                        color: json.colors.high
-                    }],
-                    disk: [{
-                        value: json.zones.diskThresholdMed,
-                        color: json.colors.low
-                    }, {
-                        value: json.zones.tpsThresholdHigh,
-                        color: json.colors.med
-                    }, {
-                        value: Number.MAX_VALUE,
-                        color: json.colors.high
-                    }]
-                };
-                const dataSeries = mapToDataSeries(json.values);
-                const series = {
-                    playersOnline: {
-                        name: s.name.playersOnline, type: s.type.areaSpline, tooltip: s.tooltip.zeroDecimals,
-                        data: dataSeries.playersOnline, color: json.colors.playersOnline, yAxis: 0
-                    },
-                    tps: {
-                        name: s.name.tps, type: s.type.spline, color: json.colors.high,
-                        zones: zones.tps, tooltip: s.tooltip.twoDecimals, data: dataSeries.tps,
-                        yAxis: 1
-                    },
-                    cpu: {
-                        name: s.name.cpu, type: s.type.spline, tooltip: s.tooltip.twoDecimals,
-                        data: dataSeries.cpu, color: json.colors.cpu, yAxis: 2
-                    },
-                    cpu_alt: {
-                        name: s.name.cpu, type: s.type.spline, tooltip: s.tooltip.twoDecimals,
-                        data: dataSeries.cpu, color: json.colors.cpu, yAxis: 1
-                    },
-                    ram: {
-                        name: s.name.ram, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
-                        data: dataSeries.ram, color: json.colors.ram, yAxis: 3
-                    },
-                    ram_alt: {
-                        name: s.name.ram, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
-                        data: dataSeries.ram, color: json.colors.ram, yAxis: 2
-                    },
-                    entities: {
-                        name: s.name.entities, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
-                        data: dataSeries.entities, color: json.colors.entities, yAxis: 4
-                    },
-                    entities_alt: {
-                        name: s.name.entities, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
-                        data: dataSeries.entities, color: json.colors.entities, yAxis: 1
-                    },
-                    chunks: {
-                        name: s.name.chunks, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
-                        data: dataSeries.chunks, color: json.colors.chunks, yAxis: 5
-                    },
-                    chunks_alt: {
-                        name: s.name.chunks, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
-                        data: dataSeries.chunks, color: json.colors.chunks, yAxis: 2
-                    },
-                    disk: {
-                        name: s.name.disk, type: s.type.spline, color: json.colors.high,
-                        zones: zones.disk, tooltip: s.tooltip.zeroDecimals, data: dataSeries.disk
-                    }
-                };
-                playersChart('playersOnlineChart', series.playersOnline, 2);
-                performanceChart('performanceGraph', series.playersOnline, series.tps, series.cpu, series.ram, series.entities, series.chunks);
-                tpsChart('tpsGraph', series.tps, series.playersOnline);
-                resourceChart('resourceGraph', series.cpu_alt, series.ram_alt, series.playersOnline);
-                worldChart('worldGraph', series.entities_alt, series.chunks_alt, series.playersOnline);
-                diskChart('diskGraph', [series.disk]);
-            } else if (error) {
-                $('#playersOnlineChart').text("Failed to load graph data: " + error);
-                $('#performanceGraph').text("Failed to load graph data: " + error);
-                $('#tpsGraph').text("Failed to load graph data: " + error);
-                $('#resourceGraph').text("Failed to load graph data: " + error);
-                $('#worldGraph').text("Failed to load graph data: " + error);
-                $('#diskGraph').text("Failed to load graph data: " + error);
-            }
-        });
-
-        jsonRequest("../v1/graph?type=aggregatedPing&server=${serverUUID}", function (json, error) {
-            if (json) {
-                var series = {
-                    avgPing: {
-                        name: s.name.avgPing,
-                        type: s.type.spline,
-                        tooltip: s.tooltip.twoDecimals,
-                        data: json.avg_ping_series,
-                        color: json.colors.avg
-                    },
-                    maxPing: {
-                        name: s.name.maxPing,
-                        type: s.type.spline,
-                        tooltip: s.tooltip.zeroDecimals,
-                        data: json.max_ping_series,
-                        color: json.colors.max
-                    },
-                    minPing: {
-                        name: s.name.minPing,
-                        type: s.type.spline,
-                        tooltip: s.tooltip.zeroDecimals,
-                        data: json.min_ping_series,
-                        color: json.colors.min
-                    }
-                };
-                lineChart('pingGraph', [series.avgPing, series.maxPing, series.minPing]);
-            } else if (error) {
-                $('#pingGraph').text("Failed to load graph data: " + error);
-            }
-        });
-
-        jsonRequest("../v1/graph?type=worldPie&server=${serverUUID}", function (json, error) {
-            if (json) {
-                var worldSeries = {name: 'World Playtime', colorByPoint: true, data: json.world_series};
-                var gmSeries = json.gm_series;
-                worldPie("worldPie", worldSeries, gmSeries);
-            } else if (error) {
-                $('#worldPie').text("Failed to load graph data: " + error)
-            }
-        });
-
-        jsonRequest("../v1/graph?type=activity&server=${serverUUID}", function (json, error) {
-            if (json) {
-                activityPie('activityPie', {
-                    name: 'Players', colorByPoint: true, data: json.activity_pie_series
-                });
-                stackChart('activityStackGraph', json.activity_labels, json.activity_series, 'Players');
-            } else if (error) {
-                $('#activityPie').text("Failed to load graph data: " + error);
-                $('#activityStackGraph').text("Failed to load graph data: " + error);
-            }
-        });
-
-        jsonRequest("../v1/graph?type=geolocation&server=${serverUUID}", function (json, error) {
-            if (json) {
-                var geolocationSeries = {
-                    name: 'Players',
-                    type: 'map',
-                    mapData: Highcharts.maps['custom/world'],
-                    data: json.geolocation_series,
-                    joinBy: ['iso-a3', 'code']
-                };
-                var geolocationBarSeries = {
-                    color: json.colors.bars,
-                    name: 'Players',
-                    data: json.geolocation_bar_series.map(function (bar) {
-                        return bar.value
-                    })
-                };
-                var geolocationBarCategories = json.geolocation_bar_series.map(function (bar) {
-                    return bar.label
-                });
-                worldMap('worldMap', json.colors.low, json.colors.high, geolocationSeries);
-                horizontalBarChart('countryBarChart', geolocationBarCategories, [geolocationBarSeries], 'Players');
-            } else if (error) {
-                $('#worldMap').text("Failed to load graph data: " + error);
-                $('#countryBarChart').text("Failed to load graph data: " + error);
-            }
-        });
-
-        jsonRequest("../v1/graph?type=uniqueAndNew&server=${serverUUID}", function (json, error) {
-            if (json) {
-                var uniquePlayers = {
-                    name: s.name.uniquePlayers, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
-                    data: json.uniquePlayers, color: json.colors.playersOnline
-                };
-                var newPlayers = {
-                    name: s.name.newPlayers, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
-                    data: json.newPlayers, color: json.colors.newPlayers
-                };
-                dayByDay('uniqueChart', [uniquePlayers, newPlayers]);
-            } else if (error) {
-                $('#uniqueChart').text("Failed to load graph data: " + error)
-            }
-        });
-
-        jsonRequest("../v1/graph?type=hourlyUniqueAndNew&server=${serverUUID}", function (json, error) {
-            if (json) {
-                var uniquePlayers = {
-                    name: s.name.uniquePlayers, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
-                    data: json.uniquePlayers, color: json.colors.playersOnline
-                };
-                var newPlayers = {
-                    name: s.name.newPlayers, type: s.type.spline, tooltip: s.tooltip.zeroDecimals,
-                    data: json.newPlayers, color: json.colors.newPlayers
-                };
-                dayByDay('hourlyUniqueChart', [uniquePlayers, newPlayers]);
-            } else if (error) {
-                $('#uniqueChart').text("Failed to load graph data: " + error)
-            }
-        });
-
-        jsonRequest("../v1/graph?type=serverCalendar&server=${serverUUID}", function (json, error) {
-            if (json) {
-                $('#calendar').text('');
-                onlineActivityCalendar('#calendar', json.data, json.firstDay);
-                $('#online-calendar-tab').click(function () {
-                    // Wrapping this in a 0ms setTimeout waits for all other event handlers
-                    // to finish. We need this because if the calendar is rendered
-                    // immediately, it renders for a width of 0.
-                    setTimeout(function () {
-                        window.calendars.online_activity.render();
-                    }, 0);
-                });
-            } else if (error) {
-                $('#calendar').text("Failed to load calendar data: " + error)
-            }
-        });
-
-        jsonRequest("../v1/graph?type=punchCard&server=${serverUUID}", function (json, error) {
-            if (json) {
-                var punchCardSeries = {
-                    name: 'Relative Join Activity',
-                    color: json.color,
-                    data: json.punchCard
-                };
-                punchCard('punchCard', punchCardSeries);
-            } else if (error) {
-                $('#punchCard').text("Failed to load graph data: " + error)
-            }
-        });
 
         setLoadingText('Sorting players table..');