AquaFlame Advanced Notify [ESX]

Introduction

Welcome to the AquaFlame Notify FiveM Resource! This resource aims to provide you with unique and advanced notification abilities for your FiveM server. This documentation below will guide you through the installation and configuration process. See the Features list below for more information. Scroll through the page for the installation and configuration steps.

Features

Auto Messages
- Duration and time between messages configurable
- Customizable messages
Welcome Messages
- Duration and time between messages configurable
- Customizable messages
- Option to disable
Admin Messages
- Configurable via admin panel in-game
Notification on Player Joining
- Notifies users of open polls
- Configurable option to enable or disable
Framework Integration
- Easily integrates with all scripts
Advanced & Clean User Interface
- Players can customize their notifications
- Choose notification positions
- Choose notification colors
- Option to hide all notifications
- Adjust notification audio
- Test notification settings before applying
- View notification history
- Hide specific notifications and revert
Polls
- Server-wide poll notifications
- Vote on Poll UI with mouse interaction toggle
- Close Poll UI and view upvotes/downvotes in settings UI
- Upvote/downvote in Settings UI -> Polls & History
- Admins can open/close/delete polls
- Configurable admin whitelist based on license

Installation

Prerequisites

Ensure your server is running the ESX Legacy framework.
Have access to phpMyAdmin for database management.

Step-by-Step Installation

Download the Resource
- Clone or download the AquaFlame Notify resource from the repository.

Import SQL Tables

Open phpMyAdmin and execute the following SQL commands to create the necessary tables:

CREATE TABLE `aquaflame_notify` (
  `identifier` varchar(46) DEFAULT NULL,
  `position` longtext DEFAULT NULL,
  `color` varchar(20) DEFAULT '#007bff'
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_general_ci;

CREATE TABLE `aquaflame_history` (
  `id` int(11) NOT NULL,
  `identifier` varchar(46) DEFAULT NULL,
  `title` varchar(255) NOT NULL,
  `message` text DEFAULT NULL,
  `type` varchar(50) NOT NULL,
  `timestamp` timestamp NOT NULL DEFAULT current_timestamp()
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_general_ci;

CREATE TABLE `aquaflame_data` (
  `id` int(11) NOT NULL,
  `identifier` varchar(46) DEFAULT NULL,
  `message` text NOT NULL,
  `hidden` tinyint(1) NOT NULL DEFAULT 0,
  `created_at` timestamp NOT NULL DEFAULT current_timestamp()
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_general_ci;

CREATE TABLE `aquaflame_polls` (
  `uniqueid` int(11) NOT NULL,
  `id` int(11) DEFAULT NULL,
  `title` varchar(255) DEFAULT NULL,
  `upvotes` int(11) DEFAULT NULL,
  `downvotes` int(11) DEFAULT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_general_ci;

ALTER TABLE `aquaflame_polls`
ADD COLUMN `status` VARCHAR(10) DEFAULT 'open';

Add to Server Resources
- Place the aquaflame_notify folder in your FiveM server's resources directory.
Update Server Configuration
- Edit your server.cfg file to include the resource. Add the following line:
  ensure aquaflame_notify

Configuration

Customize the resource by editing the config.lua file. Below is a brief overview of the configuration options available:

General Settings

Config = {}
Config.Framework = "esx" -- ESX for now only
Config.DefaultPos = "middle-right"
Config.Command = "notsettings"

Admin Access

Define the list of whitelisted player licenses for access to the admin button.

Config.WhitelistedLicenses = {
    "char1:392d2076e57504348352188913b0566fd724b81f",
}

Automatic Messages

Set up automatic messages that will trigger randomly.

Config.AutomaticMessages = {
    { title = "AquaFlame Studios", content = "Like our resources? Check us out on aquaflame.tebex.io", duration = 9000, type = "info" },
    { title = "AquaFlame Studios", content = "Join our discord via discord.gg/aquaflame", duration = 9000, type = "success" },
    { title = "AquaFlame Studios", content = "Cheaply priced, quality resources", duration = 9000, type = "warning" },
    { title = "AquaFlame Studios", content = "Innuitive Designs, Advanced functionalities.", duration = 9000, type = "danger" },
}

Custom Messages

Add your own messages for various events.

Config.Messages = {
    OpenPolls = "There are currently open polls. Please check the polls and cast your vote.",
    WelcomeMessage = "Welcome to the server! Have a great time!"
}

Message Settings

Enable or disable welcome messages and open polls notifications.

Config.EnableWelcomeMessage = true
Config.EnableOpenPollsNotification = true
Config.TimeBetweenMessages = 180000 -- 180000 milliseconds = 3 minutes

Key Bindings

Set the key for toggling mouse visibility.

Config.MouseToggleKey = "M"

Also set the keybinding in Javascript (keycode help https://www.toptal.com/developers/keycode).

// Event listener to trigger the function when a key is pressed
document.addEventListener("keydown", function(event) {
  // Check if the poll window is open
  const pollWindowOpen = document.getElementById('poll').style.display === 'block';

  // Check if the pressed key is the desired key (e.g., "M" key with keyCode 77) and the poll window is open
  if (event.keyCode === 77 && pollWindowOpen) {
   //   console.log("Key pressed. Toggling mouse visibility...");
      toggleMouseVisibility();
      isMouseVisible = !isMouseVisible; // Toggle the state of mouse visibility
  }
});
```

Change Notification Sound

If you want to change the notification sound, you can do that by replacing the original sound.mp3 file with the preferend mp3 file. Make sure to also rename it sound.mp3. Make sure to clear your server cache if you do this, just to be sure it is working. Another way to do this, is downloading the sound you prefer and drop it in the aquaflame_notify/ui folder. Afterwards, go to Javascript file named script.js and be sure to adjust the file name in there. Search for:

$(function () {
  sound = new Audio("sound.mp3");
  if (sound) {
    sound.volume = 0.5;
  }

Replace the sound.mp3 to the filename of the sound you want to utilize.

Framework Integration

If you want to integrate this notification system to handle all your defautl ESX Notifications, you can do so by following below steps: @es_extended/client/function.lua

   function ESX.ShowNotification(message, type, length)
      if GetResourceState("esx_notify") ~= "missing" then
         exports["esx_notify"]:Notify(type, length, message)
      else
         print("[^1ERROR^7] ^5ESX Notify^7 is Missing!")
      end
   end

Replace it with

   function ESX.ShowNotification(message, type, length)
      if GetResourceState("aquaflame_notify") ~= "missing" then
         exports['aquaflame_notify']:Alert("NOTIFICATION", message, length, type)
      else
         print("[^1ERROR^7] ^5AQUAFLAME_NOTIFY^7 is Missing!")
      end
   end

Using Exports

If you want to use the exports for other scripts, when you don't want to handle all server notifications, u can use below exports!

To display a notification you should call it like below:

Using Client Side:

   exports['aquaflame_notify']:Alert("Title", "Message", Time, 'type')

Using Server Side:

   TriggerClientEvent('aquaflame_notify:Alert', source, "Title", "Message", Time, 'type')

You can set display time as follows:

Time Value

Real-time

1000

1 second

2000

2 seconds

5000

5 seconds

Etc..

You can set the type of notification as follows:

Type Value

Displays as

success

Success Notification

info

Information Notification

warning

Warning Notification

error

Error Notification

Wrapping up

With AquaFlame Notify, you can enhance your FiveM server by providing players with timely notifications and interactive polls. Customize the settings to fit your server's needs and ensure smooth communication with your player base.

For further assistance, join our Discord.

Enjoy our Resource!

PreviousAquaFlame Studios Documentation

Last updated 1 year ago