diff options
Diffstat (limited to 'client-web/source/menu.ts')
| -rw-r--r-- | client-web/source/menu.ts | 27 |
1 files changed, 15 insertions, 12 deletions
diff --git a/client-web/source/menu.ts b/client-web/source/menu.ts index 7bb5b43..583f28b 100644 --- a/client-web/source/menu.ts +++ b/client-web/source/menu.ts @@ -5,12 +5,13 @@ */ /// <reference lib="dom" /> -import { ebutton, ediv, efooter, einput, elabel, enav, ep } from "./helper.ts" +import { e } from "./helper.ts" import { VERSION } from "./index.ts" import { ui_preferences } from "./preferences/ui.ts" import { create_file_res } from "./resource/file.ts"; import { create_camera_res, create_mic_res, create_screencast_res } from "./resource/track.ts"; import { Room } from "./room.ts" +import { ui_room_watches } from "./room_watches.ts"; export function info_br() { const item = (name: string, cb: (() => void) | string) => { @@ -25,8 +26,8 @@ export function info_br() { return p } - return efooter({ class: "info-br" }, - ep(`keks-meet ${VERSION}`, { class: "version" }), + return e("footer", { class: "info-br" }, + e("p", { class: "version" }, `keks-meet ${VERSION}`), item("License", "https://codeberg.org/metamuffin/keks-meet/raw/branch/master/COPYING"), item("Source code", "https://codeberg.org/metamuffin/keks-meet"), item("Documentation", "https://codeberg.org/metamuffin/keks-meet/src/branch/master/readme.md"), @@ -36,24 +37,26 @@ export function info_br() { export let chat_control: (s?: boolean) => void; export function control_bar(room: Room, side_ui_container: HTMLElement): HTMLElement { - const leave = ebutton("Leave", { class: "leave", onclick() { window.location.href = "/" } }) + const leave = e("button", { class: "leave", onclick() { window.location.href = "/" } }, "Leave") const chat = side_ui(side_ui_container, room.chat.element, "Chat") const prefs = side_ui(side_ui_container, ui_preferences(), "Settings") + const rwatches = side_ui(side_ui_container, ui_room_watches(), "Known Rooms") const local_controls = [ //ediv({ class: "local-controls", aria_label: "local resources" }, - ebutton("Microphone", { onclick: () => room.local_user.await_add_resource(create_mic_res()) }), - ebutton("Camera", { onclick: () => room.local_user.await_add_resource(create_camera_res()) }), - ebutton("Screen", { onclick: () => room.local_user.await_add_resource(create_screencast_res()) }), - ebutton("File", { onclick: () => room.local_user.await_add_resource(create_file_res()) }), + e("button", { onclick: () => room.local_user.await_add_resource(create_mic_res()) }, "Microphone"), + e("button", { onclick: () => room.local_user.await_add_resource(create_camera_res()) }, "Camera"), + e("button", { onclick: () => room.local_user.await_add_resource(create_screencast_res()) }, "Screen"), + e("button", { onclick: () => room.local_user.await_add_resource(create_file_res()) }, "File"), ] chat_control = chat.set_state; - return enav({ class: "control-bar" }, leave, chat.el, prefs.el, ...local_controls) + return e("nav", { class: "control-bar" }, leave, chat.el, prefs.el, rwatches.el, ...local_controls) } export interface SideUI { el: HTMLElement, set_state: (s?: boolean) => void } export function side_ui(container: HTMLElement, content: HTMLElement, label: string): SideUI { // TODO: close other side uis - const tray = ediv({ class: "side-tray" }, content) - const checkbox = einput("checkbox", { + const tray = e("div", { class: "side-tray" }, content) + const checkbox = e("input", { + type: "checkbox", onchange: () => { if (checkbox.checked) { tray.classList.add("animate-in") @@ -69,7 +72,7 @@ export function side_ui(container: HTMLElement, content: HTMLElement, label: str } }) return { - el: elabel(label, { class: "side-ui-control" }, checkbox), + el: e("label", { class: "side-ui-control" }, label, checkbox), set_state(s) { checkbox.checked = s ?? !checkbox.checked; if (checkbox.onchange) checkbox.onchange(undefined as unknown as Event) } } } |