# DUI

DUI (Dynamic UI) allows you to render a web page as a texture on any in-game surface — screens, billboards, laptops, phones, etc.

## CreateDui

Creates a new DUI instance.

```lua
local dui = KOJA.Client.CreateDui(opts)
```

| Field    | Type     | Default | Description                |
| -------- | -------- | ------- | -------------------------- |
| `url`    | `string` | —       | URL to load inside the DUI |
| `width`  | `number` | `1280`  | Texture width in pixels    |
| `height` | `number` | `720`   | Texture height in pixels   |

**Returns** `DuiInstance`

## DuiInstance

### Properties

| Property | Type     | Description             |
| -------- | -------- | ----------------------- |
| `id`     | `string` | Unique identifier       |
| `url`    | `string` | Current URL             |
| `handle` | `long`   | Native DUI handle       |
| `txd`    | `string` | Texture dictionary name |
| `txn`    | `string` | Texture name            |

### Methods

#### setUrl

Navigate the DUI to a new URL.

```lua
dui:setUrl(newUrl)
```

#### sendMessage

Send a JSON-serialisable message into the DUI's JavaScript.

```lua
dui:sendMessage(message)
```

The web page receives it as a `message` event. In your JS/TS:

```js
window.addEventListener('message', (event) => {
    console.log(event.data)
})
```

#### getHandle / getTextureDict / getTextureName

```lua
dui:getHandle()       -- long
dui:getTextureDict()  -- string (txd name)
dui:getTextureName()  -- string (txn name)
```

#### replaceTexture

Replace an existing game texture with this DUI's texture.

```lua
dui:replaceTexture(originalTxd, originalTxn)
```

#### removeReplaceTexture

Restore the original texture.

```lua
dui:removeReplaceTexture(originalTxd, originalTxn)
```

#### destroy

Destroy the DUI and free resources.

```lua
dui:destroy()
```

## Examples

### Replace a game texture (e.g. a TV screen)

```lua
local dui = KOJA.Client.CreateDui({
    url    = 'https://www.youtube.com/embed/dQw4w9WgXcQ',
    width  = 1280,
    height = 720,
})

-- Replace the TV screen texture
dui:replaceTexture('prop_tv_flat_01', 'prop_tv_flat_01_emissive')

-- When done:
dui:removeReplaceTexture('prop_tv_flat_01', 'prop_tv_flat_01_emissive')
dui:destroy()
```

### Draw DUI on a custom surface using scaleform

```lua
local dui = KOJA.Client.CreateDui({ url = 'nui://my-resource/screen.html' })

CreateThread(function()
    while true do
        Wait(0)
        DrawSprite(dui:getTextureDict(), dui:getTextureName(), 0.5, 0.5, 1.0, 1.0, 0.0, 255, 255, 255, 255)
    end
end)
```

### Send live data to the DUI

```lua
local dui = KOJA.Client.CreateDui({ url = 'nui://my-resource/hud.html' })

CreateThread(function()
    while true do
        Wait(1000)
        dui:sendMessage({
            action = 'updateSpeed',
            speed  = GetEntitySpeed(GetPlayerPed(-1)) * 3.6,
        })
    end
end)
```

## Related pages

- [Callbacks](/koja-lib/api-reference/client-api/callbacks) — koja-lib provides a callback system that lets client scripts request data from the server and vice versa.
- [Inventory](/koja-lib/api-reference/client-api/inventory) — Client-side inventory functions let you check what items the local player has without a server round-trip.
- [Money](/koja-lib/api-reference/client-api/money) — Retrieve the local player's money balance from the client side via a server callback.
- [Keybinds](/koja-lib/api-reference/client-api/keybinds) — Register persistent key bindings that players can rebind in the GTA V settings menu.
- [Notifications](/koja-lib/api-reference/client-api/notifications) — koja-lib provides two notification interfaces: SendNotify (routes through the configured backend) and LibNotify (built-in koja-lib notification).
- [Player](/koja-lib/api-reference/client-api/player) — Functions for reading the local player's data on the client side.
- [Client API](/koja-lib/api-reference/client-api) — back to the section overview