Adding communication between LoginScene and SelectCharacterScene
This commit is contained in:
parent
5806e379c8
commit
04a1f90ed5
3
front/.gitignore
vendored
3
front/.gitignore
vendored
@ -1,3 +1,6 @@
|
|||||||
/node_modules/
|
/node_modules/
|
||||||
/dist/bundle.js
|
/dist/bundle.js
|
||||||
/yarn-error.log
|
/yarn-error.log
|
||||||
|
/dist/webpack.config.js
|
||||||
|
/dist/webpack.config.js.map
|
||||||
|
/dist/src
|
||||||
|
@ -6,12 +6,11 @@ import Image = Phaser.GameObjects.Image;
|
|||||||
import Rectangle = Phaser.GameObjects.Rectangle;
|
import Rectangle = Phaser.GameObjects.Rectangle;
|
||||||
import {PLAYER_RESOURCES} from "../Entity/PlayableCaracter";
|
import {PLAYER_RESOURCES} from "../Entity/PlayableCaracter";
|
||||||
import {cypressAsserter} from "../../Cypress/CypressAsserter";
|
import {cypressAsserter} from "../../Cypress/CypressAsserter";
|
||||||
import {GroupCreatedUpdatedMessageInterface, MessageUserJoined, MessageUserPositionInterface} from "../../Connection";
|
import {SelectCharacterSceneInitDataInterface, SelectCharacterSceneName} from "./SelectCharacterScene";
|
||||||
|
|
||||||
//todo: put this constants in a dedicated file
|
//todo: put this constants in a dedicated file
|
||||||
export const LoginSceneName = "LoginScene";
|
export const LoginSceneName = "LoginScene";
|
||||||
enum LoginTextures {
|
enum LoginTextures {
|
||||||
//playButton = "play_button",
|
|
||||||
icon = "icon",
|
icon = "icon",
|
||||||
mainFont = "main_font"
|
mainFont = "main_font"
|
||||||
}
|
}
|
||||||
@ -19,15 +18,10 @@ enum LoginTextures {
|
|||||||
export class LoginScene extends Phaser.Scene {
|
export class LoginScene extends Phaser.Scene {
|
||||||
private nameInput: TextInput;
|
private nameInput: TextInput;
|
||||||
private textField: TextField;
|
private textField: TextField;
|
||||||
private playButton: ClickButton;
|
|
||||||
private infoTextField: TextField;
|
private infoTextField: TextField;
|
||||||
private pressReturnField: TextField;
|
private pressReturnField: TextField;
|
||||||
private logo: Image;
|
private logo: Image;
|
||||||
|
|
||||||
private selectedRectangle: Rectangle;
|
|
||||||
private selectedPlayer: Phaser.Physics.Arcade.Sprite;
|
|
||||||
private players: Array<Phaser.Physics.Arcade.Sprite> = new Array<Phaser.Physics.Arcade.Sprite>();
|
|
||||||
|
|
||||||
constructor() {
|
constructor() {
|
||||||
super({
|
super({
|
||||||
key: LoginSceneName
|
key: LoginSceneName
|
||||||
@ -61,8 +55,6 @@ export class LoginScene extends Phaser.Scene {
|
|||||||
this.pressReturnField = new TextField(this, this.game.renderer.width / 2, 130, 'Press enter to start');
|
this.pressReturnField = new TextField(this, this.game.renderer.width / 2, 130, 'Press enter to start');
|
||||||
this.pressReturnField.setOrigin(0.5).setCenterAlign()
|
this.pressReturnField.setOrigin(0.5).setCenterAlign()
|
||||||
|
|
||||||
this.selectedRectangle = this.add.rectangle(32, 32, 32, 32).setStrokeStyle(2, 0xFFFFFF);
|
|
||||||
|
|
||||||
this.logo = new Image(this, this.game.renderer.width - 30, this.game.renderer.height - 20, LoginTextures.icon);
|
this.logo = new Image(this, this.game.renderer.width - 30, this.game.renderer.height - 20, LoginTextures.icon);
|
||||||
this.add.existing(this.logo);
|
this.add.existing(this.logo);
|
||||||
|
|
||||||
@ -74,11 +66,9 @@ export class LoginScene extends Phaser.Scene {
|
|||||||
if (name === '') {
|
if (name === '') {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
return this.login(name);
|
this.login(name);
|
||||||
});
|
});
|
||||||
|
|
||||||
/*create user*/
|
|
||||||
this.createCurrentPlayer();
|
|
||||||
cypressAsserter.initFinished();
|
cypressAsserter.initFinished();
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -90,80 +80,7 @@ export class LoginScene extends Phaser.Scene {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
private async login(name: string) {
|
private login(name: string): void {
|
||||||
return gameManager.connect(name, this.selectedPlayer.texture.key).then(() => {
|
this.scene.start(SelectCharacterSceneName, { name } as SelectCharacterSceneInitDataInterface);
|
||||||
// Do we have a start URL in the address bar? If so, let's redirect to this address
|
|
||||||
let instanceAndMapUrl = this.findMapUrl();
|
|
||||||
if (instanceAndMapUrl !== null) {
|
|
||||||
let [mapUrl, instance] = instanceAndMapUrl;
|
|
||||||
let key = gameManager.loadMap(mapUrl, this.scene, instance);
|
|
||||||
this.scene.start(key);
|
|
||||||
return mapUrl;
|
|
||||||
} else {
|
|
||||||
// If we do not have a map address in the URL, let's ask the server for a start map.
|
|
||||||
return gameManager.loadStartMap().then((scene : any) => {
|
|
||||||
if (!scene) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
let key = gameManager.loadMap(window.location.protocol + "//" + scene.mapUrlStart, this.scene, scene.startInstance);
|
|
||||||
this.scene.start(key);
|
|
||||||
return scene;
|
|
||||||
}).catch((err) => {
|
|
||||||
console.error(err);
|
|
||||||
throw err;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}).catch((err) => {
|
|
||||||
console.error(err);
|
|
||||||
throw err;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Returns the map URL and the instance from the current URL
|
|
||||||
*/
|
|
||||||
private findMapUrl(): [string, string]|null {
|
|
||||||
let path = window.location.pathname;
|
|
||||||
if (!path.startsWith('/_/')) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
let instanceAndMap = path.substr(3);
|
|
||||||
let firstSlash = instanceAndMap.indexOf('/');
|
|
||||||
if (firstSlash === -1) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
let instance = instanceAndMap.substr(0, firstSlash);
|
|
||||||
return [window.location.protocol+'//'+instanceAndMap.substr(firstSlash+1), instance];
|
|
||||||
}
|
|
||||||
|
|
||||||
Map: Phaser.Tilemaps.Tilemap;
|
|
||||||
|
|
||||||
initAnimation(): void {
|
|
||||||
throw new Error("Method not implemented.");
|
|
||||||
}
|
|
||||||
|
|
||||||
createCurrentPlayer(): void {
|
|
||||||
for (let i = 0; i <PLAYER_RESOURCES.length; i++) {
|
|
||||||
let playerResource = PLAYER_RESOURCES[i];
|
|
||||||
let player = this.physics.add.sprite(playerResource.x, playerResource.y, playerResource.name, playerResource.name);
|
|
||||||
player.setBounce(0.2);
|
|
||||||
player.setCollideWorldBounds(true);
|
|
||||||
this.anims.create({
|
|
||||||
key: playerResource.name,
|
|
||||||
frames: this.anims.generateFrameNumbers(playerResource.name, {start: 0, end: 2,}),
|
|
||||||
frameRate: 10,
|
|
||||||
repeat: -1
|
|
||||||
});
|
|
||||||
player.setInteractive().on("pointerdown", () => {
|
|
||||||
this.selectedPlayer.anims.pause();
|
|
||||||
this.selectedRectangle.setY(player.y);
|
|
||||||
this.selectedRectangle.setX(player.x);
|
|
||||||
player.play(playerResource.name);
|
|
||||||
this.selectedPlayer = player;
|
|
||||||
});
|
|
||||||
this.players.push(player);
|
|
||||||
}
|
|
||||||
this.selectedPlayer = this.players[0];
|
|
||||||
this.selectedPlayer.play(PLAYER_RESOURCES[0].name);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -13,7 +13,7 @@ enum LoginTextures {
|
|||||||
mainFont = "main_font"
|
mainFont = "main_font"
|
||||||
}
|
}
|
||||||
|
|
||||||
interface InitDataInterface {
|
export interface SelectCharacterSceneInitDataInterface {
|
||||||
name: string
|
name: string
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -36,7 +36,7 @@ export class SelectCharacterScene extends Phaser.Scene {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
init({ name }: InitDataInterface) {
|
init({ name }: SelectCharacterSceneInitDataInterface) {
|
||||||
this.loginName = name;
|
this.loginName = name;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1,14 +1,5 @@
|
|||||||
import {Textures} from "../Game/GameScene";
|
import {Textures} from "../Game/GameScene";
|
||||||
|
|
||||||
interface AnimationData {
|
|
||||||
key: string;
|
|
||||||
frameRate: number;
|
|
||||||
repeat: number;
|
|
||||||
frameModel: string; //todo use an enum
|
|
||||||
frameStart: number;
|
|
||||||
frameEnd: number;
|
|
||||||
}
|
|
||||||
|
|
||||||
export enum PlayerAnimationNames {
|
export enum PlayerAnimationNames {
|
||||||
WalkDown = 'down',
|
WalkDown = 'down',
|
||||||
WalkLeft = 'left',
|
WalkLeft = 'left',
|
||||||
@ -16,34 +7,4 @@ export enum PlayerAnimationNames {
|
|||||||
WalkRight = 'right',
|
WalkRight = 'right',
|
||||||
}
|
}
|
||||||
|
|
||||||
export const getPlayerAnimations = (name: string = Textures.Player): AnimationData[] => {
|
|
||||||
return [{
|
|
||||||
key: `${name}-${PlayerAnimationNames.WalkDown}`,
|
|
||||||
frameModel: name,
|
|
||||||
frameStart: 0,
|
|
||||||
frameEnd: 2,
|
|
||||||
frameRate: 10,
|
|
||||||
repeat: -1
|
|
||||||
}, {
|
|
||||||
key: `${name}-${PlayerAnimationNames.WalkLeft}`,
|
|
||||||
frameModel: name,
|
|
||||||
frameStart: 3,
|
|
||||||
frameEnd: 5,
|
|
||||||
frameRate: 10,
|
|
||||||
repeat: -1
|
|
||||||
}, {
|
|
||||||
key: `${name}-${PlayerAnimationNames.WalkRight}`,
|
|
||||||
frameModel: name,
|
|
||||||
frameStart: 6,
|
|
||||||
frameEnd: 8,
|
|
||||||
frameRate: 10,
|
|
||||||
repeat: -1
|
|
||||||
}, {
|
|
||||||
key: `${name}-${PlayerAnimationNames.WalkUp}`,
|
|
||||||
frameModel: name,
|
|
||||||
frameStart: 9,
|
|
||||||
frameEnd: 11,
|
|
||||||
frameRate: 10,
|
|
||||||
repeat: -1
|
|
||||||
}];
|
|
||||||
};
|
|
||||||
|
@ -17,6 +17,16 @@ export interface GamerInterface extends PlayableCaracter{
|
|||||||
say(text : string) : void;
|
say(text : string) : void;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
interface AnimationData {
|
||||||
|
key: string;
|
||||||
|
frameRate: number;
|
||||||
|
repeat: number;
|
||||||
|
frameModel: string; //todo use an enum
|
||||||
|
frameStart: number;
|
||||||
|
frameEnd: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
export class Player extends PlayableCaracter implements CurrentGamerInterface, GamerInterface {
|
export class Player extends PlayableCaracter implements CurrentGamerInterface, GamerInterface {
|
||||||
userId: string;
|
userId: string;
|
||||||
userInputManager: UserInputManager;
|
userInputManager: UserInputManager;
|
||||||
@ -49,7 +59,7 @@ export class Player extends PlayableCaracter implements CurrentGamerInterface, G
|
|||||||
}
|
}
|
||||||
|
|
||||||
private initAnimation(): void {
|
private initAnimation(): void {
|
||||||
getPlayerAnimations(this.PlayerTexture).forEach(d => {
|
this.getPlayerAnimations(this.PlayerTexture).forEach(d => {
|
||||||
this.scene.anims.create({
|
this.scene.anims.create({
|
||||||
key: d.key,
|
key: d.key,
|
||||||
frames: this.scene.anims.generateFrameNumbers(d.frameModel, {start: d.frameStart, end: d.frameEnd}),
|
frames: this.scene.anims.generateFrameNumbers(d.frameModel, {start: d.frameStart, end: d.frameEnd}),
|
||||||
@ -59,6 +69,38 @@ export class Player extends PlayableCaracter implements CurrentGamerInterface, G
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
private getPlayerAnimations(name: string): AnimationData[] {
|
||||||
|
return [{
|
||||||
|
key: `${name}-${PlayerAnimationNames.WalkDown}`,
|
||||||
|
frameModel: name,
|
||||||
|
frameStart: 0,
|
||||||
|
frameEnd: 2,
|
||||||
|
frameRate: 10,
|
||||||
|
repeat: -1
|
||||||
|
}, {
|
||||||
|
key: `${name}-${PlayerAnimationNames.WalkLeft}`,
|
||||||
|
frameModel: name,
|
||||||
|
frameStart: 3,
|
||||||
|
frameEnd: 5,
|
||||||
|
frameRate: 10,
|
||||||
|
repeat: -1
|
||||||
|
}, {
|
||||||
|
key: `${name}-${PlayerAnimationNames.WalkRight}`,
|
||||||
|
frameModel: name,
|
||||||
|
frameStart: 6,
|
||||||
|
frameEnd: 8,
|
||||||
|
frameRate: 10,
|
||||||
|
repeat: -1
|
||||||
|
}, {
|
||||||
|
key: `${name}-${PlayerAnimationNames.WalkUp}`,
|
||||||
|
frameModel: name,
|
||||||
|
frameStart: 9,
|
||||||
|
frameEnd: 11,
|
||||||
|
frameRate: 10,
|
||||||
|
repeat: -1
|
||||||
|
}];
|
||||||
|
};
|
||||||
|
|
||||||
moveUser(delta: number): void {
|
moveUser(delta: number): void {
|
||||||
//if user client on shift, camera and player speed
|
//if user client on shift, camera and player speed
|
||||||
let direction = null;
|
let direction = null;
|
||||||
|
@ -12,7 +12,7 @@ const config: GameConfig = {
|
|||||||
width: window.innerWidth / RESOLUTION,
|
width: window.innerWidth / RESOLUTION,
|
||||||
height: window.innerHeight / RESOLUTION,
|
height: window.innerHeight / RESOLUTION,
|
||||||
parent: "game",
|
parent: "game",
|
||||||
scene: [SelectCharacterScene, LoginScene, ReconnectingScene],
|
scene: [LoginScene, SelectCharacterScene, ReconnectingScene],
|
||||||
zoom: RESOLUTION,
|
zoom: RESOLUTION,
|
||||||
physics: {
|
physics: {
|
||||||
default: "arcade",
|
default: "arcade",
|
||||||
|
Loading…
Reference in New Issue
Block a user