lbehm/workadventure
1
0
Fork 0
Code Issues Pull requests Releases Activity

Multi Scene in back end

Browse source 
- 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:
gparant 2020-05-09 19:41:21 +02:00
parent 7f989cfd23
commit fb8d9bf9a8
8 changed files with 101 additions and 53 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
back/src/App.ts
View file

@ -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);
}

6
back/src/Controller/AuthenticateController.ts
View file

@ -27,7 +27,11 @@ export class AuthenticateController{
return res.status(OK).send({
token: token,
roomId: ROOM,
userId: userId
userId: userId,
maps: [
"floor0",
"floor1"
]
});
});
}

34
back/src/Controller/MapController.ts
View file

@ -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"},
]
});
});
}
}

16
front/src/Connexion.ts
View file

@ -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;
});
}
/**
*

22
front/src/Phaser/Game/GameManager.ts
View file

@ -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;
}

44
front/src/Phaser/Game/GameScene.ts
View file

@ -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);
}
}
/**

25
front/src/Phaser/Login/LogincScene.ts
View file

@ -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
front/src/index.ts
View file

@ -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",