6.6 KiB
LED controller — user guide
This page describes the main web UI served from the Raspberry Pi app: profiles, tabs, presets, colour palettes, and sending commands to LED devices over the serial → ESP-NOW bridge.
For HTTP routes and the wire format the driver expects, see API.md. For running the app locally, see the project README.
Figures below are schematic (layout and ideas), not pixel-perfect screenshots.
Run mode and Edit mode
The header has a mode toggle (desktop and mobile menu). The label on the button is the mode you switch to when you press it.
The active tab is highlighted. Extra management buttons appear only in Edit mode.
| Mode | Purpose |
|---|---|
| Run mode | Day-to-day control: choose a tab, tap presets, apply profiles. Management buttons are hidden. |
| Edit mode | Full setup: tabs, presets, patterns, colour palette, Send Presets, profile create/clone/delete, preset reordering, and per-tile Edit on the strip. |
Profiles is available in both modes: in Run mode you can only apply a profile; in Edit mode you can also create, clone, and delete profiles.
Tabs
- Select a tab: click its button in the top bar. The main area shows that tab’s preset strip and controls.
- Edit mode — open tab settings: right-click a tab button to change its name, device IDs (comma-separated), and which presets appear on the tab. Device identifiers are matched to each device’s name when the app builds
selectmessages for the driver. - Tabs modal (Edit mode): create new tabs from the header Tabs button. New tabs need a name and device ID list (defaults to
1if you leave a simple placeholder). - Brightness slider (per tab): adjusts global brightness sent to devices (
bin the driver message), with a short debounce so small drags do not flood the link.
Presets on the tab strip
- Run and Edit mode: click the main part of a preset tile to select that preset on all devices assigned to the current tab (same logical action as a
selectin the driver API). - Edit mode only:
- Edit beside a tile opens the preset editor for that preset, scoped to the current tab (so you can Remove from tab without deleting the preset from the profile).
- Drag and drop tiles to reorder them; order is saved for that tab.
The slider controls global brightness for the tab’s devices. Click the coloured area of a tile to select that preset.
The Presets header button (Edit mode) opens a profile-wide list: Add new presets, Edit, Send (push definition over the transport), and Delete (removes the preset from the profile entirely).
Preset editor
- Pattern: chosen from the dropdown; optional n1–n8 fields depend on the pattern (see Pattern-specific parameters in API.md).
- Colours: choosing a value in the colour picker adds a swatch when the picker closes. Swatches can be reordered by dragging. Changing a swatch with the picker clears palette linkage for that slot.
- From Palette: inserts a colour linked to the current profile’s palette. Linked slots show a P badge; if you change that palette entry later, presets using it update.
- Brightness (0–255) and Delay (ms): stored on the preset and sent with the compact preset payload.
- Try: sends the current form values to devices on the current tab, then selects that preset — without
saveon the device (good for auditioning). - Default: updates the tab’s default preset and sends a default hint for those devices; it does not force the same live selection behaviour as clicking a tile.
- Save & Send: writes the preset to the server, then pushes definitions with save so devices may persist them. It does not auto-select the preset on devices (use the strip or Try if you want that).
- Remove from tab (when you opened the editor from a tab): removes the preset from this tab’s list only; the preset remains in the profile for other tabs.
Try previews without persisting on the device; Save & Send stores the preset and pushes definitions with save.
Profiles
- Apply: sets the current profile in your session. Tabs and presets you see are scoped to that profile.
- Edit mode — Create: new profiles always get a populated default tab. Optionally tick DJ tab to also create a
djtab (device namedj) with starter DJ-oriented presets. - Clone / Delete: available in Edit mode from the profile list.
Send Presets (Edit mode)
Send Presets walks every tab in the current profile, collects each tab’s preset IDs, and calls POST /presets/send per tab (including each tab’s default preset when set). Use this to bulk-push definitions to hardware after editing, without clicking Send on every preset individually.
Patterns
The Patterns dialog (Edit mode) is a read-only reference: pattern names and typical delay ranges from the pattern definitions. It does not change device behaviour by itself; patterns are chosen inside the preset editor.
Colour palette
Colour Palette (Edit mode) edits the current profile’s palette swatches. Those colours are reused by From Palette in the preset editor and stay in sync while the P link remains.
Add or change swatches here; linked preset colours update automatically.
Mobile layout
On narrow screens, use Menu to reach the same actions as the desktop header (Profiles, Tabs, Presets, Help, mode toggle, etc.).
Preset tiles behave the same once a tab is selected.
Further reading
- API.md — REST routes, session scoping, WebSocket
/ws, and LED driver JSON (presets,select,save,default, pattern keys). - README —
pipenv run run, port 80 setup, and high-level behaviour.