polish + menu

1 files changed, 21 insertions, 10 deletions

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
 }