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 (NaCl box.before + secretbox)	Hoch	✅ Fertig
PoW Captcha (Server-seitig)	Mittel	✅ Fertig
Monero MultiSig	Sehr hoch	🔲 Offen
Rating-System	Mittel	🔲 Offen
2FA	Mittel	🔲 Offen

⚠️ Kritische Punkte

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
Rechtliche Aspekte
- AGB, Datenschutz, Impressum erforderlich
- Geldwäsche-Regularien (je nach Jurisdiktion)
- Haftung bei Betrug klären
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

Services

Directus Backend: api.dgray.io (Docker)
PoW Captcha + Payment Proxy: pow.dgray.io (PHP, HMAC-signierte Challenges, BTCPay Proxy + Webhook, OG Meta Proxy)
BTCPay Server: pay.xmr.rocks (Monero-Zahlungen, Trocador-Plugin)
TweetNaCl: Self-hosted in js/vendor/ (E2E-Verschlüsselung)

Infrastruktur (geplant)

monero-wallet-rpc
Push-Benachrichtigungen

🚀 Setup

Voraussetzungen

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

Installation

# 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

Deployment

Für Produktion werden nur diese Dateien benötigt:

├── index.html
├── manifest.json
├── service-worker.js
├── favicon.png
├── js/
├── css/
├── locales/
└── assets/

Nicht deployen: tests/, docs/, AGENTS.md, README.md, .git/, deploy.sh

Build (Minifizierung)

# Einmalig: Dependencies installieren
pip3 install rjsmin rcssmin

# Build ausführen (erstellt dist/ mit minifizierten Dateien)
python3 build.py

Das Build-Script minifiziert alle JS- und CSS-Dateien (~111 KiB Ersparnis) und kopiert alles nach dist/.

Deploy via Script

# Einmalig: SSH-User und Pfad anpassen
./deploy.sh user@dgray.io /home/user/web/dgray.io/public_html

# Oder Defaults im Script setzen und einfach:
./deploy.sh

Das Script führt automatisch python3 build.py aus, dann rsync von dist/ zum Server.

Voraussetzungen:

Python 3 + rjsmin + rcssmin (für Build)
SSH-Key-Authentifizierung zum Server
rsync lokal und auf dem Server installiert

Tests ausführen

# Server starten
python3 -m http.server 8080

# Im Browser öffnen
# http://localhost:8080/tests/

Die Tests laufen im Browser und nutzen einen minimalen Test-Runner ohne externe Dependencies.

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 (box.before + secretbox)
│   │   ├── currency.js     # XMR/Fiat Umrechnung
│   │   ├── pow-captcha.js  # PoW Captcha (Server-first, lokaler Fallback)
│   │   ├── btcpay.js       # BTCPay Server Integration (Invoice, Checkout)
│   │   ├── favorites.js    # Favoriten (localStorage + Directus Sync)
│   │   └── notifications.js# Benachrichtigungen (Polling, Badge)
│   ├── vendor/
│   │   ├── nacl-fast.min.js    # TweetNaCl (self-hosted)
│   │   ├── nacl-util.min.js    # TweetNaCl Utils
│   │   └── cropper.min.js      # Image Cropper
│   └── 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
├── tests/
│   ├── index.html          # Test-Runner UI
│   ├── test-runner.js      # Test-Framework
│   └── *.test.js           # Unit Tests
└── assets/
    └── fonts/              # Self-hosted Fonts

📋 Offene Punkte / Roadmap

Phase 1: MVP Frontend

Projektstruktur
Routing
i18n (DE/EN/FR)
Light/Dark Mode
PWA Grundgerüst
Startseite mit Suche, Kategorien, Listings-Grid
Typografie (Inter + Space Grotesk)
Such-Komponente mit Accordion-Kategorien
Anzeige-Detailseite mit Bildergalerie
Anzeige-Erstellen-Formular
Suchseite mit Filtern (merged in Home)
Skeleton Loading, Error Boundary, Offline Indicator
Lazy Loading für Bilder
Responsive Optimierungen

Phase 2: Backend-Integration ⬅️ Aktuell

Directus aufsetzen (api.dgray.io)
Listings-Collection (CRUD)
Categories mit Übersetzungen
User-Auth (UUID + SHA-256 Hash, anonym)
Bilder-Upload (Junction-Table)
API-Services (directus.js, listings.js, categories.js, locations.js)
Directus Public-Berechtigungen (siehe docs/DIRECTUS-SCHEMA.md)
Neue Seiten: Favoriten, Meine Anzeigen, Nachrichten, Einstellungen
Listings bearbeiten (Edit-Modus für eigene Anzeigen)

Phase 3: Kommunikation & Sicherheit

Chat-System (E2E-verschlüsselt mit NaCl box.before + secretbox)
Conversations/Messages Services
Merkliste (Favoriten-Seite)
Favoriten Directus-Sync (Union-Merge bei Login, localStorage-Fallback)
PoW Captcha (server-seitig via pow.dgray.io, HMAC-signiert)
TweetNaCl self-hosted (kein CDN)
In-App Benachrichtigungen (Notifications-Service, Glocke mit Badge)
Open Graph & X Card Meta-Tags (dynamisch pro Listing)
Push-Benachrichtigungen (Web Push API)

Phase 4: Payments

XMR-Kursabfrage API (CoinGecko)
Fiat ↔ XMR Umrechnung (Dual-Preis-Anzeige)
BTCPay Server Integration (pay.xmr.rocks, Proxy auf pow.dgray.io)
Listing-Gebühr: 1 EUR/USD/CHF/GBP (200 JPY) via Monero
Webhook für Auto-Publish nach Blockchain-Confirmation
Expired Listings (Directus Flow, Status-Badges auf Cards)
Token-Refresh bei Tab-Visibility-Change
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

Feature-Branch erstellen
Änderungen committen
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

Languages

JavaScript 94.2%

CSS 2.9%

HTML 2.4%

Python 0.4%

Shell 0.1%