NUI Tier 1 — Server-Rendered Templates

Tier 1 NUI is for simple UIs: menus, dialogs, prompts, and notifications. No JavaScript needed — everything is driven from Lua.

How It Works

The View module renders server-side templates to HTML and shows them on the client. You define the template type and data; Shiva handles the rest.

Available Templates

Template	Description
menu	Scrollable list with optional icons and prices
dialog	Text input or confirmation dialog
progress	Progress bar
notify	Timed notification (corner of screen)
context	Context action menu

Showing a Menu

local View = require('shiva-fw.view')

View.show(source, 'menu', {
    id     = 'mechanic_menu',
    title  = 'Mechanic Shop',
    items  = {
        { label = 'Repair Vehicle',   action = 'repair',  price = 500,  icon = '🔧' },
        { label = 'Upgrade Engine',   action = 'upgrade', price = 2000, icon = '⚡' },
        { label = 'Wash Vehicle',     action = 'wash',    price = 150,  icon = '🚿' },
    },
})

-- Handle selection
View.on('mechanic_menu:selected', function(source, data)
    if data.action == 'repair' then
        -- deduct money, repair vehicle
    end
end)

Showing a Dialog

View.show(source, 'dialog', {
    id      = 'name_input',
    title   = 'Enter your character name',
    inputs  = {
        { name = 'firstName', label = 'First Name', type = 'text', required = true },
        { name = 'lastName',  label = 'Last Name',  type = 'text', required = true },
    },
})

View.on('name_input:submitted', function(source, data)
    print(data.firstName, data.lastName)
end)

View.on('name_input:cancelled', function(source)
    print('Player cancelled')
end)

Closing a UI

View.close(source, 'mechanic_menu')

-- Close all open UIs for a player
View.closeAll(source)

Tier 1 vs Tier 2

Use Tier 1 when:

• The UI is a standard pattern (menu, dialog, progress)
• You don't need custom animations or layouts
• You want to ship fast

Use Tier 2 when:

• You need a custom design
• The UI has complex interactive state
• You're building a phone app, HUD element, or map overlay

See Also

• NUI Tier 2 →
• API: View →