control via admin what players to show in monitor

This commit is contained in:
ducklet 2021-02-04 00:04:03 +01:00
parent 2bf3d301e6
commit 893f3dc87b
3 changed files with 34 additions and 40 deletions

View file

@ -4,15 +4,7 @@
const location = document.location
const performance = window.performance
import {
Connection,
ms_ns,
node,
q,
s_ns,
session_id,
session_url,
} from "./shared.js"
import { Connection, ms_ns, node, q, s_ns, session_id, session_url } from "./shared.js"
let conn
@ -57,31 +49,28 @@ function test_prettynum() {
test_prettynum()
const player_list = q("#players")
function _redraw_clients(me, clients) {
if (!me) {
return
}
function _redraw_clients(clients, monitored) {
// Remove all gone players.
const client_ids = clients.map((c) => "" + c.id)
for (const el of player_list.querySelectorAll(".player")) {
if (!client_ids.includes(el.dataset.cid)) {
if (!monitored.includes(el.dataset.cid)) {
el.remove()
}
}
const player_tpl = q("template#player").content.firstElementChild
for (const c of clients) {
if (c.id === me.id) {
continue
}
for (const cid of monitored) {
const c = clients[cid] ?? {id: cid, name:'', points:0, tokens:0}
let player_el = q(`.player[data-cid='${c.id}']`)
if (!player_el) {
if (player_el) {
// Ensure the element is at the correct position.
player_list.appendChild(player_el)
} else {
player_el = node(player_tpl.cloneNode(true), {
data: { cid: c.id },
appendTo: player_list,
})
} else if (q(".points", player_el).textContent !== prettynum(c.points)) {
}
if (q(".points", player_el).textContent !== prettynum(c.points)) {
q(".points.fg", player_el).classList.add("big")
q(".points.bg", player_el).classList.add("big")
setTimeout(() => {
@ -135,8 +124,9 @@ function highlight(client_id, until_ns) {
}
function setup_ws() {
let clients = [],
me
let clients = {},
me,
monitored = []
const sid = session_id()
conn = new Connection()
conn.on("helo", () => {
@ -144,7 +134,6 @@ function setup_ws() {
})
conn.on("id", ({ value }) => {
me = value
redraw_clients(me, clients)
})
conn.on("buzz", ({ value }) => {
const { time: buzztime_ns, client: client_id } = value
@ -153,20 +142,18 @@ function setup_ws() {
highlight(client_id, until_ns)
})
conn.on("clients", ({ value }) => {
clients = value.clients
redraw_clients(me, clients)
clients = Object.fromEntries(value.clients.map((c) => [c.id, c]))
redraw_clients(clients, monitored)
})
conn.on("client", ({ value: { client } }) => {
const idx = clients.findIndex((c) => c.id === client.id)
if (idx >= 0) {
clients[idx] = client
} else {
clients.push(client)
}
redraw_clients(me, clients)
clients[client.id] = client
redraw_clients(clients, monitored)
})
conn.on("control", ({ value }) => {
// ...
conn.on("control", ({ value: {payload: {action, targets}} }) => {
if (action === 'monitor' && Array.isArray(targets)) {
monitored = targets
redraw_clients(clients, monitored)
}
})
conn.connect(session_url(sid))
}