Passer au contenu principal
Version: latest - a1.11.0 ⚖️

Écran de chargement

In nanos world it is possible to add a customized and dynamic Loading Screen to your Server using WebUI.

Création d'un écran de chargement

Pour cela, vous devez créer un nouveau Package de type loading-screen, et ajouter vos fichiers HTML/CSS/JS dans le dossier racine du Package. Votre fichier HTML principal doit s'appeler index.html. Votre dossier devrait ressembler à cela :

Packages/
└── my-loading-screen/
├── Package.toml
├── index.html
├── style.css
└── ...

Accéder à la progression de chargement/téléchargement

Pour pouvoir afficher des informations dynamiques sur l'écran, vous pouvez utiliser l'event UpdateScreen (qui va être appelé toutes les quelques ms):

L'évènement UpdateScreen

ParameterDescription
messageAffiche l'état actuel (loading, validating, downloading... )
message_secondaryAffiche le fichier/asset actuel en cours de chargement/téléchargement
progress_smallProgression du fichier en cours de chargement/téléchargement
progress_small_totalTaille du fichier en cours de chargement/téléchargement
progressProgression actuelle
progress_totalProgression totale
current_stageL'étape actuelle du chargement (loading, downloading)
tip

Astuce : Vous pouvez utiliser progress et progress_total pour remplir la barre de chargement principale, et progress_small pour une barre de chargement réduite.

info

Toujours utiliser progress / progress_total pour récupérer le pourcentage % actuel, car progress_total représente le nombre total de fichiers en cours de téléchargement.

Packages/my-loading-screen/index.js
Events.Subscribe("UpdateScreen", function(message, message_secondary, progress_small, progress_small_total, progress, progress_total, current_stage) {
// Mettre à jour l'HTML ici
});

Aussi, il est possible de récupérer les informations d'un joueur en accédant à une variable globale nommée LoadingScreen:

var LoadingScreen = {
server_ip,
server_name,
server_description,
server_port,
player_nanos_id,
player_nanos_username
};

Configurer votre serveur pour utiliser l'écran de chargement

After creating your loading-screen package, you will need to configure your server to load it in your Config.toml. Dans loading_screen, mettez simplement le nom du dossier de votre Package.

# le package loading-screen à charger (l'écran de chargement sera affiché quand les joueurs rejoindront votre serveur)
loading_screen = "my-loading-screen"