RX Loading Screen V2 Configuration

Every customer-facing part of V2 lives in script/config.js. Edit the CONFIG object, keep its commas and braces intact, then restart the resource.

Use relative paths such as img/logo.png and song/track.mp3. A path must point to a file packaged inside the resource.

Theme colours

The four theme values feed the CSS variables used across controls, highlights, panel states, and the base backdrop.

theme: {
  primary: '#f4f4f5',
  primaryLight: '#ffffff',
  primaryDark: '#a1a1aa',
  bgDark: '#08080a',
},

Setting	Used for
`primary`	Main accent, active details, and icon highlights
`primaryLight`	Light text and gradient edge colour
`primaryDark`	Darker hover and pressed state colour
`bgDark`	Base dark overlay and page tone

Use six-digit hex colours. Keep primaryLight visibly brighter than primaryDark so controls retain their depth.

Background video and overlay

server.backgroundVideo selects the local video, while videoOverlay controls how clearly it is seen behind the interface.

videoOverlay: {
  defaultEnabled: true,
  defaultOpacity: 0.34,
  panelOpacity: 1.0,
  transitionMs: 580,
},

server: {
  name: 'Ripex Roleplay',
  tagline: 'YOUR STORY STARTS HERE',
  logo: 'img/logo.png',
  backgroundVideo: 'img/test.mp4',
},

Setting	Behaviour
`defaultEnabled`	Disables the idle overlay when set to `false`.
`defaultOpacity`	Idle darkness from `0` (clear) to `1` (black).
`panelOpacity`	Darkness while a content panel is open.
`transitionMs`	Overlay fade duration in milliseconds.

Use a muted H.264 MP4 and test it at the resolution your players normally use. Large video files noticeably increase join time.

Branding and social links

The server block sets the logo and two lines of brand copy. social creates one button per entry.

social: [
  { platform: 'discord', url: 'https://discord.gg/your-server', icon: 'fab fa-discord', tooltip: 'Join our Discord' },
  { platform: 'website', url: 'https://example.com', icon: 'fas fa-globe', tooltip: 'Visit website' },
],

platform becomes part of the button class, url is the destination, icon is a Font Awesome class, and tooltip is the hover label. Remove an entry to hide it; add another object to create another button.

Staff roster

Each members entry creates a selectable staff row and its expanded spotlight card.

{
  name: 'Alex',
  role: 'Developer',
  image: 'img/alex.png',
  tooltip: 'Lead Developer',
  roleClass: 'developer-role',
  status: 'Online',
  detailBadges: ['Developer', 'Systems'],
  quote: 'Keeping every release smooth.'
}

Field	Behaviour
`name`, `role`	Visible identity on the roster and spotlight
`image`	Local avatar image
`tooltip`	Short hover label on the row
`roleClass`	Badge style: `owner-role`, `manager-role`, `developer-role`, `admin-role`, or `mod-role`
`status`	Small status label shown in detail
`detailBadges`	Array of labels shown on the spotlight card
`quote`	Supporting line shown on the spotlight card

The first member is selected initially. Large teams are supported, but keep the first entry as the person you want featured by default.

Gallery

Gallery entries use a local source and optional caption.

gallery: {
  images: [
    { src: 'img/city-night.webp', caption: 'Downtown at night' },
    { src: 'img/harbor.webp', caption: 'Harbor district' },
  ],
},

Add or remove entries freely. Use compressed WebP or JPG screenshots so the gallery stays quick to open.

Updates and server information

The updates panel is a timeline. Each item gets a tag, title, body, and small date. The server-information panel turns each stats entry into an icon-led rule or fact.

updates: {
  title: 'Latest Updates',
  lastUpdated: 'Last updated: 2026-08-20',
  items: [
    { tag: 'WORLD', title: 'A new district', body: 'The north-side market is now open.', date: 'Aug 20' },
  ],
},

serverInfo: {
  title: 'Community Rules',
  stats: [
    { icon: 'fas fa-handshake', value: 'Respect', label: 'Treat every player with dignity.' },
  ],
},

Use concise body and label text. The content is read while players are waiting, so it should be useful at a glance rather than a wall of rules.

Loading messages

The loading label cycles through this array while the client connects.

loadingTexts: [
  'Logging in to the server',
  'Preparing assets',
  'Almost there',
],

Three to five short messages are ideal. Avoid exact completion estimates, since actual load time depends on the player’s connection and cache.

Music playlist

Add tracks from the local song/ folder. Every track needs its file, display name, artist, and cover image.

music: {
  initialVolume: 0.5,
  defaultSongs: [
    {
      file: 'song/arrival.mp3',
      name: 'Arrival',
      artist: 'Your Artist',
      thumbnail: 'img/arrival-cover.webp'
    },
  ],
},

initialVolume uses a range from 0 to 1; 0.5 is 50%. Ensure every audio and cover path exists before restarting. Only ship media you own or have permission to redistribute.