318 lines
8.0 KiB
Markdown
318 lines
8.0 KiB
Markdown
# 🎯 Dashboard Bedienung - Alles auf einen Blick
|
|
|
|
## ✅ GELÖSTE PROBLEME
|
|
|
|
### 1. Karten-Crash behoben
|
|
- ✅ **Error Handling** eingebaut
|
|
- ✅ **Loading-Spinner** beim Laden
|
|
- ✅ **Fehleranzeige** wenn Karte nicht lädt (z.B. kein Internet)
|
|
- ✅ **"Neu laden" Button** bei Fehlern
|
|
|
|
### 2. Alles im Dashboard vereint
|
|
- ✅ **Kein App-Wechsel mehr nötig**
|
|
- ✅ **Overview Tab zeigt alles:** Navigation + Audio + Instrumente
|
|
- ✅ **Music Player direkt eingebaut** (Play/Pause/Skip)
|
|
- ✅ **Audio-Zonen direkt sichtbar** (Lautstärke/Mute)
|
|
|
|
---
|
|
|
|
## 🚀 So benutzt du das Dashboard
|
|
|
|
### Öffne: http://localhost:8090
|
|
|
|
---
|
|
|
|
## 📊 OVERVIEW TAB (Haupt-Screen)
|
|
|
|
**Das ist der Tab, den du auf dem Boot im Kiosk-Modus siehst!**
|
|
|
|
### 🗺️ Karte / Instrumente Toggle
|
|
|
|
**Oben siehst du zwei Buttons:**
|
|
```
|
|
[📊 Instrumente] [🗺️ Karte]
|
|
```
|
|
|
|
**Klick auf "📊 Instrumente":**
|
|
- Zeigt: Kompass, Geschwindigkeit, Tiefe, Wind
|
|
- Ideal zum Segeln: Alle wichtigen Werte auf einen Blick
|
|
|
|
**Klick auf "🗺️ Karte":**
|
|
- Zeigt: Interaktive Seekarte mit deiner Position
|
|
- Dein Boot (blaues Dreieck) bewegt sich live
|
|
- OpenSeaMap Overlay (Tonnen, Fahrwasser, etc.)
|
|
- Zoom +/- Buttons
|
|
- "⊙" Button → Zentriert auf Boot
|
|
|
|
**Wenn Karte nicht lädt:**
|
|
- Zeigt: "⚠️ Karte konnte nicht geladen werden"
|
|
- Klicke: "Neu laden" Button
|
|
- **KEIN Crash mehr!** Dashboard läuft weiter.
|
|
|
|
---
|
|
|
|
### 🎵 Music Player (direkt im Overview)
|
|
|
|
**Du siehst den aktuellen Track:**
|
|
```
|
|
♫ Track Title
|
|
Artist Name
|
|
Album Name
|
|
━━━━━━━━━━━━━━━ 2:30 / 4:15
|
|
|
|
[⏮] [▶] [⏭]
|
|
```
|
|
|
|
**Controls:**
|
|
- `⏮` = Vorheriger Track
|
|
- `▶` = Play/Pause
|
|
- `⏭` = Nächster Track
|
|
- **Fortschrittsbalken** zeigt Position
|
|
|
|
**Musik starten:**
|
|
1. Gehe zu **Audio Tab** → "Radio" oder "Library"
|
|
2. Wähle einen Song/Sender
|
|
3. Player spielt ab → Zurück zu Overview
|
|
4. Steuerung funktioniert von Overview aus!
|
|
|
|
---
|
|
|
|
### 🔊 Audio Zonen (direkt im Overview)
|
|
|
|
**Du siehst alle 4 Boot-Zonen:**
|
|
```
|
|
╔════════════╗ ╔════════════╗
|
|
║ Salon ║ ║ Cockpit ║
|
|
║ 🔊 72% ║ ║ 🔊 58% ║
|
|
║ Mopidy ║ ║ Mopidy ║
|
|
╚════════════╝ ╚════════════╝
|
|
|
|
╔════════════╗ ╔════════════╗
|
|
║ Bug ║ ║ Heck ║
|
|
║ 🔇 Muted ║ ║ ⚪ Offline║
|
|
║ Spotify ║ ║ AirPlay ║
|
|
╚════════════╝ ╚════════════╝
|
|
```
|
|
|
|
**Jede Zone zeigt:**
|
|
- Name (Salon, Cockpit, Bug, Heck)
|
|
- Lautstärke (Slider)
|
|
- Audio-Quelle (Spotify/AirPlay/Mopidy)
|
|
- Mute-Button (🔊/🔇)
|
|
|
|
**Zone anpassen:**
|
|
1. **Lautstärke:** Schieberegler bewegen
|
|
2. **Mute:** Klick auf 🔊 Symbol
|
|
3. **Quelle wechseln:** Klick auf Source-Name (Dropdown)
|
|
|
|
**Alle Zonen gleichzeitig:**
|
|
- Für erweiterte Gruppen-Funktionen → **Audio Tab**
|
|
|
|
---
|
|
|
|
## 🎵 AUDIO TAB (Erweiterte Kontrolle)
|
|
|
|
**4 Sub-Tabs:**
|
|
|
|
### 1. **Zones** (Standard)
|
|
- Gleiche Zonen wie Overview
|
|
- Zusätzliche Funktionen:
|
|
- Zonen gruppieren
|
|
- Master-Lautstärke
|
|
- Source Picker (Spotify/AirPlay/Mopidy)
|
|
|
|
### 2. **Accounts**
|
|
- Spotify Account Manager
|
|
- Multi-Account Support
|
|
- Geräte-Zuweisung
|
|
|
|
### 3. **Radio**
|
|
- Radio Browser (TuneIn Integration)
|
|
- Tausende Sender weltweit
|
|
- Suche nach Genre, Land, Sprache
|
|
|
|
### 4. **Library**
|
|
- Lokale Musik-Bibliothek
|
|
- Playlists
|
|
- Track-Suche
|
|
|
|
---
|
|
|
|
## 🗺️ NAVIGATION TAB (Vollbild-Karte)
|
|
|
|
**Wann nutzen?**
|
|
- Wenn du die Karte groß brauchst
|
|
- Für Route-Planung
|
|
- Waypoint-Management
|
|
|
|
**Features:**
|
|
- Live-Position mit Kurs
|
|
- Track-Aufzeichnung (letzten 500 Punkte)
|
|
- Waypoints mit Entfernungsanzeige
|
|
- Info-Panel (Position, Heading, Speed, Distance)
|
|
|
|
**Keine Angst vor Crashes:**
|
|
- Falls Karte nicht lädt → Fehleranzeige + Reload-Button
|
|
- Dashboard bleibt stabil!
|
|
|
|
---
|
|
|
|
## ⚙️ SYSTEMS TAB
|
|
|
|
**Zeigt:**
|
|
- 🔋 Batterien (12V Starter + 24V House)
|
|
- ⚙️ Motor (RPM, Betriebsstunden, Kraftstoff)
|
|
- 🐳 Docker Services (Status aller Container)
|
|
|
|
---
|
|
|
|
## 🎯 WORKFLOW-BEISPIELE
|
|
|
|
### Beispiel 1: "Ich will Musik hören"
|
|
|
|
**Schnellstart:**
|
|
1. Öffne **Audio Tab** → **Radio**
|
|
2. Wähle einen Sender (z.B. "NDR 2")
|
|
3. Klick auf Play
|
|
4. Zurück zu **Overview** → Player läuft!
|
|
5. Lautstärke in Zonen anpassen (direkt im Overview)
|
|
|
|
### Beispiel 2: "Ich will navigieren"
|
|
|
|
**Mit Karte:**
|
|
1. **Overview Tab** → Klick auf "🗺️ Karte"
|
|
2. Karte zeigt deine Position live
|
|
3. Zoom mit +/- oder Scroll
|
|
4. "⊙" Button → Zentriert auf Boot
|
|
|
|
**Mit Instrumenten:**
|
|
1. **Overview Tab** → Klick auf "📊 Instrumente"
|
|
2. Siehst: Kompass, Geschwindigkeit, Tiefe, Wind
|
|
3. Alles auf einen Blick
|
|
|
|
### Beispiel 3: "Karte lädt nicht"
|
|
|
|
**Problem:**
|
|
- Karte zeigt nur Grau
|
|
- Oder: "⚠️ Karte konnte nicht geladen werden"
|
|
|
|
**Lösung:**
|
|
1. Prüfe Internet-Verbindung (Karte braucht OpenStreetMap)
|
|
2. Klick auf "Neu laden" Button
|
|
3. **ODER:** Nutze "📊 Instrumente" statt Karte
|
|
4. **Dashboard crasht NICHT mehr!**
|
|
|
|
---
|
|
|
|
## 💡 TIPPS & TRICKS
|
|
|
|
### Tipp 1: Overview als Haupt-Screen
|
|
- **Overview Tab** zeigt 90% von allem
|
|
- Du brauchst die anderen Tabs selten
|
|
- Perfekt für Kiosk-Modus auf dem Boot
|
|
|
|
### Tipp 2: Musik im Hintergrund
|
|
- Starte Musik im **Audio Tab** → Radio/Library
|
|
- Zurück zu **Overview**
|
|
- Player läuft weiter, Controls funktionieren
|
|
|
|
### Tipp 3: Zonen-Management
|
|
- **Schnell:** Lautstärke im Overview anpassen
|
|
- **Erweitert:** Audio Tab für Gruppierung
|
|
|
|
### Tipp 4: Karte zu klein?
|
|
- Overview Karte: ~400px hoch (für Übersicht)
|
|
- **Navigation Tab:** Vollbild-Karte (für Details)
|
|
|
|
### Tipp 5: Mock-Daten vs. Echte Daten
|
|
- **Dev Mode (jetzt):** Mock NMEA-Daten, simuliertes Boot
|
|
- **Boot Mode (später):** Echte GPS, echte Sensoren
|
|
- Dashboard funktioniert identisch!
|
|
|
|
---
|
|
|
|
## 🔧 TASTENKOMBINATIONEN
|
|
|
|
**Browser:**
|
|
- `F11` → Vollbild (Kiosk-Simulation)
|
|
- `Ctrl + R` → Seite neu laden (bei Problemen)
|
|
- `F12` → Developer Console (für Debugging)
|
|
|
|
---
|
|
|
|
## ⚠️ TROUBLESHOOTING
|
|
|
|
### Problem: "Karte zeigt nur grauen Hintergrund"
|
|
|
|
**Ursache:** OpenStreetMap-Tiles laden nicht
|
|
|
|
**Lösung:**
|
|
1. Prüfe Internet (http://tile.openstreetmap.org erreichbar?)
|
|
2. Klick auf "Neu laden" im Dashboard
|
|
3. Falls dauerhaft offline: Nutze "📊 Instrumente" Modus
|
|
|
|
### Problem: "Audio spielt nicht"
|
|
|
|
**Check:**
|
|
1. **Overview** → Ist im Player ein Track sichtbar?
|
|
2. **Audio Tab** → Zones → Sind Zonen verbunden (grün)?
|
|
3. **Mopidy:** Öffne http://localhost:6680/iris/ → Spielt dort?
|
|
4. Lautstärke > 0? Nicht gemuted?
|
|
|
|
### Problem: "Dashboard lädt nicht"
|
|
|
|
**Quick Fix:**
|
|
```powershell
|
|
# Services neu starten:
|
|
docker compose -f docker-compose.yml -f docker-compose.dev.yml restart
|
|
|
|
# Browser-Cache leeren:
|
|
Ctrl + Shift + Delete → "Cached Images" löschen
|
|
```
|
|
|
|
### Problem: "Position bewegt sich nicht"
|
|
|
|
**Das ist normal im Dev-Mode:**
|
|
- Mock-Daten simulieren langsame Fahrt (3-8 Knoten)
|
|
- Position ändert sich alle paar Sekunden
|
|
- Auf echtem Boot: Live GPS-Updates
|
|
|
|
---
|
|
|
|
## 🚢 DEPLOYMENT AUF BOOT (später)
|
|
|
|
**Wenn du das System aufs Boot bringst:**
|
|
1. Ubuntu Server Setup → Siehe `KIOSK_SETUP.md`
|
|
2. Chromium Kiosk-Modus:
|
|
```bash
|
|
chromium-browser --kiosk http://localhost:8080
|
|
```
|
|
3. Dashboard öffnet automatisch in **Overview Tab**
|
|
4. Touchscreen-Steuerung funktioniert
|
|
5. Alle Features identisch zu Dev!
|
|
|
|
---
|
|
|
|
## ✅ ZUSAMMENFASSUNG
|
|
|
|
### ✅ Was funktioniert jetzt:
|
|
- ✅ **Kein Crash** bei Karten-Fehler
|
|
- ✅ **Alles im Overview Tab** (Karte + Instrumente + Audio)
|
|
- ✅ **Music Player** direkt bedienbar
|
|
- ✅ **Audio-Zonen** direkt steuerbar
|
|
- ✅ **Kein App-Wechsel** mehr nötig
|
|
|
|
### 🎯 Dein Workflow:
|
|
1. **Dashboard öffnen:** http://localhost:8090
|
|
2. **Overview Tab** → Alles auf einen Blick
|
|
3. **Karte/Instrumente** → Toggle je nach Bedarf
|
|
4. **Musik starten** → Audio Tab → Radio/Library
|
|
5. **Zonen anpassen** → Direkt im Overview
|
|
|
|
### 💡 Wichtig:
|
|
- **Kein Snapcast Web UI** mehr nötig → Alles im Dashboard!
|
|
- **Kein Mopidy/Iris** mehr nötig → Player im Dashboard!
|
|
- **Kein SignalK UI** mehr nötig → Daten im Dashboard!
|
|
|
|
**→ Ein Dashboard, alles drin! 🚢⚓**
|