diff --git a/.gitignore b/.gitignore index a547bf3..7fb481a 100644 --- a/.gitignore +++ b/.gitignore @@ -22,3 +22,6 @@ dist-ssr *.njsproj *.sln *.sw? +/src/assets/profiles/anja.png +/src/assets/profiles/kim.png +/src/assets/profiles/matthias.jpg diff --git a/src/App.tsx b/src/App.tsx index c210614..120cb93 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,15 +1,12 @@ import './App.css'; import Navbar from './components/Navbar'; import {BrowserRouter, Routes, Route} from 'react-router-dom'; +import Feed from "./pages/Feed.tsx"; function Home() { return
Home Page
; } -function Feed() { - return
Feed Page
; -} - function Record() { return
Record Page
; } diff --git a/src/data/MockDreams.ts b/src/data/MockDreams.ts new file mode 100644 index 0000000..39bd7d4 --- /dev/null +++ b/src/data/MockDreams.ts @@ -0,0 +1,61 @@ +import Dream from '../types/Dream.ts'; + +export const mockDreams: Dream[] = [ + new Dream({ + id: 1, + userId: 1, + title: 'Mitternachtsbibliothek', + date: new Date('2025-06-30T02:15:00Z'), + inputType: 'text', + input: 'Ich wanderte um Mitternacht in eine riesige Bibliothek, in der jedes Buch sanft leuchtete. Als ich eines aus dem Regal zog, flüsterten seine Seiten mir Geheimnisse zu.', + ai: { + interpretation: 'Dieses Bild symbolisiert den Wunsch nach Wissen und die Faszination für ungelüftete Geheimnisse. Die leuchtenden Bücher stehen für Inspiration und Erkenntnis, während die nächtliche Atmosphäre auf Introspektion und das Unbewusste hinweist.' + } + }), + new Dream({ + id: 2, + userId: 2, + title: 'Unterwasserkonzert', + date: new Date('2025-06-25T07:45:00Z'), + inputType: 'text', + input: 'Ich besuchte ein Konzert unter dem Ozean. Die Musiker waren Delfine, die Melodien anklickten, während Korallenpolypen im Takt zum Rhythmus mit Licht pulsierten.', + ai: { + interpretation: 'Das Unterwasserkonzert kann als Ausdruck von Kreativität und Harmonie gedeutet werden. Delfine symbolisieren Intelligenz und Spielfreude, Korallenlicht verweist auf emotionale Schwingungen und die Verbindung zum Inneren.' + } + }), + new Dream({ + id: 3, + userId: 3, + title: 'Wüstenzug', + date: new Date('2025-05-10T04:30:00Z'), + inputType: 'text', + input: 'Ein Dampflok-Express tuckerte über goldene Dünen unter einem violetten Himmel. Passagiere winkten, während Kamele mit Laternen neben den Schienen herliefen.', + ai: { + interpretation: 'Der Wüstenzug steht für eine Reise durch unbewusste Räume und persönliche Herausforderungen (Dünen). Der violette Himmel deutet auf Spiritualität hin, während die Laternen der Kamele Hoffnung und Wegweisung symbolisieren.' + } + }), + new Dream({ + id: 4, + userId: 1, + title: 'Schwebende Teeparty', + date: new Date('2025-04-18T09:00:00Z'), + inputType: 'text', + input: 'Ich saß mit Freunden auf einer Wolke zu einer Teeparty. Jede Tasse war mit Sternenstaub gefüllt, und der Himmel um uns herum schimmerte in pastelligen Regenbogenfarben.', + ai: { + interpretation: 'Diese Szene steht für Geborgenheit und Gemeinschaft auf einer höheren Ebene. Der Sternenstaub in den Tassen symbolisiert geteilte Träume, die pastelligen Regenbögen zeigen eine optimistische Grundstimmung und Leichtigkeit.' + } + }), + new Dream({ + id: 5, + userId: 2, + title: 'Spiegelgarten', + date: new Date('2025-03-05T23:20:00Z'), + inputType: 'text', + input: 'Ich erkundete einen Garten aus Spiegeln, in denen jeweils eine andere Kindheitserinnerung reflektiert wurde. Als ich einen berührte, hörte ich entferntes Lachen durch das Glas hallen.', + ai: { + interpretation: 'Der Spiegelgarten repräsentiert Selbsterkenntnis und Rückblick auf die eigene Vergangenheit. Jeder Spiegel steht für ein Fragment der Erinnerung, das entfernte Lachen deutet auf positive Prägungen und emotionale Verankerung hin.' + } + }), +]; + +export default mockDreams; \ No newline at end of file diff --git a/src/data/MockUsers.ts b/src/data/MockUsers.ts new file mode 100644 index 0000000..087bb5b --- /dev/null +++ b/src/data/MockUsers.ts @@ -0,0 +1,11 @@ +import User from "../types/User.ts"; + +export const MockUsers: User[] = [ + new User(1, "Matthias", "matthias.jpg"), + new User(2, "Kim", "kim.png"), + new User(3, "Anja", "anja.png"), +] + +export const MockUserMap: Map = new Map(MockUsers.map(user => [user.id, user])); + +export default MockUsers; \ No newline at end of file diff --git a/src/index.css b/src/index.css index 6a6bc85..03ad73f 100644 --- a/src/index.css +++ b/src/index.css @@ -20,6 +20,20 @@ border-color: var(--background-color); } +.page { + background-color: var(--background-color); + color: black; +} + +.pagetitle { + color: var(--color-fuchsia-50); +} + +.dreampanel { + background-color: var(--color-violet-400); + color: var(--color-fuchsia-200); +} + a { font-weight: 500; color: #646cff; diff --git a/src/pages/Feed.tsx b/src/pages/Feed.tsx new file mode 100644 index 0000000..51e6a5f --- /dev/null +++ b/src/pages/Feed.tsx @@ -0,0 +1,45 @@ +// src/pages/Feed.tsx +import {mockDreams} from '../data/MockDreams'; +import Dream from '../types/Dream'; +import type User from "../types/User.ts"; +import {MockUserMap} from "../data/MockUsers.ts"; + +export default function Feed() { + return ( +
+

Feed

+ +
+ ); +} diff --git a/src/types/Dream.ts b/src/types/Dream.ts new file mode 100644 index 0000000..1a75cb3 --- /dev/null +++ b/src/types/Dream.ts @@ -0,0 +1,39 @@ +export default class Dream{ + id: number; + userId: number; + title: string; + date: Date; + inputType: "text" | "image" | "audio" ; + input: string; + ai?:{ + interpretation: string; + image?: string; + audio?: string; + video?: string; + models?: string; + } + + constructor(params: { + id: number; + userId: number; + title: string; + date: Date; + inputType: "text" | "image" | "audio" ; + input: string; + ai: { + interpretation: string; + image?: string; + audio?: string; + video?: string; + models?: string; + } + }){ + this.id = params.id; + this.userId = params.userId; + this.title = params.title; + this.date = params.date; + this.inputType = params.inputType; + this.input = params.input; + this.ai= params.ai; + } +} \ No newline at end of file diff --git a/src/types/User.ts b/src/types/User.ts new file mode 100644 index 0000000..e483dcb --- /dev/null +++ b/src/types/User.ts @@ -0,0 +1,15 @@ +export default class User { + id: number; + name: string; + profilePicture: string; + + constructor( + id: number, + name: string, + profilePicture: string + ){ + this.id = id + this.name = name + this.profilePicture = profilePicture + } +} \ No newline at end of file