diff options
Diffstat (limited to 'client-web/source')
-rw-r--r-- | client-web/source/helper.ts | 25 | ||||
-rw-r--r-- | client-web/source/local_user.ts | 7 | ||||
-rw-r--r-- | client-web/source/preferences.ts | 16 | ||||
-rw-r--r-- | client-web/source/protocol/mod.ts | 6 | ||||
-rw-r--r-- | client-web/source/room.ts | 17 |
5 files changed, 60 insertions, 11 deletions
diff --git a/client-web/source/helper.ts b/client-web/source/helper.ts index ef95e3a..c277c0d 100644 --- a/client-web/source/helper.ts +++ b/client-web/source/helper.ts @@ -4,3 +4,28 @@ export function hex_id(len = 8): string { if (len > 8) return hex_id() + hex_id(len - 8) return Math.floor(Math.random() * 16 ** len).toString(16).padStart(len, "0") } + +const elem = (s: string) => document.createElement(s) +const elem_with_content = (s: string) => (c: string) => { + const e = elem(s) + e.textContent = c + return e +} +const elem_with_children = (s: string) => (opts: { classes?: string[] }, ...cs: (HTMLElement | string)[]) => { + const e = elem(s) + if (opts.classes) e.classList.add(...opts.classes) + for (const c of cs) { + e.append(c) + } + return e +} + +export const ep = elem_with_content("p") +export const eh1 = elem_with_content("h1") +export const eh2 = elem_with_content("h2") +export const eh3 = elem_with_content("h3") +export const eh4 = elem_with_content("h4") +export const eh5 = elem_with_content("h5") +export const eh6 = elem_with_content("h6") +export const ediv = elem_with_children("div") + diff --git a/client-web/source/local_user.ts b/client-web/source/local_user.ts index 85a2a23..bb5b779 100644 --- a/client-web/source/local_user.ts +++ b/client-web/source/local_user.ts @@ -69,17 +69,20 @@ export class LocalUser extends User { document.body.append(el) } - async create_camera_track() { log("media", "requesting user media (camera)") - const user_media = await window.navigator.mediaDevices.getUserMedia({ video: true }) + const user_media = await window.navigator.mediaDevices.getUserMedia({ + video: { facingMode: { ideal: PREFS.camera_facing_mode } } + }) return new TrackHandle(user_media.getVideoTracks()[0], true) } + async create_screencast_track() { log("media", "requesting user media (screen)") const user_media = await window.navigator.mediaDevices.getDisplayMedia({ video: true }) return new TrackHandle(user_media.getVideoTracks()[0], true) } + async create_mic_track() { log("media", "requesting user media (audio)") const audio_contraints = PREFS.rnnoise ? { diff --git a/client-web/source/preferences.ts b/client-web/source/preferences.ts index e7fc7bb..63efeb2 100644 --- a/client-web/source/preferences.ts +++ b/client-web/source/preferences.ts @@ -1,9 +1,12 @@ +import { hex_id } from "./helper.ts"; export interface PrefDecl<T> { name: string, - default: T + default: T, + type?: Type, description: string, possible_values?: T[] + optional?: boolean, } type Type = "string" | "number" | "bigint" | "boolean" | "symbol" | "undefined" | "object" | "function"; @@ -13,7 +16,9 @@ export function register_prefs<T extends Record<string, PrefDecl<unknown>>>(ds: const p: PrefMap<T> = {} as PrefMap<T> for (const key in ds) { const d = ds[key]; - let value = get_param(d.default, d.name) ?? d.default; + let type = typeof d.default; + if (type == "undefined") { if (d.type) type = d.type; else throw new Error("type needed"); } + let value = get_param(type, d.name) ?? d.default; if (d.possible_values) if (!d.possible_values.includes(value)) value = d.default p[key] = value } @@ -31,10 +36,9 @@ export function load_query_params(): { [key: string]: string } { return q } -export function get_param<T>(example: T, key: string): T | undefined { +export function get_param<T>(ty: string, key: string): T | undefined { const v = raw_params[key] if (v == undefined) return undefined - const ty = typeof example if (ty == "string") return v as unknown as T else if (ty == "number") { const n = parseInt(v) @@ -50,14 +54,14 @@ export function get_param<T>(example: T, key: string): T | undefined { return undefined } - const PREF_DECLS = { rnnoise: { name: "rnnoise", default: true, description: "Use RNNoise for noise suppression" }, native_noise_suppression: { name: "native_noise_suppression", default: false, description: "Suggest the browser to do noise suppression" }, - username: { name: "username", default: "guest", description: "Username" }, + username: { name: "username", default: "guest-" + hex_id(), description: "Username" }, microphone_gain: { name: "microphone_gain", default: 1, description: "Amplify microphone volume" }, microphone_enabled: { name: "microphone_enabled", default: false, description: "Add one microphone track on startup" }, camera_enabled: { name: "camera_enabled", default: false, description: "Add one camera track on startup" }, screencast_enabled: { name: "screencast_enabled", default: false, description: "Add one screencast track on startup" }, + camera_facing_mode: { name: "camera_facing_mode", default: undefined as undefined | string, type: "string" as const, possible_values: ["environment", "user", undefined], description: "Prefer user-facing or env-facing camera" } } export const PREFS = register_prefs(PREF_DECLS) diff --git a/client-web/source/protocol/mod.ts b/client-web/source/protocol/mod.ts new file mode 100644 index 0000000..76b1290 --- /dev/null +++ b/client-web/source/protocol/mod.ts @@ -0,0 +1,6 @@ + +export class SignalingConnection { + constructor(room: string) { + + } +} diff --git a/client-web/source/room.ts b/client-web/source/room.ts index c22a956..78454bb 100644 --- a/client-web/source/room.ts +++ b/client-web/source/room.ts @@ -5,7 +5,8 @@ import { RemoteUser } from "./remote_user.ts"; import { User } from "./user.ts"; import { LocalUser } from "./local_user.ts"; import { ServerboundPacket, ClientboundPacket } from "../../common/packets.d.ts"; - +import { PREFS } from "./preferences.ts"; +import { ep } from "./helper.ts"; export class Room { el: HTMLElement @@ -20,9 +21,19 @@ export class Room { this.name = name this.el = document.createElement("div") this.el.classList.add("room") - this.websocket = new WebSocket(`${window.location.protocol.endsWith("s:") ? "wss" : "ws"}://${window.location.host}/${encodeURIComponent(name)}/signaling`) + + const ws_url = new URL(`${window.location.protocol.endsWith("s:") ? "wss" : "ws"}://${window.location.host}/${encodeURIComponent(name)}/signaling`) + ws_url.searchParams.set("username", PREFS.username) + this.websocket = new WebSocket(ws_url) this.websocket.onclose = () => this.websocket_close() - this.websocket.onopen = () => this.websocket_open() + + // const connecting_text = ep("Upgrading to a websocket connection…") + // this.el.append(connecting_text) + + this.websocket.onopen = () => { + // connecting_text.remove() + this.websocket_open() + } this.websocket.onmessage = (ev) => { this.websocket_message(JSON.parse(ev.data)) } |