refactor: Rename project order file and clean up file structure

- Rename project_order.json to order_project.json for consistency with order_ads.json naming convention - Update all references in ProjectService and ProjectsController
2025-09-14 11:26:09 +02:00
parent 233a952c04
commit 713a1156c4
5 changed files with 12 additions and 11 deletions
--- a/documentation/AREA_STRUCTURE.md
+++ b/documentation/AREA_STRUCTURE.md
@@ -0,0 +1,149 @@
+# Area Directory Structure
+
+Der `area/` Ordner enthält alle Projektdaten und Media-Dateien für die AdsPreview-Anwendung. Dieser Ordner ist aus Sicherheitsgründen und zur Größenreduzierung nicht im Git-Repository enthalten.
+
+## 📁 Verzeichnisstruktur
+
+```
+area/
+├── logins.json                          # Login-Konfiguration für Clients
+├── [Client-Name]/                        # Pro Client ein Ordner
+│   ├── order_project.json               # Reihenfolge der Projekte für den Client
+│   └── [Projekt-Name]/                   # Pro Projekt ein Ordner
+│       ├── index.php                    # Optional: Custom PHP für das Projekt
+│       ├── ads/                         # Werbemittel-Ordner
+│       │   ├── [Kampagne]/             # Kampagnen-Ordner
+│       │   │   ├── [Format]/           # Format-spezifische Dateien
+│       │   │   │   ├── [Größe]/        # Größen-spezifische Dateien
+│       │   │   │   │   ├── *.jpg       # Bilder
+│       │   │   │   │   ├── *.png       # Bilder
+│       │   │   │   │   ├── *.mp4       # Videos
+│       │   │   │   │   └── *.gif       # Animierte Bilder
+│       │   │   │   └── config.yaml     # Optional: HTML5-Konfiguration
+│       │   │   └── html/               # Optional: HTML5-Werbemittel
+│       │   │       ├── index.html      # HTML5-Anzeige
+│       │   │       └── assets/         # Zusätzliche Assets
+│       │   └── core/                   # Optional: Legacy PHP Core-Dateien
+│       └── setup/                      # Projekt-Konfiguration
+│           ├── setup.yaml              # Projekt-Setup-Konfiguration
+│           ├── logo.png                # Client-Logo
+│           ├── poster.jpg              # Projekt-Poster
+│           ├── showreel_close.svg      # Showreel-Icons
+│           └── showreel_dkt.png        # Showreel-Assets
+└── AllScreens/                         # Spezielle AllScreens-Projekte
+    └── [Projekt-Name]/                 # Struktur wie bei Client-Projekten
+```
+
+## 🔧 Konfigurationsdateien
+
+### `area/logins.json`
+Definiert die verfügbaren Clients und deren Zugriffsdaten:
+
+```json
+{
+  "clients": [
+    {
+      "name": "ClientName",
+      "folder": "ClientFolder",
+      "password": "client_password"
+    }
+  ]
+}
+```
+
+### `area/[Client]/order_project.json`
+Definiert die Reihenfolge der Projekte für einen Client:
+
+```json
+{
+  "order_project": [
+    "Projekt1",
+    "Projekt2", 
+    "Projekt3"
+  ]
+}
+```
+
+### `area/[Client]/[Projekt]/setup/setup.yaml`
+Projekt-spezifische Konfiguration:
+
+```yaml
+project_name: "Projektname"
+client: "Client Name"
+description: "Projektbeschreibung"
+showreel_enabled: true
+poster_image: "poster.jpg"
+logo_image: "logo.png"
+```
+
+## 📂 Beispiel-Struktur
+
+```
+area/
+├── logins.json
+├── Paramount/
+│   ├── order_project.json
+│   ├── Mission_Impossible_7/
+│   │   ├── ads/
+│   │   │   ├── Kinobanner/
+│   │   │   │   ├── Cineplex/
+│   │   │   │   │   └── Powerbanner_1420x420/
+│   │   │   │   │       ├── PARA_MI7_Cineplex_PB_1420x420_Datum.jpg
+│   │   │   │   │       └── PARA_MI7_Cineplex_PB_1420x420_Jetzt.jpg
+│   │   │   │   └── Cinestar/
+│   │   │   └── Programmatic/
+│   │   │       ├── Billboard/
+│   │   │       │   └── 800x250/
+│   │   │       │       ├── config.yaml
+│   │   │       │       └── html/
+│   │   │       │           ├── index.html
+│   │   │       │           ├── bg.jpg
+│   │   │       │           └── assets/
+│   │   │       └── HPA/
+│   │   └── setup/
+│   │       ├── setup.yaml
+│   │       ├── logo.png
+│   │       └── poster.jpg
+│   └── HE_Lioness_S2/
+└── Studiocanal/
+    └── HE_We_Live_in_Time/
+```
+
+## 🎯 Wichtige Hinweise
+
+### Datei-Namenskonventionen:
+- **Ordnernamen**: Keine Leerzeichen, verwende `_` oder `-`
+- **Dateinamen**: Beschreibende Namen mit Client-Präfix
+- **Bildformate**: JPG, PNG, GIF unterstützt
+- **Videoformate**: MP4 empfohlen
+
+### Dateigröße-Optimierung:
+- **Bilder**: Komprimierte Versionen mit `_sz.jpg` Suffix für kleinere Dateien
+- **Videos**: Web-optimierte MP4-Dateien
+- **Thumbnails**: Kleine Preview-Versionen für Listen-Ansichten
+
+### HTML5-Werbemittel:
+- **config.yaml**: Definiert Einstellungen für interaktive Anzeigen
+- **index.html**: Haupt-HTML-Datei
+- **Assets**: Alle zusätzlichen Dateien (CSS, JS, Bilder)
+
+## 🔒 Sicherheit
+
+- Der `area/` Ordner ist in `.gitignore` ausgeschlossen
+- Keine sensiblen Daten in Dateinamen verwenden
+- Regelmäßige Backups des `area/` Ordners erstellen
+- Zugriffskontrolle über `logins.json` verwalten
+
+## 📋 Setup-Checkliste
+
+1. ✅ `area/` Ordner im Projekt-Root erstellen
+2. ✅ `logins.json` mit Client-Daten anlegen
+3. ✅ Client-Ordner erstellen
+4. ✅ `order_project.json` für jeden Client
+5. ✅ Projekt-Ordner mit `setup/` Verzeichnis
+6. ✅ `ads/` Struktur nach Kampagnen organisieren
+7. ✅ Media-Dateien hochladen und testen
+
+---
+
+💡 **Tipp**: Verwende die Admin-Oberfläche der AdsPreview-Anwendung zur einfachen Verwaltung von Clients und Projekten.
--- a/documentation/DEPLOYMENT.md
+++ b/documentation/DEPLOYMENT.md
@@ -0,0 +1,232 @@
+# 🚀 Deployment Guide
+
+## 📂 Wichtige Dokumentation
+- **[Area Structure Guide](AREA_STRUCTURE.md)**: Aufbau des `area/` Verzeichnisses mit Projektdaten
+- **[Deployment Scripts](deployment/scripts/README.md)**: Sichere Upload-Skripte mit `.env.upload`
+
+## 🏠 Lokale Entwicklungsumgebung
+
+### Voraussetzungen
+- **Node.js 16+** und **npm**
+- **PHP 8.0+** (für lokalen Backend-Server)
+- **Git** (für Versionskontrolle)
+
+### Projekt Setup
+```bash
+# Repository klonen
+git clone <deine-gitea-url>
+cd adspreview_react
+
+# Frontend Dependencies installieren
+cd frontend/
+npm install
+```
+
+### Lokalen Development Server starten
+```bash
+# Im frontend/ Ordner
+npm run start:all
+```
+
+Dieser Befehl startet **beide Server gleichzeitig**:
+- **React Development Server**: http://localhost:3000
+- **PHP Backend Server**: http://localhost:8000
+
+### Was passiert beim `npm run start:all`?
+- Startet React App mit Live-Reload auf Port 3000
+- Startet PHP Built-in Server auf Port 8000 für das Backend
+- Verwendet `concurrently` um beide Prozesse parallel zu verwalten
+- React App ist über Proxy mit PHP Backend verbunden
+
+### Entwicklungsumgebung Features
+- ✅ **Hot Reload**: Änderungen werden sofort sichtbar
+- ✅ **API Proxy**: React App kommuniziert automatisch mit PHP Backend
+- ✅ **Echte Daten**: Verwendet lokale JSON-Dateien als Datenbank
+- ✅ **Debugging**: Console-Logs und Entwicklertools verfügbar
+
+### Lokale URLs
+- **Frontend**: http://localhost:3000 (React App)
+- **Backend API**: http://localhost:8000/api/* (PHP Endpoints)
+- **Files**: http://localhost:8000/area/* (Projekt-Dateien)
+
+### Stoppen der Entwicklungsserver
+Drücke `Ctrl+C` im Terminal um beide Server zu stoppen.
+
+---
+
+## Webspace Anforderungen
+
+### ✅ Minimum Requirements
+- **PHP 8.3+**
+- **500 MB+ Speicherplatz** (je nach Projektgröße)
+- **Schreibrechte** für PHP (für Storage-Ordner)
+- **URL Rewriting** (mod_rewrite für Apache)
+
+### 📁 Webspace Struktur
+```
+public_html/ (oder htdocs/)
+├── index.html              # React App Entry Point
+├── static/                 # CSS, JS, Media Files
+├── area/                   # Client Project Files
+│   ├── Paramount/
+│   ├── Studiocanal/
+│   └── order_project.json
+├── api/                    # PHP Backend
+├── storage/                # User Data (needs write permissions!)
+│   └── data/
+│       ├── admins.json
+│       ├── viewers.json
+│       └── clients.json
+└── vendor/                 # PHP Dependencies
+```
+
+## 🔧 Deployment Prozess
+
+### 1. Setup (einmalig)
+```bash
+cd deployment/scripts/
+./setup.sh
+```
+
+### 2. Production Build erstellen
+```bash
+cd deployment/scripts/
+./deploy.sh
+```
+
+### 3. Upload auf Webspace
+```bash
+cd deployment/scripts/
+
+#### Option A: FTP Client (FileZilla, WinSCP, etc.)
+1. Öffne deinen FTP Client
+2. Verbinde zu deinem Webspace
+3. Navigiere zu `public_html/` oder `htdocs/`
+4. Uploade den kompletten Inhalt von `backend/`
+
+#### Option B: Command Line (automatisiert)
+```bash
+cd scripts/
+nano upload.sh  # Konfiguriere FTP-Zugangsdaten
+./upload.sh
+```
+
+### 4. Webspace Konfiguration
+
+#### .htaccess für URL Rewriting
+Erstelle eine `.htaccess` Datei im Root-Verzeichnis:
+```apache
+RewriteEngine On
+
+# API Routes zu index.php weiterleiten
+RewriteCond %{REQUEST_URI} ^/api/
+RewriteRule ^(.*)$ index.php [QSA,L]
+
+# React Router: Alle anderen Requests zu index.html
+RewriteCond %{REQUEST_FILENAME} !-f
+RewriteCond %{REQUEST_FILENAME} !-d
+RewriteRule . index.html [L]
+```
+
+#### Ordner-Berechtigungen setzen
+```bash
+# Via FTP Client oder SSH
+chmod 755 storage/
+chmod 755 storage/data/
+chmod 644 storage/data/*.json
+```
+
+## 🔒 Sicherheit
+
+### Sensible Dateien schützen
+Erstelle `.htaccess` in `storage/`:
+```apache
+# Zugriff auf Storage-Dateien verbieten
+<Files "*.json">
+    Order allow,deny
+    Deny from all
+</Files>
+```
+
+### Environment Variablen (optional)
+Erstelle `.env` im Backend-Root:
+```
+BACKEND_URL=https://deine-domain.de
+JWT_SECRET=dein-super-sicherer-schlüssel
+```
+
+## 🎯 Live-Betrieb
+
+### Domain Setup
+- **Subdomain**: `adspreview.deine-domain.de`
+- **Hauptdomain**: `deine-domain.de/adspreview/`
+
+### SSL/HTTPS
+- Aktiviere SSL in deinem Webspace-Panel
+- Moderne Browser benötigen HTTPS für JWT-Tokens
+
+### Backup Strategy
+```bash
+# Regelmäßige Backups der User-Daten
+tar -czf backup_$(date +%Y%m%d).tar.gz storage/data/ area/
+```
+
+## 🛠️ Troubleshooting
+
+### Häufige Probleme:
+
+1. **"404 Not Found" bei API-Calls**
+   → Prüfe URL Rewriting (.htaccess)
+
+2. **"Permission denied" beim Login**
+   → Prüfe Schreibrechte auf storage/
+
+3. **React App lädt nicht**
+   → Prüfe BACKEND_URL in der Konfiguration
+
+4. **Uploads funktionieren nicht**
+   → Prüfe PHP upload_max_filesize und post_max_size
+
+### Debug-Modus aktivieren
+In `backend/public/index.php`:
+```php
+// Temporär für Debugging
+error_reporting(E_ALL);
+ini_set('display_errors', 1);
+```
+
+## 📊 Performance Optimierung
+
+### Gzip Compression
+In `.htaccess`:
+```apache
+# Komprimierung aktivieren
+<IfModule mod_deflate.c>
+    AddOutputFilterByType DEFLATE text/html text/css text/javascript application/javascript application/json
+</IfModule>
+```
+
+### Caching Headers
+```apache
+# Browser-Caching für statische Dateien
+<IfModule mod_expires.c>
+    ExpiresActive on
+    ExpiresByType text/css "access plus 1 month"
+    ExpiresByType application/javascript "access plus 1 month"
+    ExpiresByType image/png "access plus 1 month"
+    ExpiresByType image/jpg "access plus 1 month"
+</IfModule>
+```
+
+## ✅ Deployment Checklist
+
+- [ ] PHP 8.3+ verfügbar
+- [ ] Skripte ausgeführt (`setup.sh` → `deploy.sh`)
+- [ ] Backend-Ordner hochgeladen
+- [ ] .htaccess konfiguriert
+- [ ] Berechtigungen gesetzt
+- [ ] SSL aktiviert
+- [ ] Admin-User angelegt
+- [ ] Test-Login erfolgreich
+
+**Anwendung ist live! 🎉**