Spectate Remote Control v1

[jmlee337]

Implement Spectate Remote Control v1 per the design doc

Possible Changes

Please let me know if you'd like me to

• move spectate.worker.ts and spectate_manager.ts from broadcast/ to common/ or something like that
• move the UI control panel to somewhere a bit less discoverable for non-advanced users

Screenshots

Spectate Remote Control server: WebSocket API

(accepts only 1 connection at a time)

spectate-protocol

> let socket = new WebSocket("ws://localhost:55761", "spectate-protocol");
> socket.onopen = () => { console.log("open") };
> socket.onmessage = (event) => { console.log("message: " + event.data) };
> socket.onerror = (event) => { console.log("error: " + JSON.stringify(event)) };
> socket.onclose = () => { console.log("close") };

open

spectating-broadcasts-event

(sent once only when a client connects)

message: {"op":"spectating-broadcasts-event","spectatingBroadcasts":[{"broadcastId":"q0ejrrUneJcA5v65nUVX13OYr0o2-oFTsLA8jxfP9GqqVt7kxYk","dolphinId":"1713518126142broadcast0"}]}

new-file-event

message: {"op":"new-file-event","dolphinId":"spectate-q0ejrrUneJcA5v65nUVX13OYr0o2-cYp8HZJ9FB3P3uW72b2dHM","filePath":"C:\\Users\\jmlee337\\Documents\\Slippi\\Spectate\\Game_20240309T104448.slp"}

game-end-event

message: {"op":"game-end-event","dolphinId":"spectate-q0ejrrUneJcA5v65nUVX13OYr0o2-cYp8HZJ9FB3P3uW72b2dHM"}

dolphin-closed-event

message: {"op":"dolphin-closed-event","dolphinId":"spectate-q0ejrrUneJcA5v65nUVX13OYr0o2-cYp8HZJ9FB3P3uW72b2dHM"}

list-broadcasts-request

> socket.send(JSON.stringify({op: "list-broadcasts-request"}))

message: {"op":"list-broadcasts-response","broadcasts":[{"id":"q0ejrrUneJcA5v65nUVX13OYr0o2-cYp8HZJ9FB3P3uW72b2dHM","name":"LOST#882","broadcaster":{"uid":"q0ejrrUneJcA5v65nUVX13OYr0o2","name":"lostletters"}}]}

spectate-broadcast-request

if dolphinId is not specified, spectating will begin in a new dolphin window

> socket.send(JSON.stringify({op: "spectate-broadcast-request", broadcastId: "PMmdJgqjWzWrMHmq2IbktBKpbcf2-4zXtnoxyBgA2jRwH6wYbtb"}));

message: {"op":"spectate-broadcast-response","dolphinId":"1710210546025remote0","path":"C:\\Users\\jmlee337\\Documents\\Slippi\\Spectate"}
message: {"op":"new-file-event","dolphinId":"1710210546025remote0","filePath":"C:\\Users\\jmlee337\\Documents\\Slippi\\Spectate\\Game_20240309T104448.slp"}

if dolphinId is specified, spectating will begin in the existing dolphin window with that id (if one exists), or a new dolphin window (if none exists)

> socket.send(JSON.stringify({op: "spectate-broadcast-request", broadcastId: "PMmdJgqjWzWrMHmq2IbktBKpbcf2-4zXtnoxyBgA2jRwH6wYbtb", dolphinId: "dolphin-id"}));

message: {"op":"spectate-broadcast-response","dolphinId":"dolphin-id","path":"C:\\Users\\jmlee337\\Documents\\Slippi\\Spectate"}
message: {"op":"new-file-event","dolphinId":"dolphin-id","filePath":"C:\\Users\\jmlee337\\Documents\\Slippi\\Spectate\\Game_20240312T130151.slp"}

> socket.send(JSON.stringify({op: "spectate-broadcast-request", broadcastId: "q0ejrrUneJcA5v65nUVX13OYr0o2-pb3C5YdjLzCP4sZHhCAbyg", dolphinId: "dolphin-id"}));

message: {"op":"spectate-broadcast-response","dolphinId":"dolphin-id","path":"C:\\Users\\jmlee337\\Documents\\Slippi\\Spectate"}
message: {"op":"new-file-event","dolphinId":"dolphin-id","filePath":"C:\\Users\\jmlee337\\Documents\\Slippi\\Spectate\\Game_20240312T130208.slp"}

err

Request errors are denoted by the presence of an err field in the response

> socket.send(JSON.stringify({op: "close-dolphin-request", dolphinId: "nonexistent-dolphin-id"}));
message: {"op":"close-dolphin-response","err":"no such playback dolphin instance"}