Name of map users

- Add name on user
 - Delete NonPlayer class not used

back/src/Controller/IoSocketController.ts

@@ -215,6 +215,7 @@ export class IoSocketController {
         socket.position = message.position;
         socket.roomId = message.roomId;
         socket.userId = message.userId;
+        socket.name = message.name;
     }
 
     refreshUserPosition() {

back/src/Model/Websocket/ExSocketInterface.ts

@@ -6,5 +6,6 @@ export interface ExSocketInterface extends Socket {
     roomId: string;
     webRtcRoomId: string;
     userId: string;
+    name: string;
     position: PointInterface;
 }

back/src/Model/Websocket/ExtRoom.ts

@@ -9,27 +9,28 @@ export class ExtRooms implements ExtRoomsInterface{
     [room: string]: SocketIO.Room;
 }
 
-let RefreshUserPositionFunction = function(rooms : ExtRooms, Io: socketIO.Server){
+let RefreshUserPositionFunction = function(rooms : ExtRooms, Io: socketIO.Server) {
     let clients = Io.clients();
     let socketsKey = Object.keys(Io.clients().sockets);
 
     //create mapping with all users in all rooms
     let mapPositionUserByRoom = new Map();
-    for(let i = 0; i < socketsKey.length; i++){
+    for (let i = 0; i < socketsKey.length; i++) {
         let socket = clients.sockets[socketsKey[i]] as ExSocketInterface;
-        if(!socket.position){
+        if (!socket.position) {
             continue;
         }
         let data = {
-            userId : socket.userId,
+            userId: socket.userId,
-            roomId : socket.roomId,
+            roomId: socket.roomId,
-            position : socket.position,
+            position: socket.position,
+            name: socket.name,
         };
         let dataArray = <any>[];
-        if(mapPositionUserByRoom.get(data.roomId)){
+        if (mapPositionUserByRoom.get(data.roomId)) {
             dataArray = mapPositionUserByRoom.get(data.roomId);
             dataArray.push(data);
-        }else{
+        } else {
             dataArray = [data];
         }
         mapPositionUserByRoom.set(data.roomId, dataArray);

back/src/Model/Websocket/Message.ts

@@ -1,6 +1,7 @@
 export class Message {
     userId: string;
     roomId: string;
+    name: string;
 
     constructor(data: any) {
         if (!data.userId || !data.roomId) {
@@ -8,12 +9,14 @@ export class Message {
         }
         this.userId = data.userId;
         this.roomId = data.roomId;
+        this.name = data.name;
     }
 
     toJson() {
         return {
             userId: this.userId,
-            roomId: this.roomId
+            roomId: this.roomId,
+            name: this.name
         }
     }
 }

front/dist/resources/style/style.css

@@ -49,8 +49,8 @@ video{
     cursor: pointer;
     position: absolute;
     border: solid 0px black;
-    width: 64px;
+    width: 44px;
-    height: 64px;
+    height: 44px;
     background: #666;
     box-shadow: 2px 2px 24px #444;
     border-radius: 48px;
@@ -68,20 +68,20 @@ video{
 }
 .btn-micro{
     transition: all .3s;
-    right: 10px;
+    right: 44px;
 }
 .btn-video{
     transition: all .2s;
-    right: 114px;
+    right: 134px;
 }
 /*.btn-call{
     transition: all .1s;
     left: 0px;
 }*/
 .btn-cam-action div img{
-    height: 32px;
+    height: 22px;
-    width: 40px;
+    width: 30px;
-    top: calc(48px - 32px);
+    top: calc(48px - 37px);
-    left: calc(48px - 35px);
+    left: calc(48px - 41px);
     position: relative;
 }

front/src/Connexion.ts

@@ -17,16 +17,19 @@ enum EventMessage{
 class Message {
     userId: string;
     roomId: string;
+    name: string;
 
-    constructor(userId : string, roomId : string) {
+    constructor(userId : string, roomId : string, name: string) {
         this.userId = userId;
         this.roomId = roomId;
+        this.name = name;
     }
 
     toJson() {
         return {
             userId: this.userId,
             roomId: this.roomId,
+            name: this.name
         }
     }
 }
@@ -64,14 +67,15 @@ class Point implements PointInterface{
 export interface MessageUserPositionInterface {
     userId: string;
     roomId: string;
+    name: string;
     position: PointInterface;
 }
 
 class MessageUserPosition extends Message implements MessageUserPositionInterface{
     position: PointInterface;
 
-    constructor(userId : string, roomId : string, point : Point) {
+    constructor(userId : string, roomId : string, point : Point, name: string) {
-        super(userId, roomId);
+        super(userId, roomId, name);
         this.position = point;
     }
 
@@ -106,7 +110,8 @@ class ListMessageUserPosition {
                     userPosition.position.x,
                     userPosition.position.y,
                     userPosition.position.direction
-                )
+                ),
+                userPosition.name
             ));
         });
     }
@@ -187,7 +192,7 @@ export class Connexion implements ConnexionInterface {
      * @param roomId
      */
     joinARoom(roomId: string): void {
-        let messageUserPosition = new MessageUserPosition(this.userId, this.startedRoom, new Point(0, 0));
+        let messageUserPosition = new MessageUserPosition(this.userId, this.startedRoom, new Point(0, 0), this.email);
         this.socket.emit(EventMessage.JOIN_ROOM, messageUserPosition.toString());
     }
 
@@ -201,7 +206,7 @@ export class Connexion implements ConnexionInterface {
         if(!this.socket){
             return;
         }
-        let messageUserPosition = new MessageUserPosition(this.userId, ROOM[0], new Point(x, y, direction));
+        let messageUserPosition = new MessageUserPosition(this.userId, ROOM[0], new Point(x, y, direction), this.email);
         this.socket.emit(EventMessage.USER_POSITION, messageUserPosition.toString());
     }
 

front/src/Phaser/Entity/PlayableCaracter.ts

@@ -42,7 +42,11 @@ export class PlayableCaracter extends Phaser.Physics.Arcade.Sprite {
         if(this.bubble) {
             this.bubble.moveBubble(this.x, this.y);
         }
-        this.playerName.setPosition(this.x, this.y - 25);
+        this.updatePlayerNamePosition(this.x, this.y);
+    }
+
+    updatePlayerNamePosition(x: number, y: number){
+        this.playerName.setPosition(x, y - 25);
     }
 
     stop(){
@@ -59,4 +63,9 @@ export class PlayableCaracter extends Phaser.Physics.Arcade.Sprite {
             this.bubble = null;
         }, 3000)
     }
+
+    destroy(fromScene?: boolean): void {
+        super.destroy(fromScene);
+        this.playerName.destroy();
+    }
 }

front/src/Phaser/Game/GameScene.ts

@@ -258,7 +258,7 @@ export class GameScene extends Phaser.Scene implements GameSceneInterface{
             this,
             MessageUserPosition.position.x,
             MessageUserPosition.position.y,
-            'Foo'
+            MessageUserPosition.name
         );
         player.initAnimation();
         this.MapPlayers.add(player);

front/src/Phaser/NonPlayer/NonPlayer.ts

@@ -1,40 +0,0 @@
-import {PlayableCaracter} from "../Entity/PlayableCaracter";
-import {Textures} from "../Game/GameScene";
-import {UserInputEvent} from "../UserInput/UserInputManager";
-import {Player} from "../Player/Player";
-import {MessageUserPositionInterface} from "../../Connexion";
-import {playAnimation} from "../Player/Animation";
-
-export class NonPlayer extends PlayableCaracter {
-
-    isFleeing: boolean = false;
-    fleeingDirection:any = null //todo create a vector class
-
-    constructor(scene: Phaser.Scene, x: number, y: number, name: string) {
-        super(scene, x, y, Textures.Player, name, 1);
-        this.setSize(32, 32); //edit the hitbox to better match the character model
-    }
-
-
-    updatePosition(MessageUserPosition : MessageUserPositionInterface){
-        playAnimation(this, MessageUserPosition.position.direction);
-        this.setX(MessageUserPosition.position.x);
-        this.setY(MessageUserPosition.position.y);
-    }
-
-    fleeFrom(player:Player) {
-        if (this.isFleeing) return;
-        this.say("Don't touch me!");
-        this.isFleeing = true;
-
-        setTimeout(() => {
-            this.say("Feww, I escaped.");
-            this.isFleeing = false
-            this.fleeingDirection = null
-        }, 3000);
-
-        let vectorX = this.x - player.x;
-        let vectorY = this.y - player.y;
-        this.fleeingDirection = {x: vectorX, y: vectorY}
-    }
-}

front/src/Phaser/Player/Player.ts

@@ -100,5 +100,6 @@ export class Player extends PlayableCaracter implements CurrentGamerInterface, G
         playAnimation(this, MessageUserPosition.position.direction);
         this.setX(MessageUserPosition.position.x);
         this.setY(MessageUserPosition.position.y);
+        this.updatePlayerNamePosition(MessageUserPosition.position.x, MessageUserPosition.position.y);
     }
 }