_Bastler/partey_workadventure
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge pull request #40 from thecodingmachine/kharhamel-interaction

Browse Source 
conflict interaction @Kharhamel
This commit is contained in:
grégoire parant 2020-04-13 16:10:09 +02:00 committed by GitHub
commit 2ce6ed2d48
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
14 changed files with 511 additions and 252 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
front/dist/maps/map2.json vendored
View File

@ -155,6 +155,12 @@
},
{
"id":77,
"properties":[
{
"name":"collides",
"type":"bool",
"value":true
}],
"terrain":[2, 2, 2, 2]
},
{

BIN
front/dist/resources/objects/rockSprite.png vendored Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.6 KiB

57
front/src/Phaser/Entity/PlayableCaracter.ts Normal file
View File

@ -0,0 +1,57 @@
import {getPlayerAnimations, playAnimation, PlayerAnimationNames} from "../Player/Animation";
import {ActiveEventList, UserInputEvent} from "../UserInput/UserInputManager";
import {SpeechBubble} from "./SpeechBubble";
export class PlayableCaracter extends Phaser.Physics.Arcade.Sprite {
private bubble: SpeechBubble;
constructor(scene: Phaser.Scene, x: number, y: number, texture: string, frame?: string | number) {
super(scene, x, y, texture, frame);
this.scene.sys.updateList.add(this);
this.scene.sys.displayList.add(this);
this.setScale(2);
this.scene.physics.world.enableBody(this);
this.setImmovable(true);
this.setCollideWorldBounds(true);
this.setSize(32, 32); //edit the hitbox to better match the caracter model
}
move(x: number, y: number){
this.setVelocity(x, y);
//todo improve animations to better account for diagonal movement
if (this.body.velocity.x > 0) { //moving right
this.play(PlayerAnimationNames.WalkRight, true);
}
if (this.body.velocity.x < 0) { //moving left
this.anims.playReverse(PlayerAnimationNames.WalkLeft, true);
}
if (this.body.velocity.y < 0) { //moving up
this.play(PlayerAnimationNames.WalkUp, true);
}
if (this.body.velocity.y > 0) { //moving down
this.play(PlayerAnimationNames.WalkDown, true);
}
if(this.bubble) {
this.bubble.moveBubble(this.x, this.y);
}
}
stop(){
this.setVelocity(0, 0);
this.play(PlayerAnimationNames.None, true);
}
say(text: string) {
if (this.bubble) return;
this.bubble = new SpeechBubble(this.scene, this, text)
//todo make the buble destroy on player movement?
setTimeout(() => {
this.bubble.destroy();
this.bubble = null;
}, 3000)
}
}

88
front/src/Phaser/Entity/SpeechBubble.ts Normal file
View File

@ -0,0 +1,88 @@
import Scene = Phaser.Scene;
import {PlayableCaracter} from "./PlayableCaracter";
export class SpeechBubble {
private bubble: Phaser.GameObjects.Graphics;
private content: Phaser.GameObjects.Text;
/**
*
* @param scene
* @param player
* @param text
*/
constructor(scene: Scene, player: PlayableCaracter, text: string = "") {
let bubbleHeight = 50;
let bubblePadding = 10;
let bubbleWidth = bubblePadding * 2 + text.length * 10;
let arrowHeight = bubbleHeight / 4;
this.bubble = scene.add.graphics({ x: player.x + 16, y: player.y - 80 });
// Bubble shadow
this.bubble.fillStyle(0x222222, 0.5);
this.bubble.fillRoundedRect(6, 6, bubbleWidth, bubbleHeight, 16);
// this.bubble color
this.bubble.fillStyle(0xffffff, 1);
// this.bubble outline line style
this.bubble.lineStyle(4, 0x565656, 1);
// this.bubble shape and outline
this.bubble.strokeRoundedRect(0, 0, bubbleWidth, bubbleHeight, 16);
this.bubble.fillRoundedRect(0, 0, bubbleWidth, bubbleHeight, 16);
// Calculate arrow coordinates
let point1X = Math.floor(bubbleWidth / 7);
let point1Y = bubbleHeight;
let point2X = Math.floor((bubbleWidth / 7) * 2);
let point2Y = bubbleHeight;
let point3X = Math.floor(bubbleWidth / 7);
let point3Y = Math.floor(bubbleHeight + arrowHeight);
// bubble arrow shadow
this.bubble.lineStyle(4, 0x222222, 0.5);
this.bubble.lineBetween(point2X - 1, point2Y + 6, point3X + 2, point3Y);
// bubble arrow fill
this.bubble.fillTriangle(point1X, point1Y, point2X, point2Y, point3X, point3Y);
this.bubble.lineStyle(2, 0x565656, 1);
this.bubble.lineBetween(point2X, point2Y, point3X, point3Y);
this.bubble.lineBetween(point1X, point1Y, point3X, point3Y);
this.content = scene.add.text(0, 0, text, { fontFamily: 'Arial', fontSize: 20, color: '#000000', align: 'center', wordWrap: { width: bubbleWidth - (bubblePadding * 2) } });
let bounds = this.content.getBounds();
this.content.setPosition(this.bubble.x + (bubbleWidth / 2) - (bounds.width / 2), this.bubble.y + (bubbleHeight / 2) - (bounds.height / 2));
}
/**
*
* @param x
* @param y
*/
moveBubble(x : number, y : number) {
if (this.bubble) {
this.bubble.setPosition((x + 16), (y - 80));
}
if (this.content) {
let bubbleHeight = 50;
let bubblePadding = 10;
let bubbleWidth = bubblePadding * 2 + this.content.text.length * 10;
let bounds = this.content.getBounds();
//this.content.setPosition(x, y);
this.content.setPosition(this.bubble.x + (bubbleWidth / 2) - (bounds.width / 2), this.bubble.y + (bubbleHeight / 2) - (bounds.height / 2));
}
}
destroy(): void {
this.bubble.setVisible(false) //todo find a better way
this.bubble.destroy();
this.bubble = null;
this.content.destroy();
this.content = null;
}
}

8
front/src/Phaser/Entity/Sprite.ts Normal file
View File

@ -0,0 +1,8 @@
export class Sprite extends Phaser.GameObjects.Sprite {
constructor(scene: Phaser.Scene, x: number, y: number, texture: string, frame?: number | string) {
super(scene, x, y, texture, frame);
scene.sys.updateList.add(this);
scene.sys.displayList.add(this);
}
}

14
front/src/Phaser/Game/CameraManager.ts
View File

@ -1,24 +1,20 @@
import {RESOLUTION} from "../../Enum/EnvironmentVariable";
import {Player} from "../Player/Player";
import {MapManagerInterface} from "./MapManager";
import {GameSceneInterface} from "./GameScene";
export interface CameraManagerInterface {
MapManager : MapManagerInterface;
moveCamera(CurrentPlayer : Player) : void;
}
export class CameraManager implements CameraManagerInterface{
Scene : Phaser.Scene;
Scene : GameSceneInterface;
Camera : Phaser.Cameras.Scene2D.Camera;
MapManager : MapManagerInterface;
constructor(
Scene: Phaser.Scene,
Scene: GameSceneInterface,
Camera : Phaser.Cameras.Scene2D.Camera,
MapManager: MapManagerInterface,
) {
this.Scene = Scene;
this.MapManager = MapManager;
this.Camera = Camera;
}
@ -30,8 +26,8 @@ export class CameraManager implements CameraManagerInterface{
let limit = {
top: startY,
left: startX,
bottom : this.MapManager.Map.heightInPixels - startY,
right: this.MapManager.Map.widthInPixels - startX,
bottom : this.Scene.Map.heightInPixels - startY,
right: this.Scene.Map.widthInPixels - startX,
};
if(CurrentPlayer.x < limit.left){

1
front/src/Phaser/Game/GameManager.ts
View File

@ -50,6 +50,7 @@ export class GameManager implements GameManagerInterface {
* @param UserId
*/
createCurrentPlayer(): void {
//Get started room send by the backend
let game: GameSceneInterface = this.GameScenes.find((Game: GameSceneInterface) => Game.RoomId === ConnexionInstance.startedRoom);
game.createCurrentPlayer(ConnexionInstance.userId);
this.status = StatusGameManagerEnum.CURRENT_USER_CREATED;

195
front/src/Phaser/Game/GameScene.ts
View File

@ -1,16 +1,35 @@
import {MapManagerInterface, MapManager} from "./MapManager";
import {GameManagerInterface, StatusGameManagerEnum} from "./GameManager";
import {MessageUserPositionInterface} from "../../Connexion";
import {CameraManager, CameraManagerInterface} from "./CameraManager";
import {CurrentGamerInterface, GamerInterface, Player} from "../Player/Player";
import {RESOLUTION} from "../../Enum/EnvironmentVariable";
import Tile = Phaser.Tilemaps.Tile;
export enum Textures {
Rock = 'rock',
Player = 'playerModel',
Map = 'map',
Tiles = 'tiles'
}
export interface GameSceneInterface extends Phaser.Scene {
RoomId : string;
Map: Phaser.Tilemaps.Tilemap;
createCurrentPlayer(UserId : string) : void;
shareUserPosition(UsersPosition : Array<MessageUserPositionInterface>): void;
}
export class GameScene extends Phaser.Scene implements GameSceneInterface{
private MapManager : MapManagerInterface;
GameManager : GameManagerInterface;
RoomId : string;
Terrain : Phaser.Tilemaps.Tileset;
Camera: CameraManagerInterface;
CurrentPlayer: CurrentGamerInterface;
MapPlayers : Phaser.Physics.Arcade.Group;
Map: Phaser.Tilemaps.Tilemap;
Layers : Array<Phaser.Tilemaps.StaticTilemapLayer>;
Objects : Array<Phaser.Physics.Arcade.Sprite>;
startX = (window.innerWidth / 2) / RESOLUTION;
startY = (window.innerHeight / 2) / RESOLUTION;
constructor(RoomId : string, GameManager : GameManagerInterface) {
super({
@ -22,9 +41,10 @@ export class GameScene extends Phaser.Scene implements GameSceneInterface{
//hook preload scene
preload(): void {
this.load.image('tiles', 'maps/tiles.png');
this.load.tilemapTiledJSON('map', 'maps/map2.json');
this.load.spritesheet('player',
this.load.image(Textures.Tiles, 'maps/tiles.png');
this.load.tilemapTiledJSON(Textures.Map, 'maps/map2.json');
this.load.image(Textures.Rock, 'resources/objects/rockSprite.png');
this.load.spritesheet(Textures.Player,
'resources/characters/pipoya/Male 01-1.png',
{ frameWidth: 32, frameHeight: 32 }
);
@ -35,26 +55,100 @@ export class GameScene extends Phaser.Scene implements GameSceneInterface{
//hook create scene
create(): void {
//create map manager
this.MapManager = new MapManager(this);
//initalise map
this.Map = this.add.tilemap("map");
this.Terrain = this.Map.addTilesetImage("tiles", "tiles");
this.Map.createStaticLayer("tiles", "tiles");
//permit to set bound collision
this.physics.world.setBounds(0,0, this.Map.widthInPixels, this.Map.heightInPixels);
//add layer on map
this.Layers = new Array<Phaser.Tilemaps.StaticTilemapLayer>();
this.addLayer( this.Map.createStaticLayer("Calque 1", [this.Terrain], 0, 0).setDepth(-2) );
this.addLayer( this.Map.createStaticLayer("Calque 2", [this.Terrain], 0, 0).setDepth(-1) );
//add entities
this.Objects = new Array<Phaser.Physics.Arcade.Sprite>();
this.addSpite(this.physics.add.sprite(200, 400, Textures.Rock, 26));
//init event click
this.EventToClickOnTile();
//initialise camera
this.Camera = new CameraManager(this, this.cameras.main);
//initialise list of other player
this.MapPlayers = this.physics.add.group({ immovable: true });
//notify game manager can to create currentUser in map
this.GameManager.createCurrentPlayer();
}
/**
* Create current player
* @param UserId
*/
createCurrentPlayer(UserId : string): void {
this.MapManager.createCurrentPlayer(UserId)
addLayer(Layer : Phaser.Tilemaps.StaticTilemapLayer){
this.Layers.push(Layer);
}
//hook update
update(dt: number): void {
if(this.GameManager.status === StatusGameManagerEnum.IN_PROGRESS){
return;
createCollisionWithPlayer() {
//add collision layer
this.Layers.forEach((Layer: Phaser.Tilemaps.StaticTilemapLayer) => {
this.physics.add.collider(this.CurrentPlayer, Layer, (object1: any, object2: any) => {
this.CurrentPlayer.say("Collision with layer : "+ (object2 as Tile).layer.name)
});
Layer.setCollisionByProperty({collides: true});
//debug code
//debug code to see the collision hitbox of the object in the top layer
Layer.renderDebug(this.add.graphics(), {
tileColor: null, //non-colliding tiles
collidingTileColor: new Phaser.Display.Color(243, 134, 48, 200), // Colliding tiles,
faceColor: new Phaser.Display.Color(40, 39, 37, 255) // Colliding face edges
});
});
}
this.MapManager.update();
addSpite(Object : Phaser.Physics.Arcade.Sprite){
Object.setImmovable(true);
this.Objects.push(Object);
}
createCollisionObject(){
this.Objects.forEach((Object : Phaser.Physics.Arcade.Sprite) => {
this.physics.add.collider(this.CurrentPlayer, Object, (object1: any, object2: any) => {
this.CurrentPlayer.say("Collision with object : " + (object2 as Phaser.Physics.Arcade.Sprite).texture.key)
});
})
}
createCurrentPlayer(UserId : string){
//initialise player
this.CurrentPlayer = new Player(
UserId,
this,
this.startX,
this.startY,
this.Camera,
);
this.CurrentPlayer.initAnimation();
//create collision
this.createCollisionWithPlayer();
this.createCollisionObject();
}
EventToClickOnTile(){
// debug code to get a tile properties by clicking on it
this.input.on("pointerdown", (pointer: Phaser.Input.Pointer)=>{
//pixel position toz tile position
let tile = this.Map.getTileAt(this.Map.worldToTileX(pointer.worldX), this.Map.worldToTileY(pointer.worldY));
if(tile){
this.CurrentPlayer.say("Your touch " + tile.layer.name);
}
});
}
update() : void {
this.CurrentPlayer.moveUser();
}
/**
@ -62,6 +156,69 @@ export class GameScene extends Phaser.Scene implements GameSceneInterface{
* @param UsersPosition
*/
shareUserPosition(UsersPosition : Array<MessageUserPositionInterface>): void {
this.MapManager.updateOrCreateMapPlayer(UsersPosition);
this.updateOrCreateMapPlayer(UsersPosition);
}
/**
* Create new player and clean the player on the map
* @param UsersPosition
*/
updateOrCreateMapPlayer(UsersPosition : Array<MessageUserPositionInterface>){
if(!this.CurrentPlayer){
return;
}
//add or create new user
UsersPosition.forEach((userPosition : MessageUserPositionInterface) => {
if(userPosition.userId === this.CurrentPlayer.userId){
return;
}
let player = this.findPlayerInMap(userPosition.userId);
if(!player){
this.addPlayer(userPosition);
}else{
player.updatePosition(userPosition);
}
});
//clean map
this.MapPlayers.getChildren().forEach((player: GamerInterface) => {
if(UsersPosition.find((message : MessageUserPositionInterface) => message.userId === player.userId)){
return;
}
player.destroy();
this.MapPlayers.remove(player);
});
}
private findPlayerInMap(UserId : string) : GamerInterface | null{
let player = this.MapPlayers.getChildren().find((player: Player) => UserId === player.userId);
if(!player){
return null;
}
return (player as GamerInterface);
}
/**
* Create new player
* @param MessageUserPosition
*/
addPlayer(MessageUserPosition : MessageUserPositionInterface){
//initialise player
let player = new Player(
MessageUserPosition.userId,
this,
MessageUserPosition.position.x,
MessageUserPosition.position.y,
this.Camera,
);
player.initAnimation();
this.MapPlayers.add(player);
player.updatePosition(MessageUserPosition);
//init colision
this.physics.add.collider(this.CurrentPlayer, player, (CurrentPlayer: CurrentGamerInterface, MapPlayer: GamerInterface) => {
CurrentPlayer.say("Hello, how are you ? ");
});
}
}

148
front/src/Phaser/Game/MapManager.ts
View File

@ -1,148 +0,0 @@
import {CameraManager, CameraManagerInterface} from "./CameraManager";
import {RESOLUTION} from "../../Enum/EnvironmentVariable";
import {CurrentGamerInterface, GamerInterface, Player} from "../Player/Player";
import {GameSceneInterface} from "./GameScene";
import {MessageUserPositionInterface} from "../../Connexion";
export interface MapManagerInterface {
keyZ: Phaser.Input.Keyboard.Key;
keyQ: Phaser.Input.Keyboard.Key;
keyS: Phaser.Input.Keyboard.Key;
keyD: Phaser.Input.Keyboard.Key;
keyRight: Phaser.Input.Keyboard.Key;
keyLeft: Phaser.Input.Keyboard.Key;
keyUp: Phaser.Input.Keyboard.Key;
keyDown: Phaser.Input.Keyboard.Key;
keyShift: Phaser.Input.Keyboard.Key;
Map: Phaser.Tilemaps.Tilemap;
Terrain: Phaser.Tilemaps.Tileset;
Camera: CameraManagerInterface;
Scene: GameSceneInterface;
createCurrentPlayer(UserId : string): void;
update(): void;
updateOrCreateMapPlayer(UsersPosition : Array<MessageUserPositionInterface>): void;
}
export class MapManager implements MapManagerInterface{
keyZ: Phaser.Input.Keyboard.Key;
keyQ: Phaser.Input.Keyboard.Key;
keyS: Phaser.Input.Keyboard.Key;
keyD: Phaser.Input.Keyboard.Key;
keyRight: Phaser.Input.Keyboard.Key;
keyLeft: Phaser.Input.Keyboard.Key;
keyUp: Phaser.Input.Keyboard.Key;
keyDown: Phaser.Input.Keyboard.Key;
keyShift: Phaser.Input.Keyboard.Key;
Terrain : Phaser.Tilemaps.Tileset;
Camera: CameraManagerInterface;
CurrentPlayer: CurrentGamerInterface;
MapPlayers : GamerInterface[];
Scene: GameSceneInterface;
Map: Phaser.Tilemaps.Tilemap;
startX = (window.innerWidth / 2) / RESOLUTION;
startY = (window.innerHeight / 2) / RESOLUTION;
constructor(scene: GameSceneInterface){
this.Scene = scene;
//initalise map
this.Map = this.Scene.add.tilemap("map");
this.Terrain = this.Map.addTilesetImage("tiles", "tiles");
this.Map.createStaticLayer("tiles", "tiles");
this.Map.createStaticLayer("Calque 1", [this.Terrain], 0, 0);
this.Map.createStaticLayer("Calque 2", [this.Terrain], 0, 0);
//initialise keyboard
this.initKeyBoard();
//initialise camera
this.Camera = new CameraManager(this.Scene, this.Scene.cameras.main, this);
//initialise list of other player
this.MapPlayers = new Array<GamerInterface>();
}
createCurrentPlayer(UserId : string){
//initialise player
this.CurrentPlayer = new Player(
UserId,
this.Scene,
this.startX,
this.startY,
this.Camera,
this
);
this.CurrentPlayer.initAnimation();
}
initKeyBoard() {
this.keyShift = this.Scene.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.SHIFT);
this.keyZ = this.Scene.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.Z);
this.keyQ = this.Scene.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.Q);
this.keyS = this.Scene.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.S);
this.keyD = this.Scene.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.D);
this.keyUp = this.Scene.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.UP);
this.keyLeft = this.Scene.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.LEFT);
this.keyDown = this.Scene.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.DOWN);
this.keyRight = this.Scene.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.RIGHT);
}
update() : void {
this.CurrentPlayer.move();
}
/**
* Create new player and clean the player on the map
* @param UsersPosition
*/
updateOrCreateMapPlayer(UsersPosition : Array<MessageUserPositionInterface>){
if(!this.CurrentPlayer){
return;
}
//add or create new user
UsersPosition.forEach((userPosition : MessageUserPositionInterface) => {
if(userPosition.userId === this.CurrentPlayer.userId){
return;
}
let player = this.MapPlayers.find((player: Player) => userPosition.userId === player.userId);
if(!player){
this.addPlayer(userPosition);
}else{
player.updatePosition(userPosition);
}
});
//clean map
let mapPlayers = new Array<Player>();
this.MapPlayers.forEach((player: Player) => {
if(UsersPosition.find((message : MessageUserPositionInterface) => message.userId === player.userId)){
mapPlayers.push(player);
return;
}
player.destroy();
});
this.MapPlayers = mapPlayers;
}
/**
* Create new player
* @param MessageUserPosition
*/
addPlayer(MessageUserPosition : MessageUserPositionInterface){
//initialise player
let player = new Player(
MessageUserPosition.userId,
this.Scene,
MessageUserPosition.position.x,
MessageUserPosition.position.y,
this.Camera,
this
);
player.initAnimation();
this.MapPlayers.push(player);
player.updatePosition(MessageUserPosition)
}
}

40
front/src/Phaser/NonPlayer/NonPlayer.ts Normal file
View File

@ -0,0 +1,40 @@
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) {
super(scene, x, y, Textures.Player, 1);
this.setSize(32, 32); //edit the hitbox to better match the caracter 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}
}
}

14
front/src/Phaser/Player/Animation.ts
View File

@ -1,3 +1,5 @@
import {Textures} from "../Game/GameScene";
interface AnimationData {
key: string;
frameRate: number;
@ -15,31 +17,31 @@ export enum PlayerAnimationNames {
None = 'none',
}
export const getPlayerAnimations = (PlayerValue : string): AnimationData[] => {
export const getPlayerAnimations = (): AnimationData[] => {
return [{
key: PlayerAnimationNames.WalkDown,
frameModel: PlayerValue,
frameModel: Textures.Player,
frameStart: 0,
frameEnd: 2,
frameRate: 10,
repeat: -1
}, {
key: PlayerAnimationNames.WalkLeft,
frameModel: PlayerValue,
frameModel: Textures.Player,
frameStart: 3,
frameEnd: 5,
frameRate: 10,
repeat: -1
}, {
key: PlayerAnimationNames.WalkRight,
frameModel: PlayerValue,
frameModel: Textures.Player,
frameStart: 6,
frameEnd: 8,
frameRate: 10,
repeat: -1
}, {
key: PlayerAnimationNames.WalkUp,
frameModel: PlayerValue,
frameModel: Textures.Player,
frameStart: 9,
frameEnd: 11,
frameRate: 10,
@ -53,4 +55,4 @@ export const playAnimation = (Player : Phaser.GameObjects.Sprite, direction : st
} else if (direction === PlayerAnimationNames.None && Player.anims.currentAnim) {
Player.anims.currentAnim.destroy();
}
};
}

94
front/src/Phaser/Player/Player.ts
View File

@ -1,33 +1,34 @@
import {MapManagerInterface} from "../Game/MapManager";
import {getPlayerAnimations, playAnimation, PlayerAnimationNames} from "./Animation";
import {GameSceneInterface} from "../Game/GameScene";
import {GameSceneInterface, Textures} from "../Game/GameScene";
import {ConnexionInstance} from "../Game/GameManager";
import {CameraManagerInterface} from "../Game/CameraManager";
import {MessageUserPositionInterface} from "../../Connexion";
import {ActiveEventList, UserInputEvent, UserInputManager} from "../UserInput/UserInputManager";
import {PlayableCaracter} from "../Entity/PlayableCaracter";
export interface CurrentGamerInterface{
export interface CurrentGamerInterface extends PlayableCaracter{
userId : string;
MapManager : MapManagerInterface;
PlayerValue : string;
CameraManager: CameraManagerInterface;
initAnimation() : void;
move() : void;
moveUser() : void;
say(text : string) : void;
}
export interface GamerInterface{
export interface GamerInterface extends PlayableCaracter{
userId : string;
MapManager : MapManagerInterface;
PlayerValue : string;
CameraManager: CameraManagerInterface;
initAnimation() : void;
updatePosition(MessageUserPosition : MessageUserPositionInterface) : void;
say(text : string) : void;
}
export class Player extends Phaser.GameObjects.Sprite implements CurrentGamerInterface, GamerInterface{
export class Player extends PlayableCaracter implements CurrentGamerInterface, GamerInterface {
userId: string;
MapManager : MapManagerInterface;
PlayerValue: string;
CameraManager: CameraManagerInterface;
userInputManager: UserInputManager;
constructor(
userId: string,
@ -35,19 +36,26 @@ export class Player extends Phaser.GameObjects.Sprite implements CurrentGamerInt
x: number,
y: number,
CameraManager: CameraManagerInterface,
MapManager: MapManagerInterface,
PlayerValue : string = "player"
PlayerValue: string = Textures.Player
) {
super(Scene, x, y, PlayerValue);
super(Scene, x, y, PlayerValue, 1);
//create input to move
this.userInputManager = new UserInputManager(Scene);
//set data
this.userId = userId;
this.PlayerValue = PlayerValue;
Scene.add.existing(this);
this.MapManager = MapManager;
this.CameraManager = CameraManager;
//the current player model should be push away by other players to prevent conflict
this.setImmovable(false);
//edit the hitbox to better match the caracter model
this.setSize(32, 32);
}
initAnimation(): void {
getPlayerAnimations(this.PlayerValue).forEach(d => {
getPlayerAnimations().forEach(d => {
this.scene.anims.create({
key: d.key,
frames: this.scene.anims.generateFrameNumbers(d.frameModel, {start: d.frameStart, end: d.frameEnd}),
@ -57,51 +65,37 @@ export class Player extends Phaser.GameObjects.Sprite implements CurrentGamerInt
})
}
move() : void{
moveUser(): void {
//if user client on shift, camera and player speed
let speedMultiplier = this.MapManager.keyShift.isDown ? 5 : 1;
let haveMove = false;
let direction = null;
if((this.MapManager.keyZ.isDown || this.MapManager.keyUp.isDown)){
if(!this.CanMoveUp()){
return;
}
playAnimation(this, PlayerAnimationNames.WalkUp);
this.setY(this.y - (2 * speedMultiplier));
let activeEvents = this.userInputManager.getEventListForGameTick();
let speedMultiplier = activeEvents.get(UserInputEvent.SpeedUp) ? 500 : 100;
if (activeEvents.get(UserInputEvent.MoveUp)) {
this.move(0, -speedMultiplier);
haveMove = true;
direction = PlayerAnimationNames.WalkUp;
}
if((this.MapManager.keyQ.isDown || this.MapManager.keyLeft.isDown)){
if(!this.CanMoveLeft()){
return;
}
playAnimation(this, PlayerAnimationNames.WalkLeft);
this.setX(this.x - (2 * speedMultiplier));
if (activeEvents.get(UserInputEvent.MoveLeft)) {
this.move(-speedMultiplier, 0);
haveMove = true;
direction = PlayerAnimationNames.WalkLeft;
}
if((this.MapManager.keyS.isDown || this.MapManager.keyDown.isDown)){
if(!this.CanMoveDown()){
return;
}
playAnimation(this, PlayerAnimationNames.WalkDown);
this.setY(this.y + (2 * speedMultiplier));
if (activeEvents.get(UserInputEvent.MoveDown)) {
this.move(0, speedMultiplier);
haveMove = true;
direction = PlayerAnimationNames.WalkDown;
}
if((this.MapManager.keyD.isDown || this.MapManager.keyRight.isDown)){
if(!this.CanMoveRight()){
return;
}
playAnimation(this, PlayerAnimationNames.WalkRight);
this.setX(this.x + (2 * speedMultiplier));
if (activeEvents.get(UserInputEvent.MoveRight)) {
this.move(speedMultiplier, 0);
haveMove = true;
direction = PlayerAnimationNames.WalkRight;
}
if (!haveMove) {
playAnimation(this, PlayerAnimationNames.None);
direction = PlayerAnimationNames.None;
this.stop();
}
this.sharePosition(direction);
this.CameraManager.moveCamera(this);
@ -113,22 +107,6 @@ export class Player extends Phaser.GameObjects.Sprite implements CurrentGamerInt
}
}
private CanMoveUp(){
return this.y > 0;
}
private CanMoveLeft(){
return this.x > 0;
}
private CanMoveDown(){
return this.MapManager.Map.heightInPixels > this.y;
}
private CanMoveRight(){
return this.MapManager.Map.widthInPixels > this.x;
}
updatePosition(MessageUserPosition: MessageUserPositionInterface) {
playAnimation(this, MessageUserPosition.position.direction);
this.setX(MessageUserPosition.position.x);

68
front/src/Phaser/UserInput/UserInputManager.ts Normal file
View File

@ -0,0 +1,68 @@
import Map = Phaser.Structs.Map;
import {GameSceneInterface} from "../Game/GameScene";
interface UserInputManagerDatum {
keyCode: number;
keyInstance: Phaser.Input.Keyboard.Key;
event: UserInputEvent
}
export enum UserInputEvent {
MoveLeft = 1,
MoveUp,
MoveRight,
MoveDown,
SpeedUp,
Interact,
Shout,
}
//we cannot the map structure so we have to create a replacment
export class ActiveEventList {
private KeysCode : any;
constructor() {
this.KeysCode = {};
}
get(event: UserInputEvent): boolean {
return this.KeysCode[event] || false;
}
set(event: UserInputEvent, value: boolean): boolean {
return this.KeysCode[event] = true;
}
}
//this class is responsible for catching user inputs and listing all active user actions at every game tick events.
export class UserInputManager {
private KeysCode: UserInputManagerDatum[] = [
{keyCode: Phaser.Input.Keyboard.KeyCodes.Z, event: UserInputEvent.MoveUp, keyInstance: null},
{keyCode: Phaser.Input.Keyboard.KeyCodes.Q, event: UserInputEvent.MoveLeft, keyInstance: null},
{keyCode: Phaser.Input.Keyboard.KeyCodes.S, event: UserInputEvent.MoveDown, keyInstance: null},
{keyCode: Phaser.Input.Keyboard.KeyCodes.D, event: UserInputEvent.MoveRight, keyInstance: null},
{keyCode: Phaser.Input.Keyboard.KeyCodes.UP, event: UserInputEvent.MoveUp, keyInstance: null},
{keyCode: Phaser.Input.Keyboard.KeyCodes.LEFT, event: UserInputEvent.MoveLeft, keyInstance: null},
{keyCode: Phaser.Input.Keyboard.KeyCodes.DOWN, event: UserInputEvent.MoveDown, keyInstance: null},
{keyCode: Phaser.Input.Keyboard.KeyCodes.RIGHT, event: UserInputEvent.MoveRight, keyInstance: null},
{keyCode: Phaser.Input.Keyboard.KeyCodes.SHIFT, event: UserInputEvent.SpeedUp, keyInstance: null},
{keyCode: Phaser.Input.Keyboard.KeyCodes.E, event: UserInputEvent.Interact, keyInstance: null},
{keyCode: Phaser.Input.Keyboard.KeyCodes.F, event: UserInputEvent.Shout, keyInstance: null},
];
constructor(Scene : GameSceneInterface) {
this.KeysCode.forEach(d => {
d.keyInstance = Scene.input.keyboard.addKey(d.keyCode);
});
}
getEventListForGameTick(): ActiveEventList {
let eventsMap = new ActiveEventList();
this.KeysCode.forEach(d => {
if (d. keyInstance.isDown) {
eventsMap.set(d.event, true);
}
});
return eventsMap;
}
}

6
front/src/index.ts
View File

@ -12,6 +12,12 @@ const config: GameConfig = {
parent: "game",
scene: gameManager.GameScenes,
zoom: RESOLUTION,
physics: {
default: "arcade",
arcade: {
debug: true
}
}
};
gameManager.createGame().then(() => {