diff --git a/README.md b/README.md index 729221d..89c0e69 100644 --- a/README.md +++ b/README.md @@ -53,3 +53,8 @@ sqlite3 ./data.sqlite sqlite> INSERT INTO worker (name, token) VALUES ("name", "secret_token"); sqlite> .exit ``` + +## Further improvements +- Scrape actual queue waiting times + - Use a bot that rejoins all the time when it completed the queue + - Reports the time that it actually took to join the server to the master diff --git a/static/index.html b/static/index.html index 3b5fe61..eb7fbe3 100644 --- a/static/index.html +++ b/static/index.html @@ -11,9 +11,9 @@ - - - + + + @@ -26,7 +26,7 @@ - + diff --git a/static/js/api.js b/static/js/api.js deleted file mode 100644 index b3806b2..0000000 --- a/static/js/api.js +++ /dev/null @@ -1,9 +0,0 @@ -async function getPlayerCounts(range) { - const res = await fetch(`/api/player-count?range=${range}`) - if (!res.ok) { - throw new Error(`Failed to get player counts, got status ${res.status}`) - } - - const json = await res.json() - return json -} diff --git a/static/js/main.js b/static/js/main.js deleted file mode 100644 index e3ca0eb..0000000 --- a/static/js/main.js +++ /dev/null @@ -1,54 +0,0 @@ -async function initChart() { - const datasets = ["Playing", "Normal queue", "Priority queue"] - .map(label => ({ label, data: [] })) - - const chart = new Chart(document.querySelector("#player-counts"), { - type: "line", - data: { - datasets: datasets, - }, - options: { - scales: { - x: { - type: "time", - time: { - unit: "minute" - }, - }, - y: { - beginAtZero: true, - }, - }, - }, - }) - - const range = document.querySelector("select#range") - - const updateChart = async () => { - const data = await getPlayerCounts(range.value) - - datasets[0].data = data.map(point => ({ - x: point["time"] * 60 * 1_000, - y: point["playing"], - })) - - datasets[1].data = data.map(point => ({ - x: point["time"] * 60 * 1_000, - y: point["normal_queue"], - })) - - datasets[2].data = data.map(point => ({ - x: point["time"] * 60 * 1_000, - y: point["priority_queue"], - })) - - chart.update() - } - - range.addEventListener("change", e => updateChart()) - updateChart() -} - -document.addEventListener("DOMContentLoaded", () => { - initChart() -}) diff --git a/static/main.js b/static/main.js new file mode 100644 index 0000000..e36bbd9 --- /dev/null +++ b/static/main.js @@ -0,0 +1,67 @@ +async function getPlayerCounts(range) { + const res = await fetch(`/api/player-count?range=${range}`) + if (!res.ok) { + throw new Error(`Failed to get player counts, got status ${res.status}`) + } + + const json = await res.json() + return json +} + +function initChart() { + const range = document.querySelector("select#range") + const canvas = document.querySelector("canvas#chart") + + const chart = new Chart(canvas, { + type: "line", + data: { + datasets: [], + }, + options: { + scales: { + x: { + type: "time", + }, + y: { + beginAtZero: true, + time: { + unit: "minute" + }, + }, + }, + }, + plugins: [], + }) + + const updateChart = async () => { + try { + const data = await getPlayerCounts(range.value) + + const datasets = new Map([ + ["Playing", "playing"], + ["Normal queue", "normal_queue"], + ["Priority queue", "priority_queue"], + ]) + + chart.data.datasets = Array + .from(datasets.entries()) + .map(([name, key]) => ({ + label: name, + data: data.map(point => ({ + x: point["time"] * 60_000, + y: point[key], + })) + })) + chart.update() + } catch (e) { + alert(`Failed to fetch data: ${e}`) + } + } + + range.addEventListener("input", () => updateChart()) + updateChart() +} + +document.addEventListener("DOMContentLoaded", () => { + initChart() +}) diff --git a/static/style.css b/static/style.css new file mode 100644 index 0000000..6995fb5 --- /dev/null +++ b/static/style.css @@ -0,0 +1,3 @@ +* { + font-family: sans-serif; +}