Jump to content

MediaWiki:Common.js

From Pack.png Beta 1.7.3 Wiki
Revision as of 11:18, 31 July 2025 by Dinkelspiel (talk | contribs)

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
document.addEventListener('DOMContentLoaded', function () {
    var container = document.getElementById('maxPlayerChart');
    console.log("Hello", container);

    var canvas = document.createElement('canvas');
    canvas.id = 'maxPlayerChartCanvas';
    canvas.width = 600;
    canvas.height = 400;
    container.appendChild(canvas);

    var script = document.createElement('script');
    script.src = 'https://cdn.jsdelivr.net/npm/chart.js';

    script.onload = function () {
        var ctx1 = document.getElementById("maxPlayerChartCanvas");
        if (!ctx1) return;

        // Use XMLHttpRequest instead of fetch
        var xhr = new XMLHttpRequest();
        xhr.open("GET", "https://goldenage.keii.dev/api/servers/1/statistics/max-player-count", true);
        xhr.onreadystatechange = function () {
            if (xhr.readyState === 4 && xhr.status === 200) {
                var result = JSON.parse(xhr.responseText);
                var data = result["data"];

                new Chart(ctx1, {
                    type: "line",
                    data: {
                        labels: data.map(function (row) {
                            return new Date(row.Date).toDateString();
                        }),
                        datasets: [{
                            label: "Max Player Count",
                            data: data.map(function (row) {
                                return row.MaxPlayerCount;
                            }),
                            borderWidth: 1
                        }]
                    },
                    options: {
                        scales: {
                            y: {
                                beginAtZero: true
                            }
                        }
                    }
                });
            }
        };
        xhr.send();
    };

    document.head.appendChild(script);
});