Interactions

📘 FRKN-UIKIT Interactions

The Interactions system provides a lightweight and customizable alternative to classic targeting systems such as qb-target or ox_target. It allows players to interact with entities, world coordinates, or screen-based prompts using a clean NUI interface.

---

⚡ Features

• Add/remove dynamic interaction targets anywhere in the world

• Works with entities (vehicles, peds, props) or vector3 coordinates

• Supports two different interaction modes:

  • Default → list-based menu near the target

  • Screen → floating screen prompt in 3D space, activated with [E]

• Multiple interaction options per target

• Supports event triggers or custom action functions

• Distance-based activation

---

🔹 Interaction Modes

1️⃣ Default Mode ("default")

• Classic interaction list that appears near the entity/coords.

• Player navigates with Arrow keys and selects with Enter/E.

• Best suited for ATM menus, vehicle menus, NPC interactions.

Example:

exports["frkn-uikit"]:AddInteract("atm_target", vector3(1850.66, 3672.39, 33.71), 2.0, {
    { name = "Rob ATM", event = "my:robATM", eventData = { atmId = 1 } },
    { name = "Check Balance", event = "my:checkBalance", eventData = { atmId = 1 } }
}, "default")

2️⃣ Screen Mode ("screen")

• Displays a floating UI screen directly attached to the target.

• Activated by holding [E] while near the target.

• Perfect for immersive interactions such as racing tablets, hacking screens, or terminals.

Example:

exports["frkn-uikit"]:AddInteract("vehicle_target", veh, 3.0, {
    text = "Press [E] to open Racing Tablet",
    action = function(entity)
        TriggerEvent("frkn-racing:openTablet")
    end
}, "screen")

📂 Exports

➕ AddInteract

exports['frkn-uikit']:AddInteract(id, entityOrCoords, distance, options, mode)

Adds a new interaction target.

• id (string) → Unique identifier for this target

• entityOrCoords (entity / vector3) → Target entity or coordinates

• distance (number) → Max distance (default: 2.0)

• options (table) → List of interaction options

  • { name = "Option Label", event = "event:name", eventData = { ... } }

  • { text = "Custom Text", action = function(entity) ... end }

• mode (string) → "default" or "screen"

---

➖ RemoveInteract

exports['frkn-uikit']:RemoveInteract(id)

Removes an existing target.

🖥️ Example Commands

ATM Interaction

RegisterCommand("interact_area", function()
    exports["frkn-uikit"]:AddInteract("atm_target", vector3(1850.66, 3672.39, 33.71), 2.0, {
        { name = "Rob ATM", event = "my:robATM", eventData = { atmId = 1 } },
        { name = "Check Balance", event = "my:checkBalance", eventData = { atmId = 1 } }
    }, "default")
end)

---

Vehicle Interaction

RegisterCommand("interact_vehicle", function()
    local ped = PlayerPedId()
    local coords = GetEntityCoords(ped)
    local veh = GetClosestVehicle(coords.x, coords.y, coords.z, 5.0, 0, 70)
    if DoesEntityExist(veh) then
        exports["frkn-uikit"]:AddInteract("vehicle_target_main", veh, 3.0, {
            { name = "Enter", event = "frkn:useVehicle", eventData = veh },
            { name = "Lock", event = "frkn:lockVehicle", eventData = veh },
            { name = "Unlock", event = "frkn:unlockVehicle", eventData = veh },
            { name = "Open", event = "frkn:openvehicledoor", eventData = {veh, {0, 1}} },
            { name = "Close", event = "frkn:closevehicledoor", eventData = {veh, {0, 1}} },
        }, "default")

        local vehFront = GetOffsetFromEntityInWorldCoords(veh, 0.0, 2.0, 0.5)
        exports["frkn-uikit"]:AddInteract("vehicle_target_front", vehFront, 3.0, {
            { name = "Inspect Engine", event = "frkn:inspectEngine", eventData = veh },
            { name = "Repair Vehicle", event = "frkn:repairVehicle", eventData = veh }
        }, "default")
    end
end)

---

Screen Prompt Example

RegisterCommand("interact_screens", function()
    local ped = PlayerPedId()
    local coords = GetEntityCoords(ped)
    local veh = GetClosestVehicle(coords.x, coords.y, coords.z, 5.0, 0, 70)

    exports["frkn-uikit"]:AddInteract("vehicle_target", veh, 3.0, {
        text = "Press [E] to open Racing Tablet",
        action = function(entity)
            TriggerEvent("frkn-racing:openTablet")
        end
    }, "screen")
end)

---

🎮 Default Controls

• E → Interact / Focus

• Arrow Left / Right → Navigate options

• Enter → Confirm

• Backspace → Back

• ESC → Close