diff options
| -rw-r--r-- | web/script/player/sync.ts | 20 |
1 files changed, 17 insertions, 3 deletions
diff --git a/web/script/player/sync.ts b/web/script/player/sync.ts index 3c5e3a2..cc027f1 100644 --- a/web/script/player/sync.ts +++ b/web/script/player/sync.ts @@ -28,7 +28,12 @@ export function playersync_controls(sync_state: OVar<undefined | Playersync>, pl navigator.clipboard.writeText(channel_name_copy.value) } }) - )) + ), + e("h4", "Users"), + sync.users.map(users => + e("ul", ...[...users.keys()].map(u => e("li", u))) + ) + ) : e("div", channel_name = e("input", { type: "text", placeholder: "someroom:example.org" }), e("button", "Join", { @@ -64,6 +69,7 @@ export class Playersync { private on_destroy: (() => void)[] = [] public name: string + public users = new OVar(new Map<string, null>()) private cancel_pers: undefined | (() => void) set_pers(s?: string) { @@ -105,8 +111,16 @@ export class Playersync { } if (packet.playing === true) this.player.play() if (packet.playing === false) this.player.pause() - if (packet.join) this.logger.log(`${packet.join} joined.`) - if (packet.leave) this.logger.log(`${packet.leave} left.`) + if (packet.join) { + this.logger.log(`${packet.join} joined.`) + this.users.value.set(packet.join, null) + this.users.change() + } + if (packet.leave) { + this.logger.log(`${packet.leave} left.`) + this.users.value.delete(packet.leave) + this.users.change() + } } let cb: () => void |