📕User guide

User guide on how to use the Dynasty Notify

1. Using the notification

You can use the notification as showed in the example bellow:

exports['dynasty_notify']:Notify({
	icon = "fas fa-check",
	iconColor = "#09E85E",
	title = "SUCCESS",
	message = "Default success message for notification.",
	progressBarColor = "#09E85E",
	sound = "info.mp3",
})

2. Default notifications

In case you use a notification and don't fill any of the parameters, it will be filled with the value stated in the Config.file. For example if the parameter boxColor is not used, it will be filled with the value 2B2D42 in this case.

Config.DefaultNotify = {
    boxColor = "#2B2D42",
    icon = "fas fa-info-circle",
    iconColor = "#2f83ff",
    iconSize = "20px",
    iconShake = false,
    title = "ALERT",
    titleColor = "#F8E5EE",
    titleFontSize = "15px",
    message = "Example notification message",
    messageColor = "#C4C6E7",
    messageFontSize = "13px",
    image = false,
    progressBarColor = "#2f83ff",
    progressBarHeight = "4px",
    sound = "success.mp3",
    soundVolume = 0.4,
    counterColor = "#dc3545",
    counterFontSize = "10px",
    time = 5000
}

3. Notification configuration

3.1 Box color

boxColor = "#2B2D42"

In this case the color of the box is #2B2D42

HTML Color CodesHTML Color Codes

Example of where you can get colors

3.2 Icon

icon = "fas fa-info-circle"

In this case the icon used is fas fa-info-circle. You can find more icons in:

Find Icons with the Perfect Look & Feel | Font Awesomefontawesome

3.3 Icon color

iconColor = "#2f83ff"

In this case the color of the box is #2f83ff"

3.4 Icon size

iconSize = "20px"

In this case the size of the icon is 20px

3.5 Icon shake effect

Adds a shaking effect to the icon. True/False value

iconShake = true

In this case the shaking effect is used

3.6 Title of the notification

title = "ALERT"

In this case the title of the notification is ALERT

3.7 Title color

titleColor = "#F8E5EE"

In this case the color of the title is #F8E5EE

3.8 Title font size

titleFontSize = "15px"

In this case the size of the title is 15px

3.9 Message of the notification

message = "Example notification message"

In this case the message of the notification is Example notification message

3.10 Color of the message

 messageColor = "#C4C6E7"

In this case the color of the message is #C4C6E7

3.11 Message font size

messageFontSize = "13px"

In this case the size of the message is 13px

3.12 Image or GIF

Link of an image or a GIF that appears in the notification. If you don't want to use this feature use the value false.

image = "https://steamuserimages-a.akamaihd.net/ugc/98348089947795110/E8D6A7F620BC59003EAA3178C5B597B64753B40D/?imw=5000&imh=5000&ima=fit&impolicy=Letterbox&imcolor=%23000000&letterbox=false"

In this case the GIF used in the notification is the following:

3.13 Progress bar color

progressBarColor = "#2f83ff"

In this case the color of the progress bar is #2f83ff

3.14 Progress bar height

progressBarHeight = "4px"

In this case the height of the progress bar is 4px

3.15 Notification sound

sound = "success.mp3"

In this case the sound used is the file success.mp3

3.16 Sound volume

The volume must be between the values 0.0 and 1.0.

soundVolume = 0.4

In this case the volume of the sound is 0.4

3.17 Counter color

counterColor = "#dc3545"

In this case the color used is #dc3545

3.18 Counter font size

counterFontSize = "10px"

In this case the font size is 10px

3.19 Time of the notification

The time of the notification has to be in ms (miliseconds)

time = 5000

In this case the time is 5000 (5 seconds)

3.20 Adding transparency to the notification

#2B2D42

• FF - 0% Transparent

• CC - 20% Transparent

• 80 - 50% Transparent

• 33 - 80% Transparent

• 00 - 100% Transparent

Adding those values at the end of the hex color adds different levels of transparency. For example 80% transparency would be #2B2D4233

Example of a notification with those parameters:

4.Send notification server side

To send a notification through server side you have to trigger the client event 'dynasty_notify:Notify' with its parameters

TriggerClientEvent('dynasty_notify:Notify', source, {
    title = "Alert",
    message = "Serverside notification example",
    boxColor = "#000",
    icon = "fa circle-exclamation",
})

You will need to use source in case you want to send the notification only to the client which sent the event or -1 to trigger the event for all the players.

5.Replace QBCore notifications for Dynasty Notifications

To replace QBCore notifications you need to go to qb-core/client/functions.lua and replace the notify function as the example showed below

function QBCore.Functions.Notify(text, texttype, length, icon) 
local message = { 
    action = 'notify', 
    type = texttype or 'primary', 
    length = length or 5000, }
if type(text) == 'table' then
    message.text = text.text or 'Placeholder'
    message.caption = text.caption or 'Placeholder'
else
    message.text = text
end
if icon then
    message.icon = icon
end
    SendNUIMessage(message)
end

Replace the function for this one:

function QBCore.Functions.Notify(text, texttype, length, icon)
    if texttype == "success" then
        exports['dynasty_notify']:Notify({
            message = text,
            boxColor = "#49AF72",
            icon = "fa-solid fa-clipboard-check",
            iconSize = "20px",
            iconColor = "#FFFFFF",
            title = "Success",
            titleColor = "#FFFFFF",
            messageColor = "#FFFFFF",
        })
    elseif texttype == "warning" then
-- same here
    end
end

Here is an example of a success notification, you should do the same for the other types

6.Replace ESX notifications for Dynasty Notifications

To replace ESX notifications you need to go to esx_notify/Notify.lua and replace the notify function as the example showed below

local function Notify(notificatonType, length, message)

    if Debug then
        print("1 ".. tostring(notificatonType))
        print("2 "..tostring(length))
        print("3 "..message)
    end

    if type(notificatonType) ~= "string" then
        notificatonType = "info"
    end

    if type(length) ~= "number" then
        length = 3000
    end

    if Debug then
        print("4 ".. tostring(notificatonType))
        print("5 "..tostring(length))
        print("6 "..message)
    end

    SendNuiMessage(json.encode({
        type = notificatonType or "info",
        length = length or 3000,
        message = message or "ESX-Notify"
    }))
end

Replace the function for this one:

local function Notify(notificatonType, length, message)
    if texttype == "success" then
        exports['dynasty_notify']:Notify({
            message = text,
            boxColor = "#49AF72",
            icon = "fa-solid fa-clipboard-check",
            iconSize = "20px",
            iconColor = "#FFFFFF",
            title = "Success",
            titleColor = "#FFFFFF",
            messageColor = "#FFFFFF",
        })
    elseif texttype == "warning" then
-- same here
    end
end

Here is an example of a success notification, you should do the same for the other types

7.Additional notification examples

exports['dynasty_notify']:Notify({
    icon = "fas fa-bell",
    iconColor = "#6DAEDB",
    title = "ALERT",
    message = "Default alert message for notification.",
    progressBarColor = "#6DAEDB",
    sound = "info.mp3",
})
exports['dynasty_notify']:Notify({
    icon = "fas fa-triangle-exclamation",
    iconColor = "#F2AF29",
    title = "WARNING",
    message = "Default warning message for notification.",
    progressBarColor = "#F2AF29",
    sound = "warning.mp3",
})
exports['dynasty_notify']:Notify({
    icon = "fas fa-times-circle",
    iconColor = "#dc3545",
    title = "ERROR",
    message = "Default error message for notification.",
    progressBarColor = "#dc3545",
    sound = "error.mp3",
})
exports['dynasty_notify']:Notify({
    icon = "fas fa-info-circle",
    iconColor = "#2f83ff",
    title = "INFO",
    message = "Default info message for notification.",
    progressBarColor = "#2f83ff",
    sound = "info.mp3",
})