Screen Composer Webhook

A webhook endpoint for M5StickCPLUS2 devices that manages button labels through HTTP requests.

🎮 Device Integration

• Handles M5StickCPLUS2 device requests (GET for init, POST for button presses)
• Manages button labels for buttons A, B, and C
• Implements label rotation demo functionality

🌐 Web Interface

• Clean web UI for monitoring device interactions
• Real-time log of device requests and responses
• Manual label management interface
• Copy-to-clipboard webhook URL

📊 Request Logging

• SQLite database for persistent storage
• Logs all device interactions with timestamps
• Shows request/response pairs for debugging

• GET / - Device initialization handshake
• POST / - Button press events

• GET / (browser) - Management dashboard
• GET /logs - JSON API for request logs
• POST /clear-logs - Clear all logs
• POST /update-labels - Manually update labels

// Boot/refresh
{ "device": "M5StickCPLUS2", "event": "init" }

// Button press
{ 
  "device": "M5StickCPLUS2", 
  "event": "press", 
  "button": "A", 
  "value": "Yes please", 
  "ts_ms": 1234567 
}

{
  "labels": {
    "A": "New A text",
    "B": "New B text", 
    "C": "New C text"
  }
}

The default implementation rotates through a list of labels:

• Initial: ["Red", "Green", "Blue"]
• After button press: ["Green", "Blue", "Red"] (rotated left)
• Maps to buttons A, B, C respectively

• Built with Hono framework
• SQLite for data persistence
• TailwindCSS for styling
• Handles both device requests and web interface
• Error handling with appropriate HTTP status codes
• Payload size kept under 1KB for device compatibility