mirror of https://github.com/dirtbags/moth.git
Clean up and comment js in puzzle list and scoreboard
This commit is contained in:
Neale Pickett
parent
ab0cd35d2f
commit
aa23e248b4
|
|
@ -9,10 +9,9 @@
|
|||
|
||||
function render(obj) {
|
||||
puzzlesElement = document.createElement('div');
|
||||
let cats = [];
|
||||
for (let cat in obj) {
|
||||
cats.push(cat);
|
||||
}
|
||||
|
||||
// Create a sorted list of category names
|
||||
let cats = Object.keys(obj);
|
||||
cats.sort();
|
||||
|
||||
for (let cat of cats) {
|
||||
|
|
@ -29,6 +28,7 @@ function render(obj) {
|
|||
pdiv.appendChild(h);
|
||||
h.textContent = cat;
|
||||
|
||||
// Extras if we're running a devel server
|
||||
if (obj.__devel__) {
|
||||
var a = document.createElement('a');
|
||||
h.insertBefore(a, h.firstChild);
|
||||
|
|
@ -50,6 +50,7 @@ function render(obj) {
|
|||
i.textContent = " ";
|
||||
|
||||
if (points === 0) {
|
||||
// Sentry: there are no more puzzles in this category
|
||||
i.textContent = "✿";
|
||||
} else {
|
||||
var a = document.createElement('a');
|
||||
|
|
@ -66,16 +67,22 @@ function render(obj) {
|
|||
|
||||
function init() {
|
||||
fetch("puzzles.json")
|
||||
.then(function(resp) {
|
||||
.then(resp => {
|
||||
return resp.json();
|
||||
}).then(function(obj) {
|
||||
})
|
||||
.then(obj => {
|
||||
render(obj);
|
||||
}).catch(function(err) {
|
||||
})
|
||||
.catch(err => {
|
||||
console.log("Error", err);
|
||||
});
|
||||
}
|
||||
|
||||
document.addEventListener("DOMContentLoaded", init);
|
||||
if (document.readyState === "loading") {
|
||||
document.addEventListener("DOMContentLoaded", init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
|||
|
|
@ -34,7 +34,6 @@ function init() {
|
|||
let st = document.createElement("script");
|
||||
document.head.appendChild(st);
|
||||
st.src = base + script;
|
||||
|
||||
}
|
||||
|
||||
// List associated files
|
||||
|
|
|
|||
|
|
@ -5,130 +5,120 @@
|
|||
<link rel="stylesheet" href="basic.css">
|
||||
<meta name="viewport" content="width=device-width">
|
||||
<script>
|
||||
function loadJSON(url, callback) {
|
||||
function loaded(e) {
|
||||
callback(e.target.response);
|
||||
function update(state) {
|
||||
let element = document.getElementById("scoreboard");
|
||||
let teamnames = state["teams"];
|
||||
let pointslog = state["points"];
|
||||
let highscore = {};
|
||||
let teams = {};
|
||||
|
||||
// Every machine that's displaying the scoreboard helpfully stores the last 20 values of
|
||||
// points.json for us, in case of catastrophe. Thanks, y'all!
|
||||
//
|
||||
// We have been doing some letiation on this "everybody backs up the server state" trick since 2009.
|
||||
// We have needed it 0 times.
|
||||
let pointshistory = JSON.parse(localStorage.getItem("pointshistory")) || [];
|
||||
if (pointshistory.length >= 20){
|
||||
pointshistory.shift();
|
||||
}
|
||||
pointshistory.push(pointslog);
|
||||
localStorage.setItem("pointshistory", JSON.stringify(pointshistory));
|
||||
|
||||
// Dole out points
|
||||
for (let i in pointslog) {
|
||||
let entry = pointslog[i];
|
||||
let timestamp = entry[0];
|
||||
let teamhash = entry[1];
|
||||
let category = entry[2];
|
||||
let points = entry[3];
|
||||
|
||||
let team = teams[teamhash] || {__hash__: teamhash};
|
||||
|
||||
// Add points to team's points for that category
|
||||
team[category] = (team[category] || 0) + points;
|
||||
|
||||
// Record highest score in a category
|
||||
highscore[category] = Math.max(highscore[category] || 0, team[category]);
|
||||
|
||||
teams[teamhash] = team;
|
||||
}
|
||||
|
||||
// Sort by team score
|
||||
function teamScore(t) {
|
||||
let score = 0;
|
||||
for (let category in highscore) {
|
||||
score += (t[category] || 0) / highscore[category];
|
||||
}
|
||||
return score;
|
||||
}
|
||||
function teamCompare(a, b) {
|
||||
return teamScore(a) - teamScore(b);
|
||||
}
|
||||
|
||||
// Figure out how to order each team on the scoreboard
|
||||
let winners = [];
|
||||
for (let i in teams) {
|
||||
winners.push(teams[i]);
|
||||
}
|
||||
winners.sort(teamCompare);
|
||||
winners.reverse();
|
||||
|
||||
// Clear out the element we're about to populate
|
||||
Array.from(element.childNodes).map(e => e.remove());
|
||||
|
||||
let maxWidth = 100 / Object.keys(highscore).length;
|
||||
for (let i in winners) {
|
||||
let team = winners[i];
|
||||
let row = document.createElement("div");
|
||||
let ncat = 0;
|
||||
for (let category in highscore) {
|
||||
let catHigh = highscore[category];
|
||||
let catTeam = team[category] || 0;
|
||||
let catPct = catTeam / catHigh;
|
||||
let width = maxWidth * catPct;
|
||||
|
||||
let bar = document.createElement("span");
|
||||
bar.classList.add("category");
|
||||
bar.classList.add("cat" + ncat);
|
||||
bar.style.width = width + "%";
|
||||
bar.textContent = category + ": " + catTeam;
|
||||
bar.title = bar.textContent;
|
||||
|
||||
row.appendChild(bar);
|
||||
ncat += 1;
|
||||
}
|
||||
|
||||
let te = document.createElement("span");
|
||||
te.classList.add("teamname");
|
||||
te.textContent = teamnames[team.__hash__];
|
||||
row.appendChild(te);
|
||||
|
||||
element.appendChild(row);
|
||||
}
|
||||
var xhr = new XMLHttpRequest()
|
||||
xhr.onload = loaded;
|
||||
xhr.open("GET", url, true);
|
||||
xhr.responseType = "json";
|
||||
xhr.send();
|
||||
}
|
||||
|
||||
function scoreboard(element, continuous) {
|
||||
function update(state) {
|
||||
var teamnames = state["teams"];
|
||||
var pointslog = state["points"];
|
||||
var pointshistory = JSON.parse(localStorage.getItem("pointshistory")) || [];
|
||||
if (pointshistory.length >= 20){
|
||||
pointshistory.shift();
|
||||
}
|
||||
pointshistory.push(pointslog);
|
||||
localStorage.setItem("pointshistory", JSON.stringify(pointshistory));
|
||||
var highscore = {};
|
||||
var teams = {};
|
||||
|
||||
// Dole out points
|
||||
for (var i in pointslog) {
|
||||
var entry = pointslog[i];
|
||||
var timestamp = entry[0];
|
||||
var teamhash = entry[1];
|
||||
var category = entry[2];
|
||||
var points = entry[3];
|
||||
|
||||
var team = teams[teamhash] || {__hash__: teamhash};
|
||||
|
||||
// Add points to team's points for that category
|
||||
team[category] = (team[category] || 0) + points;
|
||||
|
||||
// Record highest score in a category
|
||||
highscore[category] = Math.max(highscore[category] || 0, team[category]);
|
||||
|
||||
teams[teamhash] = team;
|
||||
}
|
||||
|
||||
// Sort by team score
|
||||
function teamScore(t) {
|
||||
var score = 0;
|
||||
|
||||
for (var category in highscore) {
|
||||
score += (t[category] || 0) / highscore[category];
|
||||
}
|
||||
// XXX: This function really shouldn't have side effects.
|
||||
t.__score__ = score;
|
||||
return score;
|
||||
}
|
||||
function teamCompare(a, b) {
|
||||
return teamScore(a) - teamScore(b);
|
||||
}
|
||||
|
||||
var winners = [];
|
||||
for (var i in teams) {
|
||||
winners.push(teams[i]);
|
||||
}
|
||||
if (winners.length == 0) {
|
||||
// No teams!
|
||||
return;
|
||||
}
|
||||
winners.sort(teamCompare);
|
||||
winners.reverse();
|
||||
|
||||
// Clear out the element we're about to populate
|
||||
while (element.lastChild) {
|
||||
element.removeChild(element.lastChild);
|
||||
}
|
||||
|
||||
// Populate!
|
||||
var topActualScore = winners[0].__score__;
|
||||
|
||||
// (100 / ncats) * (ncats / topActualScore);
|
||||
var maxWidth = 100 / topActualScore;
|
||||
for (var i in winners) {
|
||||
var team = winners[i];
|
||||
var row = document.createElement("div");
|
||||
var ncat = 0;
|
||||
for (var category in highscore) {
|
||||
var catHigh = highscore[category];
|
||||
var catTeam = team[category] || 0;
|
||||
var catPct = catTeam / catHigh;
|
||||
var width = maxWidth * catPct;
|
||||
|
||||
var bar = document.createElement("span");
|
||||
bar.classList.add("category");
|
||||
bar.classList.add("cat" + ncat);
|
||||
bar.style.width = width + "%";
|
||||
bar.textContent = category + ": " + catTeam;
|
||||
bar.title = bar.textContent;
|
||||
|
||||
row.appendChild(bar);
|
||||
ncat += 1;
|
||||
}
|
||||
|
||||
var te = document.createElement("span");
|
||||
te.classList.add("teamname");
|
||||
te.textContent = teamnames[team.__hash__];
|
||||
row.appendChild(te);
|
||||
|
||||
element.appendChild(row);
|
||||
}
|
||||
}
|
||||
|
||||
function once() {
|
||||
loadJSON("points.json", update);
|
||||
}
|
||||
if (continuous) {
|
||||
setInterval(once, 60000);
|
||||
}
|
||||
once();
|
||||
function once() {
|
||||
fetch("points.json")
|
||||
.then(resp => {
|
||||
return resp.json();
|
||||
})
|
||||
.then(obj => {
|
||||
update(obj);
|
||||
})
|
||||
.catch(err => {
|
||||
console.log(err);
|
||||
});
|
||||
}
|
||||
|
||||
function init() {
|
||||
var sb = document.getElementById("scoreboard");
|
||||
scoreboard(sb, true);
|
||||
setInterval(once, 60000);
|
||||
once();
|
||||
}
|
||||
if (document.readyState === "loading") {
|
||||
document.addEventListener("DOMContentLoaded", init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
document.addEventListener("DOMContentLoaded", init);
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
|||
Loading…
Reference in New Issue