πŸ–ΌοΈ[FREE] Adaptive Cards Boilerplate

A lightweight Lua boilerplate for integrating Adaptive Cards into your FiveM connection process using deferrals. Built by the PyroByte team.


πŸ“¦ Overview

This boilerplate demonstrates how to display interactive Adaptive Cards to players when they connect to your FiveM server. It's designed to improve the user experience during the connection phase.

Cards can range from basic buttons to styled forms and complex layouts.


✨ Features

  • 🟦 Simple Cards – Title, message & single action

  • πŸ“‹ Form Cards – Input fields with multiple actions

  • πŸ” Card Switching – Easily change views in real-time

  • ⏳ Timeout Handling – Auto-failure or countdown after inactivity

  • 🎨 Styled Cards – Use consistent styles via Config.Styles


πŸ“ File Structure

pyro-adaptivecards-boilerplate/
β”œβ”€β”€ fxmanifest.lua
β”œβ”€β”€ sv_main.lua         # Sample connection handler with card flow
└── functions.lua       # Card creation helpers

πŸ§ͺ Examples Included

Each scenario is covered in the sample server script:

  1. βœ… Main Menu Card

  2. πŸ”‘ Recovery Form

  3. βœ”οΈ Success Message

  4. ⏱️ Timeout Countdown

  5. πŸ“œ Welcome Card with rules

  6. 🎨 Styled Card using Config.Styles


πŸ›  Card Creation Functions

CreateSimpleCard(title, message, buttonText, buttonId)

Creates a basic card with a heading, message, and one button.


CreateMultiActionCard(title, message, actions)

Accepts a list of buttons with labels and styles. Good for menus.

actions = {
  { title = "Login", id = "submit_login", style = "positive", color = "light" },
  { title = "Cancel", id = "submit_cancel", style = "default", color = "light" }
}

CreateFormCard(title, message, inputFields, submitText, submitId, backText?, backId?)

Builds a card with text input fields.

inputFields = {
  { id = "email", placeholder = "Enter your email", style = "email" }
}

CreateComplexCard(title, message, backgroundImage)

A styled layout with optional top-right nav (Back/Exit), centered message, and multiple buttons.


CreateStyledCard(title, message, styleName, buttonText, buttonId, backgroundImage?)

Uses styles from your Config.Styles object for consistent theming.


πŸ”„ Deferral Flow

Outlined in sv_main.lua:

  1. Player connects

  2. Main menu displayed

  3. Form submitted or canceled

  4. Timeout or success triggers

  5. Deferral ends with done() or rejection


βš™οΈ Installation

  1. Clone or download the repository

  2. Place it in your server's resources folder

  3. Add this to your server.cfg:

    ensure pyro-adaptivecards-boilerplate

🎨 Customization Tips

  • Replace image URLs with your own CDN or Imgur links

  • Add or modify styles in Config.Styles

  • Update logic in sv_main.lua to match your server's workflow


πŸ“‹ Requirements

  • A FiveM server

  • Basic Lua knowledge



πŸ“ž Support

Need help or have questions? β†’ Join the PyroByte Discord

Last updated