_Bastler/partey_workadventure
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

In SelectCharacterScene, if custom character not loaded then select the first character (#1284)

Browse Source
This commit is contained in:
GRL78 2021-07-19 17:06:36 +02:00 committed by GitHub
parent 9432c82386
commit 697f316780
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 51 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

104
front/src/Phaser/Login/SelectCharacterScene.ts
View File

@ -1,25 +1,25 @@
import {gameManager} from "../Game/GameManager"; import { gameManager } from "../Game/GameManager";
import Rectangle = Phaser.GameObjects.Rectangle; import Rectangle = Phaser.GameObjects.Rectangle;
import {EnableCameraSceneName} from "./EnableCameraScene"; import { EnableCameraSceneName } from "./EnableCameraScene";
import {CustomizeSceneName} from "./CustomizeScene"; import { CustomizeSceneName } from "./CustomizeScene";
import {localUserStore} from "../../Connexion/LocalUserStore"; import { localUserStore } from "../../Connexion/LocalUserStore";
import {loadAllDefaultModels} from "../Entity/PlayerTexturesLoadingManager"; import { loadAllDefaultModels } from "../Entity/PlayerTexturesLoadingManager";
import {addLoader} from "../Components/Loader"; import { addLoader } from "../Components/Loader";
import type {BodyResourceDescriptionInterface} from "../Entity/PlayerTextures"; import type { BodyResourceDescriptionInterface } from "../Entity/PlayerTextures";
import {AbstractCharacterScene} from "./AbstractCharacterScene"; import { AbstractCharacterScene } from "./AbstractCharacterScene";
import {areCharacterLayersValid} from "../../Connexion/LocalUser"; import { areCharacterLayersValid } from "../../Connexion/LocalUser";
import {touchScreenManager} from "../../Touch/TouchScreenManager"; import { touchScreenManager } from "../../Touch/TouchScreenManager";
import {PinchManager} from "../UserInput/PinchManager"; import { PinchManager } from "../UserInput/PinchManager";
import {selectCharacterSceneVisibleStore} from "../../Stores/SelectCharacterStore"; import { selectCharacterSceneVisibleStore } from "../../Stores/SelectCharacterStore";
import {waScaleManager} from "../Services/WaScaleManager"; import { waScaleManager } from "../Services/WaScaleManager";
import {isMobile} from "../../Enum/EnvironmentVariable"; import { isMobile } from "../../Enum/EnvironmentVariable";
//todo: put this constants in a dedicated file //todo: put this constants in a dedicated file
export const SelectCharacterSceneName = "SelectCharacterScene"; export const SelectCharacterSceneName = "SelectCharacterScene";
export class SelectCharacterScene extends AbstractCharacterScene { export class SelectCharacterScene extends AbstractCharacterScene {
protected readonly nbCharactersPerRow = 6; protected readonly nbCharactersPerRow = 6;
protected selectedPlayer!: Phaser.Physics.Arcade.Sprite|null; // null if we are selecting the "customize" option protected selectedPlayer!: Phaser.Physics.Arcade.Sprite | null; // null if we are selecting the "customize" option
protected players: Array<Phaser.Physics.Arcade.Sprite> = new Array<Phaser.Physics.Arcade.Sprite>(); protected players: Array<Phaser.Physics.Arcade.Sprite> = new Array<Phaser.Physics.Arcade.Sprite>();
protected playerModels!: BodyResourceDescriptionInterface[]; protected playerModels!: BodyResourceDescriptionInterface[];
@ -38,7 +38,6 @@ export class SelectCharacterScene extends AbstractCharacterScene {
} }
preload() { preload() {
this.loadSelectSceneCharacters().then((bodyResourceDescriptions) => { this.loadSelectSceneCharacters().then((bodyResourceDescriptions) => {
bodyResourceDescriptions.forEach((bodyResourceDescription) => { bodyResourceDescriptions.forEach((bodyResourceDescription) => {
this.playerModels.push(bodyResourceDescription); this.playerModels.push(bodyResourceDescription);
@ -54,7 +53,7 @@ export class SelectCharacterScene extends AbstractCharacterScene {
create() { create() {
selectCharacterSceneVisibleStore.set(true); selectCharacterSceneVisibleStore.set(true);
this.events.addListener('wake', () => { this.events.addListener("wake", () => {
waScaleManager.saveZoom(); waScaleManager.saveZoom();
waScaleManager.zoomModifier = isMobile() ? 2 : 1; waScaleManager.zoomModifier = isMobile() ? 2 : 1;
selectCharacterSceneVisibleStore.set(true); selectCharacterSceneVisibleStore.set(true);
@ -68,26 +67,26 @@ export class SelectCharacterScene extends AbstractCharacterScene {
waScaleManager.zoomModifier = isMobile() ? 2 : 1; waScaleManager.zoomModifier = isMobile() ? 2 : 1;
const rectangleXStart = this.game.renderer.width / 2 - (this.nbCharactersPerRow / 2) * 32 + 16; const rectangleXStart = this.game.renderer.width / 2 - (this.nbCharactersPerRow / 2) * 32 + 16;
this.selectedRectangle = this.add.rectangle(rectangleXStart, 90, 32, 32).setStrokeStyle(2, 0xFFFFFF); this.selectedRectangle = this.add.rectangle(rectangleXStart, 90, 32, 32).setStrokeStyle(2, 0xffffff);
this.selectedRectangle.setDepth(2); this.selectedRectangle.setDepth(2);
/*create user*/ /*create user*/
this.createCurrentPlayer(); this.createCurrentPlayer();
this.input.keyboard.on('keyup-ENTER', () => { this.input.keyboard.on("keyup-ENTER", () => {
return this.nextSceneToCameraScene(); return this.nextSceneToCameraScene();
}); });
this.input.keyboard.on('keydown-RIGHT', () => { this.input.keyboard.on("keydown-RIGHT", () => {
this.moveToRight(); this.moveToRight();
}); });
this.input.keyboard.on('keydown-LEFT', () => { this.input.keyboard.on("keydown-LEFT", () => {
this.moveToLeft(); this.moveToLeft();
}); });
this.input.keyboard.on('keydown-UP', () => { this.input.keyboard.on("keydown-UP", () => {
this.moveToUp(); this.moveToUp();
}); });
this.input.keyboard.on('keydown-DOWN', () => { this.input.keyboard.on("keydown-DOWN", () => {
this.moveToDown(); this.moveToDown();
}); });
} }
@ -96,7 +95,7 @@ export class SelectCharacterScene extends AbstractCharacterScene {
if (this.selectedPlayer !== null && !areCharacterLayersValid([this.selectedPlayer.texture.key])) { if (this.selectedPlayer !== null && !areCharacterLayersValid([this.selectedPlayer.texture.key])) {
return; return;
} }
if(!this.selectedPlayer){ if (!this.selectedPlayer) {
return; return;
} }
this.scene.stop(SelectCharacterSceneName); this.scene.stop(SelectCharacterSceneName);
@ -105,7 +104,7 @@ export class SelectCharacterScene extends AbstractCharacterScene {
gameManager.tryResumingGame(this, EnableCameraSceneName); gameManager.tryResumingGame(this, EnableCameraSceneName);
this.players = []; this.players = [];
selectCharacterSceneVisibleStore.set(false); selectCharacterSceneVisibleStore.set(false);
this.events.removeListener('wake'); this.events.removeListener("wake");
} }
public nextSceneToCustomizeScene(): void { public nextSceneToCustomizeScene(): void {
@ -119,11 +118,11 @@ export class SelectCharacterScene extends AbstractCharacterScene {
} }
createCurrentPlayer(): void { createCurrentPlayer(): void {
for (let i = 0; i <this.playerModels.length; i++) { for (let i = 0; i < this.playerModels.length; i++) {
const playerResource = this.playerModels[i]; const playerResource = this.playerModels[i];
//check already exist texture //check already exist texture
if(this.players.find((c) => c.texture.key === playerResource.name)){ if (this.players.find((c) => c.texture.key === playerResource.name)) {
continue; continue;
} }
@ -132,9 +131,9 @@ export class SelectCharacterScene extends AbstractCharacterScene {
this.setUpPlayer(player, i); this.setUpPlayer(player, i);
this.anims.create({ this.anims.create({
key: playerResource.name, key: playerResource.name,
frames: this.anims.generateFrameNumbers(playerResource.name, {start: 0, end: 11}), frames: this.anims.generateFrameNumbers(playerResource.name, { start: 0, end: 11 }),
frameRate: 8, frameRate: 8,
repeat: -1 repeat: -1,
}); });
player.setInteractive().on("pointerdown", () => { player.setInteractive().on("pointerdown", () => {
if (this.pointerClicked) { if (this.pointerClicked) {
@ -153,77 +152,79 @@ export class SelectCharacterScene extends AbstractCharacterScene {
}); });
this.players.push(player); this.players.push(player);
} }
if (this.currentSelectUser >= this.players.length) {
this.currentSelectUser = 0;
}
this.selectedPlayer = this.players[this.currentSelectUser]; this.selectedPlayer = this.players[this.currentSelectUser];
this.selectedPlayer.play(this.playerModels[this.currentSelectUser].name); this.selectedPlayer.play(this.playerModels[this.currentSelectUser].name);
} }
protected moveUser(){ protected moveUser() {
for(let i = 0; i < this.players.length; i++){ for (let i = 0; i < this.players.length; i++) {
const player = this.players[i]; const player = this.players[i];
this.setUpPlayer(player, i); this.setUpPlayer(player, i);
} }
this.updateSelectedPlayer(); this.updateSelectedPlayer();
} }
public moveToLeft(){ public moveToLeft() {
if(this.currentSelectUser === 0){ if (this.currentSelectUser === 0) {
return; return;
} }
this.currentSelectUser -= 1; this.currentSelectUser -= 1;
this.moveUser(); this.moveUser();
} }
public moveToRight(){ public moveToRight() {
if(this.currentSelectUser === (this.players.length - 1)){ if (this.currentSelectUser === this.players.length - 1) {
return; return;
} }
this.currentSelectUser += 1; this.currentSelectUser += 1;
this.moveUser(); this.moveUser();
} }
protected moveToUp(){ protected moveToUp() {
if(this.currentSelectUser < this.nbCharactersPerRow){ if (this.currentSelectUser < this.nbCharactersPerRow) {
return; return;
} }
this.currentSelectUser -= this.nbCharactersPerRow; this.currentSelectUser -= this.nbCharactersPerRow;
this.moveUser(); this.moveUser();
} }
protected moveToDown(){ protected moveToDown() {
if((this.currentSelectUser + this.nbCharactersPerRow) > (this.players.length - 1)){ if (this.currentSelectUser + this.nbCharactersPerRow > this.players.length - 1) {
return; return;
} }
this.currentSelectUser += this.nbCharactersPerRow; this.currentSelectUser += this.nbCharactersPerRow;
this.moveUser(); this.moveUser();
} }
protected defineSetupPlayer(num: number){ protected defineSetupPlayer(num: number) {
const deltaX = 32; const deltaX = 32;
const deltaY = 32; const deltaY = 32;
let [playerX, playerY] = this.getCharacterPosition(); // player X and player y are middle of the let [playerX, playerY] = this.getCharacterPosition(); // player X and player y are middle of the
playerX = ( (playerX - (deltaX * 2.5)) + ((deltaX) * (num % this.nbCharactersPerRow)) ); // calcul position on line users playerX = playerX - deltaX * 2.5 + deltaX * (num % this.nbCharactersPerRow); // calcul position on line users
playerY = ( (playerY - (deltaY * 2)) + ((deltaY) * ( Math.floor(num / this.nbCharactersPerRow) )) ); // calcul position on column users playerY = playerY - deltaY * 2 + deltaY * Math.floor(num / this.nbCharactersPerRow); // calcul position on column users
const playerVisible = true; const playerVisible = true;
const playerScale = 1; const playerScale = 1;
const playerOpacity = 1; const playerOpacity = 1;
// if selected // if selected
if( num === this.currentSelectUser ){ if (num === this.currentSelectUser) {
this.selectedRectangle.setX(playerX); this.selectedRectangle.setX(playerX);
this.selectedRectangle.setY(playerY); this.selectedRectangle.setY(playerY);
} }
return {playerX, playerY, playerScale, playerOpacity, playerVisible} return { playerX, playerY, playerScale, playerOpacity, playerVisible };
} }
protected setUpPlayer(player: Phaser.Physics.Arcade.Sprite, num: number){ protected setUpPlayer(player: Phaser.Physics.Arcade.Sprite, num: number) {
const { playerX, playerY, playerScale, playerOpacity, playerVisible } = this.defineSetupPlayer(num);
const {playerX, playerY, playerScale, playerOpacity, playerVisible} = this.defineSetupPlayer(num);
player.setBounce(0.2); player.setBounce(0.2);
player.setCollideWorldBounds(false); player.setCollideWorldBounds(false);
player.setVisible( playerVisible ); player.setVisible(playerVisible);
player.setScale(playerScale, playerScale); player.setScale(playerScale, playerScale);
player.setAlpha(playerOpacity); player.setAlpha(playerOpacity);
player.setX(playerX); player.setX(playerX);
@ -234,10 +235,7 @@ export class SelectCharacterScene extends AbstractCharacterScene {
* Returns pixel position by on column and row number * Returns pixel position by on column and row number
*/ */
protected getCharacterPosition(): [number, number] { protected getCharacterPosition(): [number, number] {
return [ return [this.game.renderer.width / 2, this.game.renderer.height / 2.5];
this.game.renderer.width / 2,
this.game.renderer.height / 2.5
];
} }
protected updateSelectedPlayer(): void { protected updateSelectedPlayer(): void {
@ -256,7 +254,7 @@ export class SelectCharacterScene extends AbstractCharacterScene {
this.pointerClicked = false; this.pointerClicked = false;
} }
if(this.lazyloadingAttempt){ if (this.lazyloadingAttempt) {
//re-render players list //re-render players list
this.createCurrentPlayer(); this.createCurrentPlayer();
this.moveUser(); this.moveUser();