Merge pull request #222 from Benzo00/main

new ESX Notification
This commit is contained in:
Mycroft
2022-04-26 16:40:53 +01:00
committed by GitHub
7 changed files with 194 additions and 4 deletions
+9 -4
View File
@@ -77,12 +77,17 @@ function ESX.SetPlayerData(key, val)
end
end
function ESX.ShowNotification(msg)
BeginTextCommandThefeedPost('STRING')
AddTextComponentSubstringPlayerName(msg)
EndTextCommandThefeedPostTicker(0,1)
function ESX.ShowNotification(message, type, length)
if Config.NativeNotify then
BeginTextCommandThefeedPost('STRING')
AddTextComponentSubstringPlayerName(msg)
EndTextCommandThefeedPostTicker(0,1)
else
exports["esx_notify"]:Notify(type, length, message)
end
end
function ESX.ShowAdvancedNotification(sender, subject, msg, textureDict, iconType, flash, saveToBrief, hudColorIndex)
if saveToBrief == nil then saveToBrief = true end
AddTextEntry('esxAdvancedNotification', msg)
+1
View File
@@ -17,6 +17,7 @@ Config.EnableDebug = false -- Use Debug options?
Config.EnableDefaultInventory = true -- Display the default Inventory ( F2 )
Config.EnableWantedLevel = false -- Use Normal GTA wanted Level?
Config.EnablePVP = true -- Allow Player to player combat
Config.NativeNotify = false -- true = old esx notification
Config.Multichar = true -- Enable support for esx_multicharacter
Config.Identity = true -- Select a characters identity data before they have loaded in (this happens by default with multichar)
+11
View File
@@ -0,0 +1,11 @@
local function Notify(type, length, message)
SendNuiMessage(json.encode({
type = type or "info",
length = length or 3000,
message = message or "ESX-Notify"
}))
end
exports('Notify', Notify)
RegisterNetEvent("ESX:Notify", Notify)
+15
View File
@@ -0,0 +1,15 @@
fx_version 'adamant'
game 'gta5'
author 'ESX-Framework'
description 'ESX Notification'
client_scripts { 'Notify.lua' }
ui_page 'nui/index.html'
files {
'nui/index.html',
'nui/js/*.js',
'nui/css/*.css',
'nui/img/*.png',
}
+14
View File
@@ -0,0 +1,14 @@
:root {
--color: white;
--bgColor: #212121;
}
* {
padding: 0;
margin: 0;
}
body {
color: var(--color);
font-family: sans-serif;
}
+118
View File
@@ -0,0 +1,118 @@
<!DOCTYPE html>
<html lang="en">
<head>
<script src="nui://game/ui/jquery.js" type="text/javascript"></script>
<script src="https://kit.fontawesome.com/a81368914c.js"></script>
<link rel="stylesheet" href="css/style.css">
<script src="js/script.js"></script>
</head>
<body>
<div id="notifyInfo" class="notifyInfo">
<div class="innerText">
<i class="fas fa-info-circle icon info"></i>
<p class="text" id="infoMessage"></p>
</div>
</div>
<div id="notifySuccess" class="notifySuccess">
<div class="innerText">
<i class="fas fa-check-circle icon info"></i>
<p class="text" id="successMessage"></p>
</div>
</div>
<div id="notifyError" class="notifyError">
<div class="innerText">
<i class="fas fa-exclamation-circle icon info"></i>
<p lass="text" id="errorMessage"></p>
</div>
</div>
</body>
</html>
<style>
.notifyInfo {
flex: auto;
display: none;
border-left: 3px solid rgb(0, 97, 153);
position:absolute;
margin: 0 auto;
left: 0;
right: 0;
top: 25px;
min-width:15%;
width:fit-content;
height:50px;
background-color:#212121;
border-radius: 5px;
animation: growDown 300ms ease-in-out;
}
.notifySuccess {
flex: auto;
display: none;
border-left: 3px solid rgb(13, 153, 0);
position:absolute;
margin: 0 auto;
left: 0;
right: 0;
top: 25px;
min-width:15%;
width:fit-content;
height:50px;
background-color:#212121;
border-radius: 5px;
animation: growDown 300ms ease-in-out;
}
.notifyError {
flex: auto;
display: none;
border-left: 3px solid rgb(153, 5, 0);
position:absolute;
margin: 0 auto;
left: 0;
right: 0;
top: 25px;
min-width:15%;
width:fit-content;
height:50px;
background-color:#212121;
border-radius: 5px;
animation: growDown 300ms ease-in-out;
}
.icon {
border: 0;
}
.innerText {
flex: auto;
margin-top: 15px;
width:100%;
}
.innerText{
margin-left: 10px;
}
p {
flex: auto;
word-wrap: break-word;
margin-left: 30px;
margin-top: 15px;
}
.innerText .icon {
float: left;
margin-left: 5px;
font-size: 20px;
}
@keyframes growDown {
0% {
transform: scaleY(0);
}
80% {
transform: scaleY(1.1)
}
100% {
transform: scaleY(1)
}
}
</style>
+26
View File
@@ -0,0 +1,26 @@
const w = window
const doc = document
$(function () {
w.addEventListener('message', function(e) {
$(".text").text(e.data.message)
if (e.data.type === "info") {
doc.getElementById("notifyInfo").style.display = "block";
Timeout()
} else if (e.data.type === "error") {
doc.getElementById("notifyError").style.display = "block";
Timeout()
} else if (e.data.type === "success") {
doc.getElementById("notifySuccess").style.display = "block";
Timeout()
}
function Timeout() {
setTimeout(function () {
doc.getElementById("notifyInfo").style.display = "none";
doc.getElementById("notifyError").style.display = "none";
doc.getElementById("notifySuccess").style.display = "none";
}, e.data.length)
}
})
})