The Incredible Historical Replay Scoreboard

www/scoreboard.js

@@ -9,101 +9,148 @@ function loadJSON(url, callback) {
     xhr.send();
 }
 
+function scoreboardHistoryPush(pointslog) {
+    let pointsHistory = JSON.parse(localStorage.getItem("pointsHistory")) || [];
+    if (pointsHistory.length >= 20) {
+	pointsHistory.shift();
+    }
+    pointsHistory.push(pointslog);
+    localStorage.setItem("pointsHistory", JSON.stringify(pointsHistory));
+}
+
 function scoreboard(element, continuous) {
     function update(state) {
-		var teamnames = state["teams"];
+	let teamNames = state["teams"];
-		var pointslog = state["points"];
+	let 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
+        // Establish scores, calculate category maximums
-		for (var i in pointslog) {
+        let categories = {};
-			var entry = pointslog[i];
+        let maxPointsByCategory = {};
-			var timestamp = entry[0];
+        let totalPointsByTeamByCategory = {};
-			var teamhash = entry[1];
+        for (let entry of pointsLog) {
-			var category = entry[2];
+            let entryTimeStamp = entry[0];
-			var points = entry[3];
+            let entryTeamHash = entry[1];
+            let entryCategory = entry[2];
+            let entryPoints = entry[3];
 
-			var team = teams[teamhash] || {__hash__: teamhash};
+            // Populate list of all categories
+            categories[entryCategory] = entryCategory;
             
             // Add points to team's points for that category
-			team[category] = (team[category] || 0) + points;
+            let points = totalPointsByTeamByCategory[entryTeamHash] || {};
+            let categoryPoints = points[entryCategory] || 0;
+            categoryPoints += entryPoints;
+            points[entryCategory] = categoryPoints;
+            totalPointsByTeamByCategory[entryTeamHash] = points;
 
-			// Record highest score in a category
+            // Calculate maximum points scored in each category
-			highscore[category] = Math.max(highscore[category] || 0, team[category]);
+            let m = maxPointsByCategory[entryCategory] || 0;
-
+            maxPointsByCategory[entryCategory] = Math.max(m, categoryPoints);
-			teams[teamhash] = team;
         }
 
-		// Sort by team score
+        // Calculate overall scores
-		function teamScore(t) {
+        let overallScore = {};
+        let orderedOverallScores = [];
+	for (let teamHash in teamNames) {
 	    var score = 0;
-
+            for (let cat in categories) {
-			for (var category in highscore) {
+		var catPoints = totalPointsByTeamByCategory[teamHash][cat] || 0;
-				score += (t[category] || 0) / highscore[category];
+		if (catPoints > 0) {
+                    score += catPoints / maxPointsByCategory[cat];
 		}
-			// XXX: This function really shouldn't have side effects.
-			t.__score__ = score;
-			return score;
             }
-		function teamCompare(a, b) {
+            overallScore[teamHash] = score;
-			return teamScore(a) - teamScore(b);
+            orderedOverallScores.push([score, teamHash]);
         }
-
+        orderedOverallScores.sort();
-		var winners = [];
+	orderedOverallScores.reverse();
-		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!
+	// Set up scoreboard structure
-		var topActualScore = winners[0].__score__;
+	let spansByTeamByCategory = {};
+	for (let pair of orderedOverallScores) {
+	    let teamHash = pair[1];
+	    let teamName = teamNames[teamHash];
+	    let teamRow = document.createElement("div");
+	    let ncat = 0;
+	    spansByTeamByCategory[teamHash] = {};
+	    for (let cat in categories) {
+		let catSpan = document.createElement("span");
+		catSpan.classList.add("cat" + ncat);
+		catSpan.style.width = "0%";
+		catSpan.textContent = cat + ": 0";
 
-		// (100 / ncats) * (ncats / topActualScore);
+		spansByTeamByCategory[teamHash][cat] = catSpan;
-		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");
+		teamRow.appendChild(catSpan);
-				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__];
+	    te.textContent = teamName;
-			row.appendChild(te);
+	    teamRow.appendChild(te);
 
-			element.appendChild(row);
+	    element.appendChild(teamRow);
 	}
+
+	// How many categories are there?
+	var numCategories = 0;
+	for (var cat in categories) {
+	    numCategories += 1;
+	}
+
+	// Replay points log, displaying scoreboard at each step
+	let replayTimer = null;
+	let replayIndex = 0;
+	function replayStep(event) {
+	    if (replayIndex > pointsLog.length) {
+		clearInterval(replayTimer);
+		return;
+	    }
+
+	    // Replay log up until replayIndex
+	    let totalPointsByTeamByCategory = {};
+	    for (let index = 0; index < replayIndex; index += 1) {
+		let entry = pointsLog[index];
+		let entryTimeStamp = entry[0];
+		let entryTeamHash = entry[1];
+		let entryCategory = entry[2];
+		let entryPoints = entry[3];
+
+		// Add points to team's points for that category
+		let points = totalPointsByTeamByCategory[entryTeamHash] || {};
+		let categoryPoints = points[entryCategory] || 0;
+		categoryPoints += entryPoints;
+		points[entryCategory] = categoryPoints;
+		totalPointsByTeamByCategory[entryTeamHash] = points;
+	    }
+
+	    // Figure out everybody's score
+	    for (let teamHash in teamNames) {
+		for (let cat in categories) {
+		    let totalPointsByCategory = totalPointsByTeamByCategory[teamHash] || {};
+		    let points = totalPointsByCategory[cat] || 0;
+		    if (points > 0) {
+			let score = points / maxPointsByCategory[cat];
+			let span = spansByTeamByCategory[teamHash][cat];
+			let width = (100.0 / numCategories) * score;
+
+			span.style.width = width + "%";
+			span.textContent = cat + ": " + points;
+			span.title = span.textContent;
+		    }
+		}
+	    }
+
+	    replayIndex += 1;
+	}
+	replayStep();
+	replayTimer = setInterval(replayStep, 20);
     }
 
     function once() {