Multi Scene in back end
- Change maps url to get maps - Change GameScene to create scene with file since back end - Change LoginScene to upload scene and start game
This commit is contained in:
parent
7f989cfd23
commit
fb8d9bf9a8
@ -13,7 +13,7 @@ class App {
|
||||
public server: http.Server;
|
||||
public ioSocketController: IoSocketController;
|
||||
public authenticateController: AuthenticateController;
|
||||
public AuthenticateMiddleware: AuthenticateMiddleware;
|
||||
//public AuthenticateMiddleware: AuthenticateMiddleware;
|
||||
public mapController: MapController;
|
||||
|
||||
constructor() {
|
||||
@ -26,7 +26,7 @@ class App {
|
||||
//create socket controllers
|
||||
this.ioSocketController = new IoSocketController(this.server);
|
||||
this.authenticateController = new AuthenticateController(this.app);
|
||||
this.AuthenticateMiddleware = new AuthenticateMiddleware(this.app);
|
||||
//this.AuthenticateMiddleware = new AuthenticateMiddleware(this.app);
|
||||
this.mapController = new MapController(this.app);
|
||||
}
|
||||
|
||||
|
@ -27,7 +27,11 @@ export class AuthenticateController{
|
||||
return res.status(OK).send({
|
||||
token: token,
|
||||
roomId: ROOM,
|
||||
userId: userId
|
||||
userId: userId,
|
||||
maps: [
|
||||
"floor0",
|
||||
"floor1"
|
||||
]
|
||||
});
|
||||
});
|
||||
}
|
||||
|
@ -3,33 +3,29 @@ import path from "path";
|
||||
import {Application, Request, Response} from "express";
|
||||
import {OK} from "http-status-codes";
|
||||
|
||||
const MapFloor0 = require('../Assets/Maps/Floor0/floor0.json');
|
||||
const MapFloor1 = require('../Assets/Maps/Floor1/floor1.json');
|
||||
export class MapController {
|
||||
App: Application;
|
||||
|
||||
export class MapController{
|
||||
App : Application;
|
||||
|
||||
constructor(App : Application) {
|
||||
constructor(App: Application) {
|
||||
this.App = App;
|
||||
this.getFloor0();
|
||||
this.getFloor1();
|
||||
this.getMpas();
|
||||
this.assetMaps();
|
||||
}
|
||||
|
||||
assetMaps(){
|
||||
this.App.use('/maps', express.static('src/Assets/Maps'));
|
||||
assetMaps() {
|
||||
this.App.use('/map/files', express.static('src/Assets/Maps'));
|
||||
}
|
||||
|
||||
//permit to login on application. Return token to connect on Websocket IO.
|
||||
getFloor0(){
|
||||
this.App.get("/floor0", (req: Request, res: Response) => {
|
||||
return res.status(OK).send(MapFloor0);
|
||||
});
|
||||
}
|
||||
|
||||
getFloor1(){
|
||||
this.App.get("/floor1", (req: Request, res: Response) => {
|
||||
return res.status(OK).send(MapFloor1);
|
||||
getMpas() {
|
||||
this.App.get("/maps", (req: Request, res: Response) => {
|
||||
return res.status(OK).send({
|
||||
startMapKey: "floor0",
|
||||
maps: [
|
||||
{mapKey: "floor0", mapUrl: "/map/files/Floor0"},
|
||||
{mapKey: "floor1", mapUrl: "/map/files/Floor1"},
|
||||
]
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
@ -143,6 +143,8 @@ export interface ConnexionInterface {
|
||||
|
||||
createConnexion(characterSelected: string): Promise<any>;
|
||||
|
||||
loadMaps(): Promise<any>;
|
||||
|
||||
joinARoom(roomId: string, character: string): void;
|
||||
|
||||
sharePosition(x: number, y: number, direction: string, character: string): void;
|
||||
@ -173,6 +175,9 @@ export class Connexion implements ConnexionInterface {
|
||||
this.GameManager = GameManager;
|
||||
}
|
||||
|
||||
/**
|
||||
* @param characterSelected
|
||||
*/
|
||||
createConnexion(characterSelected: string): Promise<ConnexionInterface> {
|
||||
return Axios.post(`${API_URL}/login`, {email: this.email})
|
||||
.then((res) => {
|
||||
@ -199,13 +204,22 @@ export class Connexion implements ConnexionInterface {
|
||||
this.groupUpdatedOrCreated();
|
||||
this.groupDeleted();
|
||||
|
||||
return this;
|
||||
return res.data;
|
||||
})
|
||||
.catch((err) => {
|
||||
console.error(err);
|
||||
throw err;
|
||||
});
|
||||
}
|
||||
|
||||
loadMaps() : Promise<any>{
|
||||
return Axios.get(`${API_URL}/maps`).then((res) => {
|
||||
return res.data;
|
||||
}).catch((err) => {
|
||||
console.error(err);
|
||||
throw err;
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
|
@ -1,13 +1,10 @@
|
||||
import {GameScene} from "./GameScene";
|
||||
import {ROOM} from "../../Enum/EnvironmentVariable"
|
||||
import {GameScene, GameSceneInterface} from "./GameScene";
|
||||
import {
|
||||
Connexion,
|
||||
ConnexionInterface,
|
||||
GroupCreatedUpdatedMessageInterface,
|
||||
ListMessageUserPositionInterface
|
||||
} from "../../Connexion";
|
||||
import {SimplePeerInterface, SimplePeer} from "../../WebRtc/SimplePeer";
|
||||
import {LogincScene} from "../Login/LogincScene";
|
||||
|
||||
export enum StatusGameManagerEnum {
|
||||
IN_PROGRESS = 1,
|
||||
@ -24,7 +21,7 @@ export interface HasMovedEvent {
|
||||
export class GameManager {
|
||||
status: number;
|
||||
private ConnexionInstance: Connexion;
|
||||
private currentGameScene: GameScene;
|
||||
private currentGameScene: GameSceneInterface;
|
||||
private playerName: string;
|
||||
SimplePeer : SimplePeerInterface;
|
||||
private characterUserSelected: string;
|
||||
@ -37,12 +34,23 @@ export class GameManager {
|
||||
this.playerName = name;
|
||||
this.characterUserSelected = characterUserSelected;
|
||||
this.ConnexionInstance = new Connexion(name, this);
|
||||
return this.ConnexionInstance.createConnexion(characterUserSelected).then(() => {
|
||||
return this.ConnexionInstance.createConnexion(characterUserSelected).then((data : any) => {
|
||||
this.SimplePeer = new SimplePeer(this.ConnexionInstance);
|
||||
return data;
|
||||
}).catch((err) => {
|
||||
throw err;
|
||||
});
|
||||
}
|
||||
|
||||
setCurrentGameScene(gameScene: GameScene) {
|
||||
loadMaps(){
|
||||
return this.ConnexionInstance.loadMaps().then((maps) => {
|
||||
return maps;
|
||||
}).catch((err) => {
|
||||
throw err;
|
||||
});
|
||||
}
|
||||
|
||||
setCurrentGameScene(gameScene: GameSceneInterface) {
|
||||
this.currentGameScene = gameScene;
|
||||
}
|
||||
|
||||
|
@ -11,16 +11,12 @@ import Graphics = Phaser.GameObjects.Graphics;
|
||||
import Texture = Phaser.Textures.Texture;
|
||||
import Sprite = Phaser.GameObjects.Sprite;
|
||||
import CanvasTexture = Phaser.Textures.CanvasTexture;
|
||||
import {Floor1Name} from "./GameSceneFloor1";
|
||||
import CreateSceneFromObjectConfig = Phaser.Types.Scenes.CreateSceneFromObjectConfig;
|
||||
|
||||
export enum Textures {
|
||||
Player = "male1",
|
||||
Map = 'floor0',
|
||||
MapUrl = 'maps/floor0.json'
|
||||
Player = "male1"
|
||||
}
|
||||
|
||||
export const Floor0Name = "Floor0";
|
||||
|
||||
export interface GameSceneInterface extends Phaser.Scene {
|
||||
Map: Phaser.Tilemaps.Tilemap;
|
||||
createCurrentPlayer(UserId : string) : void;
|
||||
@ -29,7 +25,7 @@ export interface GameSceneInterface extends Phaser.Scene {
|
||||
updateOrCreateMapPlayer(UsersPosition : Array<MessageUserPositionInterface>): void;
|
||||
deleteGroup(groupId: string): void;
|
||||
}
|
||||
export class GameScene extends Phaser.Scene implements GameSceneInterface{
|
||||
export class GameScene extends Phaser.Scene implements GameSceneInterface, CreateSceneFromObjectConfig{
|
||||
GameManager : GameManager;
|
||||
Terrains : Array<Phaser.Tilemaps.Tileset>;
|
||||
CurrentPlayer: CurrentGamerInterface;
|
||||
@ -38,24 +34,31 @@ export class GameScene extends Phaser.Scene implements GameSceneInterface{
|
||||
Layers : Array<Phaser.Tilemaps.StaticTilemapLayer>;
|
||||
Objects : Array<Phaser.Physics.Arcade.Sprite>;
|
||||
map: ITiledMap;
|
||||
groups: Map<string, Sprite>
|
||||
groups: Map<string, Sprite>;
|
||||
startX = 704;// 22 case
|
||||
startY = 32; // 1 case
|
||||
circleTexture: CanvasTexture;
|
||||
|
||||
constructor() {
|
||||
MapKey: string;
|
||||
MapUrlFile: string;
|
||||
|
||||
constructor(MapKey : string = "", MapUrlFile: string = "") {
|
||||
super({
|
||||
key: Floor0Name
|
||||
key: MapKey
|
||||
});
|
||||
|
||||
this.GameManager = gameManager;
|
||||
this.Terrains = [];
|
||||
this.groups = new Map<string, Sprite>();
|
||||
|
||||
this.MapKey = MapKey;
|
||||
this.MapUrlFile = MapUrlFile;
|
||||
}
|
||||
|
||||
//hook preload scene
|
||||
preload(): void {
|
||||
this.GameManager.setCurrentGameScene(this);
|
||||
this.load.on('filecomplete-tilemapJSON-'+Textures.Map, (key: string, type: string, data: any) => {
|
||||
this.load.on('filecomplete-tilemapJSON-'+this.MapKey, (key: string, type: string, data: any) => {
|
||||
// Triggered when the map is loaded
|
||||
// Load tiles attached to the map recursively
|
||||
this.map = data.data;
|
||||
@ -64,11 +67,13 @@ export class GameScene extends Phaser.Scene implements GameSceneInterface{
|
||||
console.warn("Don't know how to handle tileset ", tileset)
|
||||
return;
|
||||
}
|
||||
let path = Textures.MapUrl.substr(0, Textures.MapUrl.lastIndexOf('/'));
|
||||
this.load.image(tileset.name, path + '/' + tileset.image);
|
||||
console.log(tileset);
|
||||
console.log(tileset.name, `${this.MapUrlFile}/${tileset.image}`);
|
||||
this.load.image(tileset.name, `${this.MapUrlFile}/${tileset.image}`);
|
||||
})
|
||||
});
|
||||
this.load.tilemapTiledJSON(Textures.Map, Textures.MapUrl);
|
||||
console.log(this.MapKey, `${this.MapUrlFile}/${this.MapKey}.json`);
|
||||
this.load.tilemapTiledJSON(this.MapKey, `${this.MapUrlFile}/${this.MapKey}.json`);
|
||||
|
||||
//add player png
|
||||
PLAYER_RESOURCES.forEach((playerResource: any) => {
|
||||
@ -88,7 +93,7 @@ export class GameScene extends Phaser.Scene implements GameSceneInterface{
|
||||
//hook create scene
|
||||
create(): void {
|
||||
//initalise map
|
||||
this.Map = this.add.tilemap(Textures.Map);
|
||||
this.Map = this.add.tilemap(this.MapKey);
|
||||
this.map.tilesets.forEach((tileset: ITiledTileSet) => {
|
||||
this.Terrains.push(this.Map.addTilesetImage(tileset.name, tileset.name));
|
||||
});
|
||||
@ -132,6 +137,9 @@ export class GameScene extends Phaser.Scene implements GameSceneInterface{
|
||||
// Let's generate the circle for the group delimiter
|
||||
|
||||
this.circleTexture = this.textures.createCanvas('circleSprite', 96, 96);
|
||||
if(!this.circleTexture || this.circleTexture.context){
|
||||
return;
|
||||
}
|
||||
let context = this.circleTexture.context;
|
||||
context.beginPath();
|
||||
context.arc(48, 48, 48, 0, 2 * Math.PI, false);
|
||||
@ -224,6 +232,12 @@ export class GameScene extends Phaser.Scene implements GameSceneInterface{
|
||||
*/
|
||||
update(time: number, delta: number) : void {
|
||||
this.CurrentPlayer.moveUser(delta);
|
||||
if(
|
||||
832 <= this.CurrentPlayer.x && this.CurrentPlayer.x <= 864
|
||||
&& 0 <= this.CurrentPlayer.y && this.CurrentPlayer.y <= 64
|
||||
){
|
||||
//this.scene.start(Floor1Name);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -2,14 +2,13 @@ import {gameManager} from "../Game/GameManager";
|
||||
import {TextField} from "../Components/TextField";
|
||||
import {TextInput} from "../Components/TextInput";
|
||||
import {ClickButton} from "../Components/ClickButton";
|
||||
import {GameSceneInterface, Floor0Name, Textures} from "../Game/GameScene";
|
||||
import {GameScene, GameSceneInterface} from "../Game/GameScene";
|
||||
import Image = Phaser.GameObjects.Image;
|
||||
import {Player} from "../Player/Player";
|
||||
import {getPlayerAnimations, PlayerAnimationNames} from "../Player/Animation";
|
||||
import Rectangle = Phaser.GameObjects.Rectangle;
|
||||
import {PLAYER_RESOURCES} from "../Entity/PlayableCaracter";
|
||||
import {cypressAsserter} from "../../Cypress/CypressAsserter";
|
||||
import {GroupCreatedUpdatedMessageInterface, MessageUserPositionInterface} from "../../Connexion";
|
||||
import {API_URL} from "../../Enum/EnvironmentVariable";
|
||||
|
||||
//todo: put this constants in a dedicated file
|
||||
export const LoginSceneName = "LoginScene";
|
||||
@ -94,15 +93,29 @@ export class LogincScene extends Phaser.Scene implements GameSceneInterface {
|
||||
}
|
||||
|
||||
private async login(name: string) {
|
||||
gameManager.connect(name, this.selectedPlayer.texture.key).then(() => {
|
||||
this.scene.start(Floor0Name);
|
||||
Promise.all([
|
||||
gameManager.connect(name, this.selectedPlayer.texture.key),
|
||||
gameManager.loadMaps()
|
||||
]).then((data) => {
|
||||
if (!data) {
|
||||
return;
|
||||
}
|
||||
let scene: any = data[1];
|
||||
scene.maps.forEach((map : any) => {
|
||||
let game = new GameScene(map.mapKey, `${API_URL}${map.mapUrl}`);
|
||||
this.scene.add(map.mapKey, game, false);
|
||||
});
|
||||
this.scene.start(scene.startMapKey);
|
||||
}).catch((err) => {
|
||||
console.error(err);
|
||||
throw err;
|
||||
});
|
||||
}
|
||||
|
||||
Map: Phaser.Tilemaps.Tilemap;
|
||||
|
||||
initAnimation(): void {
|
||||
|
||||
throw new Error("Method not implemented.");
|
||||
}
|
||||
|
||||
createCurrentPlayer(UserId: string): void {
|
||||
|
@ -3,14 +3,13 @@ import GameConfig = Phaser.Types.Core.GameConfig;
|
||||
import {DEBUG_MODE, RESOLUTION} from "./Enum/EnvironmentVariable";
|
||||
import {cypressAsserter} from "./Cypress/CypressAsserter";
|
||||
import {LogincScene} from "./Phaser/Login/LogincScene";
|
||||
import {GameScene} from "./Phaser/Game/GameScene";
|
||||
|
||||
const config: GameConfig = {
|
||||
title: "Office game",
|
||||
width: window.innerWidth / RESOLUTION,
|
||||
height: window.innerHeight / RESOLUTION,
|
||||
parent: "game",
|
||||
scene: [LogincScene, GameScene],
|
||||
scene: [LogincScene],
|
||||
zoom: RESOLUTION,
|
||||
physics: {
|
||||
default: "arcade",
|
||||
|
Loading…
Reference in New Issue
Block a user