diff --git a/back/src/Controller/IoSocketController.ts b/back/src/Controller/IoSocketController.ts index 781d811d..511c6b42 100644 --- a/back/src/Controller/IoSocketController.ts +++ b/back/src/Controller/IoSocketController.ts @@ -10,11 +10,11 @@ import {ExtRoomsInterface} from "../Model/Websocket/ExtRoomsInterface"; import {World} from "../Model/World"; import {Group} from "_Model/Group"; import {UserInterface} from "_Model/UserInterface"; +import {SetPlayerDetailsMessage} from "_Model/Websocket/SetPlayerDetailsMessage"; enum SockerIoEvent { CONNECTION = "connection", DISCONNECT = "disconnect", - ATTRIBUTE_USER_ID = "attribute-user-id", // Sent from server to client just after the connexion is established to give the client its unique id. JOIN_ROOM = "join-room", USER_POSITION = "user-position", WEBRTC_SIGNAL = "webrtc-signal", @@ -24,6 +24,7 @@ enum SockerIoEvent { MESSAGE_ERROR = "message-error", GROUP_CREATE_UPDATE = "group-create-update", GROUP_DELETE = "group-delete", + SET_PLAYER_DETAILS = "set-player-details" } export class IoSocketController { @@ -125,7 +126,7 @@ export class IoSocketController { } }); - socket.on(SockerIoEvent.USER_POSITION, (message: string) => { + socket.on(SockerIoEvent.USER_POSITION, (message: any) => { try { let messageUserPosition = this.hydrateMessageReceive(message); if (messageUserPosition instanceof Error) { @@ -192,7 +193,12 @@ export class IoSocketController { }); // Let's send the user id to the user - socket.emit(SockerIoEvent.ATTRIBUTE_USER_ID, socket.id); + socket.on(SockerIoEvent.SET_PLAYER_DETAILS, (playerDetails: SetPlayerDetailsMessage, answerFn) => { + let Client = (socket as ExSocketInterface); + Client.name = playerDetails.name; + Client.character = playerDetails.character; + answerFn(socket.id); + }); }); } diff --git a/back/src/Model/Websocket/SetPlayerDetailsMessage.ts b/back/src/Model/Websocket/SetPlayerDetailsMessage.ts new file mode 100644 index 00000000..2f3cc707 --- /dev/null +++ b/back/src/Model/Websocket/SetPlayerDetailsMessage.ts @@ -0,0 +1,4 @@ +export interface SetPlayerDetailsMessage { + name: string, + character: string +} diff --git a/front/src/Connexion.ts b/front/src/Connexion.ts index b071c101..6b6049d2 100644 --- a/front/src/Connexion.ts +++ b/front/src/Connexion.ts @@ -1,10 +1,12 @@ import {GameManager} from "./Phaser/Game/GameManager"; - -const SocketIo = require('socket.io-client'); import Axios from "axios"; import {API_URL} from "./Enum/EnvironmentVariable"; -import {getMapKeyByUrl} from "./Phaser/Login/LogincScene"; import {MessageUI} from "./Logger/MessageUI"; +import {SetPlayerDetailsMessage} from "./Messages/SetPlayerDetailsMessage"; + +const SocketIo = require('socket.io-client'); +import Socket = SocketIOClient.Socket; + enum EventMessage{ WEBRTC_SIGNAL = "webrtc-signal", @@ -19,7 +21,7 @@ enum EventMessage{ CONNECT_ERROR = "connect_error", RECONNECT = "reconnect", - ATTRIBUTE_USER_ID = "attribute-user-id" // Sent from server to client just after the connexion is established to give the client its unique id. + SET_PLAYER_DETAILS = "set-player-details" // Send the name and character to the server (on connect), receive back the id. } class Message { @@ -115,10 +117,10 @@ export interface GroupCreatedUpdatedMessageInterface { export interface ConnexionInterface { socket: any; token: string; - email: string; + name: string; userId: string; - createConnexion(characterSelected: string): Promise; + createConnexion(name: string, characterSelected: string): Promise; loadMaps(): Promise; @@ -139,24 +141,23 @@ export interface ConnexionInterface { } export class Connexion implements ConnexionInterface { - socket: any; + socket: Socket; token: string; - email: string; + name: string; // TODO: drop "name" storage here + character: string; userId: string; GameManager: GameManager; lastPositionShared: MessageUserPosition = null; - constructor(email : string, GameManager: GameManager) { - this.email = email; + constructor(GameManager: GameManager) { this.GameManager = GameManager; } - /** - * @param characterSelected - */ - createConnexion(characterSelected: string): Promise { + createConnexion(name: string, characterSelected: string): Promise { + this.name = name; + this.character = characterSelected; /*return Axios.post(`${API_URL}/login`, {email: this.email}) .then((res) => { this.token = res.data.token; @@ -168,19 +169,7 @@ export class Connexion implements ConnexionInterface { }*/ }); - this.connectSocketServer(); - - // TODO: maybe trigger promise only when connexion is established? - let promise = new Promise((resolve, reject) => { - /*console.log('PROMISE CREATED') - this.socket.on('connection', () => { - console.log('CONNECTED'); - resolve(this); - });*/ - resolve(this); - }); - - return promise; + return this.connectSocketServer(); /* return res.data; }) @@ -194,7 +183,7 @@ export class Connexion implements ConnexionInterface { * * @param character */ - connectSocketServer(character : string = null){ + connectSocketServer(): Promise{ //if try to reconnect with last position if(this.lastPositionShared) { //join the room @@ -214,12 +203,21 @@ export class Connexion implements ConnexionInterface { } //listen event - this.attributeUserId(); this.positionOfAllUser(); this.disconnectServer(); this.errorMessage(); this.groupUpdatedOrCreated(); this.groupDeleted(); + + return new Promise((resolve, reject) => { + this.socket.emit(EventMessage.SET_PLAYER_DETAILS, { + name: this.name, + character: this.character + } as SetPlayerDetailsMessage, (id: string) => { + this.userId = id; + }); + resolve(this); + }); } //TODO add middleware with access token to secure api @@ -243,7 +241,7 @@ export class Connexion implements ConnexionInterface { this.userId, roomId, new Point(0, 0), - this.email, + this.name, character ); this.socket.emit(EventMessage.JOIN_ROOM, messageUserPosition); @@ -265,22 +263,13 @@ export class Connexion implements ConnexionInterface { this.userId, roomId, new Point(x, y, direction), - this.email, + this.name, character ); this.lastPositionShared = messageUserPosition; this.socket.emit(EventMessage.USER_POSITION, messageUserPosition); } - attributeUserId(): void { - // This event is received as soon as the connexion is established. - // It allows informing the browser of its own user id. - this.socket.on(EventMessage.ATTRIBUTE_USER_ID, (userId: string) => { - console.log('Received my user id: ', userId); - this.userId = userId; - }); - } - /** * The data sent is an array with information for each user : * [ diff --git a/front/src/Messages/SetPlayerDetailsMessage.ts b/front/src/Messages/SetPlayerDetailsMessage.ts new file mode 100644 index 00000000..2f3cc707 --- /dev/null +++ b/front/src/Messages/SetPlayerDetailsMessage.ts @@ -0,0 +1,4 @@ +export interface SetPlayerDetailsMessage { + name: string, + character: string +} diff --git a/front/src/Phaser/Game/GameManager.ts b/front/src/Phaser/Game/GameManager.ts index b886de9e..1728d0d9 100644 --- a/front/src/Phaser/Game/GameManager.ts +++ b/front/src/Phaser/Game/GameManager.ts @@ -40,8 +40,8 @@ export class GameManager { connect(name: string, characterUserSelected : string) { this.playerName = name; this.characterUserSelected = characterUserSelected; - this.ConnexionInstance = new Connexion(name, this); - return this.ConnexionInstance.createConnexion(characterUserSelected).then((data : any) => { + this.ConnexionInstance = new Connexion(this); + return this.ConnexionInstance.createConnexion(name, characterUserSelected).then((data : any) => { this.SimplePeer = new SimplePeer(this.ConnexionInstance); return data; }).catch((err) => {