workadventure/front/src/Phaser/Login/LogincScene.ts

162 lines
6.1 KiB
TypeScript
Raw Normal View History

import {gameManager} from "../Game/GameManager";
import {TextField} from "../Components/TextField";
import {TextInput} from "../Components/TextInput";
import {ClickButton} from "../Components/ClickButton";
import {GameScene, GameSceneInterface} from "../Game/GameScene";
import Image = Phaser.GameObjects.Image;
2020-05-04 01:48:14 +02:00
import Rectangle = Phaser.GameObjects.Rectangle;
import {PLAYER_RESOURCES} from "../Entity/PlayableCaracter";
2020-05-04 18:38:04 +02:00
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";
enum LoginTextures {
//playButton = "play_button",
icon = "icon",
mainFont = "main_font"
}
2020-05-04 01:48:14 +02:00
export class LogincScene extends Phaser.Scene implements GameSceneInterface {
private nameInput: TextInput;
private textField: TextField;
private playButton: ClickButton;
2020-04-26 18:48:41 +02:00
private infoTextField: TextField;
private pressReturnField: TextField;
private logo: Image;
2020-05-04 01:48:14 +02:00
private selectedRectangle: Rectangle;
private selectedPlayer: Phaser.Physics.Arcade.Sprite;
private players: Array<Phaser.Physics.Arcade.Sprite> = new Array<Phaser.Physics.Arcade.Sprite>();
constructor() {
super({
key: LoginSceneName
});
}
preload() {
2020-05-04 18:38:04 +02:00
cypressAsserter.preloadStarted();
//this.load.image(LoginTextures.playButton, "resources/objects/play_button.png");
this.load.image(LoginTextures.icon, "resources/logos/tcm_full.png");
// Note: arcade.png from the Phaser 3 examples at: https://github.com/photonstorm/phaser3-examples/tree/master/public/assets/fonts/bitmap
this.load.bitmapFont(LoginTextures.mainFont, 'resources/fonts/arcade.png', 'resources/fonts/arcade.xml');
2020-05-04 18:38:04 +02:00
cypressAsserter.preloadFinished();
2020-05-04 01:48:14 +02:00
//add player png
PLAYER_RESOURCES.forEach((playerResource: any) => {
2020-05-04 01:48:14 +02:00
this.load.spritesheet(
playerResource.name,
playerResource.img,
{frameWidth: 32, frameHeight: 32}
);
});
}
create() {
2020-05-04 18:38:04 +02:00
cypressAsserter.initStarted();
this.textField = new TextField(this, this.game.renderer.width / 2, 50, 'Enter your name:');
this.textField.setOrigin(0.5).setCenterAlign()
this.nameInput = new TextInput(this, this.game.renderer.width / 2 - 64, 70, 4);
2020-04-26 18:48:41 +02:00
this.pressReturnField = new TextField(this, this.game.renderer.width / 2, 130, 'Press enter to start');
this.pressReturnField.setOrigin(0.5).setCenterAlign()
2020-05-04 01:48:14 +02:00
this.selectedRectangle = this.add.rectangle(32, 32, 32, 32).setStrokeStyle(2, 0xFFFFFF);
2020-04-26 18:48:41 +02:00
this.logo = new Image(this, this.game.renderer.width - 30, this.game.renderer.height - 20, LoginTextures.icon);
this.add.existing(this.logo);
let infoText = "Commands: \n - Arrows or Z,Q,S,D to move\n - SHIFT to run";
this.infoTextField = new TextField(this, 10, this.game.renderer.height - 35, infoText);
this.input.keyboard.on('keyup-ENTER', () => {
let name = this.nameInput.getText();
if (name === '') {
return
2020-05-01 23:48:30 +02:00
}
return this.login(name);
});
2020-05-04 01:48:14 +02:00
/*create user*/
this.createCurrentPlayer("test");
2020-05-04 18:38:04 +02:00
cypressAsserter.initFinished();
}
update(time: number, delta: number): void {
if (this.nameInput.getText() == '') {
this.pressReturnField.setVisible(false);
} else {
this.pressReturnField.setVisible(!!(Math.floor(time / 500) % 2));
}
}
private async login(name: string) {
return gameManager.connect(name, this.selectedPlayer.texture.key).then(() => {
return gameManager.loadMaps().then((scene : any) => {
if (!scene) {
return;
}
let game = new GameScene(scene.mapStart.key, `${API_URL}${scene.mapStart.url}`);
this.scene.add(scene.mapStart.key, game, false);
this.scene.start(scene.mapStart.key);
return scene;
}).catch((err) => {
console.error(err);
throw err;
});
}).catch((err) => {
console.error(err);
throw err;
});
}
2020-05-04 01:48:14 +02:00
Map: Phaser.Tilemaps.Tilemap;
initAnimation(): void {
throw new Error("Method not implemented.");
2020-05-04 01:48:14 +02:00
}
createCurrentPlayer(UserId: string): void {
for (let i = 0; i <PLAYER_RESOURCES.length; i++) {
let playerResource = PLAYER_RESOURCES[i];
2020-05-04 01:48:14 +02:00
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);
2020-05-04 01:48:14 +02:00
}
shareUserPosition(UsersPosition: import("../../Connexion").MessageUserPositionInterface[]): void {
throw new Error("Method not implemented.");
}
deleteGroup(groupId: string): void {
throw new Error("Method not implemented.");
}
shareGroupPosition(groupPositionMessage: GroupCreatedUpdatedMessageInterface): void {
throw new Error("Method not implemented.");
}
updateOrCreateMapPlayer(UsersPosition: Array<MessageUserPositionInterface>): void {
throw new Error("Method not implemented.");
}
}