From aa86001760a0c02073f78d0acacbb42fc7989f6c Mon Sep 17 00:00:00 2001 From: Lars Gebhardt-Kusche Date: Tue, 28 Jul 2026 02:03:01 +0200 Subject: [PATCH] avatar --- .projektstructure.txt | 14 +- PROJECT_CONTEXT.md | 18 +- README.md | 19 +- config/avatar.php | 28 ++ partials/landing/account/dashboard.php | 133 +++++---- partials/landing/community/index.php | 4 +- partials/landing/community/thread.php | 4 +- partials/structure/nav.php | 8 +- public/api/avatar.php | 56 +--- public/assets/js/app.js | 193 ++++++++----- public/page/api/avatar.php | 58 +--- public/page/datenschutz.php | 7 +- schema.sql | 3 + src/App/AccountPages.php | 16 +- src/App/Avatar/AvatarManager.php | 369 +++++++++++++++++++++++++ src/App/Avatar/Lorelei.php | 219 ++++++++------- src/App/Community.php | 30 +- src/App/ProfileSettings.php | 33 ++- 18 files changed, 827 insertions(+), 385 deletions(-) create mode 100644 config/avatar.php create mode 100644 src/App/Avatar/AvatarManager.php diff --git a/.projektstructure.txt b/.projektstructure.txt index f6a7da1..91aecdc 100755 --- a/.projektstructure.txt +++ b/.projektstructure.txt @@ -1,13 +1,17 @@ Anweisung: Projektstruktur (Basis-Template) wie in „papa-kind-treff“ Aktueller Projektstand -- Papa-Kind-Treff nutzt im Mitgliederbereich DiceBear `lorelei` über einen internen API-Proxy mit lokalem Cache. -- Relevante Logik liegt in `src/App/Avatar/Lorelei.php`. +- Papa-Kind-Treff nutzt im Mitgliederbereich eine Mehr-Style-Avatar-Architektur auf Basis von DiceBear. +- Die zentrale Avatar-Verwaltung liegt in `src/App/Avatar/AvatarManager.php`. +- Der aktuell aktive Style liegt in `src/App/Avatar/Lorelei.php`. +- Die Avatar-Konfiguration liegt in `config/avatar.php`. - Der Avatar-Proxy liegt unter `public/api/avatar.php`. - Die visuelle Avatar-Konfiguration liegt im Dashboard-Modal unter `partials/landing/account/dashboard.php` und rendert Komponenten-Vorschauen live nach. -- Der Generator besitzt einen Button `Random Profilbild`, der Seed und Varianten zufällig neu setzt. -- Beim Oeffnen des Modals werden nur die Bilder des aktiven Tabs geladen; weitere Tabs laden ihre Varianten erst beim Wechsel nach. -- Alte statische Avatar-Presets und frühere Layer-Assets sind entfernt; aktiv ist nur noch der Lorelei-Generator. +- Der Generator speichert `avatar_style`, `avatar_seed` und `avatar_config_json` generisch im Profil. +- Gespeicherte Benutzer-Avatare werden lokal unter `public/assets/avatars/users/ptk-.svg` abgelegt und bei Änderungen überschrieben. +- Der Generator besitzt einen Button `Random Profilbild`, der Seed und Varianten des aktiven Styles zufällig neu setzt. +- Beim Oeffnen des Modals werden nur die Bilder des aktiven Styles und Tabs geladen; weitere Tabs laden ihre Varianten erst beim Wechsel nach. +- Alte statische Avatar-Presets und frühere Layer-Assets sind entfernt. - Änderungen an Funktionen mit Cookies, LocalStorage, SessionStorage, Geolocation, Tracking oder Drittanbietern müssen immer auch in Datenschutz-/Cookie-Hinweisen und im Consent-Flow berücksichtigt werden. Ziel diff --git a/PROJECT_CONTEXT.md b/PROJECT_CONTEXT.md index d6b2135..b6d91f0 100644 --- a/PROJECT_CONTEXT.md +++ b/PROJECT_CONTEXT.md @@ -11,8 +11,10 @@ Papa-Kind-Treff ist eine PHP-basierte Plattform für Väter. Kernbereiche sind l - Geschäftslogik unter `src/App/` - MySQL/MariaDB-Schema in `schema.sql` - Globales Frontend vor allem über `public/assets/js/app.js` und `public/assets/css/app.css` -- Avatar-Style `Lorelei` liegt getrennt unter `src/App/Avatar/Lorelei.php` -- Der Avatar-Endpunkt ist als direkte Datei unter `public/api/avatar.php` angebunden und laeuft bewusst ohne App-Bootstrap. +- Avatar-Manager liegt zentral unter `src/App/Avatar/AvatarManager.php` +- Der aktive Style `Lorelei` liegt getrennt unter `src/App/Avatar/Lorelei.php` +- Die Avatar-Konfiguration liegt in `config/avatar.php` +- Der Avatar-Endpunkt ist als direkte Datei unter `public/api/avatar.php` angebunden und laeuft bewusst ohne vollen App-Bootstrap. ## Wichtige Produktentscheidungen - Die Ansprache im Frontend soll immer den aktuellen Nutzer direkt ansprechen. @@ -21,17 +23,17 @@ Papa-Kind-Treff ist eine PHP-basierte Plattform für Väter. Kernbereiche sind l - Die Community ist hierarchisch aufgebaut: Kategorien -> Boards -> Threads -> Posts. - Moderation ist getrennt vom normalen Community-Frontend in einem eigenen Adminbereich. - Standortfunktionen sind relevant für lokale Treffen und werden künftig weiter ausgebaut. -- Profilbilder werden aktuell über DiceBear im Stil `lorelei` serverseitig erzeugt und lokal gecacht. -- Der Avatar-Editor bietet aktuell visuelle Komponenten-Vorschauen statt reiner Text-Dropdowns. -- Frühere statische Preset-Avatar-Assets wurden entfernt; der aktuelle Stand nutzt nur noch den Generator mit Proxy/Cache. +- Profilbilder werden aktuell über die Mehr-Style-Architektur serverseitig erzeugt; aktiv ist derzeit `lorelei`. +- Stil, Seed und Varianten werden generisch im Profil gespeichert; das fertige SVG wird lokal pro Benutzer unter `ptk-.svg` abgelegt. +- Der Avatar-Editor bietet visuelle Komponenten-Vorschauen statt reiner Text-Dropdowns und laedt nur den aktiven Style/Tab nach. ## Navigation / Konto - Eingeloggte Nutzer sehen rechts ein Profil-Menü statt einzelner `Dashboard`-/`Logout`-Buttons. - Das Profil-Menü enthält aktuell `Profil`, `Kinder`, `Termine`, `Community`, `Einstellungen`, `Abmelden`. - Der Mitgliederbereich selbst ist als Layout mit linker Bereichsnavigation aufgebaut. - Im Profil kann der Nutzer aktuell Komponenten wie Augen, Augenbrauen, Mund, Brille, Haare, Bart und Ohrringe direkt per Vorschaubild auswählen. -- Der Button `Random Profilbild` setzt Seed und Varianten zufaellig neu und aktualisiert die Vorschau sofort. -- Beim Oeffnen des Avatar-Generators wird nur der aktive Komponenten-Tab geladen; weitere Varianten werden erst beim Tabwechsel nachgeladen. +- Der Button `Random Profilbild` setzt Seed und Varianten des aktiven Styles zufaellig neu und aktualisiert die Vorschau sofort. +- Beim Oeffnen des Avatar-Generators wird nur der aktive Style-/Komponenten-Tab geladen; weitere Varianten werden erst beim Wechsel nachgeladen. - Debug ist kein Menüpunkt und erscheint nur als Floating-Käfer für `site_admin` bei aktivem Debug-Modus. ## Community und Rechte @@ -59,7 +61,7 @@ Papa-Kind-Treff ist eine PHP-basierte Plattform für Väter. Kernbereiche sind l ## Doku-Regel Bei jeder künftigen Änderung müssen mindestens diese Dateien mitgeprüft werden: - `README.md` -- `.projectstructure.txt` +- `.projektstructure.txt` - `PROJECT_CONTEXT.md` Wenn Cookies, LocalStorage, SessionStorage, Tracking, Geolocation oder Drittanbieter neu hinzukommen oder geändert werden, müssen zusätzlich Consent und rechtliche Hinweise angepasst werden. diff --git a/README.md b/README.md index fa8aef7..1ba55f0 100644 --- a/README.md +++ b/README.md @@ -17,9 +17,10 @@ Papa-Kind-Treff ist eine PHP-basierte Plattform für Väter mit Fokus auf lokale - Impressum, Datenschutz-&-Cookies-Seite und Über-uns - standortbasierte Sortierung für die neuesten Treffen - eigener Einstellungsbereich für Standortfreigabe, Browser-Hinweise und Consent-Verwaltung -- modernes Avatar-System auf Basis von DiceBear `lorelei`, serverseitig über einen lokalen Proxy mit Cache ausgeliefert -- Profilbild-Generator mit visueller Komponenten-Auswahl für Augen, Augenbrauen, Mund, Brille, Haare, Bart und Ohrringe sowie einem `Random Profilbild`-Button -- keine statischen Avatar-Preset-Dateien mehr im Repository; Vorschau und Auswahl laufen vollständig über den Lorelei-Generator +- modernes Avatar-System mit zentraler Mehr-Style-Architektur auf Basis von DiceBear +- aktiver Avatar-Style aktuell: `lorelei`; weitere Styles können über `config/avatar.php` freigeschaltet werden +- Profilbild-Generator mit visueller Komponenten-Auswahl, generischem Style-/Seed-/Config-Speichermodell und `Random Profilbild` +- jedes gespeicherte Profilbild wird als lokale Benutzer-SVG unter `public/assets/avatars/users/ptk-.svg` abgelegt - Consent-Manager für Analyse und externe Dienste - Navigation aktuell mit `Home`, `Suche`, `Community` - eingeloggte Nutzer sehen rechts ein Profil-Menü mit Direktlinks zu `Profil`, `Kinder`, `Termine`, `Community`, `Einstellungen` @@ -39,10 +40,12 @@ Papa-Kind-Treff ist eine PHP-basierte Plattform für Väter mit Fokus auf lokale - `owner` Die Rechteverteilung und Community-Logik sind in `src/App/CommunityAccess.php` abgebildet. -Die Lorelei-Avatarlogik liegt in `src/App/Avatar/Lorelei.php`. +Die zentrale Avatar-Verwaltung liegt in `src/App/Avatar/AvatarManager.php`. +Der aktuell aktive Style `Lorelei` liegt in `src/App/Avatar/Lorelei.php`. +Die Style-/Storage-Konfiguration liegt in `config/avatar.php`. Der direkte Avatar-Endpunkt liegt in `public/api/avatar.php`. Die visuelle Avatar-Auswahl sitzt im Dashboard-Modal in `partials/landing/account/dashboard.php`. -Beim Oeffnen des Generators werden nur die Varianten des aktuell aktiven Tabs geladen; weitere Tabs laden erst beim Wechsel nach. +Beim Oeffnen des Generators werden nur die Varianten des aktuell aktiven Styles und Tabs geladen; weitere Varianten werden erst beim Wechsel nachgeladen. ## Consent und rechtlich relevante Integrationen Der aktuelle Code nutzt oder kann nutzen: @@ -52,7 +55,7 @@ Der aktuelle Code nutzt oder kann nutzen: - lokale Standortspeicherung via Cookie, `localStorage`, `sessionStorage` (`external_services`) - Leaflet von `unpkg.com` (`external_services`) - OpenStreetMap Nominatim (`external_services`) -- DiceBear `lorelei` für serverseitig erzeugte Profilbilder +- DiceBear fuer serverseitig erzeugte Profilbilder; das Ergebnis wird lokal als Benutzer-SVG gespeichert Wichtig: - Nicht notwendige Analyse- und Drittanbieterfunktionen dürfen erst nach Einwilligung aktiv werden. @@ -61,7 +64,7 @@ Wichtig: ## Dokumentationspflicht bei Änderungen Bei jeder Änderung im Projekt immer mitprüfen und bei Bedarf aktualisieren: - `README.md` -- `.projectstructure.txt` +- `.projektstructure.txt` - `PROJECT_CONTEXT.md` Zusätzlich bei neuen Cookies, Tracking-Mechanismen oder Drittanbietern: @@ -72,5 +75,5 @@ Zusätzlich bei neuen Cookies, Tracking-Mechanismen oder Drittanbietern: ## Dateien für neue Chats Für spätere Chats als Einstieg besonders wichtig: - `README.md` -- `.projectstructure.txt` +- `.projektstructure.txt` - `PROJECT_CONTEXT.md` diff --git a/config/avatar.php b/config/avatar.php new file mode 100644 index 0000000..6851022 --- /dev/null +++ b/config/avatar.php @@ -0,0 +1,28 @@ + [ + 'base_url' => 'https://api.dicebear.com', + 'version' => '10.x', + 'timeout' => 2, + 'user_agent' => 'Papa-Kind-Treff/1.0', + ], + 'storage' => [ + 'cache_dir' => dirname(__DIR__) . '/public/assets/avatars/dicebear-cache', + 'user_dir' => dirname(__DIR__) . '/public/assets/avatars/users', + 'user_public_path' => '/assets/avatars/users', + ], + 'default_style' => 'lorelei', + 'enabled_styles' => [ + 'lorelei', + ], + 'styles' => [ + 'lorelei' => [ + 'label' => 'Lorelei', + 'class' => \App\Avatar\Lorelei::class, + 'fixed_colors' => [], + 'color_controls' => [], + ], + ], +]; diff --git a/partials/landing/account/dashboard.php b/partials/landing/account/dashboard.php index c14faa6..9cc0d04 100755 --- a/partials/landing/account/dashboard.php +++ b/partials/landing/account/dashboard.php @@ -3,6 +3,10 @@ $app = app(); $vm = \App\AccountPages::dashboard($app); extract($vm, EXTR_OVERWRITE); $avatarPlaceholder = 'data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 12 12%22%3E%3Crect width=%2212%22 height=%2212%22 fill=%22%23f7efe6%22/%3E%3C/svg%3E'; +$avatarStyleKeys = array_keys($avatarBuilder ?? []); +$currentAvatarStyle = (string)($profile['avatar_style'] ?? ($avatarStyleKeys[0] ?? 'lorelei')); +$currentAvatarComponents = $avatarBuilder[$currentAvatarStyle]['components'] ?? []; +$dashboardUserId = (int)($_SESSION['user_id'] ?? 0); $editing = isset($editEvent) && $editEvent !== null; $actionEvent = $editing ? 'event_update' : 'event_add'; $startVal = $editEvent ? date('Y-m-d\TH:i', strtotime((string)$editEvent['starts_at'])) : ''; @@ -64,11 +68,11 @@ $sectionLinks = [
- + + + +
- +

Wähle eine Komponente und passe dein neues Profilbild Schritt für Schritt an. Gespeichert wird erst nach Klick auf den Button unten.

+ 1): ?> +
+ + +
+
-
- $meta): ?> - (string) $value !== '')); - ?> - - -
-
- $meta): ?> -
-
- - Gesamtes Profilbild zur sicheren Vorschau -
-
- - - -
-
- -
+ $styleMeta): ?> + +
> +
+ + $component): ?> + + +
+
+ $component): ?> +
+
+ + Gesamtes Profilbild zur sicheren Vorschau +
+
+ + + +
+
+ +
+
+
diff --git a/partials/landing/community/index.php b/partials/landing/community/index.php index 5527a5e..d6434d7 100644 --- a/partials/landing/community/index.php +++ b/partials/landing/community/index.php @@ -115,7 +115,7 @@ $threads = $community ?>
-
+

@@ -206,7 +206,7 @@ $threads = $community ?>
-
+

diff --git a/partials/landing/community/thread.php b/partials/landing/community/thread.php index 0a65e71..1763d21 100644 --- a/partials/landing/community/thread.php +++ b/partials/landing/community/thread.php @@ -154,7 +154,7 @@ $userVotes = ($access && $userId) ? $access->getUserPostVotes((int)$userId, $pos