control via admin what players to show in monitor
This commit is contained in:
parent
2bf3d301e6
commit
893f3dc87b
3 changed files with 34 additions and 40 deletions
|
|
@ -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))
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue