2020-05-23 16:50:17 +02:00
|
|
|
import {GameManager, gameManager, HasMovedEvent} from "./GameManager";
|
2020-05-19 19:11:12 +02:00
|
|
|
import {
|
2020-06-22 11:58:07 +02:00
|
|
|
Connection,
|
|
|
|
GroupCreatedUpdatedMessageInterface, MessageUserJoined,
|
2020-05-19 19:11:12 +02:00
|
|
|
MessageUserMovedInterface,
|
2020-05-23 15:43:26 +02:00
|
|
|
MessageUserPositionInterface, PointInterface, PositionInterface
|
2020-05-24 23:14:12 +02:00
|
|
|
} from "../../Connection";
|
2020-06-04 18:54:34 +02:00
|
|
|
import {CurrentGamerInterface, hasMovedEventName, Player} from "../Player/Player";
|
2020-06-01 22:42:18 +02:00
|
|
|
import { DEBUG_MODE, ZOOM_LEVEL, POSITION_DELAY } from "../../Enum/EnvironmentVariable";
|
2020-06-19 16:36:40 +02:00
|
|
|
import {
|
|
|
|
ITiledMap,
|
|
|
|
ITiledMapLayer,
|
|
|
|
ITiledMapLayerProperty,
|
|
|
|
ITiledTileSet
|
|
|
|
} from "../Map/ITiledMap";
|
|
|
|
import {PLAYER_RESOURCES, PlayerResourceDescriptionInterface} from "../Entity/Character";
|
2020-05-08 16:09:50 +02:00
|
|
|
import Texture = Phaser.Textures.Texture;
|
|
|
|
import Sprite = Phaser.GameObjects.Sprite;
|
|
|
|
import CanvasTexture = Phaser.Textures.CanvasTexture;
|
2020-05-19 19:11:12 +02:00
|
|
|
import {AddPlayerInterface} from "./AddPlayerInterface";
|
2020-05-22 22:59:43 +02:00
|
|
|
import {PlayerAnimationNames} from "../Player/Animation";
|
2020-06-02 13:44:42 +02:00
|
|
|
import {PlayerMovement} from "./PlayerMovement";
|
|
|
|
import {PlayersPositionInterpolator} from "./PlayersPositionInterpolator";
|
2020-06-04 18:54:34 +02:00
|
|
|
import {RemotePlayer} from "../Entity/RemotePlayer";
|
2020-06-09 23:12:54 +02:00
|
|
|
import GameObject = Phaser.GameObjects.GameObject;
|
2020-06-19 18:18:43 +02:00
|
|
|
import { Queue } from 'queue-typescript';
|
2020-06-22 11:58:07 +02:00
|
|
|
import {SimplePeer} from "../../WebRtc/SimplePeer";
|
2020-06-22 15:00:23 +02:00
|
|
|
import {ReconnectingSceneName} from "../Reconnecting/ReconnectingScene";
|
2020-06-19 18:18:43 +02:00
|
|
|
|
2020-04-07 19:23:21 +02:00
|
|
|
|
2020-04-11 18:17:36 +02:00
|
|
|
export enum Textures {
|
2020-05-09 19:41:21 +02:00
|
|
|
Player = "male1"
|
2020-04-11 18:17:36 +02:00
|
|
|
}
|
|
|
|
|
2020-06-07 13:23:32 +02:00
|
|
|
export interface GameSceneInitInterface {
|
|
|
|
initPosition: PointInterface|null,
|
|
|
|
startLayerName: string|undefined
|
2020-05-23 15:43:26 +02:00
|
|
|
}
|
|
|
|
|
2020-06-19 18:18:43 +02:00
|
|
|
interface InitUserPositionEventInterface {
|
|
|
|
type: 'InitUserPositionEvent'
|
|
|
|
event: MessageUserPositionInterface[]
|
|
|
|
}
|
|
|
|
|
|
|
|
interface AddPlayerEventInterface {
|
|
|
|
type: 'AddPlayerEvent'
|
|
|
|
event: AddPlayerInterface
|
|
|
|
}
|
|
|
|
|
|
|
|
interface RemovePlayerEventInterface {
|
|
|
|
type: 'RemovePlayerEvent'
|
|
|
|
userId: string
|
|
|
|
}
|
|
|
|
|
|
|
|
interface UserMovedEventInterface {
|
|
|
|
type: 'UserMovedEvent'
|
|
|
|
event: MessageUserMovedInterface
|
|
|
|
}
|
|
|
|
|
|
|
|
interface GroupCreatedUpdatedEventInterface {
|
|
|
|
type: 'GroupCreatedUpdatedEvent'
|
|
|
|
event: GroupCreatedUpdatedMessageInterface
|
|
|
|
}
|
|
|
|
|
|
|
|
interface DeleteGroupEventInterface {
|
|
|
|
type: 'DeleteGroupEvent'
|
|
|
|
groupId: string
|
|
|
|
}
|
|
|
|
|
2020-05-19 19:11:12 +02:00
|
|
|
export class GameScene extends Phaser.Scene {
|
2020-04-27 15:03:05 +02:00
|
|
|
GameManager : GameManager;
|
2020-04-15 19:39:26 +02:00
|
|
|
Terrains : Array<Phaser.Tilemaps.Tileset>;
|
2020-04-13 15:34:09 +02:00
|
|
|
CurrentPlayer: CurrentGamerInterface;
|
|
|
|
MapPlayers : Phaser.Physics.Arcade.Group;
|
2020-06-04 18:54:34 +02:00
|
|
|
MapPlayersByKey : Map<string, RemotePlayer> = new Map<string, RemotePlayer>();
|
2020-06-04 18:11:07 +02:00
|
|
|
Map: Phaser.Tilemaps.Tilemap;
|
2020-04-13 15:34:09 +02:00
|
|
|
Layers : Array<Phaser.Tilemaps.StaticTilemapLayer>;
|
|
|
|
Objects : Array<Phaser.Physics.Arcade.Sprite>;
|
2020-06-04 18:54:34 +02:00
|
|
|
mapFile: ITiledMap;
|
2020-05-09 19:41:21 +02:00
|
|
|
groups: Map<string, Sprite>;
|
2020-06-07 13:23:32 +02:00
|
|
|
startX: number;
|
|
|
|
startY: number;
|
2020-05-08 16:09:50 +02:00
|
|
|
circleTexture: CanvasTexture;
|
2020-06-19 18:18:43 +02:00
|
|
|
pendingEvents: Queue<InitUserPositionEventInterface|AddPlayerEventInterface|RemovePlayerEventInterface|UserMovedEventInterface|GroupCreatedUpdatedEventInterface|DeleteGroupEventInterface> = new Queue<InitUserPositionEventInterface|AddPlayerEventInterface|RemovePlayerEventInterface|UserMovedEventInterface|GroupCreatedUpdatedEventInterface|DeleteGroupEventInterface>();
|
2020-06-04 18:11:07 +02:00
|
|
|
private initPosition: PositionInterface|null = null;
|
2020-06-02 13:44:42 +02:00
|
|
|
private playersPositionInterpolator = new PlayersPositionInterpolator();
|
2020-06-22 11:58:07 +02:00
|
|
|
private connection: Connection;
|
|
|
|
private simplePeer : SimplePeer;
|
|
|
|
private connectionPromise: Promise<Connection>
|
2020-04-15 19:39:26 +02:00
|
|
|
|
2020-05-09 19:41:21 +02:00
|
|
|
MapKey: string;
|
|
|
|
MapUrlFile: string;
|
2020-05-23 17:27:49 +02:00
|
|
|
RoomId: string;
|
|
|
|
instance: string;
|
2020-05-09 19:41:21 +02:00
|
|
|
|
2020-06-01 22:42:18 +02:00
|
|
|
currentTick: number;
|
|
|
|
lastSentTick: number; // The last tick at which a position was sent.
|
|
|
|
lastMoveEventSent: HasMovedEvent = {
|
|
|
|
direction: '',
|
|
|
|
moving: false,
|
|
|
|
x: -1000,
|
|
|
|
y: -1000
|
|
|
|
}
|
|
|
|
|
2020-06-10 12:15:25 +02:00
|
|
|
private PositionNextScene: Array<Array<{ key: string, hash: string }>> = new Array<Array<{ key: string, hash: string }>>();
|
2020-06-07 13:23:32 +02:00
|
|
|
private startLayerName: string|undefined;
|
2020-05-09 21:28:50 +02:00
|
|
|
|
2020-06-22 11:58:07 +02:00
|
|
|
static createFromUrl(mapUrlFile: string, instance: string, key: string|null = null): GameScene {
|
|
|
|
if (key === null) {
|
|
|
|
key = GameScene.getMapKeyByUrl(mapUrlFile);
|
|
|
|
}
|
2020-05-23 17:27:49 +02:00
|
|
|
return new GameScene(key, mapUrlFile, instance);
|
|
|
|
}
|
|
|
|
|
|
|
|
constructor(MapKey : string, MapUrlFile: string, instance: string) {
|
2020-04-07 19:23:21 +02:00
|
|
|
super({
|
2020-05-09 19:41:21 +02:00
|
|
|
key: MapKey
|
2020-04-07 19:23:21 +02:00
|
|
|
});
|
2020-05-09 19:41:21 +02:00
|
|
|
|
2020-04-27 15:03:05 +02:00
|
|
|
this.GameManager = gameManager;
|
2020-04-15 19:39:26 +02:00
|
|
|
this.Terrains = [];
|
2020-05-08 16:09:50 +02:00
|
|
|
this.groups = new Map<string, Sprite>();
|
2020-05-23 17:27:49 +02:00
|
|
|
this.instance = instance;
|
2020-05-09 19:41:21 +02:00
|
|
|
|
2020-05-23 17:27:49 +02:00
|
|
|
this.MapKey = MapKey;
|
2020-05-09 19:41:21 +02:00
|
|
|
this.MapUrlFile = MapUrlFile;
|
2020-06-22 15:00:23 +02:00
|
|
|
this.RoomId = this.instance + '__' + GameScene.getMapKeyByUrl(MapUrlFile);
|
2020-04-07 19:23:21 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
//hook preload scene
|
|
|
|
preload(): void {
|
2020-06-19 16:36:40 +02:00
|
|
|
this.load.on('filecomplete-tilemapJSON-'+this.MapKey, (key: string, type: string, data: unknown) => {
|
2020-06-03 10:45:25 +02:00
|
|
|
this.onMapLoad(data);
|
2020-04-15 19:23:06 +02:00
|
|
|
});
|
2020-05-10 17:55:30 +02:00
|
|
|
//TODO strategy to add access token
|
2020-05-10 18:34:55 +02:00
|
|
|
this.load.tilemapTiledJSON(this.MapKey, this.MapUrlFile);
|
2020-06-03 10:45:25 +02:00
|
|
|
// If the map has already been loaded as part of another GameScene, the "on load" event will not be triggered.
|
|
|
|
// In this case, we check in the cache to see if the map is here and trigger the event manually.
|
|
|
|
if (this.cache.tilemap.exists(this.MapKey)) {
|
2020-06-09 23:13:26 +02:00
|
|
|
const data = this.cache.tilemap.get(this.MapKey);
|
2020-06-03 10:45:25 +02:00
|
|
|
this.onMapLoad(data);
|
|
|
|
}
|
2020-05-06 01:50:01 +02:00
|
|
|
|
|
|
|
//add player png
|
2020-06-19 16:36:40 +02:00
|
|
|
PLAYER_RESOURCES.forEach((playerResource: PlayerResourceDescriptionInterface) => {
|
2020-05-06 01:50:01 +02:00
|
|
|
this.load.spritesheet(
|
|
|
|
playerResource.name,
|
|
|
|
playerResource.img,
|
|
|
|
{frameWidth: 32, frameHeight: 32}
|
|
|
|
);
|
|
|
|
});
|
|
|
|
|
2020-05-01 23:38:09 +02:00
|
|
|
this.load.bitmapFont('main_font', 'resources/fonts/arcade.png', 'resources/fonts/arcade.xml');
|
2020-06-22 11:58:07 +02:00
|
|
|
|
|
|
|
this.connectionPromise = Connection.createConnection(gameManager.getPlayerName(), gameManager.getCharacterSelected()).then((connection : Connection) => {
|
|
|
|
this.connection = connection;
|
|
|
|
|
|
|
|
connection.onUserJoins((message: MessageUserJoined) => {
|
|
|
|
const userMessage: AddPlayerInterface = {
|
|
|
|
userId: message.userId,
|
|
|
|
character: message.character,
|
|
|
|
name: message.name,
|
|
|
|
position: message.position
|
|
|
|
}
|
|
|
|
this.addPlayer(userMessage);
|
|
|
|
});
|
|
|
|
|
|
|
|
connection.onUserMoved((message: MessageUserMovedInterface) => {
|
|
|
|
this.updatePlayerPosition(message);
|
|
|
|
});
|
|
|
|
|
|
|
|
connection.onUserLeft((userId: string) => {
|
|
|
|
this.removePlayer(userId);
|
|
|
|
});
|
|
|
|
|
|
|
|
connection.onGroupUpdatedOrCreated((groupPositionMessage: GroupCreatedUpdatedMessageInterface) => {
|
|
|
|
this.shareGroupPosition(groupPositionMessage);
|
|
|
|
})
|
|
|
|
|
|
|
|
connection.onGroupDeleted((groupId: string) => {
|
|
|
|
try {
|
|
|
|
this.deleteGroup(groupId);
|
|
|
|
} catch (e) {
|
|
|
|
console.error(e);
|
|
|
|
}
|
|
|
|
})
|
|
|
|
|
2020-06-22 15:00:23 +02:00
|
|
|
connection.onServerDisconnected(() => {
|
|
|
|
console.log('Player disconnected from server. Reloading scene.');
|
|
|
|
|
|
|
|
this.simplePeer.closeAllConnections();
|
|
|
|
|
2020-06-22 16:11:48 +02:00
|
|
|
const key = 'somekey'+Math.round(Math.random()*10000);
|
2020-06-22 15:00:23 +02:00
|
|
|
const game : Phaser.Scene = GameScene.createFromUrl(this.MapUrlFile, this.instance, key);
|
2020-06-22 16:11:02 +02:00
|
|
|
this.scene.add(key, game, true,
|
2020-06-22 15:00:23 +02:00
|
|
|
{
|
|
|
|
initPosition: {
|
|
|
|
x: this.CurrentPlayer.x,
|
|
|
|
y: this.CurrentPlayer.y
|
|
|
|
}
|
|
|
|
});
|
2020-06-22 16:11:02 +02:00
|
|
|
|
|
|
|
this.scene.stop(this.scene.key);
|
|
|
|
this.scene.remove(this.scene.key);
|
2020-06-22 15:00:23 +02:00
|
|
|
})
|
|
|
|
|
2020-06-22 11:58:07 +02:00
|
|
|
// When connection is performed, let's connect SimplePeer
|
|
|
|
this.simplePeer = new SimplePeer(this.connection);
|
|
|
|
|
2020-06-22 16:11:02 +02:00
|
|
|
this.scene.wake();
|
|
|
|
this.scene.sleep(ReconnectingSceneName);
|
2020-06-22 11:58:07 +02:00
|
|
|
|
|
|
|
return connection;
|
|
|
|
});
|
2020-04-07 19:23:21 +02:00
|
|
|
}
|
|
|
|
|
2020-06-19 16:36:40 +02:00
|
|
|
// FIXME: we need to put a "unknown" instead of a "any" and validate the structure of the JSON we are receiving.
|
|
|
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
2020-06-03 10:45:25 +02:00
|
|
|
private onMapLoad(data: any): void {
|
|
|
|
// Triggered when the map is loaded
|
|
|
|
// Load tiles attached to the map recursively
|
2020-06-03 23:17:52 +02:00
|
|
|
this.mapFile = data.data;
|
2020-06-09 23:13:26 +02:00
|
|
|
const url = this.MapUrlFile.substr(0, this.MapUrlFile.lastIndexOf('/'));
|
2020-06-03 23:17:52 +02:00
|
|
|
this.mapFile.tilesets.forEach((tileset) => {
|
2020-06-03 10:45:25 +02:00
|
|
|
if (typeof tileset.name === 'undefined' || typeof tileset.image === 'undefined') {
|
|
|
|
console.warn("Don't know how to handle tileset ", tileset)
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
//TODO strategy to add access token
|
|
|
|
this.load.image(tileset.name, `${url}/${tileset.image}`);
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
2020-04-07 19:23:21 +02:00
|
|
|
//hook initialisation
|
2020-05-23 15:43:26 +02:00
|
|
|
init(initData : GameSceneInitInterface) {
|
2020-06-04 18:11:07 +02:00
|
|
|
if (initData.initPosition !== undefined) {
|
|
|
|
this.initPosition = initData.initPosition;
|
2020-06-07 13:23:32 +02:00
|
|
|
} else if (initData.startLayerName !== undefined) {
|
|
|
|
this.startLayerName = initData.startLayerName;
|
2020-06-04 18:11:07 +02:00
|
|
|
}
|
2020-05-23 15:43:26 +02:00
|
|
|
}
|
2020-04-07 19:23:21 +02:00
|
|
|
|
|
|
|
//hook create scene
|
|
|
|
create(): void {
|
2020-04-13 15:34:09 +02:00
|
|
|
//initalise map
|
2020-05-09 19:41:21 +02:00
|
|
|
this.Map = this.add.tilemap(this.MapKey);
|
2020-06-03 23:17:52 +02:00
|
|
|
this.mapFile.tilesets.forEach((tileset: ITiledTileSet) => {
|
2020-04-15 23:10:12 +02:00
|
|
|
this.Terrains.push(this.Map.addTilesetImage(tileset.name, tileset.name));
|
2020-04-15 19:39:26 +02:00
|
|
|
});
|
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;
|
2020-06-09 23:13:26 +02:00
|
|
|
for (const layer of this.mapFile.layers) {
|
2020-05-08 17:35:40 +02:00
|
|
|
if (layer.type === 'tilelayer') {
|
|
|
|
this.addLayer(this.Map.createStaticLayer(layer.name, this.Terrains, 0, 0).setDepth(depth));
|
2020-05-08 13:18:34 +02:00
|
|
|
}
|
2020-05-11 18:49:20 +02:00
|
|
|
if (layer.type === 'tilelayer' && this.getExitSceneUrl(layer) !== undefined) {
|
2020-06-03 23:17:52 +02:00
|
|
|
this.loadNextGame(layer, this.mapFile.width, this.mapFile.tilewidth, this.mapFile.tileheight);
|
2020-05-09 21:28:50 +02:00
|
|
|
}
|
2020-05-08 17:35:40 +02:00
|
|
|
if (layer.type === 'objectgroup' && layer.name === 'floorLayer') {
|
|
|
|
depth = 10000;
|
2020-04-15 23:10:12 +02:00
|
|
|
}
|
2020-06-07 23:00:05 +02:00
|
|
|
}
|
2020-04-15 23:10:12 +02:00
|
|
|
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
|
|
|
|
2020-06-10 14:57:32 +02:00
|
|
|
// If there is an init position passed
|
|
|
|
if (this.initPosition !== null) {
|
|
|
|
this.startX = this.initPosition.x;
|
|
|
|
this.startY = this.initPosition.y;
|
|
|
|
} else {
|
|
|
|
// Now, let's find the start layer
|
|
|
|
if (this.startLayerName) {
|
2020-06-09 23:13:26 +02:00
|
|
|
for (const layer of this.mapFile.layers) {
|
2020-06-10 14:57:32 +02:00
|
|
|
if (this.startLayerName === layer.name && layer.type === 'tilelayer' && this.isStartLayer(layer)) {
|
2020-06-09 23:13:26 +02:00
|
|
|
const startPosition = this.startUser(layer);
|
2020-06-10 14:57:32 +02:00
|
|
|
this.startX = startPosition.x;
|
|
|
|
this.startY = startPosition.y;
|
|
|
|
}
|
2020-06-07 13:23:32 +02:00
|
|
|
}
|
|
|
|
}
|
2020-06-10 14:57:32 +02:00
|
|
|
if (this.startX === undefined) {
|
|
|
|
// If we have no start layer specified or if the hash passed does not exist, let's go with the default start position.
|
2020-06-09 23:13:26 +02:00
|
|
|
for (const layer of this.mapFile.layers) {
|
2020-06-10 14:57:32 +02:00
|
|
|
if (layer.type === 'tilelayer' && layer.name === "start") {
|
2020-06-09 23:13:26 +02:00
|
|
|
const startPosition = this.startUser(layer);
|
2020-06-10 14:57:32 +02:00
|
|
|
this.startX = startPosition.x;
|
|
|
|
this.startY = startPosition.y;
|
|
|
|
}
|
2020-06-07 13:23:32 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
// Still no start position? Something is wrong with the map, we need a "start" layer.
|
|
|
|
if (this.startX === undefined) {
|
|
|
|
console.warn('This map is missing a layer named "start" that contains the available default start positions.');
|
|
|
|
// Let's start in the middle of the map
|
|
|
|
this.startX = this.mapFile.width * 16;
|
|
|
|
this.startY = this.mapFile.height * 16;
|
|
|
|
}
|
|
|
|
|
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 });
|
|
|
|
|
2020-04-10 12:54:05 +02:00
|
|
|
//notify game manager can to create currentUser in map
|
2020-05-24 23:33:56 +02:00
|
|
|
this.createCurrentPlayer();
|
2020-04-13 19:56:41 +02:00
|
|
|
|
|
|
|
//initialise camera
|
|
|
|
this.initCamera();
|
2020-05-08 00:35:36 +02:00
|
|
|
|
2020-05-08 16:09:50 +02:00
|
|
|
|
|
|
|
// Let's generate the circle for the group delimiter
|
2020-06-09 23:13:26 +02:00
|
|
|
const circleElement = Object.values(this.textures.list).find((object: Texture) => object.key === 'circleSprite');
|
2020-05-10 17:55:30 +02:00
|
|
|
if(circleElement) {
|
|
|
|
this.textures.remove('circleSprite');
|
2020-05-09 19:41:21 +02:00
|
|
|
}
|
2020-05-10 17:55:30 +02:00
|
|
|
this.circleTexture = this.textures.createCanvas('circleSprite', 96, 96);
|
2020-06-09 23:13:26 +02:00
|
|
|
const context = this.circleTexture.context;
|
2020-05-08 16:09:50 +02:00
|
|
|
context.beginPath();
|
|
|
|
context.arc(48, 48, 48, 0, 2 * Math.PI, false);
|
|
|
|
// context.lineWidth = 5;
|
|
|
|
context.strokeStyle = '#ffffff';
|
|
|
|
context.stroke();
|
|
|
|
this.circleTexture.refresh();
|
2020-05-12 00:07:50 +02:00
|
|
|
|
|
|
|
// Let's alter browser history
|
2020-06-09 23:13:26 +02:00
|
|
|
const url = new URL(this.MapUrlFile);
|
2020-05-23 17:27:49 +02:00
|
|
|
let path = '/_/'+this.instance+'/'+url.host+url.pathname;
|
2020-06-07 13:23:32 +02:00
|
|
|
if (this.startLayerName) {
|
|
|
|
path += '#'+this.startLayerName;
|
2020-05-12 00:07:50 +02:00
|
|
|
}
|
2020-06-04 18:54:34 +02:00
|
|
|
window.history.pushState({}, 'WorkAdventure', path);
|
2020-06-22 11:58:07 +02:00
|
|
|
|
|
|
|
// Let's pause the scene if the connection is not established yet
|
|
|
|
if (this.connection === undefined) {
|
2020-06-22 15:00:23 +02:00
|
|
|
// Let's wait 0.5 seconds before printing the "connecting" screen to avoid blinking
|
|
|
|
setTimeout(() => {
|
|
|
|
if (this.connection === undefined) {
|
|
|
|
this.scene.sleep();
|
|
|
|
this.scene.launch(ReconnectingSceneName);
|
|
|
|
}
|
|
|
|
}, 500);
|
2020-06-22 11:58:07 +02:00
|
|
|
}
|
2020-04-13 19:56:41 +02:00
|
|
|
}
|
|
|
|
|
2020-05-11 18:49:20 +02:00
|
|
|
private getExitSceneUrl(layer: ITiledMapLayer): string|undefined {
|
2020-06-07 13:23:32 +02:00
|
|
|
return this.getProperty(layer, "exitSceneUrl") as string|undefined;
|
2020-05-11 18:49:20 +02:00
|
|
|
}
|
|
|
|
|
2020-05-23 17:27:49 +02:00
|
|
|
private getExitSceneInstance(layer: ITiledMapLayer): string|undefined {
|
2020-06-07 13:23:32 +02:00
|
|
|
return this.getProperty(layer, "exitInstance") as string|undefined;
|
|
|
|
}
|
|
|
|
|
|
|
|
private isStartLayer(layer: ITiledMapLayer): boolean {
|
|
|
|
return this.getProperty(layer, "startLayer") == true;
|
|
|
|
}
|
|
|
|
|
|
|
|
private getProperty(layer: ITiledMapLayer, name: string): string|boolean|number|undefined {
|
2020-06-19 16:36:40 +02:00
|
|
|
const properties = layer.properties;
|
2020-05-23 17:27:49 +02:00
|
|
|
if (!properties) {
|
|
|
|
return undefined;
|
|
|
|
}
|
2020-06-19 16:36:40 +02:00
|
|
|
const obj = properties.find((property: ITiledMapLayerProperty) => property.name === name);
|
2020-05-23 17:27:49 +02:00
|
|
|
if (obj === undefined) {
|
|
|
|
return undefined;
|
|
|
|
}
|
|
|
|
return obj.value;
|
|
|
|
}
|
|
|
|
|
2020-05-09 21:28:50 +02:00
|
|
|
/**
|
2020-05-10 14:49:49 +02:00
|
|
|
*
|
|
|
|
* @param layer
|
|
|
|
* @param mapWidth
|
|
|
|
* @param tileWidth
|
|
|
|
* @param tileHeight
|
2020-05-09 21:28:50 +02:00
|
|
|
*/
|
2020-05-10 14:49:49 +02:00
|
|
|
private loadNextGame(layer: ITiledMapLayer, mapWidth: number, tileWidth: number, tileHeight: number){
|
2020-06-09 23:13:26 +02:00
|
|
|
const exitSceneUrl = this.getExitSceneUrl(layer);
|
2020-06-04 18:54:34 +02:00
|
|
|
if (exitSceneUrl === undefined) {
|
|
|
|
throw new Error('Layer is not an exit scene layer.');
|
|
|
|
}
|
2020-05-23 17:27:49 +02:00
|
|
|
let instance = this.getExitSceneInstance(layer);
|
|
|
|
if (instance === undefined) {
|
|
|
|
instance = this.instance;
|
|
|
|
}
|
2020-05-09 21:28:50 +02:00
|
|
|
|
2020-05-13 00:02:39 +02:00
|
|
|
// TODO: eventually compute a relative URL
|
2020-06-09 23:13:26 +02:00
|
|
|
const absoluteExitSceneUrl = new URL(exitSceneUrl, this.MapUrlFile).href;
|
|
|
|
const exitSceneKey = gameManager.loadMap(absoluteExitSceneUrl, this.scene, instance);
|
2020-05-10 18:34:55 +02:00
|
|
|
|
2020-06-09 23:13:26 +02:00
|
|
|
const tiles : number[] = layer.data as number[];
|
2020-06-07 22:57:32 +02:00
|
|
|
for (let key=0; key < tiles.length; key++) {
|
2020-06-09 23:13:26 +02:00
|
|
|
const objectKey = tiles[key];
|
2020-05-09 21:28:50 +02:00
|
|
|
if(objectKey === 0){
|
2020-06-07 22:57:32 +02:00
|
|
|
continue;
|
2020-05-09 21:28:50 +02:00
|
|
|
}
|
2020-05-10 14:49:49 +02:00
|
|
|
//key + 1 because the start x = 0;
|
2020-06-09 23:13:26 +02:00
|
|
|
const y : number = parseInt(((key + 1) / mapWidth).toString());
|
|
|
|
const x : number = key - (y * mapWidth);
|
2020-06-07 22:57:32 +02:00
|
|
|
|
|
|
|
let hash = new URL(exitSceneUrl, this.MapUrlFile).hash;
|
|
|
|
if (hash) {
|
|
|
|
hash = hash.substr(1);
|
|
|
|
}
|
|
|
|
|
2020-05-10 14:49:49 +02:00
|
|
|
//push and save switching case
|
2020-06-10 12:15:25 +02:00
|
|
|
if (this.PositionNextScene[y] === undefined) {
|
|
|
|
this.PositionNextScene[y] = new Array<{key: string, hash: string}>();
|
|
|
|
}
|
|
|
|
this.PositionNextScene[y][x] = {
|
2020-06-07 22:57:32 +02:00
|
|
|
key: exitSceneKey,
|
|
|
|
hash
|
2020-06-10 12:15:25 +02:00
|
|
|
}
|
2020-06-07 23:00:05 +02:00
|
|
|
}
|
2020-05-09 21:28:50 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* @param layer
|
|
|
|
*/
|
2020-06-03 11:14:04 +02:00
|
|
|
private startUser(layer: ITiledMapLayer): PositionInterface {
|
2020-06-19 16:36:40 +02:00
|
|
|
const tiles = layer.data;
|
|
|
|
if (typeof(tiles) === 'string') {
|
|
|
|
throw new Error('The content of a JSON map must be filled as a JSON array, not as a string');
|
|
|
|
}
|
|
|
|
const possibleStartPositions : PositionInterface[] = [];
|
2020-05-09 21:28:50 +02:00
|
|
|
tiles.forEach((objectKey : number, key: number) => {
|
|
|
|
if(objectKey === 0){
|
|
|
|
return;
|
|
|
|
}
|
2020-06-09 23:13:26 +02:00
|
|
|
const y = Math.floor(key / layer.width);
|
|
|
|
const x = key % layer.width;
|
2020-05-09 21:28:50 +02:00
|
|
|
|
2020-06-03 11:14:04 +02:00
|
|
|
possibleStartPositions.push({x: x*32, y: y*32});
|
2020-05-09 21:28:50 +02:00
|
|
|
});
|
2020-06-03 11:14:04 +02:00
|
|
|
// Get a value at random amongst allowed values
|
|
|
|
if (possibleStartPositions.length === 0) {
|
|
|
|
console.warn('The start layer "'+layer.name+'" for this map is empty.');
|
|
|
|
return {
|
|
|
|
x: 0,
|
|
|
|
y: 0
|
|
|
|
};
|
|
|
|
}
|
|
|
|
// Choose one of the available start positions at random amongst the list of available start positions.
|
|
|
|
return possibleStartPositions[Math.floor(Math.random() * possibleStartPositions.length)];
|
2020-05-09 21:28:50 +02:00
|
|
|
}
|
|
|
|
|
2020-04-13 19:56:41 +02:00
|
|
|
//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-10 12:54:05 +02:00
|
|
|
}
|
|
|
|
|
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) => {
|
2020-06-09 23:12:54 +02:00
|
|
|
this.physics.add.collider(this.CurrentPlayer, Layer, (object1: GameObject, object2: GameObject) => {
|
2020-04-13 16:56:06 +02:00
|
|
|
//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
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
createCollisionObject(){
|
2020-06-19 16:36:40 +02:00
|
|
|
/*this.Objects.forEach((Object : Phaser.Physics.Arcade.Sprite) => {
|
|
|
|
this.physics.add.collider(this.CurrentPlayer, Object, (object1, object2) => {
|
|
|
|
this.CurrentPlayer.say("Collision with object : " + (object2 as Phaser.Physics.Arcade.Sprite).texture.key)
|
2020-04-13 15:34:09 +02:00
|
|
|
});
|
2020-06-19 16:36:40 +02:00
|
|
|
})*/
|
2020-04-13 15:34:09 +02:00
|
|
|
}
|
|
|
|
|
2020-05-14 23:19:48 +02:00
|
|
|
createCurrentPlayer(){
|
2020-04-13 15:34:09 +02:00
|
|
|
//initialise player
|
2020-05-23 17:27:49 +02:00
|
|
|
//TODO create animation moving between exit and start
|
2020-04-13 15:34:09 +02:00
|
|
|
this.CurrentPlayer = new Player(
|
|
|
|
this,
|
|
|
|
this.startX,
|
|
|
|
this.startY,
|
2020-05-06 01:50:01 +02:00
|
|
|
this.GameManager.getPlayerName(),
|
2020-05-22 22:59:43 +02:00
|
|
|
this.GameManager.getCharacterSelected(),
|
|
|
|
PlayerAnimationNames.WalkDown,
|
|
|
|
false
|
2020-04-13 15:34:09 +02:00
|
|
|
);
|
|
|
|
|
|
|
|
//create collision
|
|
|
|
this.createCollisionWithPlayer();
|
|
|
|
this.createCollisionObject();
|
2020-05-10 13:58:32 +02:00
|
|
|
|
|
|
|
//join room
|
2020-06-22 11:58:07 +02:00
|
|
|
this.connectionPromise.then((connection: Connection) => {
|
|
|
|
connection.joinARoom(this.RoomId, this.startX, this.startY, PlayerAnimationNames.WalkDown, false).then((userPositions: MessageUserPositionInterface[]) => {
|
|
|
|
this.initUsersPosition(userPositions);
|
|
|
|
});
|
2020-05-10 13:58:32 +02:00
|
|
|
|
2020-06-22 11:58:07 +02:00
|
|
|
//listen event to share position of user
|
|
|
|
this.CurrentPlayer.on(hasMovedEventName, this.pushPlayerPosition.bind(this))
|
|
|
|
});
|
2020-05-02 16:54:52 +02:00
|
|
|
}
|
2020-05-04 18:38:04 +02:00
|
|
|
|
2020-05-02 16:54:52 +02:00
|
|
|
pushPlayerPosition(event: HasMovedEvent) {
|
2020-06-01 22:42:18 +02:00
|
|
|
if (this.lastMoveEventSent === event) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
// If the player is not moving, let's send the info right now.
|
|
|
|
if (event.moving === false) {
|
|
|
|
this.doPushPlayerPosition(event);
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
// If the player is moving, and if it changed direction, let's send an event
|
|
|
|
if (event.direction !== this.lastMoveEventSent.direction) {
|
|
|
|
this.doPushPlayerPosition(event);
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
// If more than 200ms happened since last event sent
|
|
|
|
if (this.currentTick - this.lastSentTick >= POSITION_DELAY) {
|
|
|
|
this.doPushPlayerPosition(event);
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
// Otherwise, do nothing.
|
|
|
|
}
|
|
|
|
|
|
|
|
private doPushPlayerPosition(event: HasMovedEvent): void {
|
|
|
|
this.lastMoveEventSent = event;
|
|
|
|
this.lastSentTick = this.currentTick;
|
2020-06-22 11:58:07 +02:00
|
|
|
this.connection.sharePosition(event.x, event.y, event.direction, event.moving);
|
2020-04-13 15:34:09 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
EventToClickOnTile(){
|
|
|
|
// debug code to get a tile properties by clicking on it
|
2020-06-19 18:18:43 +02:00
|
|
|
/*this.input.on("pointerdown", (pointer: Phaser.Input.Pointer)=>{
|
2020-04-13 15:34:09 +02:00
|
|
|
//pixel position toz tile position
|
2020-06-09 23:13:26 +02:00
|
|
|
const tile = this.Map.getTileAt(this.Map.worldToTileX(pointer.worldX), this.Map.worldToTileY(pointer.worldY));
|
2020-04-13 15:34:09 +02:00
|
|
|
if(tile){
|
|
|
|
this.CurrentPlayer.say("Your touch " + tile.layer.name);
|
|
|
|
}
|
2020-06-19 18:18:43 +02:00
|
|
|
});*/
|
2020-04-13 15:34:09 +02:00
|
|
|
}
|
|
|
|
|
2020-04-18 17:16:39 +02:00
|
|
|
/**
|
|
|
|
* @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 {
|
2020-06-01 22:42:18 +02:00
|
|
|
this.currentTick = time;
|
2020-04-18 17:16:39 +02:00
|
|
|
this.CurrentPlayer.moveUser(delta);
|
2020-06-02 13:44:42 +02:00
|
|
|
|
2020-06-19 18:18:43 +02:00
|
|
|
// Let's handle all events
|
2020-06-19 18:24:32 +02:00
|
|
|
while (this.pendingEvents.length !== 0) {
|
|
|
|
const event = this.pendingEvents.dequeue();
|
2020-06-19 18:18:43 +02:00
|
|
|
switch (event.type) {
|
|
|
|
case "InitUserPositionEvent":
|
|
|
|
this.doInitUsersPosition(event.event);
|
|
|
|
break;
|
|
|
|
case "AddPlayerEvent":
|
|
|
|
this.doAddPlayer(event.event);
|
|
|
|
break;
|
|
|
|
case "RemovePlayerEvent":
|
|
|
|
this.doRemovePlayer(event.userId);
|
|
|
|
break;
|
|
|
|
case "UserMovedEvent":
|
|
|
|
this.doUpdatePlayerPosition(event.event);
|
|
|
|
break;
|
|
|
|
case "GroupCreatedUpdatedEvent":
|
|
|
|
this.doShareGroupPosition(event.event);
|
|
|
|
break;
|
|
|
|
case "DeleteGroupEvent":
|
|
|
|
this.doDeleteGroup(event.groupId);
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-06-02 13:44:42 +02:00
|
|
|
// Let's move all users
|
2020-06-09 23:13:26 +02:00
|
|
|
const updatedPlayersPositions = this.playersPositionInterpolator.getUpdatedPositions(time);
|
2020-06-02 13:44:42 +02:00
|
|
|
updatedPlayersPositions.forEach((moveEvent: HasMovedEvent, userId: string) => {
|
2020-06-09 23:13:26 +02:00
|
|
|
const player : RemotePlayer | undefined = this.MapPlayersByKey.get(userId);
|
2020-06-02 13:44:42 +02:00
|
|
|
if (player === undefined) {
|
|
|
|
throw new Error('Cannot find player with ID "' + userId +'"');
|
|
|
|
}
|
|
|
|
player.updatePosition(moveEvent);
|
|
|
|
});
|
|
|
|
|
2020-06-09 23:13:26 +02:00
|
|
|
const nextSceneKey = this.checkToExit();
|
2020-05-09 21:28:50 +02:00
|
|
|
if(nextSceneKey){
|
2020-06-03 10:45:25 +02:00
|
|
|
// We are completely destroying the current scene to avoid using a half-backed instance when coming back to the same map.
|
2020-06-22 11:58:07 +02:00
|
|
|
this.connection.closeConnection();
|
|
|
|
this.scene.stop();
|
2020-06-03 10:45:25 +02:00
|
|
|
this.scene.remove(this.scene.key);
|
2020-06-07 22:57:32 +02:00
|
|
|
this.scene.start(nextSceneKey.key, {
|
|
|
|
startLayerName: nextSceneKey.hash
|
|
|
|
});
|
2020-05-09 19:41:21 +02:00
|
|
|
}
|
2020-04-13 15:34:09 +02:00
|
|
|
}
|
|
|
|
|
2020-05-09 21:28:50 +02:00
|
|
|
/**
|
|
|
|
*
|
|
|
|
*/
|
2020-06-10 12:15:25 +02:00
|
|
|
checkToExit(): {key: string, hash: string} | null {
|
|
|
|
const x = Math.floor(this.CurrentPlayer.x / 32);
|
|
|
|
const y = Math.floor(this.CurrentPlayer.y / 32);
|
|
|
|
|
|
|
|
if (this.PositionNextScene[y] !== undefined && this.PositionNextScene[y][x] !== undefined) {
|
|
|
|
return this.PositionNextScene[y][x];
|
|
|
|
} else {
|
2020-05-09 21:28:50 +02:00
|
|
|
return null;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-06-19 18:18:43 +02:00
|
|
|
/**
|
|
|
|
* Called by the connexion when the full list of user position is received.
|
|
|
|
*/
|
2020-06-22 11:58:07 +02:00
|
|
|
private initUsersPosition(usersPosition: MessageUserPositionInterface[]): void {
|
2020-06-19 18:18:43 +02:00
|
|
|
this.pendingEvents.enqueue({
|
|
|
|
type: "InitUserPositionEvent",
|
|
|
|
event: usersPosition
|
|
|
|
});
|
2020-05-19 19:11:12 +02:00
|
|
|
|
2020-06-19 18:18:43 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Put all the players on the map on map load.
|
|
|
|
*/
|
|
|
|
private doInitUsersPosition(usersPosition: MessageUserPositionInterface[]): void {
|
2020-06-22 11:58:07 +02:00
|
|
|
const currentPlayerId = this.connection.userId;
|
2020-05-19 19:11:12 +02:00
|
|
|
|
|
|
|
// clean map
|
2020-06-04 18:54:34 +02:00
|
|
|
this.MapPlayersByKey.forEach((player: RemotePlayer) => {
|
2020-05-19 19:11:12 +02:00
|
|
|
player.destroy();
|
|
|
|
this.MapPlayers.remove(player);
|
|
|
|
});
|
2020-06-04 18:54:34 +02:00
|
|
|
this.MapPlayersByKey = new Map<string, RemotePlayer>();
|
2020-05-19 19:11:12 +02:00
|
|
|
|
|
|
|
// load map
|
|
|
|
usersPosition.forEach((userPosition : MessageUserPositionInterface) => {
|
|
|
|
if(userPosition.userId === currentPlayerId){
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
this.addPlayer(userPosition);
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
2020-06-19 18:18:43 +02:00
|
|
|
/**
|
|
|
|
* Called by the connexion when a new player arrives on a map
|
|
|
|
*/
|
|
|
|
public addPlayer(addPlayerData : AddPlayerInterface) : void {
|
|
|
|
this.pendingEvents.enqueue({
|
|
|
|
type: "AddPlayerEvent",
|
|
|
|
event: addPlayerData
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
2020-04-10 12:54:05 +02:00
|
|
|
/**
|
2020-04-13 15:34:09 +02:00
|
|
|
* Create new player
|
2020-04-10 12:54:05 +02:00
|
|
|
*/
|
2020-06-19 18:18:43 +02:00
|
|
|
private doAddPlayer(addPlayerData : AddPlayerInterface) : void {
|
2020-05-23 14:00:36 +02:00
|
|
|
//check if exist player, if exist, move position
|
|
|
|
if(this.MapPlayersByKey.has(addPlayerData.userId)){
|
|
|
|
this.updatePlayerPosition({
|
|
|
|
userId: addPlayerData.userId,
|
|
|
|
position: addPlayerData.position
|
|
|
|
});
|
|
|
|
return;
|
|
|
|
}
|
2020-04-13 15:34:09 +02:00
|
|
|
//initialise player
|
2020-06-09 23:13:26 +02:00
|
|
|
const player = new RemotePlayer(
|
2020-05-19 19:11:12 +02:00
|
|
|
addPlayerData.userId,
|
2020-04-13 15:34:09 +02:00
|
|
|
this,
|
2020-05-19 19:11:12 +02:00
|
|
|
addPlayerData.position.x,
|
|
|
|
addPlayerData.position.y,
|
|
|
|
addPlayerData.name,
|
2020-05-22 22:59:43 +02:00
|
|
|
addPlayerData.character,
|
|
|
|
addPlayerData.position.direction,
|
|
|
|
addPlayerData.position.moving
|
2020-04-13 15:34:09 +02:00
|
|
|
);
|
|
|
|
this.MapPlayers.add(player);
|
2020-05-19 19:11:12 +02:00
|
|
|
this.MapPlayersByKey.set(player.userId, player);
|
|
|
|
player.updatePosition(addPlayerData.position);
|
2020-04-13 15:34:09 +02:00
|
|
|
|
2020-05-08 15:18:22 +02:00
|
|
|
//init collision
|
|
|
|
/*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-05-08 15:18:22 +02:00
|
|
|
});*/
|
2020-04-07 20:41:35 +02:00
|
|
|
}
|
2020-05-08 00:35:36 +02:00
|
|
|
|
2020-06-19 18:18:43 +02:00
|
|
|
/**
|
|
|
|
* Called by the connexion when a player is removed from the map
|
|
|
|
*/
|
2020-05-19 19:11:12 +02:00
|
|
|
public removePlayer(userId: string) {
|
2020-06-19 18:18:43 +02:00
|
|
|
this.pendingEvents.enqueue({
|
|
|
|
type: "RemovePlayerEvent",
|
|
|
|
userId
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
private doRemovePlayer(userId: string) {
|
2020-06-09 23:13:26 +02:00
|
|
|
const player = this.MapPlayersByKey.get(userId);
|
2020-05-19 19:11:12 +02:00
|
|
|
if (player === undefined) {
|
|
|
|
console.error('Cannot find user with id ', userId);
|
2020-06-04 18:11:07 +02:00
|
|
|
} else {
|
|
|
|
player.destroy();
|
|
|
|
this.MapPlayers.remove(player);
|
2020-05-19 19:11:12 +02:00
|
|
|
}
|
|
|
|
this.MapPlayersByKey.delete(userId);
|
2020-06-02 13:44:42 +02:00
|
|
|
this.playersPositionInterpolator.removePlayer(userId);
|
2020-05-19 19:11:12 +02:00
|
|
|
}
|
|
|
|
|
2020-06-19 18:18:43 +02:00
|
|
|
public updatePlayerPosition(message: MessageUserMovedInterface): void {
|
|
|
|
this.pendingEvents.enqueue({
|
|
|
|
type: "UserMovedEvent",
|
|
|
|
event: message
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
private doUpdatePlayerPosition(message: MessageUserMovedInterface): void {
|
2020-06-09 23:13:26 +02:00
|
|
|
const player : RemotePlayer | undefined = this.MapPlayersByKey.get(message.userId);
|
2020-05-19 19:11:12 +02:00
|
|
|
if (player === undefined) {
|
|
|
|
throw new Error('Cannot find player with ID "' + message.userId +'"');
|
|
|
|
}
|
2020-06-02 13:44:42 +02:00
|
|
|
|
|
|
|
// We do not update the player position directly (because it is sent only every 200ms).
|
|
|
|
// Instead we use the PlayersPositionInterpolator that will do a smooth animation over the next 200ms.
|
2020-06-09 23:13:26 +02:00
|
|
|
const playerMovement = new PlayerMovement({ x: player.x, y: player.y }, this.currentTick, message.position, this.currentTick + POSITION_DELAY);
|
2020-06-02 13:44:42 +02:00
|
|
|
this.playersPositionInterpolator.updatePlayerPosition(player.userId, playerMovement);
|
2020-05-19 19:11:12 +02:00
|
|
|
}
|
|
|
|
|
2020-06-19 18:18:43 +02:00
|
|
|
public shareGroupPosition(groupPositionMessage: GroupCreatedUpdatedMessageInterface) {
|
|
|
|
this.pendingEvents.enqueue({
|
|
|
|
type: "GroupCreatedUpdatedEvent",
|
|
|
|
event: groupPositionMessage
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
private doShareGroupPosition(groupPositionMessage: GroupCreatedUpdatedMessageInterface) {
|
2020-06-09 23:13:26 +02:00
|
|
|
const groupId = groupPositionMessage.groupId;
|
2020-05-08 00:35:36 +02:00
|
|
|
|
2020-06-09 23:13:26 +02:00
|
|
|
const group = this.groups.get(groupId);
|
2020-06-04 18:11:07 +02:00
|
|
|
if (group !== undefined) {
|
|
|
|
group.setPosition(Math.round(groupPositionMessage.position.x), Math.round(groupPositionMessage.position.y));
|
2020-05-08 00:35:36 +02:00
|
|
|
} else {
|
|
|
|
// TODO: circle radius should not be hard stored
|
2020-06-09 23:13:26 +02:00
|
|
|
const sprite = new Sprite(
|
2020-05-10 17:55:30 +02:00
|
|
|
this,
|
|
|
|
Math.round(groupPositionMessage.position.x),
|
|
|
|
Math.round(groupPositionMessage.position.y),
|
|
|
|
'circleSprite');
|
2020-05-08 16:09:50 +02:00
|
|
|
sprite.setDisplayOrigin(48, 48);
|
|
|
|
this.add.existing(sprite);
|
|
|
|
this.groups.set(groupId, sprite);
|
2020-05-08 00:35:36 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
deleteGroup(groupId: string): void {
|
2020-06-19 18:18:43 +02:00
|
|
|
this.pendingEvents.enqueue({
|
|
|
|
type: "DeleteGroupEvent",
|
|
|
|
groupId
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
doDeleteGroup(groupId: string): void {
|
2020-06-09 23:13:26 +02:00
|
|
|
const group = this.groups.get(groupId);
|
2020-06-04 18:11:07 +02:00
|
|
|
if(!group){
|
2020-05-11 13:17:02 +02:00
|
|
|
return;
|
|
|
|
}
|
2020-06-04 18:11:07 +02:00
|
|
|
group.destroy();
|
2020-05-08 00:35:36 +02:00
|
|
|
this.groups.delete(groupId);
|
|
|
|
}
|
2020-05-23 17:27:49 +02:00
|
|
|
|
|
|
|
public static getMapKeyByUrl(mapUrlStart: string) : string {
|
|
|
|
// FIXME: the key should be computed from the full URL of the map.
|
2020-06-09 23:13:26 +02:00
|
|
|
const startPos = mapUrlStart.indexOf('://')+3;
|
|
|
|
const endPos = mapUrlStart.indexOf(".json");
|
2020-05-23 17:27:49 +02:00
|
|
|
return mapUrlStart.substring(startPos, endPos);
|
|
|
|
}
|
2020-04-07 19:23:21 +02:00
|
|
|
}
|