|
|
--- |
|
|
title: Reachy Mini Simple Control Panel |
|
|
emoji: 🤖 |
|
|
colorFrom: blue |
|
|
colorTo: purple |
|
|
sdk: static |
|
|
pinned: false |
|
|
--- |
|
|
|
|
|
# Reachy Mini Simple Control Panel |
|
|
|
|
|
A lightweight, static HTML/JS control panel for Reachy Mini robot using WebSockets for real-time control. |
|
|
|
|
|
## Features |
|
|
|
|
|
- **Real-time WebSocket Control**: Instant response using WebSocket streaming |
|
|
- **Task Space Control**: Real-time head pose control (X, Y, Z, Roll, Pitch, Yaw) |
|
|
- **Body & Antennas**: Control body yaw and antenna positions |
|
|
- **Auto-reconnect**: Automatically reconnects if connection is lost |
|
|
- **No Dependencies**: Pure HTML/CSS/JavaScript |
|
|
- **100% Client-Side**: No backend needed, runs entirely in the browser |
|
|
|
|
|
## How to Use |
|
|
|
|
|
### On HuggingFace Spaces |
|
|
|
|
|
Just open the Space - the app will automatically try to connect to your local robot at `localhost:8000`. |
|
|
|
|
|
**Requirements:** |
|
|
- Reachy Mini daemon running on `localhost:8000` on your local machine |
|
|
- Modern web browser with WebSocket support |
|
|
|
|
|
### Local Testing |
|
|
|
|
|
#### Option 1: Open Directly (Simplest) |
|
|
|
|
|
Just open `index.html` in your web browser: |
|
|
|
|
|
```bash |
|
|
open index.html # macOS |
|
|
xdg-open index.html # Linux |
|
|
start index.html # Windows |
|
|
``` |
|
|
|
|
|
#### Option 2: Serve with Python |
|
|
|
|
|
```bash |
|
|
python server.py |
|
|
``` |
|
|
|
|
|
Then open http://localhost:7860 in your browser. |
|
|
|
|
|
#### Option 3: Serve with any HTTP server |
|
|
|
|
|
```bash |
|
|
# Using Python 3 |
|
|
python3 -m http.server 7860 |
|
|
|
|
|
# Using Node.js |
|
|
npx http-server -p 7860 |
|
|
|
|
|
# Using PHP |
|
|
php -S localhost:7860 |
|
|
``` |
|
|
|
|
|
## Requirements |
|
|
|
|
|
- Reachy Mini daemon running on `localhost:8000` |
|
|
- Modern web browser with WebSocket support |
|
|
|
|
|
## Architecture |
|
|
|
|
|
This app uses: |
|
|
- **WebSocket** (`ws://localhost:8000/api/move/ws/set_target`) for real-time pose streaming |
|
|
- Pure client-side JavaScript (no backend needed) |
|
|
- Automatic reconnection if connection is lost |
|
|
|
|
|
**Note**: Due to browser security (Mixed Content policy), the WebSocket connection from HuggingFace Spaces (HTTPS) to localhost (HTTP) may be blocked. For best results, run the app locally. |
|
|
|
|
|
## Technical Details |
|
|
|
|
|
- **Slider Updates**: Use `input` event for real-time updates |
|
|
- **Auto-reconnect**: WebSocket reconnects every 2 seconds if disconnected |
|
|
- **State Management**: Client-side state tracking prevents feedback loops |
|
|
- **Error Handling**: Graceful error messages and automatic recovery |
|
|
- **No Backend**: Fully static - runs entirely in the browser |
|
|
|
