I really need to make it show on my hud. Actually I have cash, bank, dirty money, job.
Client:
local Keys = {
["ESC"] = 322, ["F1"] = 288, ["F2"] = 289, ["F3"] = 170, ["F5"] = 166, ["F6"] = 167, ["F7"] = 168, ["F8"] = 169, ["F9"] = 56, ["F10"] = 57,
["~"] = 243, ["1"] = 157, ["2"] = 158, ["3"] = 160, ["4"] = 164, ["5"] = 165, ["6"] = 159, ["7"] = 161, ["8"] = 162, ["9"] = 163, ["-"] = 84, ["="] = 83, ["BACKSPACE"] = 177,
["TAB"] = 37, ["Q"] = 44, ["W"] = 32, ["E"] = 38, ["R"] = 45, ["T"] = 245, ["Y"] = 246, ["U"] = 303, ["P"] = 199, ["["] = 39, ["]"] = 40, ["ENTER"] = 18,
["CAPS"] = 137, ["A"] = 34, ["S"] = 8, ["D"] = 9, ["F"] = 23, ["G"] = 47, ["H"] = 74, ["K"] = 311, ["L"] = 182,
["LEFTSHIFT"] = 21, ["Z"] = 20, ["X"] = 73, ["C"] = 26, ["V"] = 0, ["B"] = 29, ["N"] = 249, ["M"] = 244, [","] = 82, ["."] = 81,
["LEFTCTRL"] = 36, ["LEFTALT"] = 19, ["SPACE"] = 22, ["RIGHTCTRL"] = 70,
["HOME"] = 213, ["PAGEUP"] = 10, ["PAGEDOWN"] = 11, ["DELETE"] = 178,
["LEFT"] = 174, ["RIGHT"] = 175, ["TOP"] = 27, ["DOWN"] = 173,
["NENTER"] = 201, ["N4"] = 108, ["N5"] = 60, ["N6"] = 107, ["N+"] = 96, ["N-"] = 97, ["N7"] = 117, ["N8"] = 61, ["N9"] = 118
}
ESX = nil
local isTalking = false
--local inVehicle = false
Citizen.CreateThread(function()
while ESX == nil do
TriggerEvent('esx:getSharedObject', function(obj) ESX = obj end)
Citizen.Wait(0)
end
TriggerEvent('es:setMoneyDisplay', 0.0)
ESX.UI.HUD.SetDisplay(0.0)
-- Updates the UI on start
NetworkSetTalkerProximity(10.0)
end)
RegisterNetEvent('esx:playerLoaded')
AddEventHandler('esx:playerLoaded', function(xPlayer)
local data = xPlayer
local accounts = data.accounts
for k,v in pairs(accounts) do
local account = v
if account.name == "bank" then
SendNUIMessage({action = "setValue", key = "bankmoney", value = "$"..account.money})
elseif account.name == "black_money" then
SendNUIMessage({action = "setValue", key = "dirtymoney", value = "$"..account.money})
end
end
-- Job
local job = data.job
SendNUIMessage({action = "setValue", key = "job", value = job.label.." - "..job.grade_label, icon = job.name})
-- Money
SendNUIMessage({action = "setValue", key = "money", value = "$"..data.money})
end)
Citizen.CreateThread(function()
while true do
Citizen.Wait(0)
ESX.UI.HUD.SetDisplay(0.0)
if isTalking == false then
if NetworkIsPlayerTalking(PlayerId()) then
isTalking = true
SendNUIMessage({action = "setTalking", value = true})
end
else
if NetworkIsPlayerTalking(PlayerId()) == false then
isTalking = false
SendNUIMessage({action = "setTalking", value = false})
end
end
--[[if inVehicle == false then
if IsPedInAnyVehicle(GetPlayerPed(-1)) and GetPedInVehicleSeat(GetVehiclePedIsIn(GetPlayerPed(-1)), -1) == GetPlayerPed(-1) then
inVehicle = true
SendNUIMessage({action = "toggleCar", show = true})
end
else
if IsPedInAnyVehicle(GetPlayerPed(-1)) and GetPedInVehicleSeat(GetVehiclePedIsIn(GetPlayerPed(-1)), -1) == GetPlayerPed(-1) then
local essence = exports.esx_AdvancedFuel:getFuel()
local percent = (essence/0.142)*100
SendNUIMessage({action = "updateCarStatus", status = {{name = "gas", percent = percent}}})
else
inVehicle = false
SendNUIMessage({action = "toggleCar", show = false})
end
end]]--
end
end)
-- Voice
local prox = 26.0 -- Sets the Default Voice Distance
local allowProximityChange = true -- Set to True to allow Changing Voice Distance | False to not allow Changing Voice Distance
Citizen.CreateThread(function()
while true do
Citizen.Wait(0)
if IsControlJustPressed(1, Keys['H']) and IsControlPressed(1, Keys['LEFTSHIFT']) and allowProximityChange then
local vprox
if prox <= 2.0 then
prox = 10.0
vprox = "normal"
elseif prox == 10.0 then
prox = 26.0
vprox = "shout"
elseif prox >= 26.0 then
prox = 2.0
vprox = "whisper"
end
NetworkSetTalkerProximity(prox)
SendNUIMessage({action = "setProximity", value = vprox})
end
if IsControlPressed(1, 243) then
local posPlayer = GetEntityCoords(GetPlayerPed(-1))
DrawMarker(1, posPlayer.x, posPlayer.y, posPlayer.z - 1, 0, 0, 0, 0, 0, 0, prox * 2, prox * 2, 0.8001, 0, 75, 255, 165, 0,0, 0,0)
end
end
end)
RegisterNetEvent('ui:toggle')
AddEventHandler('ui:toggle', function(show)
SendNUIMessage({action = "toggle", show = show})
end)
RegisterNetEvent('esx:setAccountMoney')
AddEventHandler('esx:setAccountMoney', function(account)
if account.name == "bank" then
SendNUIMessage({action = "setValue", key = "bankmoney", value = "$"..account.money})
elseif account.name == "black_money" then
SendNUIMessage({action = "setValue", key = "dirtymoney", value = "$"..account.money})
end
end)
RegisterNetEvent('esx:setJob')
AddEventHandler('esx:setJob', function(job)
SendNUIMessage({action = "setValue", key = "job", value = job.label.." - "..job.grade_label, icon = job.name})
end)
RegisterNetEvent('es:activateMoney')
AddEventHandler('es:activateMoney', function(e)
SendNUIMessage({action = "setValue", key = "money", value = "$"..e})
end)
RegisterNetEvent('esx_customui:updateStatus')
AddEventHandler('esx_customui:updateStatus', function(status)
SendNUIMessage({action = "updateStatus", status = status})
end)
RegisterNetEvent('esx_customui:updateWeight')
AddEventHandler('esx_customui:updateWeight', function(weight)
weightprc = (weight/8000)*100
SendNUIMessage({action = "updateWeight", weight = weightprc})
end)
Server:
TriggerEvent('es:addCommand', 'togglehud', function(source, args)
if not args then
TriggerClientEvent('chatMessage', source, "[SYNTAX]", {255, 0, 0}, "/togglehud [on/off]")
else
local a = tostring(args[1])
if a == "off" then
TriggerClientEvent('ui:toggle', source,false)
elseif a == "on" then
TriggerClientEvent('ui:toggle', source,true)
else
TriggerClientEvent('chatMessage', source, "[SYNTAX]", {255, 0, 0}, "/togglehud [on/off]")
end
end
end, {help = "Toggles the hud on and off"})
My html file (ui.html):
<!DOCTYPE html>
<html>
<head>
<title>Simple Template</title>
<meta charset="utf-8">
<meta name="viewport" content="">
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="grid.css">
<link rel="stylesheet" type="text/css" href="style.css">
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="http://code.jquery.com/ui/1.12.0/jquery-ui.min.js"></script>
<script type="text/javascript" src="main.js"></script>
</head>
<body>
<div id="ui">
<div class="playerStats">
<div class="stat" id="money">
<div class="icon"><img src="img/wallet.png"><!--<i class="fa fa-money" style="color: #4CAF50"></i>--></div><span>$0</span>
</div>
<div class="stat" id="bankmoney">
<div class="icon"><img src="img/credit-card.png"><!--<i class="fa fa-credit-card-alt" style="font-size: 14px; color: #2196F3;"></i>--></div><span>$0</span>
</div>
<div class="stat" id="dirtymoney">
<div class="icon"><img src="img/money-bag.png"><!--<i class="fa fa-money" style="color: #f44336"></i>--></div><span style="color: #f44336;">$0</span>
</div>
<div class="stat" id="job">
<div class="icon"><img src="img/jobs/unemployed.png"><!--<i class="fa fa-briefcase" style="color: #FFB300;"></i>--></div><span>Jobless - Unemployed</span>
</div>
<div class="status">
<div class="vert-stat" id="hunger">
<div class="bg" style="background-color: #FB8C00;"></div>
<img src="img/hunger.png">
</div>
<div class="vert-stat" id="water">
<div class="bg" style="background-color: #1E88E5;"></div>
<img src="img/water.png">
</div>
<div class="vert-stat" id="drunk">
<div class="bg" style="background-color: #BA68C8"></div>
<img src="img/drunk.png">
</div>
<!--<<div class="vert-stat" id="weight">
<div class="bg" style="background-color: #D81B60"></div>
<img src="img/backpack.png">
</div>>-->
<div class="vert-stat" id="voice">
<div class="bg" style="background-color: #81C784; height: 100%;"></div>
<img src="img/speaker2.png">
</div>
</div>
</div>
<div class="carStats">
<!--<div class="stat" id="speed">
<span>48 mph</span><div class="icon"><img src="img/vehicle/speed.png"></div>
</div>
<div class="stat" id="gas">
<span>42%</span><div class="icon"><img src="img/vehicle/gas.png"></div>
</div>
<div class="stat" id="damage">
<span>97%</span><div class="icon"><img src="img/vehicle/damage.png"></div>
</div>
<div class="stat" id="lock" style="margin-bottom: 0px; background-color: #039BE5;">
<span>Locked</span><div class="icon"><img src="img/vehicle/locked.png"></div>
</div>
<div class="vert-stat" id="gas">
<div class="bg" style="background-color: #FB8C00;"></div>
<img src="img/vehicle/gas.png">
</div>-->
</div>
</div>
</body>
</html>
Thanks you for the help.