# dgray.io

Eine anonyme, dezentrale Kleinanzeigen-Plattform mit Monero-Bezahlung.

## 🎯 Vision

dgray.io ermöglicht es Nutzern, Kleinanzeigen zu schalten und Waren/Dienstleistungen sicher über Monero (XMR) zu handeln. Besonderheiten:

- **Anonymität**: Nutzung ohne Account möglich
- **Käuferschutz**: Monero MultiSig Escrow
- **Dezentral**: Keine zentrale Zahlungsabwicklung
- **Privacy-First**: E2E-Verschlüsselung für Kommunikation

---

## 📊 Machbarkeitsanalyse

### Technisch realisierbar

| Feature | Komplexität | Status |
|---------|-------------|--------|
| Anzeigen CRUD | Niedrig | ✅ Fertig |
| Fiat/XMR Preisanzeige | Niedrig | ✅ Fertig |
| Anonyme Nutzung (UUID + Hash) | Mittel | ✅ Fertig |
| PWA | Mittel | ✅ Grundgerüst |
| Light/Dark Mode | Niedrig | ✅ Fertig |
| i18n (DE/EN/FR) | Niedrig | ✅ Fertig |
| Bildergalerie | Niedrig | ✅ Fertig |
| E2E-Chat | Hoch | 🔲 Vorbereitet |
| **Monero MultiSig** | **Sehr hoch** | 🔲 Offen |
| Rating-System | Mittel | 🔲 Offen |
| 2FA | Mittel | 🔲 Offen |

### ⚠️ Kritische Punkte

1. **Monero MultiSig Escrow**
   - Komplexeste Komponente
   - Erfordert eigene Wallet-Integration via `monero-wallet-rpc`
   - Nutzer müssen Wallet-Keys verwalten → UX-Hürde
   - Alternative für MVP: Trusted Escrow-Service

2. **Rechtliche Aspekte**
   - AGB, Datenschutz, Impressum erforderlich
   - Geldwäsche-Regularien (je nach Jurisdiktion)
   - Haftung bei Betrug klären

3. **E2E-Verschlüsselung**
   - Key-Management für anonyme Nutzer
   - Optionen: Signal-Protokoll, Matrix-Protokoll

---

## 🛠️ Tech-Stack

### Frontend (aktuell)
- **Vanilla JavaScript** (ES Modules)
- **Web Components** (Custom Elements)
- **CSS Custom Properties** (Theming)
- **PWA** (Service Worker, Manifest)

### Backend (geplant)
- **Directus** (Headless CMS)
  - REST/GraphQL API
  - Auth, Rollen, Berechtigungen
  - Custom Extensions für XMR-Integration

### Infrastruktur (geplant)
- PostgreSQL + Redis
- monero-wallet-rpc
- Matrix/Signal für Chat

---

## 🚀 Setup

### Voraussetzungen
- Moderner Browser mit ES Module Support
- Python 3 (für lokalen Server) oder beliebiger HTTP-Server

### Installation

```bash
# Repository klonen
git clone https://gitea.pro/schmidt1024/dgray.git
cd dgray

# Lokalen Server starten
python3 -m http.server 8080

# Oder mit Live-Reload (Node.js erforderlich)
npx live-server
```

Öffne http://localhost:8080

### Projektstruktur

```
dgray/
├── index.html              # Entry Point
├── manifest.json           # PWA Manifest
├── service-worker.js       # Offline-Support
├── css/
│   ├── fonts.css           # Web Fonts (Inter, Space Grotesk)
│   ├── variables.css       # Theming (Light/Dark)
│   ├── base.css            # Reset, Grundstyles
│   └── components.css      # UI-Komponenten
├── js/
│   ├── app.js              # App-Initialisierung
│   ├── router.js           # Hash-basiertes Routing
│   ├── i18n.js             # Übersetzungssystem
│   ├── services/
│   │   ├── directus.js     # Directus API Client
│   │   ├── auth.js         # UUID-Auth (SHA-256 Hash)
│   │   ├── listings.js     # Listings-Service
│   │   ├── categories.js   # Kategorien-Service
│   │   ├── locations.js    # Standorte-Service
│   │   ├── conversations.js# Zero-Knowledge Chat
│   │   ├── crypto.js       # NaCl Encryption
│   │   └── currency.js     # XMR/Fiat Umrechnung
│   └── components/
│       ├── app-shell.js    # Layout-Container
│       ├── app-header.js   # Header mit Navigation
│       ├── app-footer.js   # Footer
│       ├── auth-modal.js   # Login/Register Modal
│       ├── chat-widget.js  # E2E Chat Widget
│       └── pages/          # Seiten-Komponenten
├── locales/
│   ├── de.json             # Deutsch
│   ├── en.json             # English
│   └── fr.json             # Français
└── assets/
    └── fonts/              # Self-hosted Fonts
```

---

## 📋 Offene Punkte / Roadmap

### Phase 1: MVP Frontend
- [x] Projektstruktur
- [x] Routing
- [x] i18n (DE/EN/FR)
- [x] Light/Dark Mode
- [x] PWA Grundgerüst
- [x] Startseite mit Suche, Kategorien, Listings-Grid
- [x] Typografie (Inter + Space Grotesk)
- [x] Such-Komponente mit Accordion-Kategorien
- [x] Anzeige-Detailseite mit Bildergalerie
- [x] Anzeige-Erstellen-Formular
- [ ] Suchseite mit Filtern
- [ ] Responsive Optimierungen

### Phase 2: Backend-Integration ⬅️ **Aktuell**
- [x] Directus aufsetzen (`api.dgray.io`)
- [x] Listings-Collection (CRUD)
- [x] Categories mit Übersetzungen
- [x] User-Auth (UUID + SHA-256 Hash, anonym)
- [x] Bilder-Upload (Junction-Table)
- [x] API-Services (`directus.js`, `listings.js`, `categories.js`, `locations.js`)
- [ ] Directus Public-Berechtigungen vervollständigen

### Phase 3: Kommunikation
- [ ] Chat-System (E2E-verschlüsselt)
- [ ] Benachrichtigungen
- [ ] Merkliste

### Phase 4: Payments
- [ ] XMR-Kursabfrage API
- [ ] Fiat ↔ XMR Umrechnung
- [ ] Wallet-Anbindung (monero-wallet-rpc)
- [ ] MultiSig Escrow

### Phase 5: Trust & Safety
- [ ] Rating-System
- [ ] 2FA
- [ ] Reporting/Moderation
- [ ] AGB, Datenschutz

---

## 🎨 Design-Entscheidungen

### Typografie
- **Headlines**: Space Grotesk (Medium, Bold)
- **Body**: Inter (Regular, Medium, SemiBold, Bold)
- Self-hosted Fonts (SIL Open Font License)

### Farbpalette
- **Monochrome Theme** - reine Graustufen
- **Light Mode**: BG #FAFAFA, Text #1A1A1A, Primary #555555
- **Dark Mode**: BG #141414, Text #F0F0F0, Primary #AAAAAA

### Mobile-First
- Responsive Grid (2 Spalten Mobile, 5 Spalten Desktop)
- Touch-optimierte Buttons
- Icon-only Buttons auf kleinen Screens

---

## 🤝 Contributing

1. Feature-Branch erstellen
2. Änderungen committen
3. Pull Request öffnen

### Code-Konventionen
- ES Modules verwenden
- Web Components für UI-Komponenten
- CSS Custom Properties für Theming
- Übersetzungsschlüssel für alle Texte
- Keine Semikolons in JavaScript (außer for-loops, CSS)
- Englische Kommentare im Code

---

## 📄 Lizenz

TBD

---

## 📞 Kontakt

TBD