upleb.uk

Public git repos — served from a NIP-34 GRASP relay at git.upleb.uk

summaryrefslogtreecommitdiff
path: root/DISPLAY_UI_PLAN.md
diff options
context:
space:
mode:
authorYour Name <you@example.com>2026-05-18 19:25:32 +0530
committerYour Name <you@example.com>2026-05-18 19:25:32 +0530
commite1da6ffc0221abf4d0fb3a8c3e6be0b90d69397a (patch)
tree3a0055b5af2bb09492c8c38fdf2712922ecc7123 /DISPLAY_UI_PLAN.md
parentf0f8cca10196b265c3b453f71322239d2ecaf4ae (diff)
Implement full TollGate display UI
- BOOT screen: centered title + WiFi status line - READY screen: QR cycling (WiFi/Portal), price, mint domain, wallet balance (color-coded), client count - PAYMENT screen: green banner 'ACCESS GRANTED', paid amount, time - ERROR screen: red banner 'NO UPSTREAM', guidance, AP reassurance - Enhanced display_update() API with mint_url, price, wifi_status - Extract domain helper for clean mint URL display - Render interval: 2s (reduced SPI load) - Color palette: cyan, yellow, orange, green, red, dim gray - WiFi events update display status and trigger ERROR state - Board C now on /dev/ttyACM3
Diffstat (limited to 'DISPLAY_UI_PLAN.md')
-rw-r--r--DISPLAY_UI_PLAN.md136
1 files changed, 136 insertions, 0 deletions
diff --git a/DISPLAY_UI_PLAN.md b/DISPLAY_UI_PLAN.md
new file mode 100644
index 0000000..3050b8a
--- /dev/null
+++ b/DISPLAY_UI_PLAN.md
@@ -0,0 +1,136 @@
1# TollGate Display UI Design
2
3## Display Hardware
4- **Panel:** 3.5" IPS, 320x480 portrait (AXS15231B QSPI)
5- **Font:** 8x8 bitmap, scalable (1x=8px, 2x=16px, 3x=24px)
6- **Capabilities:** Text rendering, QR codes, filled rectangles
7- **No touch input** — display is output-only signage
8
9## Color Palette
10
11| Color | RGB565 | Usage |
12|-------|--------|-------|
13| Black | `0x0000` | Background |
14| White | `0xFFFF` | Primary text |
15| Cyan | `0x07FF` | Titles, labels |
16| Yellow | `0xFFE0` | Price, warnings |
17| Green | `0x07E0` | Success, wallet OK |
18| Orange | `0xFD20` | Accent (Bitcoin orange) |
19| Red | `0xF800` | Errors, alerts |
20| Dim gray | `0x8410` | Secondary info |
21| Dark bg | `0x2104` | Card backgrounds |
22
23## Screen States
24
25### 1. BOOT
26Shown during startup until WiFi connects and services start.
27
28```
29┌──────────────────────────┐ 0
30│ │
31│ TollGate │ y=180, cyan, scale 2
32│ connecting... │ y=205, yellow, scale 1
33│ │
34│ WiFi: trying... │ y=260, dim, scale 1
35│ │
36└──────────────────────────┘ 479
37```
38
39WiFi status line shows: "trying...", "connected!", "failed (retry)"
40
41### 2. READY — QR Cycling (primary screen)
42Cycles every 5 seconds between WiFi QR and Portal QR.
43
44**View A — WiFi QR:**
45```
46┌──────────────────────────┐ 0
47│ ┌──────┐ │
48│ │ QR │ │ QR: WIFI:S:<ssid>;T:nopass;;
49│ │ │ │ Centered in top 2/3 of screen
50│ └──────┘ │
51│ │ ~y=320
52│ Scan to connect │ cyan, scale 1
53│ SSID: TollGate-XXXX │ white, scale 1
54│ 21 sats/min │ orange, scale 1
55│ Wallet: 420 sats │ green, scale 1
56└──────────────────────────┘ 479
57```
58
59**View B — Portal QR:**
60```
61┌──────────────────────────┐ 0
62│ ┌──────┐ │
63│ │ QR │ │ QR: http://10.x.x.x/
64│ │ │ │
65│ └──────┘ │
66│ │ ~y=320
67│ Portal URL │ cyan, scale 1
68│ testnut.cashu.space │ orange, scale 1 (mint domain)
69│ 21 sats/min │ yellow, scale 1
70│ Clients: 3 │ green, scale 1
71└──────────────────────────┘ 479
72```
73
74### 3. PAYMENT_RECEIVED
75Shows for 3 seconds after payment, then returns to READY.
76
77```
78┌──────────────────────────┐ 0
79│ │
80│ ████████████████████ │ green filled bar, y=190..230
81│ ACCESS GRANTED │ white on green, scale 2
82│ ████████████████████ │
83│ │
84│ Paid: 21 sats │ white, scale 1
85│ Time: 1 min │ white, scale 1
86│ │
87│ Wallet: 441 sats │ green, scale 1
88└──────────────────────────┘ 479
89```
90
91### 4. ERROR
92Shown when upstream WiFi is disconnected.
93
94```
95┌──────────────────────────┐ 0
96│ ████████████████████ │ red filled bar, y=190..230
97│ NO UPSTREAM │ white on red, scale 2
98│ ████████████████████ │
99│ │
100│ Internet unavailable │ white, scale 1
101│ Check WiFi config │ yellow, scale 1
102│ │
103│ AP still active │ green, scale 1
104│ SSID: TollGate-XXXX │ dim, scale 1
105└──────────────────────────┘ 479
106```
107
108## Data Flow
109
110### display_update() receives:
111```c
112void display_update(const char *ap_ssid, int active_clients,
113 uint64_t wallet_balance, const char *portal_url);
114```
115
116### Enhanced to also receive:
117```c
118void display_update(const char *ap_ssid, int active_clients,
119 uint64_t wallet_balance, const char *portal_url,
120 const char *mint_url, int price_per_step,
121 const char *wifi_status);
122```
123
124### display_set_state() triggers:
125- `DISPLAY_BOOT` → at startup
126- `DISPLAY_READY` → when services start (WiFi connected)
127- `DISPLAY_PAYMENT_RECEIVED` → on successful payment (auto-returns to READY)
128- `DISPLAY_ERROR` → when upstream WiFi disconnects
129
130## Implementation Notes
131
132- Render every 2 seconds (reduces SPI bus load vs 1 second)
133- QR codes: auto-size based on string length, centered in top portion
134- Mint URL: show only domain part (truncate at first `/`)
135- Wallet balance: color-coded (green > 100, yellow > 0, red = 0)
136- Client count: "Clients: N" or empty string if 0