Have a question regarding NUI...

FiveM Resource Development & Modding Discussion
, ,
1

I am trying to create a simple script for buying crypto in FiveM. I am fairly inexperienced in lua, but have some background in other languages (irrelevant I suppose).

I have a NUI which opens up when pressing “E” near the coords specified in config, however, I cannot get the NUI to close. I have it set to 322 (ESC) but nothing happens, no errors in console.

local QBCore = exports['qb-core']:GetCoreObject()
local isUIVisible = false

-- Function to check if player is near the specified coordinates
function isNearCoords(coords, radius)
    local playerCoords = GetEntityCoords(PlayerPedId())
    return #(playerCoords - coords) < radius
end

-- Key mapping
Citizen.CreateThread(function()
    while true do
        Citizen.Wait(0)
        
        -- Check for UI toggle key and ESC key
        if isNearCoords(Config.UIAccess.coords, Config.UIAccess.radius) then
            if IsControlJustReleased(0, Config.UIAccess.key) then
                if not isUIVisible then
                    SetNuiFocus(true, true)
                    SendNUIMessage({type = 'showCryptoUI'})
                    isUIVisible = true
                else
                    SetNuiFocus(false, false)
                    SendNUIMessage({type = 'hideCryptoUI'})
                    isUIVisible = false
                end
            end
        else
            -- Ensure UI is hidden if the player is not near the specified coordinates
            if isUIVisible then
                SetNuiFocus(false, false)
                SendNUIMessage({type = 'hideCryptoUI'})
                isUIVisible = false
            end
        end

        -- Close UI with ESC key
        if IsControlJustReleased(0, 322) and isUIVisible then -- 322 is the control ID for ESC
            SetNuiFocus(false, false)
            SendNUIMessage({type = 'hideCryptoUI'})
            isUIVisible = false
        end
    end
end)


-- UI Event Listeners
RegisterNetEvent('crypto:updateMarket')
AddEventHandler('crypto:updateMarket', function()
    TriggerServerEvent('crypto:getMarketData')
end)

RegisterNetEvent('crypto:updateBalance')
AddEventHandler('crypto:updateBalance', function(cryptoType)
    TriggerServerEvent('crypto:getUserBalance', cryptoType)
end)

RegisterNetEvent('crypto:notify')
AddEventHandler('crypto:notify', function(message)
    -- Implement notification logic here
    print(message)
end)

-- Ensure UI is hidden on resource start
Citizen.CreateThread(function()
    Citizen.Wait(500) -- Ensure the resource is fully started
    SetNuiFocus(false, false)
    SendNUIMessage({type = 'hideCryptoUI'})
end)

Am I doing something wrong? Missing something perhaps? Not too sure, looking for input!

Thanks in advance!

2

I would close using some JS code:

  const escFunction = useCallback((event) => {
    if (event.key === "Escape") {
      setNui(false)
      fetch("https://yorick-react/closeMenu") // With this function you can close the NUI using escape key
    }
  }, [])

this is how i do it