From fe8c75610de693e93a84b8a5c91f8463a218433d Mon Sep 17 00:00:00 2001 From: kharhamel Date: Thu, 11 Mar 2021 16:13:05 +0100 Subject: [PATCH] FIX: player anims correctly stop on the idle frame --- back/src/Enum/EnvironmentVariable.ts | 2 - back/src/Model/GameRoom.ts | 7 --- front/src/Connexion/ConnexionModels.ts | 2 +- front/src/Phaser/Entity/Character.ts | 78 +++++++++++++++---------- front/src/Phaser/Entity/RemotePlayer.ts | 10 +--- front/src/Phaser/Game/GameScene.ts | 14 ++--- front/src/Phaser/Player/Animation.ts | 14 +++-- front/src/Phaser/Player/Player.ts | 14 ++--- pusher/src/Services/SocketManager.ts | 62 -------------------- 9 files changed, 75 insertions(+), 128 deletions(-) diff --git a/back/src/Enum/EnvironmentVariable.ts b/back/src/Enum/EnvironmentVariable.ts index b12f0542..8736a856 100644 --- a/back/src/Enum/EnvironmentVariable.ts +++ b/back/src/Enum/EnvironmentVariable.ts @@ -3,7 +3,6 @@ const GROUP_RADIUS = process.env.GROUP_RADIUS ? Number(process.env.GROUP_RADIUS) const ALLOW_ARTILLERY = process.env.ALLOW_ARTILLERY ? process.env.ALLOW_ARTILLERY == 'true' : false; const ADMIN_API_URL = process.env.ADMIN_API_URL || ''; const ADMIN_API_TOKEN = process.env.ADMIN_API_TOKEN || 'myapitoken'; -const MAX_USERS_PER_ROOM = parseInt(process.env.MAX_USERS_PER_ROOM || '') || 600; const CPU_OVERHEAT_THRESHOLD = Number(process.env.CPU_OVERHEAT_THRESHOLD) || 80; const JITSI_URL : string|undefined = (process.env.JITSI_URL === '') ? undefined : process.env.JITSI_URL; const JITSI_ISS = process.env.JITSI_ISS || ''; @@ -19,7 +18,6 @@ export { ADMIN_API_TOKEN, HTTP_PORT, GRPC_PORT, - MAX_USERS_PER_ROOM, GROUP_RADIUS, ALLOW_ARTILLERY, CPU_OVERHEAT_THRESHOLD, diff --git a/back/src/Model/GameRoom.ts b/back/src/Model/GameRoom.ts index 41c215ad..6a592ed0 100644 --- a/back/src/Model/GameRoom.ts +++ b/back/src/Model/GameRoom.ts @@ -7,7 +7,6 @@ import {PositionNotifier} from "./PositionNotifier"; import {Movable} from "_Model/Movable"; import {extractDataFromPrivateRoomId, extractRoomSlugPublicRoomId, isRoomAnonymous} from "./RoomIdentifier"; import {arrayIntersect} from "../Services/ArrayHelper"; -import {MAX_USERS_PER_ROOM} from "../Enum/EnvironmentVariable"; import {JoinRoomMessage} from "../Messages/generated/messages_pb"; import {ProtobufUtils} from "../Model/Websocket/ProtobufUtils"; import {ZoneSocket} from "src/RoomManager"; @@ -116,8 +115,6 @@ export class GameRoom { this.nextUserId++; this.users.set(user.id, user); this.usersByUuid.set(user.uuid, user); - // Let's call update position to trigger the join / leave room - //this.updatePosition(socket, userPosition); this.updateUserGroup(user); // Notify admins @@ -149,10 +146,6 @@ export class GameRoom { } } - get isFull(): boolean { - return this.users.size >= MAX_USERS_PER_ROOM; - } - public isEmpty(): boolean { return this.users.size === 0 && this.admins.size === 0; } diff --git a/front/src/Connexion/ConnexionModels.ts b/front/src/Connexion/ConnexionModels.ts index d7c49f63..519afcd3 100644 --- a/front/src/Connexion/ConnexionModels.ts +++ b/front/src/Connexion/ConnexionModels.ts @@ -1,4 +1,4 @@ -import {PlayerAnimationNames} from "../Phaser/Player/Animation"; +import {PlayerAnimationDirections} from "../Phaser/Player/Animation"; import {UserSimplePeerInterface} from "../WebRtc/SimplePeer"; import {SignalData} from "simple-peer"; import {RoomConnection} from "./RoomConnection"; diff --git a/front/src/Phaser/Entity/Character.ts b/front/src/Phaser/Entity/Character.ts index 67e21f10..797616f8 100644 --- a/front/src/Phaser/Entity/Character.ts +++ b/front/src/Phaser/Entity/Character.ts @@ -1,4 +1,4 @@ -import {PlayerAnimationNames} from "../Player/Animation"; +import {PlayerAnimationDirections, PlayerAnimationTypes} from "../Player/Animation"; import {SpeechBubble} from "./SpeechBubble"; import BitmapText = Phaser.GameObjects.BitmapText; import Container = Phaser.GameObjects.Container; @@ -10,8 +10,7 @@ interface AnimationData { frameRate: number; repeat: number; frameModel: string; //todo use an enum - frameStart: number; - frameEnd: number; + frames : number[] } export abstract class Character extends Container { @@ -19,7 +18,7 @@ export abstract class Character extends Container { private readonly playerName: BitmapText; public PlayerValue: string; public sprites: Map; - private lastDirection: string = PlayerAnimationNames.WalkDown; + private lastDirection: PlayerAnimationDirections = PlayerAnimationDirections.Down; //private teleportation: Sprite; private invisible: boolean; @@ -28,7 +27,7 @@ export abstract class Character extends Container { y: number, texturesPromise: Promise, name: string, - direction: string, + direction: PlayerAnimationDirections, moving: boolean, frame?: string | number ) { @@ -81,7 +80,7 @@ export abstract class Character extends Container { this.getPlayerAnimations(texture).forEach(d => { this.scene.anims.create({ key: d.key, - frames: this.scene.anims.generateFrameNumbers(d.frameModel, {start: d.frameStart, end: d.frameEnd}), + frames: this.scene.anims.generateFrameNumbers(d.frameModel, {frames: d.frames}), frameRate: d.frameRate, repeat: d.repeat }); @@ -96,37 +95,57 @@ export abstract class Character extends Container { private getPlayerAnimations(name: string): AnimationData[] { return [{ - key: `${name}-${PlayerAnimationNames.WalkDown}`, + key: `${name}-${PlayerAnimationDirections.Down}-${PlayerAnimationTypes.Walk}`, frameModel: name, - frameStart: 0, - frameEnd: 2, + frames: [0, 1, 2, 1], frameRate: 10, repeat: -1 }, { - key: `${name}-${PlayerAnimationNames.WalkLeft}`, + key: `${name}-${PlayerAnimationDirections.Left}-${PlayerAnimationTypes.Walk}`, frameModel: name, - frameStart: 3, - frameEnd: 5, + frames: [3, 4, 5, 4], frameRate: 10, repeat: -1 }, { - key: `${name}-${PlayerAnimationNames.WalkRight}`, + key: `${name}-${PlayerAnimationDirections.Right}-${PlayerAnimationTypes.Walk}`, frameModel: name, - frameStart: 6, - frameEnd: 8, + frames: [6, 7, 8, 7], frameRate: 10, repeat: -1 }, { - key: `${name}-${PlayerAnimationNames.WalkUp}`, + key: `${name}-${PlayerAnimationDirections.Up}-${PlayerAnimationTypes.Walk}`, frameModel: name, - frameStart: 9, - frameEnd: 11, + frames: [9, 10, 11, 10], frameRate: 10, repeat: -1 + },{ + key: `${name}-${PlayerAnimationDirections.Down}-${PlayerAnimationTypes.Idle}`, + frameModel: name, + frames: [1], + frameRate: 10, + repeat: 1 + }, { + key: `${name}-${PlayerAnimationDirections.Left}-${PlayerAnimationTypes.Idle}`, + frameModel: name, + frames: [4], + frameRate: 10, + repeat: 1 + }, { + key: `${name}-${PlayerAnimationDirections.Right}-${PlayerAnimationTypes.Idle}`, + frameModel: name, + frames: [7], + frameRate: 10, + repeat: 1 + }, { + key: `${name}-${PlayerAnimationDirections.Up}-${PlayerAnimationTypes.Idle}`, + frameModel: name, + frames: [10], + frameRate: 10, + repeat: 1 }]; } - protected playAnimation(direction : string, moving: boolean): void { + protected playAnimation(direction : PlayerAnimationDirections, moving: boolean): void { if (this.invisible) return; for (const [texture, sprite] of this.sprites.entries()) { if (!sprite.anims) { @@ -134,10 +153,9 @@ export abstract class Character extends Container { return; } if (moving && (!sprite.anims.currentAnim || sprite.anims.currentAnim.key !== direction)) { - sprite.play(texture+'-'+direction, true); + sprite.play(texture+'-'+direction+'-'+PlayerAnimationTypes.Walk, true); } else if (!moving) { - sprite.anims.play(texture + '-' + direction, true); - sprite.anims.stop(); + sprite.anims.play(texture + '-' + direction + '-'+PlayerAnimationTypes.Idle, true); } } } @@ -157,17 +175,17 @@ export abstract class Character extends Container { // up or down animations are prioritized over left and right if (body.velocity.y < 0) { //moving up - this.lastDirection = PlayerAnimationNames.WalkUp; - this.playAnimation(PlayerAnimationNames.WalkUp, true); + this.lastDirection = PlayerAnimationDirections.Up; + this.playAnimation(PlayerAnimationDirections.Up, true); } else if (body.velocity.y > 0) { //moving down - this.lastDirection = PlayerAnimationNames.WalkDown; - this.playAnimation(PlayerAnimationNames.WalkDown, true); + this.lastDirection = PlayerAnimationDirections.Down; + this.playAnimation(PlayerAnimationDirections.Down, true); } else if (body.velocity.x > 0) { //moving right - this.lastDirection = PlayerAnimationNames.WalkRight; - this.playAnimation(PlayerAnimationNames.WalkRight, true); + this.lastDirection = PlayerAnimationDirections.Right; + this.playAnimation(PlayerAnimationDirections.Right, true); } else if (body.velocity.x < 0) { //moving left - this.lastDirection = PlayerAnimationNames.WalkLeft; - this.playAnimation(PlayerAnimationNames.WalkLeft, true); + this.lastDirection = PlayerAnimationDirections.Left; + this.playAnimation(PlayerAnimationDirections.Left, true); } this.setDepth(this.y); diff --git a/front/src/Phaser/Entity/RemotePlayer.ts b/front/src/Phaser/Entity/RemotePlayer.ts index 81ea00e1..a6bd4f40 100644 --- a/front/src/Phaser/Entity/RemotePlayer.ts +++ b/front/src/Phaser/Entity/RemotePlayer.ts @@ -1,6 +1,7 @@ import {GameScene} from "../Game/GameScene"; import {PointInterface} from "../../Connexion/ConnexionModels"; import {Character} from "../Entity/Character"; +import {PlayerAnimationDirections} from "../Player/Animation"; /** * Class representing the sprite of a remote player (a player that plays on another computer) @@ -15,22 +16,17 @@ export class RemotePlayer extends Character { y: number, name: string, texturesPromise: Promise, - direction: string, + direction: PlayerAnimationDirections, moving: boolean ) { super(Scene, x, y, texturesPromise, name, direction, moving, 1); //set data this.userId = userId; - - //todo: implement on click action - /*this.playerName.setInteractive(); - this.playerName.on('pointerup', () => { - });*/ } updatePosition(position: PointInterface): void { - this.playAnimation(position.direction, position.moving); + this.playAnimation(position.direction as PlayerAnimationDirections, position.moving); this.setX(position.x); this.setY(position.y); diff --git a/front/src/Phaser/Game/GameScene.ts b/front/src/Phaser/Game/GameScene.ts index de0f3ad9..4dabf5cd 100644 --- a/front/src/Phaser/Game/GameScene.ts +++ b/front/src/Phaser/Game/GameScene.ts @@ -13,7 +13,7 @@ import {CurrentGamerInterface, hasMovedEventName, Player} from "../Player/Player import {DEBUG_MODE, JITSI_PRIVATE_MODE, POSITION_DELAY, RESOLUTION, ZOOM_LEVEL} from "../../Enum/EnvironmentVariable"; import {ITiledMap, ITiledMapLayer, ITiledMapLayerProperty, ITiledMapObject, ITiledTileSet} from "../Map/ITiledMap"; import {AddPlayerInterface} from "./AddPlayerInterface"; -import {PlayerAnimationNames} from "../Player/Animation"; +import {PlayerAnimationDirections} from "../Player/Animation"; import {PlayerMovement} from "./PlayerMovement"; import {PlayersPositionInterpolator} from "./PlayersPositionInterpolator"; import {RemotePlayer} from "../Entity/RemotePlayer"; @@ -865,7 +865,7 @@ export class GameScene extends ResizableScene implements CenterListener { this.startY, this.playerName, texturesPromise, - PlayerAnimationNames.WalkDown, + PlayerAnimationDirections.Down, false, this.userInputManager ); @@ -914,16 +914,16 @@ export class GameScene extends ResizableScene implements CenterListener { let x = event.x; let y = event.y; switch (event.direction) { - case PlayerAnimationNames.WalkUp: + case PlayerAnimationDirections.Up: y -= 32; break; - case PlayerAnimationNames.WalkDown: + case PlayerAnimationDirections.Down: y += 32; break; - case PlayerAnimationNames.WalkLeft: + case PlayerAnimationDirections.Left: x -= 32; break; - case PlayerAnimationNames.WalkRight: + case PlayerAnimationDirections.Right: x += 32; break; default: @@ -1059,7 +1059,7 @@ export class GameScene extends ResizableScene implements CenterListener { addPlayerData.position.y, addPlayerData.name, texturesPromise, - addPlayerData.position.direction, + addPlayerData.position.direction as PlayerAnimationDirections, addPlayerData.position.moving ); this.MapPlayers.add(player); diff --git a/front/src/Phaser/Player/Animation.ts b/front/src/Phaser/Player/Animation.ts index 471f6d5f..ea8d2308 100644 --- a/front/src/Phaser/Player/Animation.ts +++ b/front/src/Phaser/Player/Animation.ts @@ -1,9 +1,13 @@ -export enum PlayerAnimationNames { - WalkDown = 'down', - WalkLeft = 'left', - WalkUp = 'up', - WalkRight = 'right', +export enum PlayerAnimationDirections { + Down = 'down', + Left = 'left', + Up = 'up', + Right = 'right', +} +export enum PlayerAnimationTypes { + Walk = 'walk', + Idle = 'idle', } diff --git a/front/src/Phaser/Player/Player.ts b/front/src/Phaser/Player/Player.ts index a5096ebb..64ba56d0 100644 --- a/front/src/Phaser/Player/Player.ts +++ b/front/src/Phaser/Player/Player.ts @@ -1,4 +1,4 @@ -import {PlayerAnimationNames} from "./Animation"; +import {PlayerAnimationDirections} from "./Animation"; import {GameScene} from "../Game/GameScene"; import {UserInputEvent, UserInputManager} from "../UserInput/UserInputManager"; import {Character} from "../Entity/Character"; @@ -11,7 +11,7 @@ export interface CurrentGamerInterface extends Character{ } export class Player extends Character implements CurrentGamerInterface { - private previousDirection: string = PlayerAnimationNames.WalkDown; + private previousDirection: string = PlayerAnimationDirections.Down; private wasMoving: boolean = false; constructor( @@ -20,7 +20,7 @@ export class Player extends Character implements CurrentGamerInterface { y: number, name: string, texturesPromise: Promise, - direction: string, + direction: PlayerAnimationDirections, moving: boolean, private userInputManager: UserInputManager ) { @@ -43,20 +43,20 @@ export class Player extends Character implements CurrentGamerInterface { let y = 0; if (activeEvents.get(UserInputEvent.MoveUp)) { y = - moveAmount; - direction = PlayerAnimationNames.WalkUp; + direction = PlayerAnimationDirections.Up; moving = true; } else if (activeEvents.get(UserInputEvent.MoveDown)) { y = moveAmount; - direction = PlayerAnimationNames.WalkDown; + direction = PlayerAnimationDirections.Down; moving = true; } if (activeEvents.get(UserInputEvent.MoveLeft)) { x = -moveAmount; - direction = PlayerAnimationNames.WalkLeft; + direction = PlayerAnimationDirections.Left; moving = true; } else if (activeEvents.get(UserInputEvent.MoveRight)) { x = moveAmount; - direction = PlayerAnimationNames.WalkRight; + direction = PlayerAnimationDirections.Right; moving = true; } if (x !== 0 || y !== 0) { diff --git a/pusher/src/Services/SocketManager.ts b/pusher/src/Services/SocketManager.ts index 1868720f..7d5a063e 100644 --- a/pusher/src/Services/SocketManager.ts +++ b/pusher/src/Services/SocketManager.ts @@ -264,31 +264,6 @@ export class SocketManager implements ZoneEventListener { pusherToBackMessage.setItemeventmessage(itemEventMessage); client.backConnection.write(pusherToBackMessage); - - /*const itemEvent = ProtobufUtils.toItemEvent(itemEventMessage); - - try { - const world = this.Worlds.get(ws.roomId); - if (!world) { - console.error("Could not find world with id '", ws.roomId, "'"); - return; - } - - const subMessage = new SubMessage(); - subMessage.setItemeventmessage(itemEventMessage); - - // Let's send the event without using the SocketIO room. - for (const user of world.getUsers().values()) { - const client = this.searchClientByIdOrFail(user.id); - //client.emit(SocketIoEvent.ITEM_EVENT, itemEvent); - emitInBatch(client, subMessage); - } - - world.setItemState(itemEvent.itemId, itemEvent.state); - } catch (e) { - console.error('An error occurred on "item_event"'); - console.error(e); - }*/ } async handleReportMessage(client: ExSocketInterface, reportPlayerMessage: ReportPlayerMessage) { @@ -310,25 +285,6 @@ export class SocketManager implements ZoneEventListener { pusherToBackMessage.setWebrtcsignaltoservermessage(data); socket.backConnection.write(pusherToBackMessage); - - - //send only at user - /*const client = this.sockets.get(data.getReceiverid()); - if (client === undefined) { - console.warn("While exchanging a WebRTC signal: client with id ", data.getReceiverid(), " does not exist. This might be a race condition."); - return; - } - - const webrtcSignalToClient = new WebRtcSignalToClientMessage(); - webrtcSignalToClient.setUserid(socket.userId); - webrtcSignalToClient.setSignal(data.getSignal()); - - const serverToClientMessage = new ServerToClientMessage(); - serverToClientMessage.setWebrtcsignaltoclientmessage(webrtcSignalToClient); - - if (!client.disconnecting) { - client.send(serverToClientMessage.serializeBinary().buffer, true); - }*/ } emitScreenSharing(socket: ExSocketInterface, data: WebRtcSignalToServerMessage): void { @@ -336,24 +292,6 @@ export class SocketManager implements ZoneEventListener { pusherToBackMessage.setWebrtcscreensharingsignaltoservermessage(data); socket.backConnection.write(pusherToBackMessage); - - //send only at user - /*const client = this.sockets.get(data.getReceiverid()); - if (client === undefined) { - console.warn("While exchanging a WEBRTC_SCREEN_SHARING signal: client with id ", data.getReceiverid(), " does not exist. This might be a race condition."); - return; - } - - const webrtcSignalToClient = new WebRtcSignalToClientMessage(); - webrtcSignalToClient.setUserid(socket.userId); - webrtcSignalToClient.setSignal(data.getSignal()); - - const serverToClientMessage = new ServerToClientMessage(); - serverToClientMessage.setWebrtcscreensharingsignaltoclientmessage(webrtcSignalToClient); - - if (!client.disconnecting) { - client.send(serverToClientMessage.serializeBinary().buffer, true); - }*/ } private searchClientByIdOrFail(userId: number): ExSocketInterface {