partey_workadventure/front/src/Connection.ts

240 lines
8.0 KiB
TypeScript
Raw Normal View History

import Axios from "axios";
import {API_URL} from "./Enum/EnvironmentVariable";
2020-05-13 20:22:42 +02:00
import {MessageUI} from "./Logger/MessageUI";
import {SetPlayerDetailsMessage} from "./Messages/SetPlayerDetailsMessage";
const SocketIo = require('socket.io-client');
import Socket = SocketIOClient.Socket;
import {PlayerAnimationNames} from "./Phaser/Player/Animation";
import {UserSimplePeerInterface} from "./WebRtc/SimplePeer";
import {SignalData} from "simple-peer";
2020-04-25 16:05:33 +02:00
enum EventMessage{
WEBRTC_SIGNAL = "webrtc-signal",
2020-06-11 23:18:06 +02:00
WEBRTC_SCREEN_SHARING_SIGNAL = "webrtc-screen-sharing-signal",
2020-04-25 16:05:33 +02:00
WEBRTC_START = "webrtc-start",
JOIN_ROOM = "join-room", // bi-directional
USER_POSITION = "user-position", // bi-directional
USER_MOVED = "user-moved", // From server to client
USER_LEFT = "user-left", // From server to client
2020-05-02 20:46:02 +02:00
MESSAGE_ERROR = "message-error",
WEBRTC_DISCONNECT = "webrtc-disconect",
GROUP_CREATE_UPDATE = "group-create-update",
GROUP_DELETE = "group-delete",
SET_PLAYER_DETAILS = "set-player-details", // Send the name and character to the server (on connect), receive back the id.
2020-05-13 20:22:42 +02:00
CONNECT_ERROR = "connect_error",
}
export interface PointInterface {
x: number;
y: number;
direction : string;
moving: boolean;
}
export class Point implements PointInterface{
constructor(public x : number, public y : number, public direction : string = PlayerAnimationNames.WalkDown, public moving : boolean = false) {
if(x === null || y === null){
throw Error("position x and y cannot be null");
}
}
}
export interface MessageUserPositionInterface {
userId: string;
name: string;
characterLayers: string[];
position: PointInterface;
}
2020-04-25 16:05:33 +02:00
export interface MessageUserMovedInterface {
userId: string;
position: PointInterface;
}
export interface MessageUserJoined {
userId: string;
name: string;
characterLayers: string[];
position: PointInterface
}
export interface PositionInterface {
x: number,
y: number
}
export interface GroupCreatedUpdatedMessageInterface {
position: PositionInterface,
groupId: string
}
export interface WebRtcStartMessageInterface {
roomId: string,
clients: UserSimplePeerInterface[]
}
export interface WebRtcDisconnectMessageInterface {
userId: string
}
export interface WebRtcSignalMessageInterface {
userId: string, // TODO: is this needed?
receiverId: string,
roomId: string,
signal: SignalData
}
export interface StartMapInterface {
mapUrlStart: string,
startInstance: string
}
export class Connection implements Connection {
private readonly socket: Socket;
private userId: string|null = null;
2020-04-07 20:41:35 +02:00
private constructor(token: string) {
this.socket = SocketIo(`${API_URL}`, {
query: {
token: token
},
reconnection: false // Reconnection is handled by the application itself
});
this.socket.on(EventMessage.MESSAGE_ERROR, (message: string) => {
console.error(EventMessage.MESSAGE_ERROR, message);
})
}
public static createConnection(name: string, characterLayersSelected: string[]): Promise<Connection> {
return Axios.post(`${API_URL}/login`, {name: name})
.then((res) => {
2020-06-22 16:10:18 +02:00
return new Promise<Connection>((resolve, reject) => {
const connection = new Connection(res.data.token);
2020-06-22 16:10:18 +02:00
connection.onConnectError((error: object) => {
console.log('An error occurred while connecting to socket server. Retrying');
reject(error);
});
connection.socket.emit(EventMessage.SET_PLAYER_DETAILS, {
name: name,
characterLayers: characterLayersSelected
2020-06-22 16:10:18 +02:00
} as SetPlayerDetailsMessage, (id: string) => {
connection.userId = id;
});
resolve(connection);
});
})
.catch((err) => {
// Let's retry in 4-6 seconds
return new Promise<Connection>((resolve, reject) => {
setTimeout(() => {
Connection.createConnection(name, characterLayersSelected).then((connection) => resolve(connection))
2020-06-22 16:10:18 +02:00
.catch((error) => reject(error));
}, 4000 + Math.floor(Math.random() * 2000) );
});
});
}
public closeConnection(): void {
this.socket?.close();
2020-06-03 11:55:31 +02:00
}
public joinARoom(roomId: string, startX: number, startY: number, direction: string, moving: boolean): Promise<MessageUserPositionInterface[]> {
2020-06-22 16:11:48 +02:00
const promise = new Promise<MessageUserPositionInterface[]>((resolve, reject) => {
this.socket.emit(EventMessage.JOIN_ROOM, { roomId, position: {x: startX, y: startY, direction, moving }}, (userPositions: MessageUserPositionInterface[]) => {
resolve(userPositions);
});
})
return promise;
}
public sharePosition(x : number, y : number, direction : string, moving: boolean) : void{
2020-04-07 20:46:30 +02:00
if(!this.socket){
return;
}
2020-06-09 23:13:26 +02:00
const point = new Point(x, y, direction, moving);
this.socket.emit(EventMessage.USER_POSITION, point);
}
public onUserJoins(callback: (message: MessageUserJoined) => void): void {
this.socket.on(EventMessage.JOIN_ROOM, callback);
}
public onUserMoved(callback: (message: MessageUserMovedInterface) => void): void {
this.socket.on(EventMessage.USER_MOVED, callback);
}
public onUserLeft(callback: (userId: string) => void): void {
this.socket.on(EventMessage.USER_LEFT, callback);
}
public onGroupUpdatedOrCreated(callback: (groupCreateUpdateMessage: GroupCreatedUpdatedMessageInterface) => void): void {
this.socket.on(EventMessage.GROUP_CREATE_UPDATE, callback);
}
public onGroupDeleted(callback: (groupId: string) => void): void {
this.socket.on(EventMessage.GROUP_DELETE, callback)
}
2020-06-22 16:10:18 +02:00
public onConnectError(callback: (error: object) => void): void {
this.socket.on(EventMessage.CONNECT_ERROR, callback)
}
public sendWebrtcSignal(signal: unknown, roomId: string, userId? : string|null, receiverId? : string) {
return this.socket.emit(EventMessage.WEBRTC_SIGNAL, {
2020-04-26 17:43:21 +02:00
userId: userId ? userId : this.userId,
receiverId: receiverId ? receiverId : this.userId,
2020-04-25 16:05:33 +02:00
roomId: roomId,
signal: signal
});
2020-04-25 16:05:33 +02:00
}
public sendWebrtcScreenSharingSignal(signal: unknown, roomId: string, userId? : string|null, receiverId? : string) {
return this.socket.emit(EventMessage.WEBRTC_SCREEN_SHARING_SIGNAL, {
userId: userId ? userId : this.userId,
receiverId: receiverId ? receiverId : this.userId,
2020-06-11 23:18:06 +02:00
roomId: roomId,
signal: signal
});
}
public receiveWebrtcStart(callback: (message: WebRtcStartMessageInterface) => void) {
this.socket.on(EventMessage.WEBRTC_START, callback);
2020-04-25 16:05:33 +02:00
}
public receiveWebrtcSignal(callback: (message: WebRtcSignalMessageInterface) => void) {
return this.socket.on(EventMessage.WEBRTC_SIGNAL, callback);
2020-04-25 16:05:33 +02:00
}
public receiveWebrtcScreenSharingSignal(callback: (message: WebRtcSignalMessageInterface) => void) {
return this.socket.on(EventMessage.WEBRTC_SCREEN_SHARING_SIGNAL, callback);
2020-06-11 23:18:06 +02:00
}
public onServerDisconnected(callback: (reason: string) => void): void {
this.socket.on('disconnect', (reason: string) => {
if (reason === 'io client disconnect') {
// The client asks for disconnect, let's not trigger any event.
return;
}
callback(reason);
2020-05-13 20:22:42 +02:00
});
}
public getUserId(): string|null {
return this.userId;
2020-05-13 20:22:42 +02:00
}
disconnectMessage(callback: (message: WebRtcDisconnectMessageInterface) => void): void {
this.socket.on(EventMessage.WEBRTC_DISCONNECT, callback);
2020-05-02 20:46:02 +02:00
}
}