filmout_manager/browser/index.ts

50 lines
1.2 KiB
TypeScript

interface SequenceState {
name : string,
hash : string,
progress : number
}
interface State {
width? : number,
height? : number,
sequence? : SequenceState
}
class Client {
private client : WebSocket;
private connected : boolean = false;
private progress : HTMLProgressElement;
constructor () {
let uri : string = 'ws://localhost:8082';
this.progress = document.getElementById('progress') as HTMLProgressElement;
this.client = new WebSocket(uri);
this.client.onopen = this.onOpen.bind(this);
this.client.onmessage = this.onMessage.bind(this);
}
private onMessage (event : any) {
const state : State = JSON.parse(event.data) as State;
if (typeof state.sequence !== 'undefined' && state.sequence !== null) {
this.setSequence(state.sequence);
}
}
private onOpen (event : any) {
console.log('Connected');
this.connected = true;
}
private setSequence(sequence : SequenceState) {
const percent : number = sequence.progress * 100.0;
this.progress.value = percent;
this.progress.innerText = `${Math.floor(percent)}%`;
}
public cameraOpen () {
console.log('camera open');
this.client.send(JSON.stringify({ cmd : 'open' }));
}
}
const client : Client = new Client();