Merge branch 'interaction' into kharhamel-interaction

# Conflicts:
#	front/src/Phaser/Game/CameraManager.ts
#	front/src/Phaser/Game/GameScene.ts
#	front/src/Phaser/Game/MapManager.ts
#	front/src/Phaser/Player/Player.ts
This commit is contained in:
gparant 2020-04-13 13:42:21 +02:00
commit 01dbff7aee
13 changed files with 367 additions and 89 deletions

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;

View file

@ -2,6 +2,13 @@ import {MapManagerInterface, MapManager} from "./MapManager";
import {GameManagerInterface, StatusGameManagerEnum} from "./GameManager";
import {MessageUserPositionInterface} from "../../Connexion";
export enum Textures {
Rock = 'rock',
Player = 'playerModel',
Map = 'map',
Tiles = 'tiles'
}
export interface GameSceneInterface extends Phaser.Scene {
RoomId : string;
createCurrentPlayer(UserId : string) : void;
@ -22,9 +29,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 }
);

View file

@ -1,20 +1,11 @@
import {CameraManager, CameraManagerInterface} from "./CameraManager";
import {RESOLUTION} from "../../Enum/EnvironmentVariable";
import {CurrentGamerInterface, GamerInterface, Player} from "../Player/Player";
import {GameSceneInterface} from "./GameScene";
import {GameSceneInterface, Textures} from "./GameScene";
import {MessageUserPositionInterface} from "../../Connexion";
import {NonPlayer} from "../NonPlayer/NonPlayer";
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;
@ -25,25 +16,20 @@ export interface MapManagerInterface {
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[];
MapPlayers : Phaser.Physics.Arcade.Group;
Scene: GameSceneInterface;
Map: Phaser.Tilemaps.Tilemap;
BottomLayer: Phaser.Tilemaps.StaticTilemapLayer;
TopLayer: Phaser.Tilemaps.StaticTilemapLayer;
startX = (window.innerWidth / 2) / RESOLUTION;
startY = (window.innerHeight / 2) / RESOLUTION;
//entities
private rock: Phaser.Physics.Arcade.Sprite;
constructor(scene: GameSceneInterface){
this.Scene = scene;
@ -51,15 +37,29 @@ export class MapManager implements MapManagerInterface{
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);
this.BottomLayer = this.Map.createStaticLayer("Calque 1", [this.Terrain], 0, 0).setDepth(-2);
this.TopLayer = this.Map.createStaticLayer("Calque 2", [this.Terrain], 0, 0).setDepth(-1);
this.Scene.physics.world.setBounds(0,0, this.Map.widthInPixels, this.Map.heightInPixels);
//add entitites
this.rock = this.Scene.physics.add.sprite(200, 400, Textures.Rock, 26).setImmovable(true);
//debug code
//debug code to see the collision hitbox of the object in the top layer
this.TopLayer.renderDebug(this.Scene.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
});
//init event click
this.EventToClickOnTile();
//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>();
this.MapPlayers = this.Scene.physics.add.group({ immovable: true });
}
createCurrentPlayer(UserId : string){
@ -73,24 +73,28 @@ export class MapManager implements MapManagerInterface{
this
);
this.CurrentPlayer.initAnimation();
//create collision
this.Scene.physics.add.collider(this.CurrentPlayer, this.rock);
//add collision layer
this.Scene.physics.add.collider(this.CurrentPlayer, this.TopLayer);
this.TopLayer.setCollisionByProperty({collides:true});
}
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);
EventToClickOnTile(){
// debug code to get a tile properties by clicking on it
this.Scene.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){
//console.log("MapManager => tile => pointerdown", tile);
this.CurrentPlayer.say("Your touch " + tile.layer.name);
}
});
}
update() : void {
this.CurrentPlayer.move();
this.CurrentPlayer.moveUser();
}
/**
@ -107,7 +111,7 @@ export class MapManager implements MapManagerInterface{
if(userPosition.userId === this.CurrentPlayer.userId){
return;
}
let player = this.MapPlayers.find((player: Player) => userPosition.userId === player.userId);
let player = this.findPlayerInMap(userPosition.userId);
if(!player){
this.addPlayer(userPosition);
}else{
@ -116,15 +120,21 @@ export class MapManager implements MapManagerInterface{
});
//clean map
let mapPlayers = new Array<Player>();
this.MapPlayers.forEach((player: Player) => {
this.MapPlayers.getChildren().forEach((player: GamerInterface) => {
if(UsersPosition.find((message : MessageUserPositionInterface) => message.userId === player.userId)){
mapPlayers.push(player);
return;
}
player.destroy();
this.MapPlayers.remove(player);
});
this.MapPlayers = mapPlayers;
}
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);
}
/**
@ -142,7 +152,12 @@ export class MapManager implements MapManagerInterface{
this
);
player.initAnimation();
this.MapPlayers.push(player);
player.updatePosition(MessageUserPosition)
this.MapPlayers.add(player);
player.updatePosition(MessageUserPosition);
//init colision
this.Scene.physics.add.collider(this.CurrentPlayer, player, (CurrentPlayer: CurrentGamerInterface, MapPlayer: GamerInterface) => {
MapPlayer.say("Hello, how are you ? ");
});
}
}