154 lines
4.9 KiB
Markdown
154 lines
4.9 KiB
Markdown
# TCKRTUIYO - Rainfall Station RTU Web Interface
|
|
|
|
> **Current Version**: v1 (Flask) - See `src/`
|
|
> **Next Version**: v2 (React) - See `v2/` (in development)
|
|
|
|
A modern web-based interface for a Base Station/Real-Time Unit (RTU) rainfall monitoring system, designed for a 7" capacitive touchscreen display (1024x600). The system monitors and logs rainfall and related sensors, transmits data to a server, and provides both a kiosk-mode local display and a full HD remote interface.
|
|
|
|
## Features
|
|
|
|
### Current (Phase 1-2 Complete)
|
|
- **Dashboard** - Real-time rainfall readings (Today, Hourly, MAR Accumulated, Yearly Accumulated)
|
|
- **Voltage Monitoring** - Solar and battery voltage with status indicators (HIGH/NORMAL/LOW)
|
|
- **Status Display** - Date/time, station ID, communication status, software version
|
|
- **Real-time Updates** - Auto-refresh via Socket.IO
|
|
- **Settings** - Station info, date/time, network, ADC channels, sensor thresholds
|
|
- **Calibration** - Live ADC readings (4 channels), rainfall counter reset
|
|
- **File Management** - View, navigate, delete CSV files; generate tidEDA formatted files
|
|
|
|
### Coming Soon (Phase 3-4)
|
|
- Network transmission (FTP, SFTP, SCP, WebDAV)
|
|
- Remote HD access (port 9090) with authentication
|
|
|
|
## Hardware
|
|
|
|
- **Primary**: Raspberry Pi Zero 2 W
|
|
- **Alternative**: Raspberry Pi 3B
|
|
- **Display**: 7-inch capacitive touchscreen (1024x600)
|
|
|
|
## Tech Stack
|
|
|
|
### v1 (Active - Flask)
|
|
- **Backend**: Flask + Flask-SocketIO
|
|
- **Frontend**: Bootstrap 5.3, Socket.IO Client
|
|
- **Python**: 3.x
|
|
|
|
### v2 (In Development - React)
|
|
- **Frontend**: React 18 + TypeScript + TailwindCSS
|
|
- **Build**: Vite
|
|
- **UI Components**: shadcn/ui
|
|
|
|
## Getting Started
|
|
|
|
### Prerequisites
|
|
|
|
```bash
|
|
# Install Python dependencies
|
|
pip install -r requirements.txt
|
|
```
|
|
|
|
### Running the Application
|
|
|
|
```bash
|
|
# Start the Flask server (port 8080 for kiosk mode)
|
|
python src/app.py
|
|
|
|
# Access via browser
|
|
# Local kiosk: http://pihostname:8080
|
|
```
|
|
|
|
### Development Mode
|
|
|
|
```bash
|
|
# Run with debug mode
|
|
FLASK_DEBUG=1 python src/app.py
|
|
```
|
|
|
|
## UI Design
|
|
|
|
### Touch Optimization
|
|
- Minimum touch target: 48px
|
|
- Primary buttons: 64px height
|
|
- Designed for 7" 1024x600 display
|
|
|
|
### Color Scheme
|
|
- Primary: Bootstrap defaults (blue accent)
|
|
- Status indicators:
|
|
- HIGH: Green
|
|
- NORMAL: Blue/Yellow
|
|
- LOW: Red
|
|
|
|
### Layout
|
|
- Fixed 1024x600 resolution for kiosk
|
|
- Responsive for remote HD access (Phase 4)
|
|
|
|
## API Endpoints
|
|
|
|
| Endpoint | Method | Description |
|
|
|----------|--------|-------------|
|
|
| `/api/status` | GET | Station status (ID, time, version) |
|
|
| `/api/sensors` | GET | Sensor readings (rainfall, voltage) |
|
|
| `/api/settings` | GET/POST | Configuration settings |
|
|
| `/api/calibration` | GET | Live ADC readings |
|
|
| `/api/calibration/reset_rainfall` | POST | Reset rainfall counters |
|
|
| `/api/files` | GET | List CSV files |
|
|
| `/api/files/<filename>` | GET | View file contents |
|
|
| `/api/files/<filename>` | DELETE | Delete file |
|
|
| `/api/files/export` | POST | Generate tidEDA format |
|
|
|
|
## Version History
|
|
|
|
| Version | Description | Date | Location |
|
|
|---------|-------------|------|----------|
|
|
| v1 | Flask + Bootstrap interface (archived) | Pre-2026 | `src_v1/` |
|
|
| v1 | Flask + Bootstrap interface (active) | 2026-03 | `src/` |
|
|
| v2 | React/Next.js interface (in development) | 2026-03 | `v2/` |
|
|
|
|
## Project Structure
|
|
|
|
```
|
|
.
|
|
├── src/ # Currently active Flask v1 application
|
|
├── src_v1/ # Archived Flask v1 application (backup)
|
|
│ ├── app.py # Flask application
|
|
│ ├── templates/ # HTML templates
|
|
│ │ ├── dashboard.html # Main kiosk dashboard
|
|
│ │ ├── settings.html # Configuration UI
|
|
│ │ ├── calibration.html # Sensor calibration
|
|
│ │ └── files.html # File management
|
|
│ ├── static/ # CSS, JS, images
|
|
│ ├── data/ # CSV storage
|
|
│ ├── routes/ # Route handlers
|
|
│ ├── services/ # Business logic
|
|
│ └── requirements.txt # Python dependencies
|
|
├── v2/ # NEW: React v2 interface (development)
|
|
│ ├── src/app/ # React application
|
|
│ ├── guidelines/ # Design system
|
|
│ ├── package.json # Node dependencies
|
|
│ └── vite.config.ts # Vite config
|
|
├── sample_interface/ # Reference implementation template
|
|
├── requirements.txt # Current Python dependencies
|
|
├── README.md # This file
|
|
└── .planning/ # GSD planning artifacts
|
|
```
|
|
|
|
## Kiosk Mode Setup
|
|
|
|
To run in full-screen kiosk mode on Raspberry Pi:
|
|
|
|
```bash
|
|
# Add to ~/.config/lxsession/LXDE-pi/autostart
|
|
@ chromium-browser --kiosk --incognito http://localhost:8080
|
|
```
|
|
|
|
## Roadmap
|
|
|
|
- [x] Phase 1: Foundation & Kiosk UI
|
|
- [x] Phase 2: Data Persistence & File Management
|
|
- [ ] Phase 3: Network Transmission
|
|
- [ ] Phase 4: Remote Access
|
|
|
|
## License
|
|
|
|
This project is for the TCKRTUIYO rainfall monitoring system.
|