LIVE WEB PLAYER
Loading WebAssembly…See it respond.
The same raylib runtime, compiled to WebAssembly. Load this example, inject MQTT messages and watch its published events.
MQTT I/O
Waiting for runtime…
The browser requires a user action before the scene is loaded. Click Load demo scene first. MQTT is emulated and never leaves this page. Shaders are disabled in the web build; GPIO is hardware-only.
Touch/mouse grid generated from a pipe-separated list of labels.
Configuration
| Field | Description | |
|---|---|---|
type | button_grid | |
columns, rows | Grid dimensions | |
spacing | Gap between cells | |
value | Labels separated by ` | ` |
font, font_size | Label font | |
bg_color, pressed_bg_color | Cell fills | |
border_color, pressed_border_color | Cell borders | |
border_thickness | Border width |
Copy-and-paste JSON
{
"type": "button_grid",
"id": "numpad",
"pos": [800, 120],
"size": [420, 560],
"columns": 3,
"rows": 4,
"spacing": 10,
"font": "Technology.ttf",
"font_size": 34,
"value": "1|2|3|4|5|6|7|8|9|*|0|#",
"bg_color": "#303030FF",
"pressed_bg_color": "#505050FF",
"border_color": "#808080FF",
"pressed_border_color": "#FFD700FF",
"border_thickness": 2,
"layer": 2
}MQTT
ergs/rpi01/update/numpad YES|NO|BACK
Published topic: ergs/rpi01/status/numpad/click
Payload: selected label, for example YES