From 645b4cb35f3c128a4325e62a8a58078f0506b278 Mon Sep 17 00:00:00 2001
From: metamuffin <metamuffin@disroot.org>
Date: Fri, 16 Sep 2022 22:40:46 +0200
Subject: fix ui and css

---
 client-web/source/resource/track.ts | 68 ++++++++++++++++---------------------
 1 file changed, 30 insertions(+), 38 deletions(-)

(limited to 'client-web/source/resource/track.ts')

diff --git a/client-web/source/resource/track.ts b/client-web/source/resource/track.ts
index b2f73ab..a14525b 100644
--- a/client-web/source/resource/track.ts
+++ b/client-web/source/resource/track.ts
@@ -31,49 +31,41 @@ export class TrackResource extends Resource {
         super.destroy()
     }
 
-    // TODO --- all the following code could be more generic and prettier in the UI ---
-
-    create_preview(): HTMLElement {
-        return ebutton(`Enable ${this.info.kind}`, {
-            onclick: (e) => {
-                (e as HTMLButtonElement).disabled = true;
-                this.request()
-            }
-        })
-    }
     create_element() {
-        if (!this.track) { return this.create_preview() }
         const el = document.createElement("div")
-        el.append(ebutton(`Enable ${this.info.kind}`, {
-            onclick: (e) => {
-                (e as HTMLButtonElement).disabled = true;
-                this.request_stop()
-            }
-        }))
-
-        const is_video = this.track.kind == "video"
-        const media_el = is_video ? document.createElement("video") : document.createElement("audio")
-        const stream = new MediaStream([this.track.track])
-        media_el.srcObject = stream
-        media_el.classList.add("media")
-        media_el.autoplay = true
-        media_el.controls = true
-        if (this.track.local) media_el.muted = true
-        el.append(media_el)
+        if (!this.track?.local) {
+            el.append(ebutton(`${this.track ? "Disable" : "Enable"} ${this.info.kind}`, {
+                onclick: (e) => {
+                    (e as HTMLButtonElement).disabled = true;
+                    this.track ? this.request_stop() : this.request()
+                }
+            }))
+        }
+        if (this.track) {
+            const is_video = this.track.kind == "video"
+            const media_el = is_video ? document.createElement("video") : document.createElement("audio")
+            const stream = new MediaStream([this.track.track])
+            media_el.srcObject = stream
+            media_el.classList.add("media")
+            media_el.autoplay = true
+            media_el.controls = true
+            if (this.track.local) media_el.muted = true
+            el.append(media_el)
 
-        if (this.track.local) {
-            const end_button = document.createElement("button")
-            end_button.textContent = "End"
-            end_button.addEventListener("click", () => {
-                this.track?.end()
+            if (this.track.local) {
+                const end_button = document.createElement("button")
+                end_button.textContent = "End"
+                end_button.addEventListener("click", () => {
+                    this.track?.end()
+                })
+                el.append(end_button)
+            }
+            this.el.append(el)
+            this.track.addEventListener("ended", () => {
+                media_el.srcObject = null // TODO
+                el.remove()
             })
-            el.append(end_button)
         }
-        this.el.append(el)
-        this.track.addEventListener("ended", () => {
-            media_el.srcObject = null // TODO
-            el.remove()
-        })
         return el
     }
 }
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2