Initial commit

2023-11-30 19:32:38 +01:00
commit c8f076c2ab
13 changed files with 977 additions and 0 deletions
--- a/server/static/index.html
+++ b/server/static/index.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <title>title</title>
+    <link rel="stylesheet" href="style.css">
+    <script src="script.js"></script>
+  </head>
+  <body>
+    <h1>HELLO!</h1>
+    <ol id="streamList">
+    </ol>
+    <video id="video1" width="1920" height="1080" autoplay muted></video>
+  </body>
+</html>
--- a/server/static/script.js
+++ b/server/static/script.js
@@ -0,0 +1,66 @@
+const startStream = function (streamKey) {
+    const pc = new RTCPeerConnection({
+        iceServers: [{ urls: 'stun:stun.l.google.com:19302' }]
+    })
+
+    pc.oniceconnectionstatechange = e => console.log(e)
+    pc.addTransceiver('video')
+    pc.addTransceiver('audio')
+    pc.createOffer().then(offer => {
+        fetch("/whip/tjuice", {
+            method: "POST",
+            body: offer.sdp
+        }).then(resp => {
+            resp.text().then(text => {
+                var answer = {
+                    type: "answer",
+                    sdp: text
+                }
+                try {
+                    pc.setLocalDescription(offer).then(
+                        pc.setRemoteDescription(answer)
+                    )
+                } catch (e) {
+                    console.log("Error setting remote description: " + e)
+                }
+            })
+        });
+    })
+
+    pc.ontrack = function (event) {
+        console.log(event)
+        const el = document.getElementById('video1')
+        var ms = new MediaStream()
+        event.streams.forEach(s => {
+            const tracks = s.getTracks()
+            tracks.forEach( t => {
+                ms.addTrack(t)
+            })
+        })
+
+        el.srcObject = ms
+        el.autoplay = true
+        el.controls = true
+    }
+}
+
+displayStreams = function () {
+    fetch("/whip").then(resp => {
+        resp.json().then(streamList => {
+            for (const element of streamList) {
+                const ol = document.getElementById("streamList")
+                var entry = document.createElement("li")
+                var a = document.createElement("a")
+                a.onclick = _ => startStream(element)
+                a.append(document.createTextNode(element))
+                entry.appendChild(a)
+                ol.appendChild(entry)
+            }
+        })
+    })
+}
+
+window.onload = function ( ev ) {
+    console.log(ev)
+    displayStreams()
+}
--- a/server/static/style.css
+++ b/server/static/style.css
@@ -0,0 +1,3 @@
+body {
+    color: #ff5722;
+}