diff options
Diffstat (limited to 'client-web/source/user')
-rw-r--r-- | client-web/source/user/local.ts | 1 | ||||
-rw-r--r-- | client-web/source/user/mod.ts | 5 | ||||
-rw-r--r-- | client-web/source/user/remote.ts | 38 |
3 files changed, 30 insertions, 14 deletions
diff --git a/client-web/source/user/local.ts b/client-web/source/user/local.ts index a1d43bd..a2a2908 100644 --- a/client-web/source/user/local.ts +++ b/client-web/source/user/local.ts @@ -21,6 +21,7 @@ export class LocalUser extends User { constructor(room: Room, id: number) { super(room, id) this.el.classList.add("local") + this.status_el.textContent = "Local" this.name = PREFS.username log("usermodel", `added local user: ${this.display_name}`) this.add_initial_tracks() diff --git a/client-web/source/user/mod.ts b/client-web/source/user/mod.ts index 67b3cd5..267c216 100644 --- a/client-web/source/user/mod.ts +++ b/client-web/source/user/mod.ts @@ -15,6 +15,7 @@ export class User { get display_name() { return this.name ?? "Unknown" } name_el = e("span", {}, this.display_name) + status_el = e("span", { class: ["connection-status", "status-neutral"] }, "") stats_el = e("pre", {}) el = e("div", { class: "user" }) @@ -22,8 +23,8 @@ export class User { const info_el = e("div", { class: "info" }) this.name_el.textContent = this.display_name this.name_el.classList.add("name") - info_el.append(this.name_el, this.stats_el) + info_el.append(this.name_el, this.stats_el, this.status_el) this.el.append(info_el) room.element.append(this.el) } -}
\ No newline at end of file +} diff --git a/client-web/source/user/remote.ts b/client-web/source/user/remote.ts index b1b7fb4..bfae1c5 100644 --- a/client-web/source/user/remote.ts +++ b/client-web/source/user/remote.ts @@ -32,7 +32,7 @@ export class RemoteUser extends User { if (!ev.candidate) return room.signaling.send_relay({ ice_candidate: ev.candidate.toJSON() }, this.id) log("webrtc", `ICE candidate set`, ev.candidate) - this.update_stats() + this.update_status() } this.pc.ontrack = ev => { const t = ev.track @@ -45,7 +45,7 @@ export class RemoteUser extends User { ev.transceiver.stop() }) log("media", `remote track: ${this.display_name}`, t) - this.update_stats() + this.update_status() } this.pc.ondatachannel = ({ channel }) => { const id = channel.label @@ -56,23 +56,23 @@ export class RemoteUser extends User { channel.close() }) log("media", `remote channel: ${this.display_name}`, channel) - this.update_stats() + this.update_status() } this.pc.onnegotiationneeded = () => { log("webrtc", `negotiation needed: ${this.display_name}`) // if (this.pc.signalingState != "stable") return this.offer() - this.update_stats() + this.update_status() } this.pc.onicecandidateerror = () => { log({ scope: "webrtc", warn: true }, "ICE error") - this.update_stats() + this.update_status() } - this.pc.oniceconnectionstatechange = () => { this.update_stats() } - this.pc.onicegatheringstatechange = () => { this.update_stats() } - this.pc.onsignalingstatechange = () => { this.update_stats() } - this.pc.onconnectionstatechange = () => { this.update_stats() } - this.update_stats() + this.pc.oniceconnectionstatechange = () => { this.update_status() } + this.pc.onicegatheringstatechange = () => { this.update_status() } + this.pc.onsignalingstatechange = () => { this.update_status() } + this.pc.onconnectionstatechange = () => { this.update_status() } + this.update_status() } leave() { log("usermodel", `remove remote user: ${this.display_name}`) @@ -132,7 +132,7 @@ export class RemoteUser extends User { add_ice_candidate(candidate: RTCIceCandidateInit) { this.pc.addIceCandidate(new RTCIceCandidate(candidate)) - this.update_stats() + this.update_status() } async offer() { this.negotiation_busy = true @@ -162,7 +162,21 @@ export class RemoteUser extends User { this.negotiation_busy = false } - async update_stats() { + async update_status() { + + const states: { [key in RTCIceConnectionState]: [string, string] } = { + new: ["Not connected", "neutral"], + checking: ["Checking...", "neutral"], + failed: ["Connection failed", "fail"], + closed: ["Disconnected", "neutral"], + completed: ["Connected", "good"], + connected: ["Connected", "good"], + disconnected: ["Disconnected", "neutral"] + } + this.status_el.classList.value = "" + this.status_el.classList.add("connection-status", "status-" + states[this.pc.iceConnectionState][1]) + this.status_el.textContent = states[this.pc.iceConnectionState][0] + if (!PREFS.webrtc_debug) return try { const stats = await this.pc.getStats() |