From 1704001ef6244f7c90bc80dcda751c9913f8bff2 Mon Sep 17 00:00:00 2001 From: Chuck <33324927+ChuckBuilds@users.noreply.github.com> Date: Mon, 11 Aug 2025 14:12:17 -0500 Subject: [PATCH] ensure web ui actions work and web interface is starting without venv --- README.md | 31 ++--- demo_web_v2.py | 271 --------------------------------------- demo_web_v2_simple.py | 287 ------------------------------------------ 3 files changed, 16 insertions(+), 573 deletions(-) delete mode 100644 demo_web_v2.py delete mode 100644 demo_web_v2_simple.py diff --git a/README.md b/README.md index e4aec5ba..cedcc498 100644 --- a/README.md +++ b/README.md @@ -1199,12 +1199,20 @@ The LEDMatrix system includes a robust caching mechanism to optimize API calls a - Building a user-friendly UI for easier configuration (done!) -### If you've read this far ā€” thanks! + ## Granting Passwordless Sudo Access for Web Interface Actions The web interface needs to run certain commands with `sudo` (e.g., `reboot`, `systemctl start/stop/enable/disable ledmatrix.service`, `python display_controller.py`). To avoid needing to enter a password for these actions through the web UI, you can configure the `sudoers` file to allow the user running the Flask application to execute these specific commands without a password. +1. Shortcut to automate the below steps: +```chmod +x configure_web_sudo.sh``` +then +```./configure_web_sudo.sh``` + + +Manual Method: + **WARNING: Be very careful when editing the `sudoers` file. Incorrect syntax can lock you out of `sudo` access.** 1. **Identify the user:** Determine which user is running the `web_interface.py` script. Often, this might be the default user like `pi` on a Raspberry Pi, or a dedicated user you've set up. @@ -1256,35 +1264,28 @@ For `display_controller.py` and `stop_display.sh`, ensure their file permissions ## Web Interface V2 (simplified quick start) -### 1) Create and populate the venv (recommended) -``` -cd /home/ledpi/LEDMatrix -python3 -m venv venv_web_v2 -source venv_web_v2/bin/activate -pip install -r requirements_web_v2.txt -pip install -e rpi-rgb-led-matrix-master/bindings/python -``` - -Alternatively, run the helper (does the above and starts the server): +### 1) un the helper (does the above and starts the server): ``` python3 start_web_v2.py ``` ### 2) Start the web UI v2 ``` -source venv_web_v2/bin/activate python web_interface_v2.py ``` ### 3) Autostart (optional) Set `"web_display_autostart": true` in `config/config.json`. Ensure your systemd service (or launcher) calls `start_web_conditionally.py`. -It will prefer `venv_web_v2/bin/python` if present. ### 4) Permissions (optional but recommended) - Add the service user to `systemd-journal` for viewing logs without sudo. - Configure passwordless sudo for actions (start/stop service, reboot, shutdown) if desired. + - Required for web Ui actions, look in the section above for the commands to run (chmod +x configure_web_sudo.sh & ./configure_web_sudo.sh) ### 5) Old web UI (v1) -The project now defaults to Web UI v2. The v1 interface can be removed or ignored. -An LED matrix display system that provides real-time information display capabilities for various data sources. The system is highly configurable and supports multiple display modes that can be enabled or disabled based on user preferences. \ No newline at end of file +The project now defaults to Web UI v2. The v1 interface can be ignored. +An LED matrix display system that provides real-time information display capabilities for various data sources. The system is highly configurable and supports multiple display modes that can be enabled or disabled based on user preferences. + + +### If you've read this far ā€” thanks! \ No newline at end of file diff --git a/demo_web_v2.py b/demo_web_v2.py deleted file mode 100644 index 905845d9..00000000 --- a/demo_web_v2.py +++ /dev/null @@ -1,271 +0,0 @@ -#!/usr/bin/env python3 -""" -LED Matrix Web Interface V2 Demo -Demonstrates the new features and capabilities of the modern web interface. -""" - -import os -import time -import json -from src.layout_manager import LayoutManager -from src.display_manager import DisplayManager -from src.config_manager import ConfigManager - -def create_demo_config(): - """Create a demo configuration for testing.""" - demo_config = { - "display": { - "hardware": { - "rows": 32, - "cols": 64, - "chain_length": 2, - "parallel": 1, - "brightness": 95, - "hardware_mapping": "adafruit-hat-pwm" - }, - "runtime": { - "gpio_slowdown": 3 - } - }, - "schedule": { - "enabled": True, - "start_time": "07:00", - "end_time": "23:00" - } - } - return demo_config - -def demo_layout_manager(): - """Demonstrate the layout manager capabilities.""" - print("šŸŽØ LED Matrix Layout Manager Demo") - print("=" * 50) - - # Create layout manager (without actual display for demo) - layout_manager = LayoutManager() - - # Create preset layouts - print("Creating preset layouts...") - layout_manager.create_preset_layouts() - - # List available layouts - layouts = layout_manager.list_layouts() - print(f"Available layouts: {layouts}") - - # Show layout previews - for layout_name in layouts: - preview = layout_manager.get_layout_preview(layout_name) - print(f"\nšŸ“‹ Layout: {layout_name}") - print(f" Description: {preview.get('description', 'No description')}") - print(f" Elements: {preview.get('element_count', 0)}") - for element in preview.get('elements', []): - print(f" - {element['type']} at {element['position']}") - - return layout_manager - -def demo_custom_layout(): - """Demonstrate creating a custom layout.""" - print("\nšŸ› ļø Creating Custom Layout Demo") - print("=" * 50) - - layout_manager = LayoutManager() - - # Create a custom sports dashboard layout - sports_layout = [ - { - 'type': 'text', - 'x': 2, - 'y': 2, - 'properties': { - 'text': 'SPORTS', - 'color': [255, 255, 0], - 'font_size': 'normal' - } - }, - { - 'type': 'line', - 'x': 0, - 'y': 12, - 'properties': { - 'x2': 128, - 'y2': 12, - 'color': [100, 100, 100] - } - }, - { - 'type': 'data_text', - 'x': 2, - 'y': 15, - 'properties': { - 'data_key': 'sports.team1.score', - 'format': 'TB: {value}', - 'color': [0, 255, 0], - 'default': 'TB: --' - } - }, - { - 'type': 'data_text', - 'x': 2, - 'y': 24, - 'properties': { - 'data_key': 'sports.team2.score', - 'format': 'DAL: {value}', - 'color': [0, 100, 255], - 'default': 'DAL: --' - } - } - ] - - # Save the custom layout - success = layout_manager.create_layout( - 'sports_dashboard', - sports_layout, - 'Custom sports dashboard showing team scores' - ) - - if success: - print("āœ… Custom sports dashboard layout created successfully!") - - # Show the layout preview - preview = layout_manager.get_layout_preview('sports_dashboard') - print(f"šŸ“‹ Layout Preview:") - print(f" Elements: {preview.get('element_count', 0)}") - for element in preview.get('elements', []): - print(f" - {element['type']} at {element['position']}") - else: - print("āŒ Failed to create custom layout") - - return layout_manager - -def demo_web_features(): - """Demonstrate web interface features.""" - print("\nšŸŒ Web Interface Features Demo") - print("=" * 50) - - features = [ - "šŸ–„ļø Real-Time Display Preview", - " - Live WebSocket connection", - " - Scaled-up preview for visibility", - " - Screenshot capture", - "", - "āœļø Display Editor Mode", - " - Drag-and-drop element placement", - " - Real-time property editing", - " - Custom layout creation", - " - Element palette with multiple types", - "", - "šŸ“Š System Monitoring", - " - CPU temperature tracking", - " - Memory usage monitoring", - " - Service status indicators", - " - Performance metrics", - "", - "āš™ļø Configuration Management", - " - Tabbed interface for organization", - " - Visual controls (sliders, toggles)", - " - Real-time config updates", - " - Instant feedback", - "", - "šŸŽØ Modern UI Design", - " - Responsive layout", - " - Professional styling", - " - Smooth animations", - " - Color-coded status indicators" - ] - - for feature in features: - print(feature) - if feature.startswith(" -"): - time.sleep(0.1) # Small delay for effect - -def demo_api_endpoints(): - """Show available API endpoints.""" - print("\nšŸ”Œ API Endpoints Demo") - print("=" * 50) - - endpoints = { - "Display Control": [ - "POST /api/display/start - Start the LED matrix", - "POST /api/display/stop - Stop the LED matrix", - "GET /api/display/current - Get current display image" - ], - "Editor Mode": [ - "POST /api/editor/toggle - Toggle editor mode", - "POST /api/editor/preview - Update layout preview" - ], - "Configuration": [ - "POST /api/config/save - Save configuration changes", - "GET /api/system/status - Get system status" - ], - "System Actions": [ - "POST /api/system/action - Execute system commands", - "GET /logs - View system logs" - ] - } - - for category, apis in endpoints.items(): - print(f"\nšŸ“ {category}:") - for api in apis: - print(f" {api}") - -def show_setup_instructions(): - """Show setup instructions.""" - print("\nšŸš€ Setup Instructions") - print("=" * 50) - - instructions = [ - "1. Install dependencies:", - " pip install -r requirements_web_v2.txt", - "", - "2. Make startup script executable:", - " chmod +x start_web_v2.py", - "", - "3. Start the web interface:", - " python3 start_web_v2.py", - "", - "4. Access the interface:", - " Open browser to http://your-pi-ip:5001", - "", - "5. Enter Editor Mode:", - " - Click 'Enter Editor' button", - " - Drag elements from palette", - " - Customize properties", - " - Save your layout", - "", - "6. Monitor your system:", - " - Check real-time stats in header", - " - View performance metrics", - " - Access system logs" - ] - - for instruction in instructions: - print(instruction) - -def main(): - """Main demo function.""" - print("šŸŽÆ LED Matrix Web Interface V2 - Complete Demo") - print("=" * 60) - print() - - # Show features - demo_web_features() - - # Demo layout manager - layout_manager = demo_layout_manager() - - # Demo custom layout creation - demo_custom_layout() - - # Show API endpoints - demo_api_endpoints() - - # Show setup instructions - show_setup_instructions() - - print("\n" + "=" * 60) - print("šŸŽ‰ Demo Complete!") - print("Ready to revolutionize your LED Matrix experience!") - print("Start the web interface with: python3 start_web_v2.py") - print("=" * 60) - -if __name__ == '__main__': - main() \ No newline at end of file diff --git a/demo_web_v2_simple.py b/demo_web_v2_simple.py deleted file mode 100644 index 42a5b07e..00000000 --- a/demo_web_v2_simple.py +++ /dev/null @@ -1,287 +0,0 @@ -#!/usr/bin/env python3 -""" -LED Matrix Web Interface V2 Demo (Simplified) -Demonstrates the new features without requiring hardware. -""" - -import json -import time - -def demo_web_features(): - """Demonstrate web interface features.""" - print("šŸŒ LED Matrix Web Interface V2 - Feature Overview") - print("=" * 60) - - features = [ - "", - "šŸ–„ļø REAL-TIME DISPLAY PREVIEW", - " āœ“ Live WebSocket connection to LED matrix", - " āœ“ Scaled-up preview (4x) for better visibility", - " āœ“ Real-time updates as content changes", - " āœ“ Screenshot capture functionality", - "", - "āœļø DISPLAY EDITOR MODE", - " āœ“ Drag-and-drop interface for custom layouts", - " āœ“ Element palette: text, weather icons, shapes, lines", - " āœ“ Properties panel for fine-tuning appearance", - " āœ“ Real-time preview of changes on actual display", - " āœ“ Save/load custom layouts for reuse", - "", - "šŸ“Š SYSTEM MONITORING", - " āœ“ Real-time CPU temperature and memory usage", - " āœ“ Service status monitoring with visual indicators", - " āœ“ Performance metrics dashboard", - " āœ“ Connection status indicator", - "", - "āš™ļø CONFIGURATION MANAGEMENT", - " āœ“ Modern tabbed interface for easy navigation", - " āœ“ Visual controls (sliders, toggles, dropdowns)", - " āœ“ Real-time configuration updates", - " āœ“ Instant feedback on changes", - "", - "šŸŽØ MODERN UI DESIGN", - " āœ“ Responsive design (works on desktop & mobile)", - " āœ“ Professional card-based layout", - " āœ“ Smooth animations and transitions", - " āœ“ Color-coded status indicators", - " āœ“ Dark theme optimized for LED matrix work" - ] - - for feature in features: - print(feature) - if feature.startswith(" āœ“"): - time.sleep(0.1) - -def demo_layout_system(): - """Show the layout system capabilities.""" - print("\nšŸŽØ CUSTOM LAYOUT SYSTEM") - print("=" * 60) - - print("The new layout system allows you to:") - print("") - print("šŸ“‹ PRESET LAYOUTS:") - print(" ā€¢ Basic Clock - Simple time and date display") - print(" ā€¢ Weather Display - Icon with temperature and conditions") - print(" ā€¢ Dashboard - Mixed clock, weather, and stock data") - print("") - print("šŸ› ļø CUSTOM ELEMENTS:") - print(" ā€¢ Text Elements - Static or data-driven text") - print(" ā€¢ Weather Icons - Dynamic weather condition icons") - print(" ā€¢ Shapes - Rectangles for borders/backgrounds") - print(" ā€¢ Lines - Decorative separators") - print(" ā€¢ Clock Elements - Customizable time formats") - print(" ā€¢ Data Text - Live data from APIs (stocks, weather, etc.)") - print("") - print("āš” REAL-TIME EDITING:") - print(" ā€¢ Drag elements directly onto display preview") - print(" ā€¢ Adjust position, color, size in properties panel") - print(" ā€¢ See changes instantly on actual LED matrix") - print(" ā€¢ Save layouts for later use") - -def demo_api_endpoints(): - """Show available API endpoints.""" - print("\nšŸ”Œ REST API ENDPOINTS") - print("=" * 60) - - endpoints = { - "šŸ–„ļø Display Control": [ - "POST /api/display/start - Start the LED matrix display", - "POST /api/display/stop - Stop the LED matrix display", - "GET /api/display/current - Get current display as base64 image" - ], - "āœļø Editor Mode": [ - "POST /api/editor/toggle - Enter/exit display editor mode", - "POST /api/editor/preview - Update preview with custom layout" - ], - "āš™ļø Configuration": [ - "POST /api/config/save - Save configuration changes", - "GET /api/system/status - Get real-time system status" - ], - "šŸ”§ System Actions": [ - "POST /api/system/action - Execute system commands", - "GET /logs - View system logs in browser" - ] - } - - for category, apis in endpoints.items(): - print(f"\n{category}:") - for api in apis: - print(f" {api}") - -def show_editor_workflow(): - """Show the editor workflow.""" - print("\nāœļø DISPLAY EDITOR WORKFLOW") - print("=" * 60) - - workflow = [ - "1. šŸš€ ENTER EDITOR MODE", - " ā€¢ Click 'Enter Editor' button in web interface", - " ā€¢ Normal display operation pauses", - " ā€¢ Display switches to editor mode", - "", - "2. šŸŽØ DESIGN YOUR LAYOUT", - " ā€¢ Drag elements from palette onto display preview", - " ā€¢ Elements appear exactly where you drop them", - " ā€¢ Click elements to select and edit properties", - "", - "3. šŸ”§ CUSTOMIZE PROPERTIES", - " ā€¢ Adjust position (X, Y coordinates)", - " ā€¢ Change colors (RGB values)", - " ā€¢ Modify text content and fonts", - " ā€¢ Resize elements as needed", - "", - "4. šŸ‘€ REAL-TIME PREVIEW", - " ā€¢ Changes appear instantly on actual LED matrix", - " ā€¢ No need to restart or reload", - " ā€¢ See exactly how it will look", - "", - "5. šŸ’¾ SAVE YOUR WORK", - " ā€¢ Click 'Save Layout' to store design", - " ā€¢ Layouts saved locally for reuse", - " ā€¢ Load layouts anytime in the future", - "", - "6. šŸŽÆ EXIT EDITOR MODE", - " ā€¢ Click 'Exit Editor' to return to normal operation", - " ā€¢ Your custom layout can be used in rotation" - ] - - for step in workflow: - print(step) - -def show_system_monitoring(): - """Show system monitoring capabilities.""" - print("\nšŸ“Š SYSTEM MONITORING DASHBOARD") - print("=" * 60) - - monitoring = [ - "šŸŒ”ļø HARDWARE MONITORING:", - " ā€¢ CPU Temperature - Real-time thermal monitoring", - " ā€¢ Memory Usage - RAM usage percentage", - " ā€¢ System Uptime - How long system has been running", - "", - "āš” SERVICE STATUS:", - " ā€¢ LED Matrix Service - Active/Inactive status", - " ā€¢ Display Connection - Hardware connection status", - " ā€¢ Web Interface - Connection indicator", - "", - "šŸ“ˆ PERFORMANCE METRICS:", - " ā€¢ Update frequency - Display refresh rates", - " ā€¢ Network status - WebSocket connection health", - " ā€¢ Resource usage - System performance tracking", - "", - "šŸ” TROUBLESHOOTING:", - " ā€¢ System logs accessible via web interface", - " ā€¢ Error messages with timestamps", - " ā€¢ Performance alerts for resource issues" - ] - - for item in monitoring: - print(item) - -def show_setup_guide(): - """Show complete setup guide.""" - print("\nšŸš€ COMPLETE SETUP GUIDE") - print("=" * 60) - - setup_steps = [ - "šŸ“¦ INSTALLATION:", - " 1. pip install -r requirements_web_v2.txt", - " 2. chmod +x start_web_v2.py", - "", - "šŸŒ STARTING THE INTERFACE:", - " 3. python3 start_web_v2.py", - " 4. Open browser to http://your-pi-ip:5001", - "", - "šŸŽÆ FIRST USE:", - " 5. Check system status in header", - " 6. Use Start/Stop buttons to control display", - " 7. Take screenshots for documentation", - "", - "āœļø USING THE EDITOR:", - " 8. Click 'Enter Editor' button", - " 9. Drag elements from palette to display", - " 10. Customize properties in right panel", - " 11. Save your custom layouts", - "", - "āš™ļø CONFIGURATION:", - " 12. Use Config tab for display settings", - " 13. Adjust brightness, schedule, hardware settings", - " 14. Changes apply in real-time", - "", - "šŸ”§ SYSTEM MANAGEMENT:", - " 15. Use System tab for maintenance", - " 16. View logs, restart services, update code", - " 17. Monitor performance metrics" - ] - - for step in setup_steps: - print(step) - -def show_benefits(): - """Show the benefits of the new interface.""" - print("\nšŸŽ‰ WHY UPGRADE TO WEB INTERFACE V2?") - print("=" * 60) - - benefits = [ - "šŸš€ MODERN & INTUITIVE:", - " ā€¢ Professional web interface replaces basic controls", - " ā€¢ Responsive design works on any device", - " ā€¢ No more SSH or command-line configuration", - "", - "āš” REAL-TIME CONTROL:", - " ā€¢ See exactly what your display shows", - " ā€¢ Make changes and see results instantly", - " ā€¢ No more guessing what the display looks like", - "", - "šŸŽØ CREATIVE FREEDOM:", - " ā€¢ Design custom layouts visually", - " ā€¢ Drag-and-drop interface for easy positioning", - " ā€¢ Save and reuse your favorite designs", - "", - "šŸ“Š BETTER MONITORING:", - " ā€¢ Keep track of system health", - " ā€¢ Get alerts for performance issues", - " ā€¢ Access logs without SSH", - "", - "šŸ› ļø EASIER MAINTENANCE:", - " ā€¢ Update code with one click", - " ā€¢ Restart services from web interface", - " ā€¢ Troubleshoot issues visually", - "", - "šŸ’” LIGHTWEIGHT & EFFICIENT:", - " ā€¢ Designed specifically for Raspberry Pi", - " ā€¢ Minimal resource usage", - " ā€¢ Runs alongside LED matrix without issues" - ] - - for benefit in benefits: - print(benefit) - -def main(): - """Main demo function.""" - print("šŸŽÆ LED MATRIX WEB INTERFACE V2") - print(" Modern ā€¢ Sleek ā€¢ Powerful ā€¢ Easy to Use") - print("=" * 60) - - # Show all demos - demo_web_features() - demo_layout_system() - show_editor_workflow() - demo_api_endpoints() - show_system_monitoring() - show_setup_guide() - show_benefits() - - print("\n" + "=" * 60) - print("šŸŽ‰ READY TO TRANSFORM YOUR LED MATRIX EXPERIENCE!") - print("") - print("šŸš€ GET STARTED:") - print(" python3 start_web_v2.py") - print(" Open browser to http://your-pi-ip:5001") - print("") - print("šŸ“š DOCUMENTATION:") - print(" See WEB_INTERFACE_V2_README.md for full details") - print("=" * 60) - -if __name__ == '__main__': - main() \ No newline at end of file