# WhatToPlay - Quick Start Guide

## 🚀 Schnelleinstieg (5 Minuten)

### 1. App öffnen

```bash
cd /Users/felixfoertsch/Developer/whattoplay
npm run dev
# Opens: http://localhost:5173
```

### 2. Settings-Tab öffnen

```
Navbar unten rechts → "Einstellungen" Tab
```

### 3. Steam integrieren (optional, funktioniert sofort)

```
Settings Tab
  ↓
Karte "🎮 Steam"
  ↓
"?" Button → Tutorial Modal
  ↓
Folge den 6 Schritten:
  1. https://steamcommunity.com/dev/apikey
  2. Login & Accept ToS
  3. API Key kopieren
  4. https://www.steamcommunity.com/
  5. Auf Namen klicken
  6. Steam ID aus URL kopieren (z.B. 76561197960434622)
  ↓
Eintragen → Speichern
  ↓
Library Tab → 1103 Games erscheinen!
```

---

## 🎮 Für jeden Service

### Steam ✅ (Funktioniert JETZT)

```
Difficulty: ⭐ Einfach
Time: 5 Minuten
Status: Voll funktionsfähig
```

### GOG ⚠️ (Funktioniert JETZT mit manuelem Token)

```
Difficulty: ⭐⭐ Mittel
Time: 10 Minuten
Status: Development-ready
Step: Tutorial → Browser DevTools → Token kopieren
```

### Blizzard ⚠️ (Funktioniert JETZT mit Credentials)

```
Difficulty: ⭐⭐ Mittel
Time: 10 Minuten
Status: Development-ready
Step: Docs → OAuth → Client ID + Secret
```

### Epic Games ⚠️ (Später, mit Backend)

```
Difficulty: ⭐⭐⭐ Schwer
Time: 30+ Minuten
Status: Needs Cloudflare Worker
Step: Warte auf Backend OAuth Proxy
```

### Amazon Games ⚠️ (Später, mit Backend)

```
Difficulty: ⭐⭐⭐ Schwer
Time: 30+ Minuten
Status: Needs Cloudflare Worker
Step: Warte auf Backend OAuth Proxy
```

---

## 💾 Config Management

### Export (Backup machen)

```
Settings Tab
  ↓
"📦 Daten-Management"
  ↓
"Config exportieren"
  ↓
whattoplay-config.json herunterladen
  ↓
(WARNUNG: Enthält sensitive Daten! Sicher lagern!)
```

### Import (Von anderem Device)

```
Settings Tab
  ↓
"📦 Daten-Management"
  ↓
"Config importieren"
  ↓
whattoplay-config.json auswählen
  ↓
✓ Alles wiederhergestellt!
```

---

## 🐛 Häufige Probleme

### "Keine Games angezeigt"

```
1. Settings-Tab überprüfen
2. Alle Felder gefüllt? ✓
3. Library-Tab laden lassen (30 Sekunden)
4. Browser-Konsole öffnen (F12) → Fehler checken
```

### "Steam ID nicht gültig"

```
❌ Richtig: 76561197960434622 (lange Nummer)
❌ Falsch: felixfoertsch (Name/Community ID)

→ Gehe zu https://www.steamcommunity.com/
→ Öffne dein Profil
→ URL ist: /profiles/76561197960434622/
→ Diese Nummer kopieren!
```

### "GOG Token abgelaufen"

```
Tokens laufen nach ~24h ab

→ Settings Tab
→ GOG Karte
→ Neuer Token aus Browser (Follow Tutorial)
→ Speichern
```

### "Blizzard sagt 'invalid client'"

```
1. Client ID/Secret überprüfen
2. Battle.net Developer Portal:
   https://develop.battle.net
3. "My Applications" öffnen
4. Correct Credentials kopieren
```

---

## 📱 Auf dem iPhone nutzen

### Option 1: Web App (Empfohlen)

```
1. iPhone Safari
2. Gehe zu https://whattoplay.vercel.app (später)
3. Teilen → Home Screen hinzufügen
4. App sieht aus wie native App!
```

### Option 2: Localhost (Development)

```
1. iPhone und Computer im gleichen WiFi
2. Computer IP: 192.168.x.x
3. iPhone Safari: 192.168.x.x:5173
4. Funktioniert auch ohne Internet (offline!)
```

---

## 🔄 Workflow zum Hinzufügen neuer Games

```
1. Spiel auf Steam/GOG/Epic spielen
2. Settings speichern (automatisch täglich?)
3. Library Tab öffnen
4. Neue Spiele erscheinen
5. Click auf Spiel → Details
6. Zu Playlist hinzufügen (später)
```

---

## 🎯 MVP vs. Production

### MVP (Jetzt, February 2026)

- ✅ Steam funktioniert perfekt
- ✅ Settings-Tab mit Tutorials
- ✅ GOG/Blizzard Development-ready
- ⚠️ Epic/Amazon nur placeholder
- ✅ Config Export/Import
- ✅ Offline funktional (localStorage)

### Production (März+ 2026)

- Cloudflare Worker deployen
- GOG/Blizzard OAuth automatisch
- Epic/Amazon manueller Import
- Home-Page Widgets
- Playlists Feature
- PWA + iOS App

---

## 📚 Dokumentation

| Datei                                                        | Inhalt               |
| ------------------------------------------------------------ | -------------------- |
| [FEATURES-OVERVIEW.md](./FEATURES-OVERVIEW.md)               | Was gibt es neues?   |
| [CLOUDFLARE-WORKERS-SETUP.md](./CLOUDFLARE-WORKERS-SETUP.md) | Backend deployen     |
| [BLIZZARD-SETUP.md](./BLIZZARD-SETUP.md)                     | Blizzard OAuth       |
| [GOG-SETUP.md](./GOG-SETUP.md)                               | GOG Token extraction |
| [IOS-WEB-STRATEGY.md](./IOS-WEB-STRATEGY.md)                 | Gesamtstrategie      |
| [ARCHITECTURE.md](./ARCHITECTURE.md)                         | Technische Details   |

---

## 💡 Pro Tipps

### Mehrere Accounts gleichzeitig

```
Browser-Profile nutzen:
  ↓
Chrome/Firefox: Neue Person/Profil
  ↓
Unterschiedliche config.local.json je Profil
  ↓
Vergleiche deine Bibliothek mit Freunden!
```

### Spiele schneller finden

```
Library Tab
  ↓
Suchleiste (zukünftig):
  - Nach Titel suchen
  - Nach Plattform filtern
  - Nach Länge sortieren
```

### Offline Modus

```
1. Settings speichern (einmalig online)
2. Dann brauchst du kein Internet mehr
3. Daten in localStorage gespeichert
4. Auf dem Flugzeug spielen? ✓ Funktioniert!
```

---

## 🚀 Nächste Schritte für dich

### Sofort testen

```bash
npm run dev
# → Settings Tab → Steam Tutorial folgen
```

### In 1 Woche

```
- GOG oder Blizzard einrichten
- Config exportieren
- Alle Games konsolidiert sehen
```

### In 2 Wochen

```
- Cloudflare Worker aufsetzen
- OAuth automatisieren
- Epic/Amazon hinzufügen (einfacher)
```

---

## ❓ Fragen?

Siehe `docs/` Ordner für detaillierte Guides:

```
docs/
  ├── FEATURES-OVERVIEW.md (Was gibt es neues?)
  ├── CLOUDFLARE-WORKERS-SETUP.md (Zero-Infra Backend)
  ├── BLIZZARD-SETUP.md (Blizzard OAuth)
  ├── GOG-SETUP.md (GOG Token)
  ├── IOS-WEB-STRATEGY.md (Gesamtvision)
  └── ARCHITECTURE.md (Tech Details)
```

---

**Viel Spaß mit WhatToPlay! 🎮**