# templates

## Overview

SL-Chat includes a separate template system (`templates.config.lua`) for predefined message types that can be used from other scripts. These templates are perfect for system notifications, error messages, success confirmations, and more.

## Configuration File

Location: `shared/templates.config.lua`

## Built-in Templates

### SYSTEM

Generic system message with gray styling.

{% code title="SYSTEM template (Lua)" %}

```lua
['SYSTEM'] = {
    logType = 'system',
    template = [[
        <div style="padding: 1vh 1.2vh; background: linear-gradient(180deg, rgba(74, 74, 74, 0.85) 0%, rgba(26, 26, 26, 0.85) 100%); border-bottom: 0.25vh solid #4A4A4A; border-radius: 0.2vh;">
            <span style="font-size: 1.1vh; font-weight: 600; background: #4A4A4A; padding: 0.3vh 0.6vh; border-radius: 0.3vh; color: #fff;">SYSTEM</span>
            <span style="font-size: 1.3vh; color: #fff;"> {message}</span>
            <span style="font-size: 1vh; color: rgba(255,255,255,0.7);">{time}</span>
        </div>
    ]]
}
```

{% endcode %}

### WELCOME

Welcome message with green styling.

{% code title="WELCOME template (Lua)" %}

```lua
['WELCOME'] = {
    logType = 'system',
    template = [[
        <div style="background: linear-gradient(180deg, rgba(50, 150, 100, 0.85) 0%, rgba(20, 80, 50, 0.85) 100%); border-bottom: 0.25vh solid #32CD32;">
            <span style="background: #32CD32;">WITAJ</span>
            <span>{message}</span>
        </div>
    ]]
}
```

{% endcode %}

### ERROR

Error message with red styling.

{% code title="ERROR template (Lua)" %}

```lua
['ERROR'] = {
    logType = 'system',
    template = [[
        <div style="background: linear-gradient(180deg, rgba(180, 50, 50, 0.85) 0%, rgba(100, 20, 20, 0.85) 100%); border-bottom: 0.25vh solid #B43232;">
            <span style="background: #B43232;">BŁĄD</span>
            <span>{message}</span>
        </div>
    ]]
}
```

{% endcode %}

### SUCCESS

Success message with green styling.

{% code title="SUCCESS template (Lua)" %}

```lua
['SUCCESS'] = {
    logType = 'system',
    template = [[
        <div style="background: linear-gradient(180deg, rgba(50, 180, 100, 0.85) 0%, rgba(20, 100, 50, 0.85) 100%); border-bottom: 0.25vh solid #32B464;">
            <span style="background: #32B464;">SUKCES</span>
            <span>{message}</span>
        </div>
    ]]
}
```

{% endcode %}

### INFO

Information message with blue styling.

{% code title="INFO template (Lua)" %}

```lua
['INFO'] = {
    logType = 'system',
    template = [[
        <div style="background: linear-gradient(180deg, rgba(60, 140, 200, 0.85) 0%, rgba(30, 80, 130, 0.85) 100%); border-bottom: 0.25vh solid #3C8CC8;">
            <span style="background: #3C8CC8;">INFO</span>
            <span>{message}</span>
        </div>
    ]]
}
```

{% endcode %}

### WARNING

Warning message with yellow/orange styling.

{% code title="WARNING template (Lua)" %}

```lua
['WARNING'] = {
    logType = 'system',
    template = [[
        <div style="background: linear-gradient(180deg, rgba(220, 180, 50, 0.85) 0%, rgba(150, 120, 20, 0.85) 100%); border-bottom: 0.25vh solid #DCB432;">
            <span style="background: #DCB432;">UWAGA</span>
            <span>{message}</span>
        </div>
    ]]
}
```

{% endcode %}

## Template Options

| Option     | Type   | Description                       |
| ---------- | ------ | --------------------------------- |
| `logType`  | string | Log category for Discord webhooks |
| `template` | string | HTML template with placeholders   |

## Template Placeholders

| Placeholder  | Description                 |
| ------------ | --------------------------- |
| `{message}`  | The message content         |
| `{time}`     | Current time (HH:MM format) |
| `{playerId}` | Player's server ID          |

## Using Templates from Other Scripts

### Server-side Export

```lua
-- Send template message to a player
exports['sl-chat']:SendTemplate('SUCCESS', playerId, 'Operation completed successfully!')

-- Send error to player
exports['sl-chat']:SendTemplate('ERROR', playerId, 'Something went wrong!')

-- Send system notification
exports['sl-chat']:SendTemplate('SYSTEM', playerId, 'Server restart in 5 minutes')

-- Send info message
exports['sl-chat']:SendTemplate('INFO', playerId, 'New event starting soon!')

-- Send warning
exports['sl-chat']:SendTemplate('WARNING', playerId, 'Low fuel level!')

-- Send welcome message
exports['sl-chat']:SendTemplate('WELCOME', playerId, 'Welcome to our server!')
```

### Server-side Event

```lua
-- Alternative: using event
TriggerEvent('sl-chat:sendTemplate', 'SUCCESS', playerId, 'Your message here')
```

## Adding Custom Templates

```lua
Chat.Templates = {
    -- ... existing templates ...
    
    ['POLICE'] = {
        logType = 'faction',
        template = [[
            <div style="padding: 1vh 1.2vh; background: linear-gradient(180deg, rgba(0, 100, 200, 0.85) 0%, rgba(0, 50, 100, 0.85) 100%); border-bottom: 0.25vh solid #0064C8; border-radius: 0.2vh;">
                <span style="font-size: 1.1vh; font-weight: 600; background: #0064C8; padding: 0.3vh 0.6vh; border-radius: 0.3vh; color: #fff;">POLICE</span>
                <span style="font-size: 1.3vh; color: #fff;"> {message}</span>
                <span style="font-size: 1vh; color: rgba(255,255,255,0.7);">{time}</span>
            </div>
        ]]
    },
    
    ['EMS'] = {
        logType = 'faction',
        template = [[
            <div style="padding: 1vh 1.2vh; background: linear-gradient(180deg, rgba(200, 50, 50, 0.85) 0%, rgba(100, 25, 25, 0.85) 100%); border-bottom: 0.25vh solid #C83232; border-radius: 0.2vh;">
                <span style="font-size: 1.1vh; font-weight: 600; background: #C83232; padding: 0.3vh 0.6vh; border-radius: 0.3vh; color: #fff;">EMS</span>
                <span style="font-size: 1.3vh; color: #fff;"> {message}</span>
                <span style="font-size: 1vh; color: rgba(255,255,255,0.7);">{time}</span>
            </div>
        ]]
    }
}
```

## Integration Examples

### Player Join Welcome

```lua
-- server.lua
AddEventHandler('playerConnecting', function(name, setCallback, deferrals)
    local playerId = source
    
    Citizen.SetTimeout(5000, function()
        exports['sl-chat']:SendTemplate('WELCOME', playerId, 'Welcome to our server, ' .. name .. '!')
    end)
end)
```

### Vehicle Purchase Confirmation

```lua
function PurchaseVehicle(playerId, vehicleName, price)
    -- ... purchase logic ...
    
    if success then
        exports['sl-chat']:SendTemplate('SUCCESS', playerId, 'You purchased ' .. vehicleName .. ' for $' .. price)
    else
        exports['sl-chat']:SendTemplate('ERROR', playerId, 'Not enough money to purchase ' .. vehicleName)
    end
end
```

### Job Notification

```lua
-- your-job-script/server.lua
function StartJob(playerId, jobName)
    exports['sl-chat']:SendTemplate('INFO', playerId, 'You started working as ' .. jobName)
end

function EndJob(playerId)
    exports['sl-chat']:SendTemplate('SYSTEM', playerId, 'You ended your shift')
end
```

## Next Steps

* [🛠️ Configuration](https://scriptlock.gitbook.io/script-lock-docs/resources/chat-system/broken-reference) - Main config
* [💬 Commands](https://scriptlock.gitbook.io/script-lock-docs/resources/chat-system/broken-reference) - Chat commands
* [📤 Exports](https://scriptlock.gitbook.io/script-lock-docs/resources/chat-system/broken-reference) - All exports