@@ -250,4 +250,81 @@ Common issues:
250250- Missing ui.broadcast() calls
251251- Not handling header updates across different views
252252- Not checking if game is closed in sync_board_state
253- - Ignoring exception handling for disconnected clients
253+ - Ignoring exception handling for disconnected clients
254+
255+ ## State Persistence
256+
257+ The application uses NiceGUI's ` app.storage.general ` for persistent state management:
258+
259+ ### Key Components
260+ - ** Persistent Data** : Game state survives app restarts
261+ - ** Serialization** : Handles conversion of Python types (sets → lists, tuples → lists)
262+ - ** Auto-save** : State saved after every user action
263+ - ** Load on Init** : State restored from storage when app starts
264+
265+ ### State Elements
266+ - ` clicked_tiles ` : Set of clicked (row, col) positions
267+ - ` is_game_closed ` : Boolean for game status
268+ - ` header_text ` : Current header message
269+ - ` board_iteration ` : Tracks board version
270+ - ` bingo_patterns ` : Winning patterns found
271+
272+ ### Key Functions
273+ - ` save_state_to_storage() ` : Serializes and saves current state
274+ - ` load_state_from_storage() ` : Loads and deserializes saved state
275+ - ` toggle_tile() ` : Updates tile state and triggers save
276+ - ` close_game() ` : Closes game and saves state
277+ - ` reopen_game() ` : Reopens game and saves state
278+
279+ ## View Synchronization
280+
281+ The application maintains two synchronized views:
282+
283+ ### Views
284+ - ** Root Path (` / ` )** : Full interactive board with controls
285+ - ** Stream Path (` /stream ` )** : Read-only view for audiences
286+
287+ ### Synchronization Strategy
288+ - ** Timer-based** : Uses 0.05 second interval timers
289+ - ** NiceGUI 2.11+ Compatible** : Removed deprecated ` ui.broadcast() `
290+ - ** Automatic Updates** : UI changes propagate to all connected clients
291+ - ** State Consistency** : Both views share same game state
292+
293+ ### User Tracking
294+ - Active connections tracked per path
295+ - Connection/disconnection handled gracefully
296+ - Health endpoint reports user counts
297+ - UI displays active user count
298+
299+ ## NiceGUI Framework Notes
300+
301+ ### Version Compatibility
302+ - Built for NiceGUI 2.11.0+
303+ - Uses ` app.storage.general ` for persistence
304+ - Timer-based synchronization pattern
305+ - No longer uses deprecated ` ui.broadcast() `
306+
307+ ### Storage Best Practices
308+ ``` python
309+ # Store data
310+ app.storage.general[' key' ] = value
311+
312+ # Retrieve with default
313+ value = app.storage.general.get(' key' , default_value)
314+
315+ # Check existence
316+ if ' key' in app.storage.general:
317+ # process
318+ ```
319+
320+ ### UI Patterns
321+ - Buttons support text + icons for mobile
322+ - Use context managers for UI containers
323+ - Handle disconnected clients in try/except
324+ - Timer callbacks for periodic updates
325+
326+ ### Mobile Optimization
327+ - Touch targets: minimum 44x44 pixels
328+ - Descriptive text alongside icons
329+ - Responsive design classes
330+ - Clear visual feedback
0 commit comments