roster kind of sort of works

priv/static/js/dist/webrtc.js

@@ -16,18 +16,39 @@ async function main() {
     let ws = new WebSocket('/ws/webrtc');
     // grab document elements
     let init = document.getElementById('init');
-    let peers = document.getElementById('peers');
+    let roster = document.getElementById('roster');
+    let roster_ul = document.getElementById('roster-ul');
+    let whoami = document.getElementById('whoami');
     let init_name = document.getElementById('init-name');
     let init_join = document.getElementById('init-join');
     // handle button click
     init_join.addEventListener('click', function () {
-        handle_join(init, init_name, peers, ws);
+        handle_join(init, init_name, roster, ws);
     });
     // handle message from ws
     ws.onopen = function (e) { console.log('ws open:', e); };
     ws.onclose = function (e) { console.warn('ws closed:', e); };
     ws.onerror = function (e) { console.error('ws error:', e); };
-    ws.onmessage = function (e) { console.log('ws message', e); };
+    ws.onmessage =
+        function (e) {
+            // console.log('ws message:', e.data);
+            let message = JSON.parse(e.data);
+            handle_ws_msg(message, roster_ul, whoami);
+        };
+}
+function handle_ws_msg(message, roster_ul, whoami) {
+    switch (message[0]) {
+        case "username":
+            whoami.innerText = 'Whoami: ' + message[1];
+            break;
+        case "users":
+            for (let uname of message[1]) {
+                let thisli = document.createElement('li');
+                thisli.innerText = uname;
+                roster_ul.appendChild(thisli);
+            }
+            break;
+    }
 }
 async function handle_join(init, init_name, peers, ws) {
     console.log('connecting...');