🎮Spectro_Hud

📋 Table of Contents

🌟 Introduction

Spectro-HUD is an ultra-optimized and highly customizable user interface (HUD) specifically designed for FiveM servers using the ESX framework. It offers a complete and attractive visual experience while maintaining excellent performance even on high-population servers.

✨ Features

📋 Requirements

Framework: ESX (es_extended)
Database: MySQL with mysql-async
Server: Updated FiveM (recommended: latest versions)
Additional resources: esx_status for hunger/thirst functionality

🔧 Installation

Step 1: Download and install files 📥

Extract the spectro-hud.zip file into your server's resources folder
Make sure the folder name is spectro-hud (all lowercase, no spaces)

Step 2: Configure the database 💾

Run the following SQL query in your database:

CREATE TABLE IF NOT EXISTS hud_settings (    identifier VARCHAR(50) PRIMARY KEY,    settings LONGTEXT NOT NULL,    last_updated TIMESTAMP DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP);

Step 3: Configure the server 🖥️

Open your server.cfg file and add the following line:

ensure spectro-hud

⚠️ IMPORTANT: Make sure spectro-hud starts after es_extended and mysql-async.

Step 4: Restart the server 🔄

Save all changes and restart your FiveM server.

⚙️ Configuration

The main configuration file is located in config.lua. Here you can adjust various aspects of the HUD:

General configuration 🌐

Config.DefaultLanguage = 'en' -- Default language (es, en)Config.CommandName = 'hud' -- Command to open the menu

Element configuration 📊

You can enable or disable the main HUD elements:

Config.Elements = {    Health = true,        -- Health bar    Armor = true,         -- Armor bar    Hunger = true,        -- Hunger bar    Thirst = true,        -- Thirst bar    Stress = true,        -- Stress bar    Oxygen = true,        -- Oxygen bar    Speedometer = true,   -- Speedometer    Money = true,         -- Money    PlayerId = true       -- Player ID}

Sound configuration 🔊

Config.Sounds = {    Enabled = true,    -- Enable sounds    Volume = 0.8       -- Volume (0.0 - 1.0)}

Job counter configuration 👮‍♂️

Config.EnableJobCounts = true  -- Enable job countersConfig.TrackedJobs = {    police = true,     -- Police    ambulance = true,  -- EMS    taxi = true,       -- Taxi    mechanic = true    -- Mechanic}

Performance configuration ⚡

Config.JobCountUpdateInterval = 60000  -- Update counts every 1 minuteConfig.ClientUpdateInterval = 200      -- Update client UI every 200msConfig.EnableDebugLogs = false         -- Disable debug logs by default

Optimization configuration 📈

Config.PerformanceMode = {    Enabled = true,             -- Automatically activate with many players    PlayerThreshold = 50,       -- Player threshold for performance mode    UpdateInterval = 500,       -- Update interval in performance mode    MinimalHUD = false          -- Force minimal HUD in performance mode}

💬 Commands

📊 HUD Elements

Status bars 📈

Health ❤️: Shows the player's current health
Armor 🛡️: Appears only when the player has armor
Hunger 🍔: Hunger level (requires esx_status)
Thirst 💧: Thirst level (requires esx_status)
Oxygen 🫁: Appears only when the player is underwater
Stamina 🏃: Shows running/swimming endurance

Monetary information 💰

Cash 💵: Available money in inventory
Bank 🏦: Money in the bank account
Black money 💸: Illegal money (if available)
Coins 🪙: Server coin system (configurable)

Speedometer 🚗

Speed 🏎️: Shows current speed in km/h
Fuel ⛽: Vehicle fuel level

Job counters 👥

Shows the number of active workers for:

Police 👮: Available officers (LSPD)
EMS 🚑: Available medical personnel
Taxi 🚕: Available taxi drivers
Mechanic 🔧: Available mechanics

Weapon system 🔫

Shows currently equipped weapon
Ammunition counter (magazine/total)

🎨 Customization

The HUD offers an extensive customization system accessible through the in-game menu (/hud):

Visual styles 🖌️

Health bar style: 3 different styles
- Style 1: Classic horizontal bars
- Style 2: Modern vertical bars
- Style 3: Futuristic hexagonal design
Speedometer style: 3 different designs
- Style 1: Minimalist with fuel bar
- Style 2: Circular with gradient effect
- Style 3: Digital with neon lighting
Bar position: Horizontal or vertical

Colors 🎨

Complete color customization for each element
Opacity adjustment for backgrounds and borders
Predefined color presets:
- Default: Standard balanced scheme
- Dark: Dark with bright accents
- Light: Light with high contrast
- Neon: Vibrant cyberpunk-style colors

Element visibility 👁️

Activate/deactivate any element individually
Options to permanently show critical elements
Minimalist mode to reduce on-screen elements

Minimap mode 🗺️

Always visible: The minimap is always shown
Only in vehicle: The minimap appears only when driving

⚡ Optimization

The HUD includes advanced optimization systems to ensure exceptional performance:

Adaptive system 📊

Automatically adjusts update frequency based on the number of players
Reduces resource consumption on high-population servers
Three optimization levels based on player count:
- Low (<50 players): Frequent updates
- Medium (50-100 players): Moderate updates
- High (>100 players): Spaced updates

Batching system 📦

Groups updates to reduce client-server communication
Minimizes impact on server performance

Configurable through:

Config.Batching = {    Enabled = true,    UpdateDelay = 300,    MaxBatchSize = 20}

Intelligent caching 💾

Stores configurations to avoid unnecessary database queries
Optimizes player data loading
Efficient memory management with configurable limits

Rate limiting ⏱️

Prevents event spam and server requests
Efficiently manages job counter updates
Protection against system abuse

❓ Frequently Asked Questions

Installation and configuration 🔧

How can I change the HUD language?

Modify Config.DefaultLanguage = 'en' in config.lua. Currently supports 'es' (Spanish) and 'en' (English).

Is the HUD compatible with other status scripts?

Yes, it's compatible with most ESX-based scripts. For hunger/thirst it requires esx_status or an equivalent.

Can I use this HUD on QBCore servers?

No, it's currently only compatible with ESX. We're working on a QBCore version.

How can I add more job counters?

Add the job name in Config.TrackedJobs and make sure it exists in your job database.

Usage and functionality 🛠️

Why isn't my armor bar showing?

The armor bar only appears when you have armor equipped. You can configure it to always show in the configuration menu.

Why does the minimap disappear when exiting a vehicle?

You probably have the "Only in vehicle" mode configured. Use /checkminimap to verify and change the setting in the HUD menu.

How can I change the bar icons?

The icons use FontAwesome. Currently, they cannot be changed without modifying the HTML code.

Are coins a virtual currency for the server?

Yes, it's an integrated system for virtual coins. Administrators can assign them with /hudcoins [ID] [amount].

Customization and styles 🎨

Can I create my own color presets?

Currently you can only use predefined presets, but you can customize each color individually and save your configuration.

Is it possible to move elements individually?

No, elements move in groups according to their type, but you can choose between horizontal or vertical position for status bars.

Does the HUD look good on all resolutions?

Yes, it's designed to adapt to any resolution, from 720p to 4K.

Are there more speedometer styles available?

Currently there are 3 styles. We're working on adding more in future updates.

Performance and optimization ⚡

Does the HUD affect server performance?

It's highly optimized and has minimal impact. With many players, it automatically activates performance mode.

How much RAM does it consume?

Consumption is very low, less than 1MB of RAM on the server and approximately 5-10MB on the client.

Does it work well on servers with +100 players?

Yes, it includes specific optimization systems for large servers, such as rate limiting and batching.

Can I disable elements to improve performance?

Yes, you can disable any element you don't need from the configuration menu or in config.lua.

🔍 Troubleshooting

The HUD doesn't appear after installation ❌

Verify that the resource appears in the active resource list (start spectro-hud)
Check that es_extended and mysql-async are working correctly
Check the server logs for possible errors
Run the /reloadhud command to force a reinitialization

Speedometer problems 🚗

Make sure the element is activated in the configuration
Run /reloadhud to force vehicle checking

If you use a custom fuel script, verify compatibility with these commands:

- LegacyFuel: Native compatibility- esx_fuel: Native compatibility- Others:  May require manual configuration

Job counters not updating 👥

Verify that Config.EnableJobCounts is set to true
Check that jobs are correctly configured in Config.TrackedJobs
There may be an intentional delay (60 seconds) to reduce server load
Verify that players have the correct jobs assigned

Configurations not saving 💾

Verify that the hud_settings table has been correctly created in the database
Check database permissions
Check server logs for possible SQL errors

Try this SQL command to verify the table:

SHOW TABLES LIKE 'hud_settings';SELECT COUNT(*) FROM hud_settings;

Conflicts with other HUDs 🔄

If you have other HUDs installed, they may conflict with Spectro-HUD:

Disable any other HUD in your server.cfg
Use the ensure spectro-hud feature to ensure it loads last
Check if there are scripts that modify the same native functions

🎉 Congratulations!

You have successfully installed and configured Spectro-HUD. Enjoy your new visual experience on your FiveM server. If you encounter any problems or need additional assistance, don't hesitate to contact us.

Developed by Spectro Version 1.0.0

PreviousSpectro_MultiJobs NextSpectro_propscreator

Last updated 1 month ago