From 063de6d1ca9d94b862db0912bf5971e0206c9684 Mon Sep 17 00:00:00 2001 From: Hanusiak Piotr Date: Wed, 23 Feb 2022 17:34:00 +0100 Subject: [PATCH] playerTextures metadata is being loaded via Phaser.Loader --- front/src/Phaser/Entity/PlayerTextures.ts | 54 +++++++------------ front/src/Phaser/Login/EntryScene.ts | 17 ++---- .../src/Phaser/Login/SelectCharacterScene.ts | 33 +++++++----- 3 files changed, 43 insertions(+), 61 deletions(-) diff --git a/front/src/Phaser/Entity/PlayerTextures.ts b/front/src/Phaser/Entity/PlayerTextures.ts index bc484ceb..34e7f433 100644 --- a/front/src/Phaser/Entity/PlayerTextures.ts +++ b/front/src/Phaser/Entity/PlayerTextures.ts @@ -1,5 +1,7 @@ //The list of all the player textures, both the default models and the partial textures used for customization +import { PUSHER_URL } from "../../Enum/EnvironmentVariable"; + export interface BodyResourceDescriptionListInterface { [key: string]: BodyResourceDescriptionInterface; } @@ -49,46 +51,30 @@ export class PlayerTextures { public static ACCESSORIES_RESOURCES: BodyResourceDescriptionListInterface; public static LAYERS: BodyResourceDescriptionListInterface[]; - public static loadPlayerTexturesMetadata(url: string): Promise { - return new Promise((resolve, reject) => { - fetch(url, { - method: "GET", - // mode: 'no-cors', - headers: { - Host: "pusher.workadventure.localhost", - }, - }) - .then((response) => response.json()) - .then((data: PlayerTexturesMetadata) => { - this.mapTexturesMetadataIntoResources(data); - resolve(true); - }) - .catch((reason) => { - reject(reason); - }); - }); + public loadPlayerTexturesMetadata(metadata: PlayerTexturesMetadata): void { + this.mapTexturesMetadataIntoResources(metadata); } - private static mapTexturesMetadataIntoResources(metadata: PlayerTexturesMetadata): void { - this.PLAYER_RESOURCES = this.getMappedResources(metadata.woka); - this.COLOR_RESOURCES = this.getMappedResources(metadata.body); - this.EYES_RESOURCES = this.getMappedResources(metadata.eyes); - this.HAIR_RESOURCES = this.getMappedResources(metadata.hair); - this.CLOTHES_RESOURCES = this.getMappedResources(metadata.clothes); - this.HATS_RESOURCES = this.getMappedResources(metadata.hat); - this.ACCESSORIES_RESOURCES = this.getMappedResources(metadata.accessory); + private mapTexturesMetadataIntoResources(metadata: PlayerTexturesMetadata): void { + PlayerTextures.PLAYER_RESOURCES = this.getMappedResources(metadata.woka); + PlayerTextures.COLOR_RESOURCES = this.getMappedResources(metadata.body); + PlayerTextures.EYES_RESOURCES = this.getMappedResources(metadata.eyes); + PlayerTextures.HAIR_RESOURCES = this.getMappedResources(metadata.hair); + PlayerTextures.CLOTHES_RESOURCES = this.getMappedResources(metadata.clothes); + PlayerTextures.HATS_RESOURCES = this.getMappedResources(metadata.hat); + PlayerTextures.ACCESSORIES_RESOURCES = this.getMappedResources(metadata.accessory); - this.LAYERS = [ - this.COLOR_RESOURCES, - this.EYES_RESOURCES, - this.HAIR_RESOURCES, - this.CLOTHES_RESOURCES, - this.HATS_RESOURCES, - this.ACCESSORIES_RESOURCES, + PlayerTextures.LAYERS = [ + PlayerTextures.COLOR_RESOURCES, + PlayerTextures.EYES_RESOURCES, + PlayerTextures.HAIR_RESOURCES, + PlayerTextures.CLOTHES_RESOURCES, + PlayerTextures.HATS_RESOURCES, + PlayerTextures.ACCESSORIES_RESOURCES, ]; } - private static getMappedResources(category: PlayerTexturesCategory): BodyResourceDescriptionListInterface { + private getMappedResources(category: PlayerTexturesCategory): BodyResourceDescriptionListInterface { const resources: BodyResourceDescriptionListInterface = {}; for (const collection of category.collections) { for (const texture of collection.textures) { diff --git a/front/src/Phaser/Login/EntryScene.ts b/front/src/Phaser/Login/EntryScene.ts index f560f44f..d86e3a2e 100644 --- a/front/src/Phaser/Login/EntryScene.ts +++ b/front/src/Phaser/Login/EntryScene.ts @@ -8,6 +8,7 @@ import LL from "../../i18n/i18n-svelte"; import { get } from "svelte/store"; import { localeDetector } from "../../i18n/locales"; import { PlayerTextures } from "../Entity/PlayerTextures"; +import { PUSHER_URL } from "../../Enum/EnvironmentVariable"; export const EntrySceneName = "EntryScene"; @@ -16,7 +17,6 @@ export const EntrySceneName = "EntryScene"; * and to route to the next correct scene. */ export class EntryScene extends Scene { - private texturesMetadataLoaded: boolean = false; private localeLoaded: boolean = false; constructor() { @@ -31,21 +31,10 @@ export class EntryScene extends Scene { // Note: arcade.png from the Phaser 3 examples at: https://github.com/photonstorm/phaser3-examples/tree/master/public/assets/fonts/bitmap this.load.bitmapFont(ReconnectingTextures.mainFont, "resources/fonts/arcade.png", "resources/fonts/arcade.xml"); this.load.spritesheet("cat", "resources/characters/pipoya/Cat 01-1.png", { frameWidth: 32, frameHeight: 32 }); - - void PlayerTextures.loadPlayerTexturesMetadata("http://pusher.workadventure.localhost/woka-list").then( - (success) => { - this.texturesMetadataLoaded = success; - } - ); } - create() {} - - public update(): void { - if (this.texturesMetadataLoaded && !this.localeLoaded) { - this.localeLoaded = true; - this.loadLocale(); - } + create() { + this.loadLocale(); } private loadLocale(): void { diff --git a/front/src/Phaser/Login/SelectCharacterScene.ts b/front/src/Phaser/Login/SelectCharacterScene.ts index 1fceee39..cfa63bfd 100644 --- a/front/src/Phaser/Login/SelectCharacterScene.ts +++ b/front/src/Phaser/Login/SelectCharacterScene.ts @@ -5,7 +5,7 @@ import { CustomizeSceneName } from "./CustomizeScene"; import { localUserStore } from "../../Connexion/LocalUserStore"; import { loadAllDefaultModels } from "../Entity/PlayerTexturesLoadingManager"; import { Loader } from "../Components/Loader"; -import type { BodyResourceDescriptionInterface } from "../Entity/PlayerTextures"; +import { BodyResourceDescriptionInterface, PlayerTextures } from "../Entity/PlayerTextures"; import { AbstractCharacterScene } from "./AbstractCharacterScene"; import { areCharacterLayersValid } from "../../Connexion/LocalUser"; import { touchScreenManager } from "../../Touch/TouchScreenManager"; @@ -14,6 +14,7 @@ import { selectCharacterSceneVisibleStore } from "../../Stores/SelectCharacterSt import { waScaleManager } from "../Services/WaScaleManager"; import { analyticsClient } from "../../Administration/AnalyticsClient"; import { isMediaBreakpointUp } from "../../Utils/BreakpointsUtils"; +import { PUSHER_URL } from "../../Enum/EnvironmentVariable"; //todo: put this constants in a dedicated file export const SelectCharacterSceneName = "SelectCharacterScene"; @@ -32,28 +33,34 @@ export class SelectCharacterScene extends AbstractCharacterScene { protected lazyloadingAttempt = true; //permit to update texture loaded after renderer private loader: Loader; + private playerTextures: PlayerTextures; constructor() { super({ key: SelectCharacterSceneName, }); this.loader = new Loader(this); + this.playerTextures = new PlayerTextures(); } preload() { - this.loadSelectSceneCharacters() - .then((bodyResourceDescriptions) => { - bodyResourceDescriptions.forEach((bodyResourceDescription) => { - this.playerModels.push(bodyResourceDescription); - }); - this.lazyloadingAttempt = true; - }) - .catch((e) => console.error(e)); - this.playerModels = loadAllDefaultModels(this.load); - this.lazyloadingAttempt = false; + this.load.json("woka-list", `${PUSHER_URL}/woka-list`); + this.load.on("filecomplete-json-woka-list", () => { + this.playerTextures.loadPlayerTexturesMetadata(this.cache.json.get("woka-list")); + this.loadSelectSceneCharacters() + .then((bodyResourceDescriptions) => { + bodyResourceDescriptions.forEach((bodyResourceDescription) => { + this.playerModels.push(bodyResourceDescription); + }); + this.lazyloadingAttempt = true; + }) + .catch((e) => console.error(e)); + this.playerModels = loadAllDefaultModels(this.load); + this.lazyloadingAttempt = false; - //this function must stay at the end of preload function - this.loader.addLoader(); + //this function must stay at the end of preload function + this.loader.addLoader(); + }); } create() {