API Reference

Complete API documentation for ESP-DashboardPlus.

---

ESPDashboardPlus Class

The main dashboard class that manages cards and WebSocket communication.

Constructor

ESPDashboardPlus(const String& title = "ESP32 Dashboard")

Parameter	Type	Default	Description
title	String	“ESP32-DashboardPlus”	Dashboard title

Methods

begin()

Initialize the dashboard with PROGMEM HTML data.

void begin(AsyncWebServer* server, const uint8_t* htmlData, size_t htmlSize, 
           bool enableOTA = true, bool enableConsole = true, const String& wsPath = "/ws")

Parameter	Type	Default	Description
server	AsyncWebServer*	-	Pointer to web server
htmlData	const uint8_t*	-	PROGMEM HTML data
htmlSize	size_t	-	HTML data size
enableOTA	bool	true	Show the OTA Update tab
enableConsole	bool	true	Show the Console tab
wsPath	String	“/ws”	WebSocket path

Note: OTA and Console functionality are available as tabs only, not dashboard cards. Use the enableOTA and enableConsole parameters to control tab visibility.

Note on OTA support (ESP32)
To use the OTA update tab reliably, your ESP32 must use a partition table that provides OTA app slots (e.g. ota_0, ota_1) with enough space for your firmware.
Common choices in Arduino / PlatformIO are partition schemes like min_spiffs.csv or other *ota*.csv variants that define at least one OTA partition.

Example: PlatformIO configuration with OTA-capable partition table

[env:esp32-s3-devkitm-1]
platform = espressif32
board = esp32-s3-devkitm-1
framework = arduino

; 4 MB flash with OTA-capable partition layout
board_upload.flash_size = 4MB
board_build.partitions = min_spiffs.csv

build_flags =
  -DARDUINO_USB_CDC_ON_BOOT=1
  -DBOARD_HAS_PSRAM

loop()

Process WebSocket events. Call this in your main loop.

void loop()

setTitle()

Change the dashboard title and optionally subtitle.

void setTitle(const String& title)
void setTitle(const String& title, const String& subtitle)
void setSubtitle(const String& subtitle)

Parameter	Type	Description
title	String	Dashboard title displayed in header
subtitle	String	Subtitle displayed below title

setVersionInfo()

Set firmware version info displayed in the OTA tab.

void setVersionInfo(const String& version, const String& lastUpdate = "")

Parameter	Type	Description
version	String	Current firmware version
lastUpdate	String	Date of last update

onCommand()

Set the global command handler for Console tab input.

void onCommand(std::function<void(const String&)> handler)

isOTAEnabled()

Check if OTA tab is enabled.

bool isOTAEnabled() const

isConsoleEnabled()

Check if Console tab is enabled.

bool isConsoleEnabled() const

---

Card Creation Methods

All methods return a pointer to the created card for further configuration.

addStatCard()

StatCard* addStatCard(const String& id, const String& title, 
                      const String& value = "", const String& unit = "")

addGaugeCard()

GaugeCard* addGaugeCard(const String& id, const String& title, 
                        float min = 0, float max = 100, const String& unit = "%")

addChartCard()

ChartCard* addChartCard(const String& id, const String& title, 
                        ChartType type = ChartType::LINE, int maxPoints = 20)

addToggleCard()

ToggleCard* addToggleCard(const String& id, const String& title, 
                          const String& label = "", bool defaultValue = false)

addSliderCard()

SliderCard* addSliderCard(const String& id, const String& title, 
                          int min = 0, int max = 100, int step = 1, 
                          const String& unit = "")

addButtonCard()

ButtonCardImpl* addButtonCard(const String& id, const String& title, 
                              const String& label, ButtonCallback cb)

addActionButton()

ActionButton* addActionButton(const String& id, const String& title, 
                              const String& label, const String& confirmTitle, 
                              const String& confirmMsg, ButtonCallback cb)

addLinkCard()

LinkCard* addLinkCard(const String& id, const String& title, 
                      const String& label, const String& url)

addInputCard()

InputCard* addInputCard(const String& id, const String& title, 
                        const String& placeholder = "")

addDropdownCard()

DropdownCardImpl* addDropdownCard(const String& id, const String& title, 
                                  const String& placeholder = "Select...")

addColorPickerCard()

ColorPickerCard* addColorPickerCard(const String& id, const String& title, 
                                    const String& defaultColor = "#00D4AA")

addDateCard()

DateCard* addDateCard(const String& id, const String& title, 
                      bool includeTime = false)

addTimezoneCard()

TimezoneCard* addTimezoneCard(const String& id, const String& title, 
                              const String& label = "Get Browser Timezone")

addStatusCard()

StatusCard* addStatusCard(const String& id, const String& title, 
                          StatusIcon icon = StatusIcon::INFO)

---

Update Methods

Methods to update card values and broadcast changes to all connected clients.

updateStatCard()

void updateStatCard(const String& id, const String& value)

updateGaugeCard()

void updateGaugeCard(const String& id, float value)

updateChartCard()

void updateChartCard(const String& id, float value)

updateToggleCard()

void updateToggleCard(const String& id, bool value)

updateSliderCard()

void updateSliderCard(const String& id, int value)

updateColorCard()

void updateColorCard(const String& id, const String& color)

updateDropdownCard()

void updateDropdownCard(const String& id, const String& value)

updateDateCard()

void updateDateCard(const String& id, const String& value)

updateLinkCard()

void updateLinkCard(const String& id, const String& url)

updateStatusCard()

void updateStatusCard(const String& id, StatusIcon icon, CardVariant variant, 
                      const String& label, const String& message)

---

Console Logging Methods

Log messages to the Console tab. Only works if enableConsole = true was set in begin().

logDebug(message)

void logDebug(const String& message)

logInfo(message)

void logInfo(const String& message)

logWarning(message)

void logWarning(const String& message)

logError(message)

void logError(const String& message)

log(level, message)

void log(LogLevel level, const String& message)

---

Card Management

getCard()

Get a card by its ID.

DashboardCard* getCard(const String& id)

removeCard()

Remove a card from the dashboard.

void removeCard(const String& id)

---

Enums

CardVariant

enum class CardVariant {
    PRIMARY,    // Teal/cyan
    SUCCESS,    // Green
    WARNING,    // Yellow/amber
    DANGER,     // Red
    INFO,       // Blue
    SECONDARY   // Gray
};

ChartType

enum class ChartType {
    LINE,      // Connected line with points
    AREA,      // Filled area
    BAR,       // Vertical bars
    SCATTER,   // Unconnected points
    STEP       // Staircase line
};

StatusIcon

enum class StatusIcon {
    CHECK,     // ✓
    ERROR,     // ✗
    WARNING,   // ⚠
    INFO,      // ℹ
    WIFI,      // 📶
    POWER,     // ⚡
    SYNC,      // 🔄
    CLOUD,     // ☁
    LOCK,      // 🔒
    UNLOCK     // 🔓
};

LogLevel

enum class LogLevel {
    DEBUG,     // Gray
    INFO,      // Blue
    WARNING,   // Yellow
    ERROR      // Red
};

---

Callback Types

typedef std::function<void()> ButtonCallback;
typedef std::function<void(const String&)> InputCallback;
typedef std::function<void(bool)> ToggleCallback;
typedef std::function<void(int)> SliderCallback;
typedef std::function<void(const String&)> ColorCallback;
typedef std::function<void(const String&)> DropdownCallback;
typedef std::function<void(const String&, int, const String&)> TimezoneCallback;
typedef std::function<void(const String&)> DateCallback;