109 lines
2.5 KiB
TypeScript
109 lines
2.5 KiB
TypeScript
/**
|
|
* webrtc page script
|
|
*
|
|
* Author: Peter Harpending <peterharpending@qpq.swiss>
|
|
* Date: 2026-02-04
|
|
* Copyright: Copyright (c) 2026 QPQ AG
|
|
*
|
|
* Reference: https://git.qpq.swiss/QPQ-AG/research-megadoc/src/commit/c7c4592d4b21ad120145ef63334471a1a7ec1e60/paste/2026-02/grok-webrtc.html
|
|
*
|
|
* @module
|
|
*/
|
|
|
|
type state =
|
|
{whoami: string,
|
|
roster: Array<string>};
|
|
|
|
let st: state =
|
|
{whoami: "",
|
|
roster: []};
|
|
|
|
main();
|
|
|
|
async function
|
|
main
|
|
()
|
|
: Promise<void>
|
|
{
|
|
// start websocket immediately
|
|
let ws: WebSocket;
|
|
let init = document.getElementById('init') as HTMLDivElement;
|
|
let init_join = document.getElementById('init-join') as HTMLButtonElement;
|
|
|
|
// handle button click
|
|
init_join.addEventListener('click',
|
|
function() {
|
|
init.hidden = true;
|
|
document.getElementById('run')!.hidden = false;
|
|
ws = new WebSocket('/ws/webrtc');
|
|
ws.onopen = function(e) { console.log('ws open'); };
|
|
ws.onclose = function(e) { console.warn('ws closed'); };
|
|
ws.onerror = function(e) { console.error('ws error:', e); };
|
|
ws.onmessage =
|
|
function(e) {
|
|
// console.log('ws message:', e.data);
|
|
let message = JSON.parse(e.data) as ws_msg;
|
|
handle_ws_msg(message);
|
|
};
|
|
}
|
|
);
|
|
}
|
|
|
|
type ws_msg = ["whoami", string]
|
|
| ["roster", Array<string>];
|
|
|
|
function
|
|
handle_ws_msg
|
|
(message: ws_msg)
|
|
: void
|
|
{
|
|
console.log('message from server:', message);
|
|
switch(message[0]) {
|
|
case "whoami":
|
|
st.whoami = message[1];
|
|
break;
|
|
case "roster":
|
|
st.roster = (message[1] as Array<string>);
|
|
break;
|
|
default:
|
|
console.warn("unknown message", message);
|
|
}
|
|
|
|
render_state();
|
|
}
|
|
|
|
|
|
|
|
function
|
|
ws_send_json
|
|
(ws : WebSocket,
|
|
x : any)
|
|
: void
|
|
{
|
|
let s: string = JSON.stringify(x, undefined, 4);
|
|
console.log('sending:\n', s);
|
|
|
|
ws.send(s);
|
|
}
|
|
|
|
|
|
|
|
function
|
|
render_state
|
|
()
|
|
: void
|
|
{
|
|
console.log('st', st);
|
|
// whoami
|
|
document.getElementById('whoami')!.innerText = st.whoami;
|
|
//
|
|
let roster_ul = document.getElementById('roster-ul') as HTMLUListElement;
|
|
let newChildren : Array<HTMLElement> = [];
|
|
for (let nick of st.roster) {
|
|
let li = document.createElement('li');
|
|
li.innerText = nick;
|
|
newChildren.push(li);
|
|
}
|
|
roster_ul.replaceChildren(...newChildren);
|
|
}
|