iridium/neko
2
2
Fork 0
mirror of https://github.com/m1k1o/neko.git synced 2024-07-24 14:40:50 +12:00
Code Issues Packages Projects Releases Wiki Activity

WebSocket types & messages refactored using new spec.

Browse Source
This commit is contained in:
Miroslav Šedivý 2020-11-30 22:00:07 +01:00
parent 34ac9098f0
commit 267ef5baa0
5 changed files with 143 additions and 259 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/component/main.vue
View File

@ -93,9 +93,7 @@
inverse: true,
sensitivity: 1,
},
clipboard: {
data: null,
},
clipboard: null,
host: null,
},
screen: {
@ -227,8 +225,8 @@
}
public setScreenSize(width: number, height: number, rate: number) {
this.api.admin.screenConfigurationChange({ screenConfigurationPayload: { width, height, rate } })
//this.websocket.send('screen/set', { width, height, rate })
//this.api.admin.screenConfigurationChange({ screenConfigurationPayload: { width, height, rate } })
this.websocket.send('screen/set', { width, height, rate })
}
/////////////////////////////
@ -238,11 +236,6 @@
// component size change
this.observer.observe(this._component)
// host change
this.events.on('control.host', (id: string | null) => {
Vue.set(this.state.member, 'is_controlling', id != null && id === this.state.member.id)
})
// fullscreen change
this._component.addEventListener('fullscreenchange', () => {
Vue.set(this.state.video, 'fullscreen', document.fullscreenElement !== null)
@ -256,8 +249,6 @@
this.websocket.on('message', async (event: string, payload: any) => {
switch (event) {
case 'signal/provide':
Vue.set(this.state.member, 'id', payload.id)
try {
let sdp = await this.webrtc.connect(payload.sdp, payload.lite, payload.ice)
this.websocket.send('signal/answer', { sdp })
@ -267,15 +258,16 @@
})
this.websocket.on('connecting', () => {
Vue.set(this.state.connection, 'websocket', 'connecting')
this.events.emit('system.websocket', 'connecting')
this.events.emit('internal.websocket', 'connecting')
})
this.websocket.on('connected', () => {
this.websocket.send('signal/request')
Vue.set(this.state.connection, 'websocket', 'connected')
this.events.emit('system.websocket', 'connected')
this.events.emit('internal.websocket', 'connected')
})
this.websocket.on('disconnected', () => {
Vue.set(this.state.connection, 'websocket', 'disconnected')
this.events.emit('system.websocket', 'disconnected')
this.events.emit('internal.websocket', 'disconnected')
this.webrtc.disconnect()
// TODO: reset state
@ -308,15 +300,15 @@
})
this.webrtc.on('connecting', () => {
Vue.set(this.state.connection, 'webrtc', 'connecting')
this.events.emit('system.webrtc', 'connecting')
this.events.emit('internal.webrtc', 'connecting')
})
this.webrtc.on('connected', () => {
Vue.set(this.state.connection, 'webrtc', 'connected')
this.events.emit('system.webrtc', 'connected')
this.events.emit('internal.webrtc', 'connected')
})
this.webrtc.on('disconnected', () => {
Vue.set(this.state.connection, 'webrtc', 'disconnected')
this.events.emit('system.webrtc', 'disconnected')
this.events.emit('internal.webrtc', 'disconnected')
// @ts-ignore
this._video.src = null
})

88
src/component/types/events.ts
View File

@ -1,72 +1,30 @@
export const EVENT = {
SYSTEM: {
DISCONNECT: 'system/disconnect',
},
SIGNAL: {
ANSWER: 'signal/answer',
PROVIDE: 'signal/provide',
},
MEMBER: {
LIST: 'member/list',
CONNECTED: 'member/connected',
DISCONNECTED: 'member/disconnected',
},
CONTROL: {
LOCKED: 'control/locked',
RELEASE: 'control/release',
REQUEST: 'control/request',
REQUESTING: 'control/requesting',
GIVE: 'control/give',
CLIPBOARD: 'control/clipboard',
KEYBOARD: 'control/keyboard',
},
SCREEN: {
CONFIGURATIONS: 'screen/configurations',
RESOLUTION: 'screen/resolution',
SET: 'screen/set',
},
BROADCAST: {
STATUS: 'broadcast/status',
CREATE: 'broadcast/create',
DESTROY: 'broadcast/destroy',
},
ADMIN: {
CONTROL: 'admin/control',
RELEASE: 'admin/release',
GIVE: 'admin/give',
},
} as const
export const SYSTEM_INIT = 'system/init'
export const SYSTEM_ADMIN = 'system/admin'
export const SYSTEM_DISCONNECT = 'system/disconnect'
export type Events = typeof EVENT
export const SIGNAL_REQUEST = 'signal/request'
export const SIGNAL_ANSWER = 'signal/answer'
export const SIGNAL_PROVIDE = 'signal/provide'
export type WebSocketEvents =
| SystemEvents
| SignalEvents
| MemberEvents
| ControlEvents
| ScreenEvents
| BroadcastEvents
| AdminEvents
export const MEMBER_CONNECTED = 'member/connected'
export const MEMBER_UPDATED = 'member/updated' // TODO: New.
export const MEMBER_DISCONNECTED = 'member/disconnected'
export type SystemEvents = typeof EVENT.SYSTEM.DISCONNECT
export const CONTROL_HOST = 'control/host'
export const CONTROL_RELEASE = 'control/release'
export const CONTROL_REQUEST = 'control/request'
export const CONTROL_MOVE = 'control/move' // TODO: New. (fallback)
export const CONTROL_SCROLL = 'control/scroll' // TODO: New. (fallback)
export const CONTROL_KEYDOWN = 'control/keydown' // TODO: New. (fallback)
export const CONTROL_KEYUP = 'control/keyup' // TODO: New. (fallback)
export type SignalEvents = typeof EVENT.SIGNAL.ANSWER | typeof EVENT.SIGNAL.PROVIDE
export const SCREEN_UPDATED = 'screen/updated'
export const SCREEN_SET = 'screen/set'
export type MemberEvents = typeof EVENT.MEMBER.LIST | typeof EVENT.MEMBER.CONNECTED | typeof EVENT.MEMBER.DISCONNECTED
export const CLIPBOARD_UPDATED = 'clipboard/updated'
export const CLIPBOARD_SET = 'clipboard/set'
export type ControlEvents =
| typeof EVENT.CONTROL.LOCKED
| typeof EVENT.CONTROL.RELEASE
| typeof EVENT.CONTROL.REQUEST
| typeof EVENT.CONTROL.GIVE
| typeof EVENT.CONTROL.CLIPBOARD
| typeof EVENT.CONTROL.KEYBOARD
export const KEYBOARD_MODIFIERS = 'keyboard/modifiers'
export const KEYBOARD_LAYOUT = 'keyboard/layout'
export type ScreenEvents = typeof EVENT.SCREEN.CONFIGURATIONS | typeof EVENT.SCREEN.RESOLUTION | typeof EVENT.SCREEN.SET
export type BroadcastEvents =
| typeof EVENT.BROADCAST.STATUS
| typeof EVENT.BROADCAST.CREATE
| typeof EVENT.BROADCAST.DESTROY
export type AdminEvents = typeof EVENT.ADMIN.CONTROL | typeof EVENT.ADMIN.RELEASE | typeof EVENT.ADMIN.GIVE
export const BORADCAST_STATUS = 'broadcast/status'

257
src/component/types/messages.ts
View File

@ -1,178 +1,137 @@
import {
EVENT,
WebSocketEvents,
SystemEvents,
SignalEvents,
MemberEvents,
ControlEvents,
ScreenEvents,
BroadcastEvents,
AdminEvents,
} from './events'
import { Member, ScreenConfigurations, ScreenResolution } from './structs'
export type WebSocketMessages =
| WebSocketMessage
| SignalProvideMessage
| SignalAnswerMessage
| MemberListMessage
| MemberConnectMessage
| MemberDisconnectMessage
| ControlMessage
| ScreenResolutionMessage
| ScreenConfigurationsMessage
export type WebSocketPayloads =
| SignalProvidePayload
| SignalAnswerPayload
| MemberListPayload
| Member
| ControlPayload
| ControlClipboardPayload
| ControlKeyboardPayload
| ScreenResolutionPayload
| ScreenConfigurationsPayload
| AdminPayload
| BroadcastStatusPayload
| BroadcastCreatePayload
export interface WebSocketMessage {
event: WebSocketEvents | string
export interface Message {
event: string | undefined
payload: any
}
/*
SYSTEM MESSAGES/PAYLOADS
*/
// system/disconnect
export interface DisconnectMessage extends WebSocketMessage, DisconnectPayload {
event: typeof EVENT.SYSTEM.DISCONNECT
/////////////////////////////
// System
/////////////////////////////
export interface SystemInit {
event: string | undefined
control_host: ControlHost
screen_size: ScreenSize
members: MemberData[]
}
export interface DisconnectPayload {
export interface SystemAdmin {
event: string | undefined
screen_sizes_list: ScreenSize[]
broadcast_status: BroadcastStatus
}
// TODO: New.
export interface SystemDisconnect {
event: string | undefined
message: string
}
/*
SIGNAL MESSAGES/PAYLOADS
*/
// signal/provide
export interface SignalProvideMessage extends WebSocketMessage, SignalProvidePayload {
event: typeof EVENT.SIGNAL.PROVIDE
}
export interface SignalProvidePayload {
id: string
/////////////////////////////
// Signal
/////////////////////////////
export interface SignalProvide {
event: string | undefined
sdp: string
lite: boolean
ice: string[]
}
export interface SignalAnswer {
event: string | undefined
sdp: string
}
// signal/answer
export interface SignalAnswerMessage extends WebSocketMessage, SignalAnswerPayload {
event: typeof EVENT.SIGNAL.ANSWER
}
export interface SignalAnswerPayload {
sdp: string
}
/////////////////////////////
// Member
/////////////////////////////
/*
MEMBER MESSAGES/PAYLOADS
*/
// member/list
export interface MemberListMessage extends WebSocketMessage, MemberListPayload {
event: typeof EVENT.MEMBER.LIST
}
export interface MemberListPayload {
members: Member[]
}
// member/connected
export interface MemberConnectMessage extends WebSocketMessage, MemberPayload {
event: typeof EVENT.MEMBER.CONNECTED
}
export type MemberPayload = Member
// member/disconnected
export interface MemberDisconnectMessage extends WebSocketMessage, MemberPayload {
event: typeof EVENT.MEMBER.DISCONNECTED
}
export interface MemberDisconnectPayload {
// TODO: New.
export interface MemberID {
event: string | undefined
id: string
}
/*
CONTROL MESSAGES/PAYLOADS
*/
// control/locked & control/release & control/request
export interface ControlMessage extends WebSocketMessage, ControlPayload {
event: ControlEvents
}
export interface ControlPayload {
// TODO: New.
export interface MemberData {
event: string | undefined
id: string
name: string
is_admin: boolean
}
export interface ControlTargetPayload {
id: string
target: string
/////////////////////////////
// Control
/////////////////////////////
export interface ControlHost {
event: string | undefined
has_host: boolean
host_id: string | undefined
}
export interface ControlClipboardPayload {
// TODO: New.
export interface ControlMove {
event: string | undefined
x: number
y: number
}
// TODO: New.
export interface ControlScroll {
event: string | undefined
x: number
y: number
}
// TODO: New.
export interface ControlKey {
event: string | undefined
key: number
}
/////////////////////////////
// Screen
/////////////////////////////
export interface ScreenSize {
event: string | undefined
width: number
height: number
rate: number
}
/////////////////////////////
// Clipboard
/////////////////////////////
export interface ClipboardData {
event: string | undefined
text: string
}
export interface ControlKeyboardPayload {
layout?: string
capsLock?: boolean
numLock?: boolean
scrollLock?: boolean
/////////////////////////////
// Keyboard
/////////////////////////////
export interface KeyboardModifiers {
event: string | undefined
caps_lock: boolean
num_lock: boolean
scroll_lock: boolean
}
/*
SCREEN PAYLOADS
*/
export interface ScreenResolutionMessage extends WebSocketMessage, ScreenResolutionPayload {
event: ScreenEvents
export interface KeyboardLayout {
event: string | undefined
layout: string
}
export interface ScreenResolutionPayload extends ScreenResolution {
id?: string
}
/////////////////////////////
// Broadcast
/////////////////////////////
export interface ScreenConfigurationsMessage extends WebSocketMessage, ScreenConfigurationsPayload {
event: ScreenEvents
}
export interface ScreenConfigurationsPayload {
configurations: ScreenConfigurations
}
/*
BROADCAST PAYLOADS
*/
export interface BroadcastCreatePayload {
url: string
}
export interface BroadcastStatusPayload {
url: string
isActive: boolean
}
/*
ADMIN PAYLOADS
*/
export interface AdminMessage extends WebSocketMessage, AdminPayload {
event: AdminEvents
}
export interface AdminPayload {
id: string
}
export interface AdminTargetMessage extends WebSocketMessage, AdminTargetPayload {
event: AdminEvents
}
export interface AdminTargetPayload {
id: string
target?: string
export interface BroadcastStatus {
event: string | undefined
is_active: boolean
url: string | undefined
}

4
src/component/types/state.ts
View File

@ -35,7 +35,7 @@ export interface Video {
/////////////////////////////
export interface Control {
scroll: Scroll
clipboard: Clipboard
clipboard: Clipboard | null
host: Member | null
}
@ -45,7 +45,7 @@ export interface Scroll {
}
export interface Clipboard {
data: string | null
text: string
}
/////////////////////////////

25
src/component/types/structs.ts
View File

@ -1,25 +0,0 @@
export interface Member {
id: string
name: string
admin: boolean
connected?: boolean
ignored?: boolean
}
export interface ScreenConfigurations {
[index: string]: ScreenConfiguration
}
export interface ScreenConfiguration {
width: number
height: number
rates: {
[index: string]: number
}
}
export interface ScreenResolution {
width: number
height: number
rate: number
}