Update loading

src/App.tsx

@@ -1,4 +1,4 @@
-import { GetAvatarRenderManager, GetCommunication, GetConfiguration, GetLocalizationManager, GetRoomEngine, GetRoomSessionManager, GetSessionDataManager, GetSoundManager, GetStage, GetTicker, HabboWebTools, LegacyExternalInterface, LoadGameUrlEvent, NitroLogger, NitroVersion, PrepareRenderer } from '@nitrots/nitro-renderer';
+import { GetAssetManager, GetAvatarRenderManager, GetCommunication, GetConfiguration, GetLocalizationManager, GetRoomEngine, GetRoomSessionManager, GetSessionDataManager, GetSoundManager, GetStage, GetTicker, HabboWebTools, LegacyExternalInterface, LoadGameUrlEvent, NitroLogger, NitroVersion, PrepareRenderer } from '@nitrots/nitro-renderer';
 import { FC, useEffect, useState } from 'react';
 import { GetUIVersion } from './api';
 import { Base } from './common';
@@ -11,8 +11,15 @@ NitroVersion.UI_VERSION = GetUIVersion();
 export const App: FC<{}> = props =>
 {
     const [ isReady, setIsReady ] = useState(false);
-    const [ message, setMessage ] = useState('Getting Ready');
+
-    const [ imageRendering, setImageRendering ] = useState<boolean>(true);
+    useMessageEvent<LoadGameUrlEvent>(LoadGameUrlEvent, event =>
+    {
+        const parser = event.getParser();
+
+        if(!parser) return;
+
+        LegacyExternalInterface.callGame('showGame', parser.url);
+    });
 
     useEffect(() =>
     {
@@ -42,11 +49,19 @@ export const App: FC<{}> = props =>
                 NitroLogger.LOG_EVENTS = GetConfiguration().getValue<boolean>('system.log.events', false);
                 NitroLogger.LOG_PACKETS = GetConfiguration().getValue<boolean>('system.log.packets', false);
 
-                await GetLocalizationManager().init();
+                const assetUrls = GetConfiguration().getValue<string[]>('preload.assets.urls').map(url => GetConfiguration().interpolate(url)) ?? [];
-                await GetAvatarRenderManager().init();
+
-                await GetSoundManager().init();
+                await Promise.all(
-                await GetSessionDataManager().init();
+                    [
-                await GetRoomSessionManager().init();
+                        GetAssetManager().downloadAssets(assetUrls),
+                        GetLocalizationManager().init(),
+                        GetAvatarRenderManager().init(),
+                        GetSoundManager().init(),
+                        GetSessionDataManager().init(),
+                        GetRoomSessionManager().init()
+                    ]
+                );
+
                 await GetRoomEngine().init();
                 await GetCommunication().init();
 
@@ -70,33 +85,13 @@ export const App: FC<{}> = props =>
             }
         }
 
-        const resize = (event: UIEvent) => setImageRendering(!(window.devicePixelRatio % 1));
-
-        window.addEventListener('resize', resize);
-
-        resize(null);
-
         prepare(window.innerWidth, window.innerHeight);
-
-        return () =>
-        {
-            window.removeEventListener('resize', resize);
-        }
     }, []);
     
-    useMessageEvent<LoadGameUrlEvent>(LoadGameUrlEvent, event =>
-    {
-        const parser = event.getParser();
-
-        if(!parser) return;
-
-        LegacyExternalInterface.callGame('showGame', parser.url);
-    });
-    
     return (
-        <Base fit overflow="hidden" className={ imageRendering && 'image-rendering-pixelated' }>
+        <Base fit overflow="hidden" className={ !(window.devicePixelRatio % 1) && 'image-rendering-pixelated' }>
             { !isReady &&
-                <LoadingView isError={ false } message={ message } percent={ 0 } showPercent={ false } /> }
+                <LoadingView /> }
             { isReady && <MainView /> }
             <Base id="draggable-windows-container" />
         </Base>

src/components/loading/LoadingView.tsx

@@ -1,34 +1,19 @@
 import { FC } from 'react';
-import { Base, Column, LayoutProgressBar, Text } from '../../common';
+import { Base, Column } from '../../common';
 
 interface LoadingViewProps
 {
-    isError: boolean;
-    message: string;
-    percent: number;
-    showPercent?: boolean;
 }
 
 export const LoadingView: FC<LoadingViewProps> = props =>
 {
-    const { isError = false, message = '', percent = 0, showPercent = true } = props;
+    const {} = props;
     
     return (
         <Column fullHeight position="relative" className="nitro-loading">
             <Base fullHeight className="container h-100">
                 <Column fullHeight alignItems="center" justifyContent="end">
                     <Base className="connecting-duck" />
-                    { showPercent && <Column size={ 6 } className="text-center py-4">
-                        { isError && (message && message.length) ?
-                            <Base className="fs-4 text-shadow">{ message }</Base>
-                            :
-                            <>
-                                <Text fontSize={ 4 } variant="white" className="text-shadow">{ percent.toFixed() }%</Text>
-                                <LayoutProgressBar progress={ percent } className="mt-2 large" />
-                            </>
-                        }
-                        
-                    </Column> }
                 </Column>
             </Base>
         </Column>