From 2d8cdc052f4f993f3cdf26e645f603e3081cab5b Mon Sep 17 00:00:00 2001 From: Till Tomczak Date: Sun, 27 Apr 2025 15:12:52 +0200 Subject: [PATCH] Refactor chat interface in index.html and main.js: Improve user interaction by optimizing chat message rendering and enhancing initialization logic for the ChatGPT assistant. Update styles for better responsiveness and visual appeal, ensuring seamless integration with existing functionalities. --- .cursor/rules/ai-integration.mdc | 34 ++++++++++++++++++++ .cursor/rules/authentication.mdc | 36 +++++++++++++++++++++ .cursor/rules/configuration.mdc | 31 +++++++++++++++++++ .cursor/rules/data-models.mdc | 31 +++++++++++++++++++ .cursor/rules/development-workflow.mdc | 32 +++++++++++++++++++ .cursor/rules/frontend-structure.mdc | 41 ++++++++++++++++++++++++ .cursor/rules/project-structure.mdc | 27 ++++++++++++++++ .cursor/rules/routing.mdc | 43 ++++++++++++++++++++++++++ 8 files changed, 275 insertions(+) create mode 100644 .cursor/rules/ai-integration.mdc create mode 100644 .cursor/rules/authentication.mdc create mode 100644 .cursor/rules/configuration.mdc create mode 100644 .cursor/rules/data-models.mdc create mode 100644 .cursor/rules/development-workflow.mdc create mode 100644 .cursor/rules/frontend-structure.mdc create mode 100644 .cursor/rules/project-structure.mdc create mode 100644 .cursor/rules/routing.mdc diff --git a/.cursor/rules/ai-integration.mdc b/.cursor/rules/ai-integration.mdc new file mode 100644 index 0000000..3d00054 --- /dev/null +++ b/.cursor/rules/ai-integration.mdc @@ -0,0 +1,34 @@ +--- +description: +globs: +alwaysApply: false +--- +# KI-Integration + +Die Anwendung integriert OpenAI für KI-Funktionalitäten: + +## Konfiguration +- [app.py](mdc:app.py): OpenAI-Client-Initialisierung +- [requirements.txt](mdc:requirements.txt): OpenAI SDK als Abhängigkeit + +## Endpunkte +- `/api/assistant`: Hauptendpunkt für KI-Anfragen + +## Funktionalitäten +- Chatbot-Integration: Benutzer können mit einem KI-Assistenten kommunizieren +- Inhaltsanalyse: KI kann Gedanken und Konzepte analysieren +- Vorschläge: Kontextbezogene Vorschläge basierend auf dem Benutzerkontext + +## Implementation +- Verwendet den OpenAI SDK für API-Aufrufe +- Kontextübergabe für konsistente Konversationen +- Streaming-Antworten für bessere Benutzererfahrung + +## Konfigurationsparameter +- `OPENAI_API_KEY`: API-Schlüssel (in .env-Datei) +- Das System verwendet vorwiegend das Chat-Completion-API + +## Sicherheitsmaßnahmen +- API-Schlüssel werden sicher über Umgebungsvariablen geladen +- Ratenbegrenzung und Fehlerbehandlung für API-Aufrufe +- Eingabevalidierung vor API-Anfragen diff --git a/.cursor/rules/authentication.mdc b/.cursor/rules/authentication.mdc new file mode 100644 index 0000000..0ed6641 --- /dev/null +++ b/.cursor/rules/authentication.mdc @@ -0,0 +1,36 @@ +--- +description: +globs: +alwaysApply: false +--- +# Authentifizierung und Benutzerrollen + +Die Anwendung nutzt Flask-Login für das Authentifizierungssystem: + +## Hauptkomponenten +- [LoginManager](mdc:app.py): Konfiguration im app.py +- [User Model](mdc:models.py): Die User-Klasse implementiert UserMixin für Flask-Login +- Passwort-Hashing: Verwendet Werkzeug Security für sichere Passwort-Speicherung + +## Authentifizierungsrouten +- `/login`: Benutzeranmeldung (GET/POST) +- `/register`: Benutzerregistrierung (GET/POST) +- `/logout`: Benutzerabmeldung + +## Benutzerrollen +- Reguläre Benutzer: Grundlegende Funktionen +- Administratoren (`is_admin=True`): Erweiterte Privilegien + +## Zugriffskontrollen +- `@login_required`: Decorator für routenspezifischen Authentifizierungsschutz +- `@admin_required`: Benutzerdefinierter Decorator für Admin-Zugriffskontrolle + +## Sitzungsverwaltung +- Tracking von Anmeldezeit (`last_login`) +- Langlebige Sitzungen für Präferenzen (z.B. Dark Mode) +- Angepasste Flash-Nachrichten + +## Profilmanagement +- `/settings`: Benutzereinstellungen aktualisieren +- Passwortänderung +- Profildetails (Biografie, Avatar, etc.) diff --git a/.cursor/rules/configuration.mdc b/.cursor/rules/configuration.mdc new file mode 100644 index 0000000..80fd245 --- /dev/null +++ b/.cursor/rules/configuration.mdc @@ -0,0 +1,31 @@ +--- +description: +globs: +alwaysApply: false +--- +# Konfiguration und Umgebungsvariablen + +Die Anwendung verwendet Umgebungsvariablen für die Konfiguration: + +## Konfigurationsdateien +- [.env](mdc:.env): Haupt-Umgebungsvariablen (nicht in Git) +- [example.env](mdc:example.env): Beispiel-Konfiguration als Vorlage + +## Wichtige Konfigurationsparameter +- `SECRET_KEY`: Geheimer Schlüssel für Flask-Sitzungen +- `SQLALCHEMY_DATABASE_URI`: Datenbankverbindung +- `OPENAI_API_KEY`: API-Schlüssel für OpenAI-Integration + +## Anwendungsinitialisierung +- [run.py](mdc:run.py): Lädt Umgebungsvariablen und startet die Anwendung +- [app.py](mdc:app.py): Konfiguriert Flask mit den geladenen Umgebungsvariablen +- [init_db.py](mdc:init_db.py): Initialisiert die Datenbank mit Beispieldaten + +## Datenbank-Konfiguration +- SQLite-Datenbank im `/database`-Verzeichnis +- Automatische Erstellung der Datenbankstruktur bei Anwendungsstart +- Beispieldaten werden mit `init_database()` erstellt + +## Ausführung der Anwendung +- Entwicklungsserver: `python run.py` +- In Produktion: Nutzung von Gunicorn (siehe requirements.txt) diff --git a/.cursor/rules/data-models.mdc b/.cursor/rules/data-models.mdc new file mode 100644 index 0000000..0a008d1 --- /dev/null +++ b/.cursor/rules/data-models.mdc @@ -0,0 +1,31 @@ +--- +description: +globs: +alwaysApply: false +--- +# Datenmodelle + +Die Anwendung verwendet SQLAlchemy als ORM mit folgenden Hauptmodellen: + +## Benutzer und Authentifizierung +- [User](mdc:models.py): Benutzermodell mit Authentifizierung und Profildaten + +## Mind-Mapping und Wissensorganisation +- [Category](mdc:models.py): Wissenschaftliche Kategorien zur Organisation der Mindmap +- [MindMapNode](mdc:models.py): Knoten in der öffentlichen Mindmap +- [UserMindmap](mdc:models.py): Benutzerspezifische Mindmaps +- [UserMindmapNode](mdc:models.py): Speichert Positionen von Knoten in Benutzer-Mindmaps +- [MindmapNote](mdc:models.py): Private Notizen zu Mindmap-Elementen + +## Gedanken und Inhalte +- [Thought](mdc:models.py): Gedanken und Konzepte, die in Mindmaps verknüpft werden +- [ThoughtRelation](mdc:models.py): Verknüpfungen zwischen verschiedenen Gedanken +- [ThoughtRating](mdc:models.py): Bewertungen von Gedanken durch Benutzer +- [Comment](mdc:models.py): Kommentare zu Gedanken + +## Hauptbeziehungen +- Benutzer → Gedanken: 1-zu-n (Autor) +- Benutzer → MindMaps: 1-zu-n +- Gedanken ↔ MindMapNodes: n-zu-m +- Kategorien → MindMapNodes: 1-zu-n +- Gedanken ↔ Gedanken: über ThoughtRelation (gerichtete Beziehungen) diff --git a/.cursor/rules/development-workflow.mdc b/.cursor/rules/development-workflow.mdc new file mode 100644 index 0000000..c57bc98 --- /dev/null +++ b/.cursor/rules/development-workflow.mdc @@ -0,0 +1,32 @@ +--- +description: +globs: +alwaysApply: false +--- +# Entwicklungs-Workflow + +## Grundlegende Entwicklungsschritte +1. Umgebung einrichten: Python 3.11 und Abhängigkeiten installieren +2. `.env`-Datei basierend auf `example.env` erstellen +3. Datenbank initialisieren: `python init_db.py` +4. Entwicklungsserver starten: `python run.py` + +## Datenbankentwicklung +- Models in [models.py](mdc:models.py) definieren +- Migrationen bei Schemaänderungen durchführen +- Testdaten über [init_db.py](mdc:init_db.py) bereitstellen + +## Anwendungsentwicklung +- Neue Routen in [app.py](mdc:app.py) hinzufügen +- Frontend-Templates in `/templates` erstellen/anpassen +- API-Endpoints für AJAX/Frontend-Integration implementieren + +## Testing +- Tests mit pytest schreiben (siehe requirements.txt) +- Flask-Testumgebung für Integrationstest verwenden + +## Best Practices +- Immer auf Datenbankmodelle zurückgreifen (kein Raw-SQL) +- API-Endpunkte mit Authentifizierung schützen +- Flash-Nachrichten für Benutzerrückmeldungen verwenden +- Code-Dokumentation in deutscher Sprache halten diff --git a/.cursor/rules/frontend-structure.mdc b/.cursor/rules/frontend-structure.mdc new file mode 100644 index 0000000..8caaa3e --- /dev/null +++ b/.cursor/rules/frontend-structure.mdc @@ -0,0 +1,41 @@ +--- +description: +globs: +alwaysApply: false +--- +# Frontend-Struktur + +Die Anwendung verwendet ein Flask-Jinja2-Template-System mit JavaScript-Erweiterungen: + +## Template-Struktur +- `/templates`: Hauptverzeichnis für Jinja2-Templates +- `/templates/errors`: Fehlerseiten (404, 500, etc.) +- Layout-Templates für einheitliches Design + +## Frontend-Assets +- `/static/css`: CSS-Dateien (mit Tailwind) + - `/static/css/src`: Quell-CSS-Dateien +- `/static/js`: JavaScript-Dateien + - `/static/js/modules`: Modulare JS-Komponenten +- `/static/img`: Bilder und grafische Elemente + +## JavaScript-Funktionalität +- API-Integration: Asynchrone Kommunikation mit Backend +- Mindmap-Visualisierung: Interaktive Darstellung von Konzepten +- Benutzeroberflächen-Interaktivität: Drag & Drop, Tooltips, Modals + +## CSS-Framework +- Tailwind CSS für responsive Design-Elemente +- TAILWIND CDN verwenden, nicht manuell build! + +## Responsive Design +- Mobile-first Ansatz für verschiedene Gerätetypen +- Anpassungsfähiges Layout für verschiedene Bildschirmgrößen + +## Zugänglichkeit +- Semantisches HTML für bessere Zugänglichkeit +- ARIA-Attribute für Screenreader-Unterstützung + +## Internationalisierung +- Deutsche Benutzeroberfläche als Standard +- Vorbereitet für mehrsprachige Unterstützung diff --git a/.cursor/rules/project-structure.mdc b/.cursor/rules/project-structure.mdc new file mode 100644 index 0000000..086aae7 --- /dev/null +++ b/.cursor/rules/project-structure.mdc @@ -0,0 +1,27 @@ +--- +description: +globs: +alwaysApply: false +--- +# Projekt-Struktur (Systades) + +## Hauptkomponenten +Diese Python-Flask-Webanwendung implementiert ein Mind-Mapping und Gedanken-Management System: + +- [app.py](mdc:app.py): Hauptanwendungsdatei mit allen Routen und Endpunkten +- [models.py](mdc:models.py): Datenbankmodelle und Beziehungen +- [run.py](mdc:run.py): Startpunkt der Anwendung +- [init_db.py](mdc:init_db.py): Initialisiert die Datenbank mit Beispieldaten + +## Projektstruktur +- `/database`: Enthält SQLite-Datenbank +- `/docs`: Dokumentation +- `/static`: Frontend-Ressourcen (CSS, JS, Bilder) +- `/templates`: Jinja2-Templates für die Webseiten +- `/utils`: Hilfsfunktionen und -klassen + +## Hauptfunktionalität +- Mind-Mapping: Visualisierung von Wissen und Beziehungen +- Gedanken-Management: Erfassung und Organisation von Ideen und Konzepten +- Benutzer-Management: Registrierung, Login, Profile +- API-Endpunkte: RESTful-Schnittstellen für Frontend-Integration diff --git a/.cursor/rules/routing.mdc b/.cursor/rules/routing.mdc new file mode 100644 index 0000000..736b152 --- /dev/null +++ b/.cursor/rules/routing.mdc @@ -0,0 +1,43 @@ +--- +description: +globs: +alwaysApply: false +--- +# Routing und API-Endpunkte + +## Hauptrouten (Webseiten) +- `/`: Startseite +- `/login`, `/register`, `/logout`: Authentifizierung +- `/mindmap`: Öffentliche Mindmap-Ansicht +- `/profile`: Benutzerprofil +- `/settings`: Benutzereinstellungen +- `/search`: Suchfunktion +- `/my_account`: Kontoübersicht + +## API-Endpunkte +### Mindmap-Verwaltung +- `/api/mindmap`: Öffentliche Mindmap-Daten abrufen +- `/api/mindmap/public`: Öffentliche Mindmap abrufen +- `/api/mindmap/user/`: Benutzer-Mindmap abrufen +- `/api/mindmap//add_node`: Knoten hinzufügen +- `/api/mindmap//remove_node/`: Knoten entfernen +- `/api/mindmap//update_node_position`: Knotenposition aktualisieren +- `/api/mindmap//notes`: Notizen verwalten + +### Gedanken und Inhalte +- `/api/thoughts`: Gedanken erstellen +- `/api/thoughts/`: Gedanken abrufen, aktualisieren, löschen +- `/api/thoughts//bookmark`: Lesezeichen setzen/entfernen +- `/api/nodes//thoughts`: Gedanken zu einem Knoten abrufen/hinzufügen + +### System und Benutzereinstellungen +- `/api/set_dark_mode`, `/api/get_dark_mode`: Erscheinungsbild-Einstellungen +- `/api/assistant`: KI-Assistent-Kommunikation +- `/api/categories`: Kategorien abrufen +- `/api/get_flash_messages`: Flash-Nachrichten für AJAX-Anfragen + +## Fehlerbehandlung +- 404: Page Not Found +- 403: Forbidden +- 500: Internal Server Error +- 429: Too Many Requests