From 788e22e8b04c80f4952578c9adc1449d88d608ed Mon Sep 17 00:00:00 2001
From: Gregoire Parant <g.parant@thecodingmachine.com>
Date: Mon, 1 Feb 2021 16:52:28 +0100
Subject: [PATCH] Fix loading logo of WorkAdventure

---
 front/src/Phaser/Components/Loader.ts | 26 ++++++++++++++++++++------
 1 file changed, 20 insertions(+), 6 deletions(-)

diff --git a/front/src/Phaser/Components/Loader.ts b/front/src/Phaser/Components/Loader.ts
index d9dde0a7..a81b7f25 100644
--- a/front/src/Phaser/Components/Loader.ts
+++ b/front/src/Phaser/Components/Loader.ts
@@ -1,15 +1,26 @@
-const LogoNameIndex: string = 'logo';
+import ImageFrameConfig = Phaser.Types.Loader.FileTypes.ImageFrameConfig;
+
+const LogoNameIndex: string = 'logoLoading';
+const TextName: string = 'Loading...';
 const LogoResource: string = 'resources/logos/logo.png';
+const LogoFrame: ImageFrameConfig = {frameWidth: 307, frameHeight: 59};
 
 export const addLoader = (scene: Phaser.Scene): void => {
-    const loaderPlugin = scene.load.image(LogoNameIndex, LogoResource);
-    loaderPlugin.spritesheet(LogoNameIndex, LogoResource);
+    let loadingText: Phaser.GameObjects.Text|null = null;
+
     const promiseLoadLogoTexture = new Promise<Phaser.GameObjects.Image>((res) => {
-        if (loaderPlugin.textureManager.exists(LogoNameIndex)) {
+        if(scene.load.textureManager.exists(LogoNameIndex)){
             return res(scene.add.image(scene.game.renderer.width / 2, 100, LogoNameIndex));
+        }else{
+            //add loading if logo image is not ready
+            loadingText = scene.add.text(scene.game.renderer.width / 2, 200, TextName);
         }
-        loaderPlugin.once(`filecomplete-spritesheet-${LogoNameIndex}`, () => {
-            res(scene.add.image(scene.game.renderer.width / 2, 100, LogoNameIndex))
+        scene.load.spritesheet(LogoNameIndex, LogoResource, LogoFrame);
+        scene.load.once(`filecomplete-spritesheet-${LogoNameIndex}`, () => {
+            if(loadingText){
+                loadingText.destroy();
+            }
+            return res(scene.add.image(scene.game.renderer.width / 2, 100, LogoNameIndex));
         });
     });
 
@@ -20,6 +31,9 @@ export const addLoader = (scene: Phaser.Scene): void => {
         progress.fillRect(0, 270, 800 * value, 60);
     });
     scene.load.on('complete', () => {
+        if(loadingText){
+            loadingText.destroy();
+        }
         promiseLoadLogoTexture.then((resLoadingImage: Phaser.GameObjects.Image) => {
             resLoadingImage.destroy();
         });