<!DOCTYPE html> <html> <head> <title>Scoreboard</title> <link rel="stylesheet" href="style.css" type="text/css"> <style> #info { max-width: 20em; position: absolute; opacity: 0.8; bottom: 1em; right: 10em; text-align: center; } </style> <script src="d3.js" async></script> <script src="scoreboard-llnl.js" async></script> <script> var type = "original"; var interval = 60000; function preinit() { type = "time"; interval = 60000; } function updateType(newType) { type = newType; init(); } function init() { var sb = document.getElementById("scoreboard"); scoreboard(sb, true, type, interval); window.addEventListener("resize", reScoreboardCaller); } var resizeCallback; function reScoreboardCaller() { if(resizeCallback) { clearInterval(resizeCallback); } resizeCallback = setInterval(reScoreboard, 400); } function reScoreboard() { clearInterval(resizeCallback); console.log("resizing"); var sb = document.getElementById("scoreboard"); scoreboard(sb, true, type, interval); } window.addEventListener("load", preinit); window.addEventListener("load", init); </script> </head> <body> <h1 id="title">Scoreboard</h1> <div id="scoreboard"></div> </body> </html>