diff options
Diffstat (limited to 'client-web/source/resource/mod.ts')
-rw-r--r-- | client-web/source/resource/mod.ts | 78 |
1 files changed, 54 insertions, 24 deletions
diff --git a/client-web/source/resource/mod.ts b/client-web/source/resource/mod.ts index 948ccc2..716d42b 100644 --- a/client-web/source/resource/mod.ts +++ b/client-web/source/resource/mod.ts @@ -6,54 +6,84 @@ /// <reference lib="dom" /> import { ProvideInfo } from "../../../common/packets.d.ts" -import { ediv } from "../helper.ts" -import { log } from "../logger.ts" +import { ediv } from "../helper.ts"; +import { TrackHandle } from "../track_handle.ts"; +import { LocalUser } from "../user/local.ts"; import { User } from "../user/mod.ts" import { RemoteUser } from "../user/remote.ts" -import { TrackResource } from "./track.ts" +import { TrackResource } from "./track.ts"; -export type ChannelState = "running" | "disconnected" - -export abstract class Resource { +export type ChannelState = "enabled" | "await_enable" | "disabled" | "await_disable" +export abstract class Resource extends EventTarget { + local: boolean el: HTMLElement = ediv({ class: ["channel"] }) - on_destroy = () => { } + inner_el?: HTMLElement constructor( public user: User, public info: ProvideInfo, ) { - setTimeout(() => this.update_el(), 0) + super() + this.local = this.user instanceof LocalUser + const button = document.createElement("button") + button.onclick = () => { + this.state == "enabled" ? this.request_stop() : this.request() + } + this.addEventListener("statechange", () => { + if (this.user instanceof LocalUser) button.textContent = "End", button.disabled = false + else if (this.state == "enabled") button.textContent = "Disable", button.disabled = false + else if (this.state == "disabled") button.textContent = `Enable ${this.info.kind}`, button.disabled = false + else button.textContent = "Working…", button.disabled = true; + }) + this.dispatchEvent(new CustomEvent("statechange")) + this.el.append(button) } - private _state: ChannelState = "disconnected" + static create(user: User, info: ProvideInfo): Resource { + if (info.kind == "audio" || info.kind == "video") return new TrackResource(user, info) + else throw new Error("blub"); + } + + private _state: ChannelState = "disabled" get state() { return this._state } set state(value: ChannelState) { const old_value = this._state this._state = value - if (value != old_value) this.update_el() + if (value != old_value) this.dispatchEvent(new CustomEvent("statechange")) } - destroy() { this.on_destroy() } + private _track?: TrackHandle + get track() { return this._track } + set track(value: TrackHandle | undefined) { + const handle_end = () => { + this.track = undefined + this.state = "disabled" + this.inner_el?.remove() + if (this.user instanceof LocalUser) this.destroy() + } + this._track?.removeEventListener("ended", handle_end) + this._track = value + if (value) this.el.append(this.inner_el = this.on_track(value)) + if (value) this.state = "enabled" + else this.state = "disabled" + this._track?.addEventListener("ended", handle_end) + } - abstract create_element(): HTMLElement + abstract on_track(_track: TrackHandle): HTMLElement - static create(user: User, info: ProvideInfo): Resource | undefined { - if (info.kind == "audio" || info.kind == "video") return new TrackResource(user, info) - if (info.kind == "file") throw new Error(""); - log({ scope: "media", warn: true }, "unknown resource kind") - } + destroy() { this.dispatchEvent(new CustomEvent("destroy")) } request() { if (!(this.user instanceof RemoteUser)) return + this.state = "await_enable" this.user.send_to({ request: { id: this.info.id } }) } request_stop() { - if (!(this.user instanceof RemoteUser)) return - this.user.send_to({ request_stop: { id: this.info.id } }) - } - - update_el() { - this.el.innerHTML = "" - this.el.append(this.create_element()) + if (this.user instanceof RemoteUser) { + this.state = "await_disable" + this.user.send_to({ request_stop: { id: this.info.id } }) + } else if (this.user instanceof LocalUser) { + this.destroy() + } } } |