diff --git a/front/src/Phaser/Entity/PlayerTextures.ts b/front/src/Phaser/Entity/PlayerTextures.ts index 6d0f99c0..7d10cc1a 100644 --- a/front/src/Phaser/Entity/PlayerTextures.ts +++ b/front/src/Phaser/Entity/PlayerTextures.ts @@ -18,6 +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/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"}, @@ -25,7 +30,11 @@ 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"}, + "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 = { 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..25af61c6 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,12 +51,27 @@ 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() { 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; @@ -70,25 +85,41 @@ 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 // check if player isn't empty + || (this.selectedRectangleYPos + 1) === Math.ceil(this.playerModels.length / this.nbCharactersPerRow) // check if is custom rectangle + ) + ) { 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(); @@ -148,10 +179,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);