polish + menu

author: metamuffin <metamuffin@yandex.com> 2022-01-25 20:58:57 +0100
committer: metamuffin <metamuffin@yandex.com> 2022-01-25 20:58:57 +0100
commit: 8cc5a50b91a3d80b28b03191b246974d3aca9bf8 (patch)
tree: c737af828efe2e1750b5fadc140237737026081d
parent: a22bdc3821bd53d8e3b198423db3f8d7e8e579f6 (diff)
download: keks-meet-8cc5a50b91a3d80b28b03191b246974d3aca9bf8.tar
keks-meet-8cc5a50b91a3d80b28b03191b246974d3aca9bf8.tar.bz2
keks-meet-8cc5a50b91a3d80b28b03191b246974d3aca9bf8.tar.zst
9 files changed, 90 insertions, 37 deletions
diff --git a/LICENCE b/LICENCE
index fa3ed5e..33724bb 100644
--- a/LICENCE
+++ b/LICENCE
@@ -1,5 +1,5 @@
-keks-meet - a webrtc powered online conference application
-Copyright (C) 2021 metamuffin
+keks-meet - a online conference application
+Copyright (C) 2022 metamuffin
 
 This program is free software: you can redistribute it and/or modify
 it under the terms of the GNU Affero General Public License as
diff --git a/README.md b/README.md
index 5da3720..065780b 100644
--- a/README.md
+++ b/README.md
@@ -1,20 +1,22 @@
 # keks-meet
 
-A simple webrtc powered conference application
+a online conference application
 
 ## Parameters
 
-For configuration just add a set of the following options as query parameters to the URL (e.g. `/room/asdfg?username=bob`).
+For configuration just add a set of the following options as query parameters to the URL (e.g. `/room/asdfg#username=bob`).
+Note that the page wont automatically reload if the 
 
 Booleans can be either `1`, `true`, `yes` or their opposites.
 
-| Option name     | Type    | Default | Description                            |
-| --------------- | ------- | ------- | -------------------------------------- |
-| `username`      | string  | "guest" | Sets the username                      |
-| `rnnoise`       | boolean | true    | Enables noise suppression with rnnoise |
-| `audio_enabled` | boolean | false   | Enables audio transmission by default  |
-| `camera_enabled` | boolean | false   | Enables video transmission by default  |
-| `mic_gain`      | number  | 1       | Sets the microphone volume             |
+| Option name      | Type    | Default | Description                              |
+| ---------------- | ------- | ------- | ---------------------------------------- |
+| `username`       | string  | "guest" | Sets the username                        |
+| `rnnoise`        | boolean | true    | Enables noise suppression with rnnoise   |
+| `mic_enabled`    | boolean | false   | Adds audio track on startup              |
+| `camera_enabled` | boolean | false   | Adds camera track on startup             |
+| `screen_enabled` | boolean | false   | Adds screen track on startup (wont work) |
+| `mic_gain`       | number  | 1       | Sets the microphone volume               |
 
 ## Licence
 
diff --git a/public/index.html b/public/index.html
index 1ab2bee..ded060a 100644
--- a/public/index.html
+++ b/public/index.html
@@ -7,8 +7,14 @@
     <script defer async type="module" src="/bundle.js"></script>
     <link rel="stylesheet" href="/style/master.css" />
 
-    <title>keks webrtc meeting</title>
+    <title>keks-meet</title>
   </head>
 
-  <body></body>
+  <body>
+    <p>
+      keks-meet needs evil javascript to enabled. Don't be afraid though, all
+      the code is free (AGPL-3.0-only)! Look at it on
+      <a href="https://codeberg.org/metamuffin/keks-meet">codeberg</a>
+    </p>
+  </body>
 </html>
diff --git a/public/style/master.css b/public/style/master.css
index 89c0e4a..f148d06 100644
--- a/public/style/master.css
+++ b/public/style/master.css
@@ -85,17 +85,6 @@ input[type="text"] {
   text-decoration: underline;
 }
 
-.info .status {
-  background-color: var(--bg-disabled);
-  padding: 0.25em;
-  margin: 0.1em;
-  border: 0px solid transparent;
-  border-radius: 10px;
-}
-.info .status.enabled {
-  background-color: var(--bg-enabled);
-}
-
 .media {
   max-height: 30vh;
   width: auto;
@@ -116,3 +105,12 @@ input[type="text"] {
   margin: 0.5em;
   font-size: 32px;
 }
+
+.menu-overlay {
+  position: absolute;
+  bottom: 0px;
+  right: 0px;
+  display: block;
+  text-align: right;
+}
+
diff --git a/source/client/helper.ts b/source/client/helper.ts
index 37da7b9..31e500a 100644
--- a/source/client/helper.ts
+++ b/source/client/helper.ts
@@ -4,7 +4,7 @@ import { parameters } from "./index.ts"
 
 export function get_query_params(): { [key: string]: string } {
     const q: { [key: string]: string } = {}
-    for (const kv of window.location.search.substring(1).split("&")) {
+    for (const kv of window.location.hash.substring(1).split("&")) {
         const [key, value] = kv.split("=")
         q[decodeURIComponent(key)] = decodeURIComponent(value)
     }
@@ -41,4 +41,3 @@ export function parameter_string(name: string, def: string): string {
     if (!v) return def
     return v
 }
-
diff --git a/source/client/index.ts b/source/client/index.ts
index 16118a6..d3c3fcc 100644
--- a/source/client/index.ts
+++ b/source/client/index.ts
@@ -2,6 +2,7 @@
 
 import { get_query_params } from "./helper.ts"
 import { log } from "./logger.ts"
+import { create_menu } from "./menu.ts";
 import { Room } from "./room.ts"
 
 export const servers: RTCConfiguration = {
@@ -19,31 +20,40 @@ export const parameters = get_query_params()
 window.onload = () => main()
 
 export function main() {
+    document.body.querySelector("p")?.remove()
     log("*", "starting up")
     if (window.location.pathname.startsWith("/room/")) {
         const room_name = window.location.pathname.substring("/room/".length)
         const room = new Room(room_name)
+        create_menu(room)
         document.body.append(room.el)
     } else {
+        create_menu()
         document.body.append(create_start_screen())
     }
 }
 
 function create_start_screen() {
-    const el = document.createElement("div")
-    const header = document.createElement("h2")
-    header.textContent = "keks meet"
-    const para = document.createElement("p")
-    para.textContent = "Hier kann man dann irgendwann mal sinnvollen text hinschreiben..."
+    const with_text_content = (a: string) => (b: string) => {
+        const e = document.createElement(a)
+        e.textContent = b
+        return e
+    }
+    const p = with_text_content("p")
+    const h2 = with_text_content("h2")
 
-    // const room_input_label = document.createElement("label")
-    // room_input_label.textContent = "Room ID: "
-    // room_input_label.htmlFor = "room-id-input"
+    const el = document.createElement("div")
+    el.append(
+        h2("keks-meet"),
+        p("A web conferencing application using webrtc"),
+        p("keks-meet is free! It is licenced under the terms of the third version of the GNU Affero General Public Licence only."),
+        p("To get started, just enter a unique idenfier, then share the URL with your partner.")
+    )
 
     const room_input = document.createElement("input")
     room_input.type = "text"
     room_input.id = "room-id-input"
-    room_input.placeholder = "room id "
+    room_input.placeholder = "room id"
 
     const submit = document.createElement("input")
     submit.type = "button"
@@ -54,6 +64,7 @@ function create_start_screen() {
     submit.value = "Join room"
 
     el.classList.add("start-box")
-    el.append(header, para, room_input, document.createElement("br"), submit)
+    el.append(room_input, document.createElement("br"), submit)
+
     return el
 }
diff --git a/source/client/logger.ts b/source/client/logger.ts
index 1f7139c..e00b1d0 100644
--- a/source/client/logger.ts
+++ b/source/client/logger.ts
@@ -7,6 +7,7 @@ const log_tag_color = {
     ws: "#44FFFF",
     rnnoise: "#2222FF",
     usermodel: "#44FF44",
+    error: "#FF0000",
 }
 export type LogTag = keyof typeof log_tag_color
 
@@ -29,7 +30,7 @@ export function log(tag: LogTag, message: string, ...data: any[]) {
         logger_container.append(e)
         setTimeout(() => {
             e.remove()
-        }, 6000)
+        }, tag == "error" ? 60000 : 6000)
     }
 }
 
@@ -42,3 +43,8 @@ globalThis.addEventListener("load", () => {
     // clear the console every hour so logs dont accumulate
     setInterval(() => console.clear(), 1000 * 60 * 60)
 })
+
+globalThis.onerror = (_ev, source, line, col, err) => {
+    log("error", `${err?.name} ${err?.message}`, err)
+    log("error", `on ${source}:${line}:${col}`, err)
+}
+\ No newline at end of file
diff --git a/source/client/menu.ts b/source/client/menu.ts
new file mode 100644
index 0000000..1401b42
--- /dev/null
+++ b/source/client/menu.ts
@@ -0,0 +1,26 @@
+import { Room } from "./room.ts";
+
+export function create_menu(room?: Room) {
+    const menu = document.createElement("div")
+    menu.classList.add("menu-overlay")
+    document.body.append(menu)
+
+    const item = (name: string, cb: (() => void) | string) => {
+        const p = document.createElement("p")
+        const a = document.createElement("a")
+        a.classList.add("menu-item")
+        a.textContent = name
+        if (typeof cb == "string") a.href = cb
+        else a.addEventListener("click", cb), a.href = "#"
+        p.append(a)
+        return p
+    }
+
+    if (room) menu.append(
+        item("Settings", () => alert("todo, refer to the url parameters in the docs for now"))
+    )
+    menu.append(
+        item("Licence", "/licence"),
+        item("Sources / Documentation", "https://codeberg.org/metamuffin/keks-meet"),
+    )
+}
+\ No newline at end of file
diff --git a/source/server/index.ts b/source/server/index.ts
index 75114ea..3fc32ce 100644
--- a/source/server/index.ts
+++ b/source/server/index.ts
@@ -10,6 +10,11 @@ let bundleFiles: Record<string, string> = {}
 root.get("/", async c => { await c.send({ path: "index.html", root: `${Deno.cwd()}/public` }) })
 root.get("/room/:id", async c => { await c.send({ path: "index.html", root: `${Deno.cwd()}/public` }) })
 
+root.get("/licen(c|s)e", async c => {
+    c.response.body = await Deno.readTextFile("LICENCE")
+    c.response.headers.set("Content-Type", "text/plain")
+})
+
 root.get("/favicon.ico", c => { c.response.status = 204 })
 
 // deno-lint-ignore no-explicit-any
author	metamuffin <metamuffin@yandex.com>	2022-01-25 20:58:57 +0100
committer	metamuffin <metamuffin@yandex.com>	2022-01-25 20:58:57 +0100
commit	8cc5a50b91a3d80b28b03191b246974d3aca9bf8 (patch)
tree	c737af828efe2e1750b5fadc140237737026081d
parent	a22bdc3821bd53d8e3b198423db3f8d7e8e579f6 (diff)
download	keks-meet-8cc5a50b91a3d80b28b03191b246974d3aca9bf8.tar keks-meet-8cc5a50b91a3d80b28b03191b246974d3aca9bf8.tar.bz2 keks-meet-8cc5a50b91a3d80b28b03191b246974d3aca9bf8.tar.zst