Scoreboard changes:

* Consistent category colors
* Only show server URL when enabled
* HTML to display when there are no scores
This commit is contained in:
Neale Pickett 2023-11-16 22:18:16 -07:00
parent e4a8883f27
commit 610eb27430
5 changed files with 30 additions and 9 deletions

View File

@ -1,11 +1,12 @@
{
"TrackSolved": true,
"Scoreboard": {
"DisplayServerURL": true,
"DisplayServerURLWhenEnabled": true,
"ShowCategoryLeaders": true,
"ReplayHistory": true,
"ReplayFPS": 6,
"ReplayDurationMS": 2000,
"NoScoresHtml": "<div class='notification'><h2>~ no scores ~</h2></div>",
"": ""
},
"Messages": "<!-- Messages can go here (HTML) -->",

View File

@ -367,8 +367,8 @@ class State {
Devel: obj.Config.Devel,
}
/** True if the server is in enabled state */
this.Enabled = obj.Enabled
/** True if the server is in enabled state, or if we don't know */
this.Enabled = obj.Enabled ?? true
/** Map from Team ID to Team Name
* @type {Object.<string,string>}

View File

@ -18,6 +18,21 @@
text-decoration: underline;
}
.no-scores {
display: flex;
justify-content: space-around;
align-items: center;
flex-wrap: wrap;
min-height: calc(100vh - 2em);
}
.no-scores.hidden {
display: none;
}
.no-scores img {
object-fit: cover;
max-height: 60vh;
}
/** Scoreboard */
#rankings {
width: 100%;

View File

@ -5,12 +5,11 @@
<link rel="stylesheet" href="basic.css">
<link rel="stylesheet" href="scoreboard.css">
<meta name="viewport" content="width=device-width">
<script src="https://cdn.jsdelivr.net/npm/luxon@1.26.0"></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js@3.0.2"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-adapter-luxon@0.2.1"></script>
<link rel="icon" href="luna-moth.svg">
<script type="module" src="scoreboard.mjs"></script>
</head>
<body>
<div class="no-scores hidden"></div>
<div id="rankings"></div>
<div class="location"></div>
</body>

View File

@ -42,17 +42,18 @@ async function update() {
console.warn("config.json has empty Scoreboard section")
}
let state = await server.GetState()
for (let e of document.querySelectorAll(".location")) {
e.textContent = common.BaseURL
e.classList.toggle("hidden", !ScoreboardConfig.DisplayServerURL)
e.classList.toggle("hidden", !(ScoreboardConfig.DisplayServerURLWhenEnabled && state.Enabled))
}
let state = await server.GetState()
let rankingsElement = document.querySelector("#rankings")
let logSize = state.PointsLog.length
// Figure out the timing so that we can replay the scoreboard in about
// ReplayDurationMS, but no more than 24 frames per second.
// ReplayDurationMS.
let frameModulo = 1
let delay = 0
while (delay < (common.Second / ReplayFPS)) {
@ -110,6 +111,11 @@ async function update() {
}
await sleep(delay)
}
for (let e of document.querySelectorAll(".no-scores")) {
e.innerHTML = ScoreboardConfig.NoScoresHtml
e.classList.toggle("hidden", frame > 0)
}
}
function init() {