Files
mindflux/CHANGELOG.md
T
AliceDarkest db6b5bbb1a Doku: Changelog-Eintrag Login/Registrierung/Konten + Dev-Lab-Icon-Fix
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-06-30 20:36:15 +02:00

206 lines
17 KiB
Markdown
Raw Blame History

This file contains invisible Unicode characters
This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# Changelog
Alle nennenswerten Änderungen an **Mindflux** werden hier dokumentiert.
Format angelehnt an [Keep a Changelog](https://keepachangelog.com/de/1.0.0/),
Versionierung [semantisch](https://semver.org/lang/de/).
## [Unreleased] – 2026-06-30 · Login, Registrierung & Konten
Reihe von Fixes und Verbesserungen rund um Anmeldung, Registrierung und
Konto-Verwaltung – ausgelöst durch einen Login-Bug, bei dem ein frisch
registriertes Konto sich nicht anmelden konnte.
### Behoben
- **Login scheiterte an Groß-/Kleinschreibung des Benutzernamens:** Die Registrierung
speicherte den Namen klein, der Login suchte aber **case-sensitiv** – wer sich z. B. als
„LostAtWonderland" registrierte, kam mit genau dieser Schreibweise nicht hinein. Das wirkte
wie ein Passwort-Problem, war aber der Benutzername-Abgleich (das Passwort lag korrekt
verschlüsselt in der DB). Login **und** Dublettenprüfung sind jetzt **case-insensitiv**
(`findByUsernameIgnoreCase`); Admin-Logins funktionieren unverändert in jeder Schreibweise.
- **Profilbild wurde beim Bearbeiten im Admin genullt:** Das Benutzer-Edit-Formular sendet kein
`profile_picture`, wodurch ein Speichern das Bild löschte. Beim Bearbeiten bleibt das
bestehende Profilbild jetzt erhalten.
- **Dev-Lab-Pfad-Icon „Debugging & Problemlösung" war leer:** Das Symbol `</>` wurde per
`innerHTML` als (kaputtes) HTML interpretiert statt als Text gerendert. Der Marker wird jetzt
escaped (`esc(p.marker)`, Cache-Buster `v4`); alle drei Trainingspfade zeigen ihr Icon
(`{}` · `</>` · `[]`).
### Geändert / Hinzugefügt
- **Registrierung behält die Schreibweise des Benutzernamens** (vorher klein) und trimmt nur noch.
- **Passwort-Wiederholung bei der Registrierung:** neues Feld „Passwort wiederholen" mit Client-
**und** Server-Prüfung; bei Abweichung wird der Account nicht angelegt (Schutz vor Tippfehlern,
da die Passworteingabe verdeckt ist). Eigene Fehlermeldung, die das Signup-Panel direkt öffnet.
- **Admin-Passwort-Reset (ohne E-Mail):** In der Benutzerverwaltung lässt sich pro Nutzer direkt
ein neues Passwort setzen („PW zurücksetzen"); das Bearbeiten-Formular setzt ein eingegebenes
Passwort ebenfalls neu (leer = unverändert). Dient als Konto-Recovery (Phase 1).
### Hinweise / offen
- **„Passwort vergessen" als E-Mail-Self-Service (Phase 2)** ist noch offen: Der Server hat aktuell
keinen Mailversand. Geplant über ein SMTP-Relay (z. B. Brevo/Mailjet, EU/DSGVO) bzw. ein
vorhandenes Postfach, sobald SMTP-Zugangsdaten vorliegen – Reset dann per zeitlich begrenztem
Token-Link. (Ein eigener Mailserver ist wegen Zustellbarkeit/Reputation nicht vorgesehen.)
## [Unreleased] – 2026-06-30 · Dev Lab
Neues Spiel **Dev Lab**: ein Entwicklerlabor, das mehrere kleine Disziplinen bündelt
(SQL, Java/Debugging, Git, HTML, CSS, Regex, PHP, REST). Im Gegensatz zur ersten,
rein clientseitigen Skizze ist Dev Lab jetzt **server-autoritativ, DB-gestützt und im
Admin pflegbar** – mit **echter Mechanik-Vielfalt** statt überall demselben Lückentext.
### Hinzugefügt
- **Spiel: Dev Lab (`/devlab`)** mit Hub (drei Trainingspfade: Syntax · Debugging · Praxis)
und **11 Disziplinen** (`query-builder`, `sql-detective`, `debug-hunt`, `git-mission`,
`html-architect`, `css-designer`, `css-cascade`, `flexbox-factory`, `regex-master`,
`php-request`, `api-explorer`), zusammen **189 Aufgaben** (16–21 je Spiel).
- **Sechs unterschiedliche Spielmechaniken** – passend zum Thema gemischt:
**cloze** (Code-Lücke tippen), **choice** (Multiple-Choice-Chips), **order**
(Bausteine klick-basiert zusammensetzen/sortieren), **spot** (den fehlerhaften Token
anklicken), **match** (Paare zuordnen) und **regex** (Muster schreiben mit
**Live-Treffer-Vorschau** gegen Beispiel-Strings).
- **Server-autoritativ & Anti-Cheat:** Aus dem JSON-Payload jeder Aufgabe baut der Server
eine bereinigte Sicht **ohne Lösung**; geprüft und gewertet wird ausschließlich serverseitig
(Text-/Reihenfolge-/Verhaltensvergleich). `correctIndex`/`bugIndex`/Lösungen/Pattern verlassen
nie das Backend. Score über die generische `game_scores`-Tabelle (Kennung `devlab`, `deck`=Spiel-Slug).
- **Fehler-Mechanik** wie bei Syntax Saga: bis zu drei Versuche mit Hinweis, dann „Auflösung",
kein Game-Over; Punkte nach Versuch, Sterne 0–3.
- **Admin-Verwaltung (`/admin/devlab`):** Spiele und Aufgaben (Typ + JSON-Payload) anlegen,
bearbeiten, löschen, aktiv/inaktiv schalten. Inhalte aus `devlab/content.json` (idempotenter Seeder).
### Behoben / geändert (ggü. der ersten Dev-Lab-Skizze)
- **Platzhalter-Leak entfernt:** Die Eingabefelder zeigten vorher die Lösung als Platzhalter –
jetzt sind es neutrale Kategorie-Labels („Keyword", „Operator", „Tag" …). Geprüft wird serverseitig.
- **Echte Mechanik-Abwechslung** statt 11×Lückentext; **deutlich mehr Aufgaben** je Disziplin.
### Technik
- Neue Entities `DevLabGame`/`DevLabTask` (JSON-`payload`) + Flyway `V8__devlab.sql`;
`DevLabService` mit sechs Mechanik-Checkern; JSON-API `/api/devlab/**`
(`catalog`/`session`/`check`/`finish`, CSRF-ausgenommen, `devlab` in `KNOWN_GAMES`).
Frontend: polymorphe Engine `devlabgame.js`, DB-getriebener Hub `devlab.js`, `devlabgame.css` (Prefix `dlg-`).
## [Unreleased] – 2026-06-30
Neues Spiel **Syntax Saga**: interaktive IT-Geschichten, in denen man den fehlenden
Code (Schlüsselwörter, Operatoren, ganze Zeilen) in eine kleine Story tippt. Server-autoritativ
nach dem TechTacular-Muster, Inhalte DB-gestützt und im Admin pflegbar. Die Dashboard-Kachel
„Syntax Saga" ist damit aktiv (vorher „coming soon").
### Hinzugefügt
- **Spiel: Syntax Saga (`/syntaxsaga`):** Missions-Saga in drei **wählbaren Schwierigkeitsstufen**
(Junior = eine Lücke, Professional = mehrere Lücken, Senior = ganze Zeile rekonstruieren). Jede
Mission besteht aus Erzähltext + optionalem Dialog + Codeblock mit `{{n}}`-Lücken. Eine Lücke kann
**mehrere gültige Antworten** haben (z. B. `localhost` / `192.168.0.1`) und optional
groß-/kleinschreibungs-unabhängig prüfen (z. B. SQL-Keywords). Eingabe per Freitext; **Prüfung und
Score ausschließlich serverseitig** – die Lösungen verlassen nie das Backend (Anti-Cheat wie bei
TechTacular/MindMatch).
- **Fehler-Mechanik:** pro Lücke bis zu drei Versuche mit Hinweis, danach **„Auflösung anzeigen"**; die
Geschichte läuft immer weiter (**kein Game-Over**). Punkte je nach Versuch (Erstversuch voll, danach
weniger), aufgelöste Lücke = 0 Punkte; Sterne­wertung 0–3.
- **Admin-Verwaltung (`/admin/syntaxsaga`):** Missionen, Lücken und Lösungen anlegen/bearbeiten/löschen,
aktiv/inaktiv schalten. Mitgeliefert: **34 Seed-Missionen** (16 Junior · 10 Professional · 8 Senior,
zusammen 44 Lücken) aus `syntaxsaga/content.json` (idempotenter Seeder, lädt nur in leere Tabellen).
Themen quer durch den Stack: **Java** (Schleifen, OOP/`class`/`this`, Exceptions, Collections,
Operatoren), **SQL** (`WHERE`/`ORDER BY`/`JOIN … ON`/`INSERT`/`UPDATE`/`DELETE`), **Bash**
(`cd`/`grep`/Pipe), **Git** (`commit`), **HTML** (Link/Formular) und **Python** (`print`); Senior
rekonstruiert ganze Zeilen (z. B. `public static void main(String[] args)`,
`Scanner sc = new Scanner(System.in)`) mit ein paar tolerierten Schreibvarianten.
- Spielstände laufen über die bestehende generische `game_scores`-Tabelle (Spiel-Kennung `syntax-saga`),
inkl. Highscore/„Neuer Bestwert" und Statistik im Spiel-HUD.
### Technik
- Neue Entities `SyntaxSagaMission` / `SyntaxSagaGap` / `SyntaxSagaSolution` + Flyway-Migration
`V7__syntax_saga.sql`; server-autoritativer `SyntaxSagaService` (Story ohne Lösungen / serverseitige
Prüfung / Score-Recompute beim Abschluss); JSON-API `/api/syntaxsaga/**` (CSRF-ausgenommen). Frontend
unter `syntaxsaga.html` / `syntaxsaga.js` / `syntaxsaga.css` (Prefix `ss-`, zentrale `theme.css`-Tokens).
## [Unreleased] – 2026-06-29
Inhaltlicher und optischer Feinschliff: echte Rechtstexte, vollständig
überarbeitete FinalFlux-Inhalte, neue Login-Optik, eine reparierte
Konto-Löschung sowie ein app-weiter Farb-Relaunch auf das
„Back to the Future"-Schema.
### Hinzugefügt
- **Rechtsseiten:** Impressum-Platzhalter (Hinweis „in Entwicklung / nicht für die öffentliche Nutzung") sowie **echte** Nutzungsbedingungen/AGB, Datenschutzerklärung (DSGVO-konform, spiegelt die tatsächlich verarbeiteten Daten) und Community-/Nutzungsrichtlinien. Neuer `LegalController` (`/nutzungsbedingungen`, `/datenschutz`, `/richtlinien`) + `ImpressumController`; alle Footer-Links app-weit verdrahtet.
- **Kombinierte Login/Registrierung:** Dual-Panel mit überschiebendem Overlay (Sign-in ↔ „Account erstellen") und Neon-Button mit Hover-Expand und rotierendem Conic-Glow; ausgelagert nach `static/css/auth.css`. Responsiver Fallback (gestapelt) auf schmalen Screens.
- **FinalFlux – Netzwerktopologien:** fünf theme-adaptive Inline-SVG-Diagramme (Stern, Bus, Ring, Mesh, Baum) in den Erklärungen.
### Geändert
- **FinalFlux-Inhalte komplett überarbeitet (28 Themen, ~742 Fragen):** die generischen Dummy-Falschantworten („nur Dekoration", „zufälliger Begriff" …) durch plausible, themennahe Distraktoren ersetzt, jede Frage mit echter Begründung und variierender Antwortposition. Jede Themenseite hat jetzt **echten Lehrtext** (Definitionen, Funktionsweise, Rechenbeispiele, Merksätze) statt des bisherigen Stubs.
- **App-weiter Farb-Relaunch auf „Back to the Future"-Palette:** Primär **Feuer-Amber** (`#f0a81a`) + Gelb-Glow, **Flux-Blau** (`#2d9cce`) als Zweitakzent (u. a. Links); warmer Bernstein-Glow statt Matrix-Grün. Dark/Light bleiben (sehr dunkler/sehr heller Grund). Zentral über `theme.css`-Tokens; Legacy-Cyan in `style.css` auf Theme-Variablen umgestellt.
- **Spiele-Feedback ohne Grün:** richtig = **Flux-Blau + ✓**, falsch = **Rot + ✗** in FinalFlux, MindMatch und TechTacular (löst den fehlenden Kontrast von „grün auf grün"); neue Tokens `--success`, `--danger`, `--secondary`. Das Fehler-Rot ist ein kühleres Crimson (`#ff4d6d` dunkel / `#be123c` hell), damit es sich klar vom orangen Akzent abhebt (v. a. im Light-Mode).
- Registrierungs-Duplikat leitet auf `/?registerError` (kombinierte Seite öffnet automatisch das Signup-Panel).
- **Vollständig responsive / mobiltauglich:** Auf schmalen Screens wird die App-Sidebar nicht mehr ausgeblendet (vorher fehlte die Navigation komplett), sondern zu einer Off-Canvas-Schublade mit Hamburger-Button + Backdrop (global via `theme.js` injiziert, Styles in `theme.css`). Topbar stapelt/umbricht (dekorativer Puls + Suche ausgeblendet), Spielkarten-Grid 3→2→1, breite Tabellen horizontal scrollbar. Spiele, FinalFlux und Login/Registrierung waren bereits responsiv.
### Behoben
- **Konto-Löschung repariert:** „Profil löschen" warf einen 500er (fehlendes `@Transactional` bei einer abgeleiteten Delete-Query) und löschte nichts. Jetzt werden Konto **plus** Spielstände, Achievements und Profilbild-Datei in einer Transaktion entfernt — erfüllt die in der Datenschutzerklärung zugesicherte Löschung (Art. 17 DSGVO).
- Impressum-„Zurück"-Link loggte eingeloggte Nutzer scheinbar aus; jetzt login-abhängig (eingeloggt → Dashboard, sonst → Startseite). Gleiche Logik auf den Rechtsseiten.
- Login-Overlay im **Light-Mode** war weiß-auf-weiß/verwaschen; jetzt kräftiges Orange-Panel mit weißem Text (Dark-Mode unverändert).
- **Mobile-Bedienbarkeit der Spiele:** MindMatch- und TechTacular-Boards ragten auf dem Handy aus dem Bildschirm, ohne dass man scrollen konnte (`height:100vh; overflow:hidden` + iOS-Adressleiste). Auf Touch-Breiten jetzt scrollbar, Karten/Kacheln mit fester Proportion bzw. Mindesthöhe → alle Felder erreichbar.
- **FinalFlux-Hub auf Mobil:** Überlappung von Kopfbereich und Inhalt + unerreichbares Themen-Menü. Ursache: das generische `main {}` aus der Alt-`style.css` traf das Hub-`<main>`; jetzt in `.finalflux-main` neutralisiert und die Shell stapelt auf Mobil sauber (`display:block`, Sidebar mit voller Höhe).
### Sicherheit
- Neue Rechtsseiten öffentlich erreichbar (`permitAll` für `/impressum`, `/nutzungsbedingungen`, `/datenschutz`, `/richtlinien`).
### Hinweise
- Footer-Links **Support** und **Feedback** sind weiterhin Platzhalter (`href="#"`).
- Die Rechtstexte sind inhaltlich vollständig, aber KI-erstellt — vor einem öffentlichen Launch fachlich/juristisch prüfen (insb. konkrete Anbieteranschrift im Impressum).
- Vier ungenutzte Alt-CSS-Dateien (`progress/settings/achievements/soziales.css`, keine Referenzen) blieben vorerst liegen.
## [Unreleased] – 2026-06-25
Großer Ausbau: zwei vollständige Spiele, durchgängig DB-gestützte und
admin-pflegbare Inhalte sowie ein kompletter Optik-Relaunch (Theme-System
mit Dark/Light-Umschaltung).
### Hinzugefügt
#### Spiel: MindMatch (Lern-Memory)
- Memory-Spiel, das **Begriff ↔ Bedeutung** paart (klassische Aufdeck-Mechanik mit Lernwert).
- Deck-Auswahl, Zug-/Zeitzähler, Sternebewertung und „Spiel abbrechen".
- **No-Scroll-Layout**: alle Karten einer Runde passen ohne Scrollen auf den Schirm (Brett skaliert die Karten).
- Kartenrückseiten tragen das leuchtende Mindflux-Emblem (grün/magenta je Theme).
- Inhalte **DB-gestützt und im Admin pflegbar** (`/admin/mindmatch`): Decks und Paare jederzeit erweiterbar.
- Mitgelieferte Decks: Netzwerk, Hardware, IT-Sicherheit, SQL-Befehle sowie ein großer Fachinformatiker-Satz (15 Decks insgesamt).
#### Spiel: TechTacular (Jeopardy-Quiz)
- **Echtes Jeopardy-Prinzip (umgekehrt):** angezeigt wird eine Aussage, gesucht ist der Begriff als „Was ist …?".
- 5×5-Board (Kategorie × Punktwert 100–500), Antwortprüfung mit Erklärung.
- **Server-autoritativ & Anti-Cheat:** das Board enthält nie die Lösung; Prüfung und Wertung passieren ausschließlich serverseitig.
- **≥ 60 % neue Fragen pro Runde:** das Board schließt die Fragen der Vorrunde aus.
- **Kuratierter Inhalt:** 12 Kategorien über das ganze Informatik-Prüfungsspektrum (Netzwerk, Betriebssysteme, Programmierung, Datenstrukturen & Algorithmen, Datenbanken/SQL, IT-Sicherheit & Krypto, Web, Rechnerarchitektur, Software-Engineering, Theoretische Informatik, Cloud/DevOps, IT-Recht), **384 Hinweise**.
- Admin-Verwaltung als Drill-down (`/admin/techtacular`).
#### Generisches Spiel-Backend
- Tabelle `game_scores` + `GameScoreService`/`GameScoreController` mit `POST /api/games/{game}/scores` und `GET /api/games/{game}/stats` für alle Spiele.
- `/progress` zeigt echte Spiel-Statistiken (Highscore, Spiele, zuletzt gespielt).
#### Optik-Relaunch / Theme-System
- **Zentrale Tokens** in `theme.css` + Umschalter `theme.js`, gesteuert über `<html data-theme="dark|light">` (Persistenz via `localStorage`, kein Aufblitzen).
- **Dark = Grün-Neon, Light = heller Grund + Magenta** (bewusst invertiert).
- Wiederverwendbare `mf-`-Komponenten (Shell/Sidebar/Topbar, HUD-Karten, Panels, Buttons, Formulare, Tabellen, Footer …).
- **Dashboard** im „Cyber-Grid"-Look neu: linke Sidebar (Nav, Profil, Level/XP, Streak), Mitte mit HUD-Spielkarten, rechte Widget-Spalte (System-Status, Fortschritt, Top-Kategorien, Challenge), Top-Leiste mit Suche/Glocke/Theme-Schalter.
- Original-Mindflux-Logo per CSS-Maske theme-abhängig eingefärbt (`/img/mindflux-emblem.png`).
- Theme + Umschalter **app-weit** ausgerollt: Login/Registrierung, beide Spiele, Profil/Fortschritt/Achievements/Einstellungen/Soziales/Knowledge, alle Admin-Seiten, FinalFlux-Hub und 28 statische Lernseiten.
- **Fußzeile** (Support · Feedback · Nutzungsbedingungen · Richtlinien · Datenschutz · Impressum) als `.mf-footer`-Komponente, einheitlich auf allen Content-Seiten.
### Geändert
- `ProgressService` liefert echte DB-Daten statt der bisherigen Dummy-Spiele.
- Admin-Bootstrap-User auf `AliceDarkest` umbenannt (vorher „Alice Darkest" mit Leerzeichen); zusätzlicher Admin `KevCipher` angelegt.
### Sicherheit
- Statische JS-Ressourcen (`/js/**`) wie CSS/Bilder öffentlich (`permitAll`) — kein schützenswerter Inhalt.
- Score-Endpunkte gegen eine Allowlist bekannter Spiele abgesichert; Punkte werden serverseitig berechnet (kein vom Client gemeldeter Score).
### Technisch
- **Flyway-Migrationen V2–V6:** `game_scores` (V2), MindMatch-Decks/-Paare (V3) + Fachinformatiker-Inhalte (V4), TechTacular-Schema (V5) + kuratierte Reverse-Inhalte (V6).
- Inhalts-Import für TechTacular über einen `CommandLineRunner`-Seeder aus `techtacular/content.json`.
- Hinweis (Thymeleaf): Inline-`<script>` mit `[[`/`]]` benötigt `th:inline="none"`, sonst bricht die Antwort ab.
### Hinweise
- Footer-Links sind aktuell Platzhalter (`href="#"`); echte Impressum-/AGB-/Datenschutz-Seiten existieren noch nicht.
- Die fünf übrigen Dashboard-Spiele (Syntax Saga, Code Escape Room, Service Clash, Bug Hunter, Netzwerker) sind noch nicht umgesetzt und verweisen auf „coming soon".
---
_Frühere Stände (Grundgerüst der Lernplattform: Benutzer/Login, Profil, Achievements, FinalFlux, Admin) wurden vor Einführung dieses Changelogs entwickelt._