workadventure/front/src/Phaser/Game/GameScene.ts

271 lines
9.5 KiB
TypeScript
Raw Normal View History

import {GameManager, gameManager, StatusGameManagerEnum} from "./GameManager";
import {MessageUserPositionInterface} from "../../Connexion";
2020-04-13 15:34:09 +02:00
import {CurrentGamerInterface, GamerInterface, Player} from "../Player/Player";
import {DEBUG_MODE, RESOLUTION, ROOM, ZOOM_LEVEL} from "../../Enum/EnvironmentVariable";
2020-04-13 15:34:09 +02:00
import Tile = Phaser.Tilemaps.Tile;
2020-04-15 23:10:12 +02:00
import {ITiledMap, ITiledTileSet} from "../Map/ITiledMap";
2020-04-14 20:04:55 +02:00
import {cypressAsserter} from "../../Cypress/CypressAsserter";
import { GameSceneInitDataInterface } from "./GameSceneInitDataInterface";
export const GameSceneName = "GameScene";
2020-04-11 18:17:36 +02:00
export enum Textures {
2020-04-12 18:28:05 +02:00
Player = 'playerModel',
Map = 'map'
2020-04-11 18:17:36 +02:00
}
2020-04-07 20:41:35 +02:00
export interface GameSceneInterface extends Phaser.Scene {
2020-04-13 15:34:09 +02:00
Map: Phaser.Tilemaps.Tilemap;
createCurrentPlayer(UserId : string) : void;
shareUserPosition(UsersPosition : Array<MessageUserPositionInterface>): void;
2020-04-07 20:41:35 +02:00
}
export class GameScene extends Phaser.Scene implements GameSceneInterface{
GameManager : GameManager;
Terrains : Array<Phaser.Tilemaps.Tileset>;
2020-04-13 15:34:09 +02:00
CurrentPlayer: CurrentGamerInterface;
MapPlayers : Phaser.Physics.Arcade.Group;
Map: Phaser.Tilemaps.Tilemap;
Layers : Array<Phaser.Tilemaps.StaticTilemapLayer>;
Objects : Array<Phaser.Physics.Arcade.Sprite>;
2020-04-15 23:10:12 +02:00
map: ITiledMap;
2020-04-13 15:34:09 +02:00
startX = (window.innerWidth / 2) / RESOLUTION;
startY = (window.innerHeight / 2) / RESOLUTION;
playerName: string;
constructor() {
super({
key: GameSceneName
});
this.GameManager = gameManager;
this.Terrains = [];
}
//hook preload scene
preload(): void {
this.GameManager.setCurrentGameScene(this);
2020-04-14 20:04:55 +02:00
cypressAsserter.preloadStarted();
2020-04-15 19:30:49 +02:00
let mapUrl = 'maps/map.json';
this.load.on('filecomplete-tilemapJSON-'+Textures.Map, (key: string, type: string, data: any) => {
// Triggered when the map is loaded
// Load tiles attached to the map recursively
2020-04-15 23:10:12 +02:00
this.map = data.data;
this.map.tilesets.forEach((tileset) => {
if (typeof tileset.name === 'undefined' || typeof tileset.image === 'undefined') {
console.warn("Don't know how to handle tileset ", tileset)
return;
}
let path = mapUrl.substr(0, mapUrl.lastIndexOf('/'));
this.load.image(tileset.name, path + '/' + tileset.image);
})
});
this.load.tilemapTiledJSON(Textures.Map, mapUrl);
this.load.spritesheet(Textures.Player,
'resources/characters/pipoya/Male 01-1.png',
{ frameWidth: 32, frameHeight: 32 }
);
this.load.bitmapFont('main_font', 'resources/fonts/arcade.png', 'resources/fonts/arcade.xml');
2020-04-14 20:04:55 +02:00
cypressAsserter.preloadFinished();
}
//hook initialisation
init(data: GameSceneInitDataInterface) {
this.playerName = data.name;
}
//hook create scene
create(): void {
2020-04-14 20:04:55 +02:00
cypressAsserter.initStarted();
2020-04-13 15:34:09 +02:00
//initalise map
this.Map = this.add.tilemap("map");
2020-04-15 23:10:12 +02:00
this.map.tilesets.forEach((tileset: ITiledTileSet) => {
this.Terrains.push(this.Map.addTilesetImage(tileset.name, tileset.name));
});
2020-04-13 15:34:09 +02:00
//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>();
2020-04-15 23:10:12 +02:00
let depth = -2;
this.map.layers.forEach((layer) => {
if (layer.type === 'tilelayer') {
this.addLayer( this.Map.createStaticLayer(layer.name, this.Terrains, 0, 0).setDepth(depth) );
} else if (layer.type === 'objectgroup' && layer.name === 'floorLayer') {
depth = -1;
}
});
if (depth === -2) {
throw new Error('Your map MUST contain a layer of type "objectgroup" whose name is "floorLayer" that represents the layer characters are drawn at.');
}
2020-04-13 15:34:09 +02:00
//add entities
this.Objects = new Array<Phaser.Physics.Arcade.Sprite>();
//init event click
this.EventToClickOnTile();
//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();
//initialise camera
this.initCamera();
2020-04-14 20:04:55 +02:00
cypressAsserter.initFinished();
}
//todo: in a dedicated class/function?
initCamera() {
this.cameras.main.setBounds(0,0, this.Map.widthInPixels, this.Map.heightInPixels);
this.cameras.main.startFollow(this.CurrentPlayer);
this.cameras.main.setZoom(ZOOM_LEVEL);
}
2020-04-13 15:34:09 +02:00
addLayer(Layer : Phaser.Tilemaps.StaticTilemapLayer){
this.Layers.push(Layer);
}
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)
2020-04-13 15:34:09 +02:00
});
Layer.setCollisionByProperty({collides: true});
2020-04-13 19:40:10 +02:00
if (DEBUG_MODE) {
//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
});
}
2020-04-13 15:34:09 +02:00
});
}
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)
2020-04-13 15:34:09 +02:00
});
})
}
createCurrentPlayer(UserId : string){
//initialise player
this.CurrentPlayer = new Player(
UserId,
this,
this.startX,
this.startY,
this.playerName
2020-04-13 15:34:09 +02:00
);
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){
2020-04-13 19:40:10 +02:00
console.log(tile)
2020-04-13 15:34:09 +02:00
this.CurrentPlayer.say("Your touch " + tile.layer.name);
}
});
}
/**
* @param time
* @param delta The delta time in ms since the last frame. This is a smoothed and capped value based on the FPS rate.
*/
update(time: number, delta: number) : void {
this.CurrentPlayer.moveUser(delta);
2020-04-13 15:34:09 +02:00
}
/**
2020-04-13 15:34:09 +02:00
* Share position in scene
* @param UsersPosition
*/
2020-04-13 15:34:09 +02:00
shareUserPosition(UsersPosition : Array<MessageUserPositionInterface>): void {
this.updateOrCreateMapPlayer(UsersPosition);
}
2020-04-13 15:34:09 +02:00
/**
* Create new player and clean the player on the map
* @param UsersPosition
*/
updateOrCreateMapPlayer(UsersPosition : Array<MessageUserPositionInterface>){
if(!this.CurrentPlayer){
return;
}
2020-04-13 15:34:09 +02:00
//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);
}
2020-04-07 20:41:35 +02:00
/**
2020-04-13 15:34:09 +02:00
* Create new player
* @param MessageUserPosition
*/
2020-04-13 15:34:09 +02:00
addPlayer(MessageUserPosition : MessageUserPositionInterface){
//initialise player
let player = new Player(
MessageUserPosition.userId,
this,
MessageUserPosition.position.x,
MessageUserPosition.position.y,
'Foo'
2020-04-13 15:34:09 +02:00
);
player.initAnimation();
this.MapPlayers.add(player);
player.updatePosition(MessageUserPosition);
//init colision
this.physics.add.collider(this.CurrentPlayer, player, (CurrentPlayer: CurrentGamerInterface, MapPlayer: GamerInterface) => {
2020-04-13 15:35:38 +02:00
CurrentPlayer.say("Hello, how are you ? ");
2020-04-13 15:34:09 +02:00
});
2020-04-07 20:41:35 +02:00
}
}