diff --git a/src/component/internal/messages.ts b/src/component/internal/messages.ts index 64a40eef..ad5773ad 100644 --- a/src/component/internal/messages.ts +++ b/src/component/internal/messages.ts @@ -111,8 +111,10 @@ export class NekoMessages extends EventEmitter { // Signal Events ///////////////////////////// - protected [EVENT.SIGNAL_PROVIDE]({ event }: message.SignalProvide) { + protected [EVENT.SIGNAL_PROVIDE]({ event, video, videos }: message.SignalProvide) { this._log.debug('EVENT.SIGNAL_PROVIDE') + Vue.set(this.state.connection.webrtc, 'video', video) + Vue.set(this.state.connection.webrtc, 'videos', videos) // TODO: Handle. } @@ -121,6 +123,11 @@ export class NekoMessages extends EventEmitter { // TODO: Handle. } + protected [EVENT.SIGNAL_VIDEO]({ event, video }: message.SignalVideo) { + this._log.debug('EVENT.SIGNAL_VIDEO') + Vue.set(this.state.connection.webrtc, 'video', video) + } + ///////////////////////////// // Member Events ///////////////////////////// diff --git a/src/component/main.vue b/src/component/main.vue index 201eb09c..a7735288 100644 --- a/src/component/main.vue +++ b/src/component/main.vue @@ -85,8 +85,12 @@ connection: { authenticated: false, websocket: this.websocket.supported ? 'disconnected' : 'unavailable', - webrtc: this.webrtc.supported ? 'disconnected' : 'unavailable', - webrtc_stats: null, + webrtc: { + status: this.webrtc.supported ? 'disconnected' : 'unavailable', + stats: null, + video: null, + videos: [], + }, type: 'none', }, video: { @@ -127,7 +131,7 @@ } public get watching() { - return this.state.connection.webrtc == 'connected' + return this.state.connection.webrtc.status == 'connected' } public get controlling() { @@ -264,6 +268,14 @@ this.websocket.send('screen/set', { width, height, rate }) } + public setWebRTCVideo(video: string) { + if (!this.state.connection.webrtc.videos.includes(video)) { + throw new Error('VideoID not found.') + } + + this.websocket.send('signal/video', { video: video }) + } + public sendUnicast(receiver: string, subject: string, body: any) { this.websocket.send('send/unicast', { receiver, subject, body }) } @@ -373,20 +385,22 @@ this.websocket.send('signal/candidate', candidate) }) this.webrtc.on('stats', (stats: WebRTCStats) => { - Vue.set(this.state.connection, 'webrtc_stats', stats) + Vue.set(this.state.connection.webrtc, 'stats', stats) }) this.webrtc.on('connecting', () => { - Vue.set(this.state.connection, 'webrtc', 'connecting') + Vue.set(this.state.connection.webrtc, 'status', 'connecting') this.events.emit('connection.webrtc', 'connecting') }) this.webrtc.on('connected', () => { - Vue.set(this.state.connection, 'webrtc', 'connected') + Vue.set(this.state.connection.webrtc, 'status', 'connected') Vue.set(this.state.connection, 'type', 'webrtc') this.events.emit('connection.webrtc', 'connected') }) this.webrtc.on('disconnected', () => { - Vue.set(this.state.connection, 'webrtc', 'disconnected') - Vue.set(this.state.connection, 'webrtc_stats', null) + Vue.set(this.state.connection.webrtc, 'status', 'disconnected') + Vue.set(this.state.connection.webrtc, 'stats', null) + Vue.set(this.state.connection.webrtc, 'video', null) + Vue.set(this.state.connection.webrtc, 'videos', []) Vue.set(this.state.connection, 'type', 'none') this.events.emit('connection.webrtc', 'disconnected') diff --git a/src/component/types/events.ts b/src/component/types/events.ts index 7c3f4ed1..4ebaf61c 100644 --- a/src/component/types/events.ts +++ b/src/component/types/events.ts @@ -6,6 +6,7 @@ export const SIGNAL_REQUEST = 'signal/request' export const SIGNAL_ANSWER = 'signal/answer' export const SIGNAL_PROVIDE = 'signal/provide' export const SIGNAL_CANDIDATE = 'signal/candidate' +export const SIGNAL_VIDEO = 'signal/video' export const MEMBER_CREATED = 'member/created' export const MEMBER_DELETED = 'member/deleted' diff --git a/src/component/types/messages.ts b/src/component/types/messages.ts index 94981c42..c218af1b 100644 --- a/src/component/types/messages.ts +++ b/src/component/types/messages.ts @@ -37,6 +37,8 @@ export interface SignalProvide { sdp: string lite: boolean ice: string[] + video: string + videos: string[] } export interface SignalCandidate extends RTCIceCandidateInit { @@ -48,6 +50,11 @@ export interface SignalAnswer { sdp: string } +export interface SignalVideo { + event: string | undefined + video: string +} + ///////////////////////////// // Member ///////////////////////////// diff --git a/src/component/types/state.ts b/src/component/types/state.ts index fd710a8d..4b78d24c 100644 --- a/src/component/types/state.ts +++ b/src/component/types/state.ts @@ -13,11 +13,17 @@ export default interface State { export interface Connection { authenticated: boolean websocket: 'unavailable' | 'disconnected' | 'connecting' | 'connected' - webrtc: 'unavailable' | 'disconnected' | 'connecting' | 'connected' - webrtc_stats: WebRTCStats | null + webrtc: WebRTC type: 'webrtc' | 'fallback' | 'none' } +export interface WebRTC { + status: 'unavailable' | 'disconnected' | 'connecting' | 'connected' + stats: WebRTCStats | null + video: string | null + videos: string[] +} + export interface WebRTCStats { bitrate: number packetLoss: number