Custom loading screen

A loading screen is a plain HTML page in your server's resources, at resources/loadscreen/index.html. The launcher shows it full screen behind its progress panel once the resources are downloaded.

1. Create the files

game-server/resources/loadscreen/
├── index.html
├── style.css
└── background.jpg

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>My server</title>
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <div class="wrap">
    <h1>My <span>server</span></h1>
    <p>Welcome! Read the rules while the Andes load.</p>
  </div>
</body>
</html>

html, body { margin: 0; height: 100%; background: #111 url('background.jpg') center / cover; color: #fff; font-family: 'Segoe UI', sans-serif; }
.wrap { position: absolute; left: 64px; bottom: 140px; max-width: 640px; }
h1 span { color: #FFB800; }

2. Rules to follow

• Relative paths only. The page is opened from the player's cache as a file:// URL, so href="style.css" works and /style.css does not.
• Keep it light. Every file is downloaded before the page can show; large videos delay the screen for everyone.
• Leave room for the launcher's panel (progress, steps, current file).
• The page cannot talk to the launcher; it is decoration and information.

3. Restart the server

The resource manifest is built at start-up — restart node server.js after changing the files. Players get the new version automatically on their next join (changed files are re-downloaded, removed ones deleted from their cache).