HZ Scripts

HZ-Loading

HZ-Loading is a loading screen creator for FiveM. The loading screen itself is a React app served by your server — and it is edited in-game, from the HZ-Bridge admin panel, in a split-pane editor showing a live preview of the real screen.

No config file, no restart. Everything is edited in /hzpanel and published in one click. The new screen is live for everyone connecting from that moment.

What it does

  • The Loading Creator — a WYSIWYG builder inside your admin panel. Free drag-and-drop placement with grid snap, and the right-hand pane runs the actual loading screen, not a mockup.
  • Real progress — bound to FXServer's streaming events (init / map / run phases, current file, true percentage), not a CSS animation on a timer.
  • Live server data — player count, slots and uptime pushed by your own server, delivered through the connection handshake so they are correct for a player who is still connecting.
  • Scene scheduler — cron-scheduled config overlays: a Halloween skin every 25–31 October, a maintenance banner on Tuesdays, a promo weekend.
  • Backgrounds — image playlist with crossfade, video file, YouTube, or a generative animated background, with darkness / grayscale / saturation / contrast / scanline effects.
  • Music player — playlist, shuffle, skip, volume, mute, with per-player preferences that persist between connections.
  • Content panels — Updates and Rules in Markdown (Rules gets full-text search), a team grid, and a rotating tips ticker.
  • Keybinds board — the physical keyboard drawn with your bound keys lit, with a QWERTY / AZERTY toggle.
  • 7 languages — English, French, Spanish, German, Portuguese, Turkish, Italian, including translated built-in example content.

How it fits together

/hzpanel → Loading Creator          (admin edits, live preview in an iframe)
      ↓  Publish
data/HZ-Loading.json                (the Creator document, server-side)
      ↓  overlaid on the panel config + the active scene
getConfig()
      ↓
deferrals.handover  →  the connecting player's loading screen
data/effective.json →  fallback snapshot, read over nui://

The loading screen receives its configuration through the connection handshake — it never asks for it. During the loading window HZ-Loading is the only resource running on the client and network events are not routed yet, so a request/response round-trip would often go unanswered.

Requirements

  • HZ-Bridge — required. Provides the admin panel, role permissions and the appearance cascade.
  • Standalone — no framework needed. Runs alongside ESX, QBCore, QBox or anything else.
  • Any recent FXServer build.

Where to go next