From f8d4b696e8aa992fe1ed334501d0141fdee008bb Mon Sep 17 00:00:00 2001 From: Gregoire Parant Date: Tue, 12 Jan 2021 13:19:51 +0100 Subject: [PATCH 1/4] Customise characters with admin console - Add new characters choise - Display on 3 line of 6 pers - Add custom characters from admin console wilth level -1 --- front/src/Phaser/Entity/PlayerTextures.ts | 4 +++- .../Entity/PlayerTexturesLoadingManager.ts | 2 +- front/src/Phaser/Login/CustomizeScene.ts | 3 +++ front/src/Phaser/Login/SelectCharacterScene.ts | 16 ++++++++++++++-- 4 files changed, 21 insertions(+), 4 deletions(-) diff --git a/front/src/Phaser/Entity/PlayerTextures.ts b/front/src/Phaser/Entity/PlayerTextures.ts index 6d0f99c0..8a560b56 100644 --- a/front/src/Phaser/Entity/PlayerTextures.ts +++ b/front/src/Phaser/Entity/PlayerTextures.ts @@ -18,6 +18,7 @@ export const PLAYER_RESOURCES: BodyResourceDescriptionListInterface = { "male6": {name: "male6", img: "resources/characters/pipoya/Male 17-2.png"}, "male7": {name: "male7", img: "resources/characters/pipoya/Male 18-1.png"}, "male8": {name: "male8", img: "resources/characters/pipoya/Male 16-4.png"}, + "male9": {name: "male9", img: "resources/characters/pipoya/Teacher male 02.png"}, "Female1": {name: "Female1", img: "resources/characters/pipoya/Female 01-1.png"}, "Female2": {name: "Female2", img: "resources/characters/pipoya/Female 02-2.png"}, "Female3": {name: "Female3", img: "resources/characters/pipoya/Female 03-4.png"}, @@ -25,7 +26,8 @@ export const PLAYER_RESOURCES: BodyResourceDescriptionListInterface = { "Female5": {name: "Female5", img: "resources/characters/pipoya/Female 10-3.png"}, "Female6": {name: "Female6", img: "resources/characters/pipoya/Female 17-2.png"}, "Female7": {name: "Female7", img: "resources/characters/pipoya/Female 18-1.png"}, - "Female8": {name: "Female8", img: "resources/characters/pipoya/Female 16-4.png"} + "Female8": {name: "Female8", img: "resources/characters/pipoya/Female 16-4.png"}, + "Female9": {name: "Female9", img: "resources/characters/pipoya/Female 07-2.png"} }; export const COLOR_RESOURCES: BodyResourceDescriptionListInterface = { diff --git a/front/src/Phaser/Entity/PlayerTexturesLoadingManager.ts b/front/src/Phaser/Entity/PlayerTexturesLoadingManager.ts index 6f684b2d..c2a421e5 100644 --- a/front/src/Phaser/Entity/PlayerTexturesLoadingManager.ts +++ b/front/src/Phaser/Entity/PlayerTexturesLoadingManager.ts @@ -26,9 +26,9 @@ export const loadAllDefaultModels = (load: LoaderPlugin): BodyResourceDescriptio export const loadCustomTexture = (load: LoaderPlugin, texture: CharacterTexture) => { const name = 'customCharacterTexture'+texture.id; load.spritesheet(name,texture.url,{frameWidth: 32, frameHeight: 32}); + return name; } - export const lazyLoadPlayerCharacterTextures = (loadPlugin: LoaderPlugin, texturePlugin: TextureManager, texturekeys:Array): Promise => { const promisesList:Promise[] = []; texturekeys.forEach((textureKey: string|BodyResourceDescriptionInterface) => { diff --git a/front/src/Phaser/Login/CustomizeScene.ts b/front/src/Phaser/Login/CustomizeScene.ts index 2cc58a8e..c6364ef6 100644 --- a/front/src/Phaser/Login/CustomizeScene.ts +++ b/front/src/Phaser/Login/CustomizeScene.ts @@ -60,6 +60,9 @@ export class CustomizeScene extends ResizableScene { const textures = localUser?.textures; if (textures) { for (const texture of textures) { + if(texture.level === -1){ + continue; + } loadCustomTexture(this.load, texture); const name = 'customCharacterTexture'+texture.id; this.layers[texture.level].unshift({ diff --git a/front/src/Phaser/Login/SelectCharacterScene.ts b/front/src/Phaser/Login/SelectCharacterScene.ts index 723638f5..82a9f75c 100644 --- a/front/src/Phaser/Login/SelectCharacterScene.ts +++ b/front/src/Phaser/Login/SelectCharacterScene.ts @@ -6,7 +6,7 @@ import {EnableCameraSceneName} from "./EnableCameraScene"; import {CustomizeSceneName} from "./CustomizeScene"; import {ResizableScene} from "./ResizableScene"; import {localUserStore} from "../../Connexion/LocalUserStore"; -import {loadAllDefaultModels} from "../Entity/PlayerTexturesLoadingManager"; +import {loadAllDefaultModels, loadCustomTexture} from "../Entity/PlayerTexturesLoadingManager"; import {addLoader} from "../Components/Loader"; import {BodyResourceDescriptionInterface} from "../Entity/PlayerTextures"; @@ -22,7 +22,7 @@ enum LoginTextures { } export class SelectCharacterScene extends ResizableScene { - private readonly nbCharactersPerRow = 4; + private readonly nbCharactersPerRow = 6; private textField!: TextField; private pressReturnField!: TextField; private logo!: Image; @@ -51,6 +51,18 @@ export class SelectCharacterScene extends ResizableScene { this.playerModels = loadAllDefaultModels(this.load); this.load.image(LoginTextures.customizeButton, 'resources/objects/customize.png'); this.load.image(LoginTextures.customizeButtonSelected, 'resources/objects/customize_selected.png'); + + const localUser = localUserStore.getLocalUser(); + const textures = localUser?.textures; + if (textures) { + for (const texture of textures) { + if(texture.level !== -1){ + continue; + } + const name = loadCustomTexture(this.load, texture); + this.playerModels.push({name: name, img: texture.url}); + } + } } create() { From 123ee4bc43c5d30efe69286c5390b79e683f840c Mon Sep 17 00:00:00 2001 From: Gregoire Parant Date: Tue, 12 Jan 2021 15:29:26 +0100 Subject: [PATCH 2/4] Fix responsive and limite select cursor --- .../src/Phaser/Login/SelectCharacterScene.ts | 33 ++++++++++++++----- 1 file changed, 25 insertions(+), 8 deletions(-) diff --git a/front/src/Phaser/Login/SelectCharacterScene.ts b/front/src/Phaser/Login/SelectCharacterScene.ts index 82a9f75c..a7f17576 100644 --- a/front/src/Phaser/Login/SelectCharacterScene.ts +++ b/front/src/Phaser/Login/SelectCharacterScene.ts @@ -67,8 +67,11 @@ export class SelectCharacterScene extends ResizableScene { create() { this.textField = new TextField(this, this.game.renderer.width / 2, 50, 'Select your character'); - - this.pressReturnField = new TextField(this, this.game.renderer.width / 2, 256, 'Press enter to start'); + this.pressReturnField = new TextField( + this, + this.game.renderer.width / 2, + 90 + 32 * Math.ceil( this.playerModels.length / this.nbCharactersPerRow) + 40, + 'Press enter to start'); const rectangleXStart = this.game.renderer.width / 2 - (this.nbCharactersPerRow / 2) * 32 + 16; @@ -82,25 +85,38 @@ export class SelectCharacterScene extends ResizableScene { }); this.input.keyboard.on('keydown-RIGHT', () => { - if (this.selectedRectangleXPos < this.nbCharactersPerRow - 1) { + if(this.selectedRectangleYPos * this.nbCharactersPerRow + (this.selectedRectangleXPos + 2)) + if ( + this.selectedRectangleXPos < this.nbCharactersPerRow - 1 + && ((this.selectedRectangleYPos * this.nbCharactersPerRow) + (this.selectedRectangleXPos + 1) + 1) <= this.playerModels.length + ) { this.selectedRectangleXPos++; } this.updateSelectedPlayer(); }); this.input.keyboard.on('keydown-LEFT', () => { - if (this.selectedRectangleXPos > 0) { + if ( + this.selectedRectangleXPos > 0 + && ((this.selectedRectangleYPos * this.nbCharactersPerRow) + (this.selectedRectangleXPos - 1) + 1) <= this.playerModels.length + ) { this.selectedRectangleXPos--; } this.updateSelectedPlayer(); }); this.input.keyboard.on('keydown-DOWN', () => { - if (this.selectedRectangleYPos < Math.ceil(this.playerModels.length / this.nbCharactersPerRow)) { + if ( + this.selectedRectangleYPos < Math.ceil(this.playerModels.length / this.nbCharactersPerRow) + && (((this.selectedRectangleYPos + 1) * this.nbCharactersPerRow) + this.selectedRectangleXPos + 1) <= this.playerModels.length + ) { this.selectedRectangleYPos++; } this.updateSelectedPlayer(); }); this.input.keyboard.on('keydown-UP', () => { - if (this.selectedRectangleYPos > 0) { + if ( + this.selectedRectangleYPos > 0 + && (((this.selectedRectangleYPos - 1) * this.nbCharactersPerRow) + this.selectedRectangleXPos + 1) <= this.playerModels.length + ) { this.selectedRectangleYPos--; } this.updateSelectedPlayer(); @@ -160,10 +176,11 @@ export class SelectCharacterScene extends ResizableScene { this.players.push(player); } - this.customizeButton = new Image(this, this.game.renderer.width / 2, 90 + 32 * 4 + 6, LoginTextures.customizeButton); + const maxRow = Math.ceil( this.playerModels.length / this.nbCharactersPerRow); + this.customizeButton = new Image(this, this.game.renderer.width / 2, 90 + 32 * maxRow + 6, LoginTextures.customizeButton); this.customizeButton.setOrigin(0.5, 0.5); this.add.existing(this.customizeButton); - this.customizeButtonSelected = new Image(this, this.game.renderer.width / 2, 90 + 32 * 4 + 6, LoginTextures.customizeButtonSelected); + this.customizeButtonSelected = new Image(this, this.game.renderer.width / 2, 90 + 32 * maxRow + 6, LoginTextures.customizeButtonSelected); this.customizeButtonSelected.setOrigin(0.5, 0.5); this.customizeButtonSelected.setVisible(false); this.add.existing(this.customizeButtonSelected); From 993c58cf8ee383b9df6d29e84fbc9c867d50367b Mon Sep 17 00:00:00 2001 From: Gregoire Parant Date: Tue, 12 Jan 2021 19:49:48 +0100 Subject: [PATCH 3/4] Fix select rectangle for customize scene --- front/src/Phaser/Login/SelectCharacterScene.ts | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/front/src/Phaser/Login/SelectCharacterScene.ts b/front/src/Phaser/Login/SelectCharacterScene.ts index a7f17576..25af61c6 100644 --- a/front/src/Phaser/Login/SelectCharacterScene.ts +++ b/front/src/Phaser/Login/SelectCharacterScene.ts @@ -106,7 +106,10 @@ export class SelectCharacterScene extends ResizableScene { this.input.keyboard.on('keydown-DOWN', () => { if ( this.selectedRectangleYPos < Math.ceil(this.playerModels.length / this.nbCharactersPerRow) - && (((this.selectedRectangleYPos + 1) * this.nbCharactersPerRow) + this.selectedRectangleXPos + 1) <= this.playerModels.length + && ( + (((this.selectedRectangleYPos + 1) * this.nbCharactersPerRow) + this.selectedRectangleXPos + 1) <= this.playerModels.length // check if player isn't empty + || (this.selectedRectangleYPos + 1) === Math.ceil(this.playerModels.length / this.nbCharactersPerRow) // check if is custom rectangle + ) ) { this.selectedRectangleYPos++; } From 512be7acd28462792baa2c2bddd272a1938902c1 Mon Sep 17 00:00:00 2001 From: Gregoire Parant Date: Wed, 13 Jan 2021 16:46:24 +0100 Subject: [PATCH 4/4] New basic characters --- front/src/Phaser/Entity/PlayerTextures.ts | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/front/src/Phaser/Entity/PlayerTextures.ts b/front/src/Phaser/Entity/PlayerTextures.ts index 8a560b56..7d10cc1a 100644 --- a/front/src/Phaser/Entity/PlayerTextures.ts +++ b/front/src/Phaser/Entity/PlayerTextures.ts @@ -18,7 +18,11 @@ export const PLAYER_RESOURCES: BodyResourceDescriptionListInterface = { "male6": {name: "male6", img: "resources/characters/pipoya/Male 17-2.png"}, "male7": {name: "male7", img: "resources/characters/pipoya/Male 18-1.png"}, "male8": {name: "male8", img: "resources/characters/pipoya/Male 16-4.png"}, - "male9": {name: "male9", img: "resources/characters/pipoya/Teacher male 02.png"}, + "male9": {name: "male9", img: "resources/characters/pipoya/Male 07-2.png"}, + "male10": {name: "male10", img: "resources/characters/pipoya/Male 05-3.png"}, + "male11": {name: "male11", img: "resources/characters/pipoya/Teacher male 02.png"}, + "male12": {name: "male12", img: "resources/characters/pipoya/su4 Student male 12.png"}, + "Female1": {name: "Female1", img: "resources/characters/pipoya/Female 01-1.png"}, "Female2": {name: "Female2", img: "resources/characters/pipoya/Female 02-2.png"}, "Female3": {name: "Female3", img: "resources/characters/pipoya/Female 03-4.png"}, @@ -27,7 +31,10 @@ export const PLAYER_RESOURCES: BodyResourceDescriptionListInterface = { "Female6": {name: "Female6", img: "resources/characters/pipoya/Female 17-2.png"}, "Female7": {name: "Female7", img: "resources/characters/pipoya/Female 18-1.png"}, "Female8": {name: "Female8", img: "resources/characters/pipoya/Female 16-4.png"}, - "Female9": {name: "Female9", img: "resources/characters/pipoya/Female 07-2.png"} + "Female9": {name: "Female9", img: "resources/characters/pipoya/Female 07-2.png"}, + "Female10": {name: "Female10", img: "resources/characters/pipoya/Female 05-3.png"}, + "Female11": {name: "Female11", img: "resources/characters/pipoya/Teacher fmale 02.png"}, + "Female12": {name: "Female12", img: "resources/characters/pipoya/su4 Student fmale 12.png"}, }; export const COLOR_RESOURCES: BodyResourceDescriptionListInterface = {