From d93a8da828d3d7c3ac0b93efd04eced7ad43586c Mon Sep 17 00:00:00 2001
From: Gregoire Parant <g.parant@thecodingmachine.com>
Date: Sun, 24 Jan 2021 15:57:47 +0100
Subject: [PATCH] Fix custom character lazy loading

---
 .../Entity/PlayerTexturesLoadingManager.ts    | 20 +++++++++++--------
 front/src/Phaser/Game/GameScene.ts            | 11 +++++++++-
 front/src/Phaser/Login/CustomizeScene.ts      |  7 ++-----
 .../src/Phaser/Login/SelectCharacterScene.ts  |  5 +++--
 4 files changed, 27 insertions(+), 16 deletions(-)

diff --git a/front/src/Phaser/Entity/PlayerTexturesLoadingManager.ts b/front/src/Phaser/Entity/PlayerTexturesLoadingManager.ts
index 776d1f5c..2e0353ae 100644
--- a/front/src/Phaser/Entity/PlayerTexturesLoadingManager.ts
+++ b/front/src/Phaser/Entity/PlayerTexturesLoadingManager.ts
@@ -23,21 +23,25 @@ export const loadAllDefaultModels = (load: LoaderPlugin): BodyResourceDescriptio
     });
     return returnArray;
 }
-export const loadCustomTexture = (load: LoaderPlugin, texture: CharacterTexture) => {
+export const loadCustomTexture = (load: LoaderPlugin, texture: CharacterTexture) : Promise<BodyResourceDescriptionInterface> => {
     const name = 'customCharacterTexture'+texture.id;
-    load.spritesheet(name,texture.url,{frameWidth: 32, frameHeight: 32});
-    return name;
+    return createLoadingPromise(load, {name, img: texture.url}).then(() => {
+        return {name: name, img: texture.url}
+    });
 }
 
 export const lazyLoadPlayerCharacterTextures = (loadPlugin: LoaderPlugin, texturePlugin: TextureManager, texturekeys:Array<string|BodyResourceDescriptionInterface>): Promise<string[]> => {
     const promisesList:Promise<void>[] = [];
     texturekeys.forEach((textureKey: string|BodyResourceDescriptionInterface) => {
-        const playerResourceDescriptor = getRessourceDescriptor(textureKey);        
-        if(!texturePlugin.exists(playerResourceDescriptor.name)) {
-            console.log('Loading '+playerResourceDescriptor.name)
-            promisesList.push(createLoadingPromise(loadPlugin, playerResourceDescriptor));
+        try {
+            const playerResourceDescriptor = getRessourceDescriptor(textureKey);
+            if (playerResourceDescriptor && !texturePlugin.exists(playerResourceDescriptor.name)) {
+                promisesList.push(createLoadingPromise(loadPlugin, playerResourceDescriptor));
+            }
+        }catch (err){
+            console.error(err);
         }
-    })
+    });
     let returnPromise:Promise<Array<string|BodyResourceDescriptionInterface>>;
     if (promisesList.length > 0) {
         loadPlugin.start();
diff --git a/front/src/Phaser/Game/GameScene.ts b/front/src/Phaser/Game/GameScene.ts
index c2cb0950..c4a08e11 100644
--- a/front/src/Phaser/Game/GameScene.ts
+++ b/front/src/Phaser/Game/GameScene.ts
@@ -30,7 +30,7 @@ import {RemotePlayer} from "../Entity/RemotePlayer";
 import {Queue} from 'queue-typescript';
 import {SimplePeer, UserSimplePeerInterface} from "../../WebRtc/SimplePeer";
 import {ReconnectingSceneName} from "../Reconnecting/ReconnectingScene";
-import {lazyLoadPlayerCharacterTextures} from "../Entity/PlayerTexturesLoadingManager";
+import {lazyLoadPlayerCharacterTextures, loadCustomTexture} from "../Entity/PlayerTexturesLoadingManager";
 import {
     CenterListener,
     layoutManager,
@@ -67,6 +67,8 @@ import {SelectCharacterScene, SelectCharacterSceneName} from "../Login/SelectCha
 import {TextureError} from "../../Exception/TextureError";
 import {addLoader} from "../Components/Loader";
 import {ErrorSceneName} from "../Reconnecting/ErrorScene";
+import {localUserStore} from "../../Connexion/LocalUserStore";
+import {BodyResourceDescriptionInterface} from "../Entity/PlayerTextures";
 
 export interface GameSceneInitInterface {
     initPosition: PointInterface|null,
@@ -182,6 +184,13 @@ export class GameScene extends ResizableScene implements CenterListener {
     //hook preload scene
     preload(): void {
         addLoader(this);
+        const localUser = localUserStore.getLocalUser();
+        const textures = localUser?.textures;
+        if (textures) {
+            for (const texture of textures) {
+                loadCustomTexture(this.load, texture);
+            }
+        }
 
         this.load.image(openChatIconName, 'resources/objects/talk.png');
         this.load.on(FILE_LOAD_ERROR, (file: {src: string}) => {
diff --git a/front/src/Phaser/Login/CustomizeScene.ts b/front/src/Phaser/Login/CustomizeScene.ts
index c6364ef6..1cea50ee 100644
--- a/front/src/Phaser/Login/CustomizeScene.ts
+++ b/front/src/Phaser/Login/CustomizeScene.ts
@@ -63,11 +63,8 @@ export class CustomizeScene extends ResizableScene {
                 if(texture.level === -1){
                     continue;
                 }
-                loadCustomTexture(this.load, texture);
-                const name = 'customCharacterTexture'+texture.id;
-                this.layers[texture.level].unshift({
-                    name,
-                    img: texture.url
+                loadCustomTexture(this.load, texture).then((bodyResourceDescription: BodyResourceDescriptionInterface) => {
+                    this.layers[texture.level].unshift(bodyResourceDescription);
                 });
             }
         }
diff --git a/front/src/Phaser/Login/SelectCharacterScene.ts b/front/src/Phaser/Login/SelectCharacterScene.ts
index 25af61c6..5d315139 100644
--- a/front/src/Phaser/Login/SelectCharacterScene.ts
+++ b/front/src/Phaser/Login/SelectCharacterScene.ts
@@ -59,8 +59,9 @@ export class SelectCharacterScene extends ResizableScene {
                 if(texture.level !== -1){
                     continue;
                 }
-                const name = loadCustomTexture(this.load, texture);
-                this.playerModels.push({name: name, img: texture.url});
+                loadCustomTexture(this.load, texture).then((bodyResourceDescription: BodyResourceDescriptionInterface) => {
+                    this.playerModels.push(bodyResourceDescription);
+                });
             }
         }
     }