From 2bfa57b0bad274711bcd6c763c636881fe2c3415 Mon Sep 17 00:00:00 2001 From: gparant Date: Wed, 29 Apr 2020 01:40:32 +0200 Subject: [PATCH] Merge world and webrtc conexion --- back/src/App.ts | 2 +- back/src/Controller/IoSocketController.ts | 132 ++++++++++++------ back/src/Model/Websocket/ExSocketInterface.ts | 1 + back/src/Model/World.ts | 7 +- front/src/Connexion.ts | 7 - front/src/Phaser/Game/GameScene.ts | 1 - front/src/WebRtc/SimplePeer.ts | 41 +++--- 7 files changed, 123 insertions(+), 68 deletions(-) diff --git a/back/src/App.ts b/back/src/App.ts index 4b3b3c53..82ca317a 100644 --- a/back/src/App.ts +++ b/back/src/App.ts @@ -28,7 +28,7 @@ class App { private config(): void { this.app.use(bodyParser.json()); this.app.use(bodyParser.urlencoded({extended: false})); - this.app.use(function (req: Request, res: Response, next) { + this.app.use((req: Request, res: Response, next) => { res.header("Access-Control-Allow-Origin", "*"); // update to match the domain you will make the request from res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept"); next(); diff --git a/back/src/Controller/IoSocketController.ts b/back/src/Controller/IoSocketController.ts index 77f3ac9e..23a238e6 100644 --- a/back/src/Controller/IoSocketController.ts +++ b/back/src/Controller/IoSocketController.ts @@ -8,6 +8,17 @@ import {SECRET_KEY} from "../Enum/EnvironmentVariable"; //TODO fix import by "_E import {ExtRooms, RefreshUserPositionFunction} from "../Model/Websocket/ExtRoom"; import {ExtRoomsInterface} from "../Model/Websocket/ExtRoomsInterface"; import {World} from "../Model/World"; +import { uuid } from 'uuidv4'; + +enum SockerIoEvent { + CONNECTION = "connection", + DISCONNECTION = "disconnect", + JOIN_ROOM = "join-room", + USER_POSITION = "user-position", + WEBRTC_SIGNAL = "webrtc-signal", + WEBRTC_START = "webrtc-start", + MESSAGE_ERROR = "message-error", +} export class IoSocketController{ Io: socketIO.Server; @@ -31,11 +42,17 @@ export class IoSocketController{ this.ioConnection(); this.shareUsersPosition(); - this.World = new World(this.connectedUser, this.disConnectedUser); + + //don't send only function because the context will be not this + this.World = new World((user1 : string, user2 : string) => { + this.connectedUser(user1, user2); + }, (user1 : string, user2 : string) => { + this.disConnectedUser(user1, user2); + }); } ioConnection() { - this.Io.on('connection', (socket: Socket) => { + this.Io.on(SockerIoEvent.CONNECTION, (socket: Socket) => { /*join-rom event permit to join one room. message : userId : user identification @@ -44,10 +61,10 @@ export class IoSocketController{ x: user x position on map y: user y position on map */ - socket.on('join-room', (message : string) => { + socket.on(SockerIoEvent.JOIN_ROOM, (message : string) => { let messageUserPosition = this.hydrateMessageReceive(message); if(messageUserPosition instanceof Error){ - return socket.emit("message-error", JSON.stringify({message: messageUserPosition.message})) + return socket.emit(SockerIoEvent.MESSAGE_ERROR, JSON.stringify({message: messageUserPosition.message})) } //join user in room @@ -64,13 +81,13 @@ export class IoSocketController{ rooms.refreshUserPosition = RefreshUserPositionFunction; rooms.refreshUserPosition(rooms, this.Io); - socket.to(messageUserPosition.roomId).emit('join-room', messageUserPosition.toString()); + socket.to(messageUserPosition.roomId).emit(SockerIoEvent.JOIN_ROOM, messageUserPosition.toString()); }); - socket.on('user-position', (message : string) => { + socket.on(SockerIoEvent.USER_POSITION, (message : string) => { let messageUserPosition = this.hydrateMessageReceive(message); if (messageUserPosition instanceof Error) { - return socket.emit("message-error", JSON.stringify({message: messageUserPosition.message})); + return socket.emit(SockerIoEvent.MESSAGE_ERROR, JSON.stringify({message: messageUserPosition.message})); } // update position in the worl @@ -87,37 +104,7 @@ export class IoSocketController{ rooms.refreshUserPosition(rooms, this.Io); }); - socket.on('webrtc-room', (message : string) => { - let data = JSON.parse(message); - socket.join(data.roomId); - (socket as ExSocketInterface).roomId = data.roomId; - - //if two persone in room share - if(this.Io.sockets.adapter.rooms[data.roomId].length < 2) { - return; - } - let clients : Array = Object.values(this.Io.sockets.sockets); - - //send start at one client to initialise offer webrtc - //send all users in room to create PeerConnection in front - clients.forEach((client: ExSocketInterface, index : number) => { - - let clientsId = clients.reduce((tabs : Array, clientId: ExSocketInterface, indexClientId: number) => { - if(!clientId.userId || clientId.userId === client.userId){ - return tabs; - } - tabs.push({ - userId: clientId.userId, - initiator : index <= indexClientId - }); - return tabs; - }, []); - - client.emit('webrtc-start', JSON.stringify(clientsId)); - }); - }); - - socket.on('webrtc-signal', (message : string) => { + socket.on(SockerIoEvent.WEBRTC_SIGNAL, (message : string) => { let data : any = JSON.parse(message); //send only at user @@ -127,10 +114,63 @@ export class IoSocketController{ if(client.userId !== data.receiverId){ continue } - client.emit('webrtc-signal', message); + client.emit(SockerIoEvent.WEBRTC_SIGNAL, message); break; } }); + + socket.on(SockerIoEvent.DISCONNECTION, (reason : string) => { + let Client = (socket as ExSocketInterface); + //leave group of user + this.World.leave(Client); + + //leave room + socket.leave(Client.roomId); + socket.leave(Client.webRtcRoomId); + + //delete all socket information + delete Client.userId; + delete Client.webRtcRoomId; + delete Client.roomId; + delete Client.token; + delete Client.position; + }); + }); + } + + /** + * + * @param socket + * @param roomId + */ + joinWebRtcRoom(socket : ExSocketInterface, roomId : string) { + if(socket.webRtcRoomId === roomId){ + return; + } + socket.join(roomId); + socket.webRtcRoomId = roomId; + //if two persone in room share + if (this.Io.sockets.adapter.rooms[roomId].length < 2) { + return; + } + let clients: Array = Object.values(this.Io.sockets.sockets); + + //send start at one client to initialise offer webrtc + //send all users in room to create PeerConnection in front + clients.forEach((client: ExSocketInterface, index: number) => { + + let clientsId = clients.reduce((tabs: Array, clientId: ExSocketInterface, indexClientId: number) => { + if (!clientId.userId || clientId.userId === client.userId) { + return tabs; + } + tabs.push({ + userId: clientId.userId, + initiator: index <= indexClientId + }); + return tabs; + }, []); + + client.emit(SockerIoEvent.WEBRTC_START, JSON.stringify({clients: clientsId, roomId: roomId})); }); } @@ -191,8 +231,18 @@ export class IoSocketController{ //connected user connectedUser(user1 : string, user2 : string){ - console.log("connectedUser => user1", user1); - console.log("connectedUser => user2", user2); + /* TODO manager room and group user to enter and leave */ + let roomId = uuid(); + let clients : Array = Object.values(this.Io.sockets.sockets); + let User1 = clients.find((user : ExSocketInterface) => user.userId === user1); + let User2 = clients.find((user : ExSocketInterface) => user.userId === user2); + + if(User1) { + this.joinWebRtcRoom(User1, roomId); + } + if(User2) { + this.joinWebRtcRoom(User2, roomId); + } } //connected user diff --git a/back/src/Model/Websocket/ExSocketInterface.ts b/back/src/Model/Websocket/ExSocketInterface.ts index 095d3cbc..4d1d9fee 100644 --- a/back/src/Model/Websocket/ExSocketInterface.ts +++ b/back/src/Model/Websocket/ExSocketInterface.ts @@ -4,6 +4,7 @@ import {PointInterface} from "./PointInterface"; export interface ExSocketInterface extends Socket { token: any; roomId: string; + webRtcRoomId: string; userId: string; position: PointInterface; } \ No newline at end of file diff --git a/back/src/Model/World.ts b/back/src/Model/World.ts index 804a176b..ff1f58ff 100644 --- a/back/src/Model/World.ts +++ b/back/src/Model/World.ts @@ -3,6 +3,7 @@ import {PointInterface} from "./Websocket/PointInterface"; import {Group} from "./Group"; import {Distance} from "./Distance"; import {UserInterface} from "./UserInterface"; +import {ExSocketInterface} from "_Model/Websocket/ExSocketInterface"; export class World { static readonly MIN_DISTANCE = 160; @@ -29,8 +30,12 @@ export class World { }); } + public leave(user : ExSocketInterface){ + /*TODO leaver user in group*/ + this.users.delete(user.userId); + } + public updatePosition(userPosition: MessageUserPosition): void { - let context = this; let user = this.users.get(userPosition.userId); if(typeof user === 'undefined') { return; diff --git a/front/src/Connexion.ts b/front/src/Connexion.ts index a9c10df5..77c9619f 100644 --- a/front/src/Connexion.ts +++ b/front/src/Connexion.ts @@ -7,7 +7,6 @@ import {API_URL} from "./Enum/EnvironmentVariable"; enum EventMessage{ WEBRTC_SIGNAL = "webrtc-signal", WEBRTC_START = "webrtc-start", - WEBRTC_ROOM = "webrtc-room", JOIN_ROOM = "join-room", USER_POSITION = "user-position", MESSAGE_ERROR = "message-error" @@ -127,8 +126,6 @@ export interface ConnexionInterface { positionOfAllUser(): void; /*webrtc*/ - sendWebrtcRomm(roomId: string): void; - sendWebrtcSignal(signal: any, roomId: string, userId?: string, receiverId?: string): void; receiveWebrtcSignal(callBack: Function): void; @@ -239,10 +236,6 @@ export class Connexion implements ConnexionInterface { })); } - sendWebrtcRomm(roomId: string) { - this.socket.emit(EventMessage.WEBRTC_ROOM, JSON.stringify({roomId: roomId})); - } - receiveWebrtcStart(callback: Function) { this.socket.on(EventMessage.WEBRTC_START, callback); } diff --git a/front/src/Phaser/Game/GameScene.ts b/front/src/Phaser/Game/GameScene.ts index e996d140..b08db791 100644 --- a/front/src/Phaser/Game/GameScene.ts +++ b/front/src/Phaser/Game/GameScene.ts @@ -258,7 +258,6 @@ export class GameScene extends Phaser.Scene implements GameSceneInterface{ //init colision this.physics.add.collider(this.CurrentPlayer, player, (CurrentPlayer: CurrentGamerInterface, MapPlayer: GamerInterface) => { CurrentPlayer.say("Hello, how are you ? "); - this.GameManager.SimplePeer.activePhone(); }); } } diff --git a/front/src/WebRtc/SimplePeer.ts b/front/src/WebRtc/SimplePeer.ts index a53fd754..b04511d7 100644 --- a/front/src/WebRtc/SimplePeer.ts +++ b/front/src/WebRtc/SimplePeer.ts @@ -3,14 +3,13 @@ import {MediaManager} from "./MediaManager"; let Peer = require('simple-peer'); export interface SimplePeerInterface { - activePhone(): void; - disablePhone(): void; } export class SimplePeer { Connexion: ConnexionInterface; MediaManager: MediaManager; RoomId: string; + Users: Array; PeerConnexionArray: Array = new Array(); @@ -18,12 +17,25 @@ export class SimplePeer { this.Connexion = Connexion; this.RoomId = roomId; this.MediaManager = new MediaManager(); + this.initialise(); + } + + /** + * permit to listen when user could start visio + */ + private initialise(){ + + //receive message start + this.Connexion.receiveWebrtcStart((message: string) => { + this.receiveWebrtcStart(message); + }); + + //when button to call is clicked, start video this.MediaManager.getElementActivePhone().addEventListener("click", () => { this.startWebRtc(); this.disablePhone(); }); } - /** * server has two person connected, start the meet */ @@ -31,13 +43,9 @@ export class SimplePeer { this.MediaManager.activeVisio(); return this.MediaManager.getCamera().then((stream: MediaStream) => { this.MediaManager.localStream = stream; - //send message to join a room - this.Connexion.sendWebrtcRomm(this.RoomId); - //receive message start - this.Connexion.receiveWebrtcStart((message: string) => { - this.receiveWebrtcStart(message); - }); + //create pear connexion + this.createPeerConnexion(); //receive signal by gemer this.Connexion.receiveWebrtcSignal((message: string) => { @@ -54,17 +62,16 @@ export class SimplePeer { */ receiveWebrtcStart(message: string) { let data = JSON.parse(message); + this.RoomId = data.roomId; + this.Users = data.clients; - //create pear connexion of user stared - this.createPeerConnexion(data); + //active button for player + this.activePhone(); } - /** - * - * @param users - */ - createPeerConnexion(users : Array) { - users.forEach((user: any) => { + + createPeerConnexion() { + this.Users.forEach((user: any) => { if(this.PeerConnexionArray[user.userId]){ return; }