Hugging Face's logo

Spaces:
Lukasusem3
/
examprep-pro
Running

App Files Community
Lukasusem3 commited on
Commit
e81a36f
·
verified ·
1 Parent(s): b5f853b

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +6 -4
  2. index.html +628 -19
  3. prompts.txt +0 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Examprep Pro
3
- emoji: 💻
4
- colorFrom: green
5
  colorTo: yellow
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: examprep-pro
3
+ emoji: 🐳
4
+ colorFrom: purple
5
  colorTo: yellow
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,628 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="de">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>ExamPrep Pro - Intelligente Prüfungsvorbereitung</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <style>
10
+ .dropzone {
11
+ border: 2px dashed #3b82f6;
12
+ transition: all 0.3s ease;
13
+ }
14
+ .dropzone.active {
15
+ border-color: #10b981;
16
+ background-color: #f0fdf4;
17
+ }
18
+ .progress-bar {
19
+ transition: width 0.5s ease;
20
+ }
21
+ .topic-cloud {
22
+ display: flex;
23
+ flex-wrap: wrap;
24
+ justify-content: center;
25
+ align-items: center;
26
+ gap: 12px;
27
+ }
28
+ .topic-item {
29
+ padding: 8px 16px;
30
+ border-radius: 9999px;
31
+ transition: all 0.3s ease;
32
+ }
33
+ .topic-item:hover {
34
+ transform: scale(1.1);
35
+ }
36
+ .question-card {
37
+ transition: all 0.2s ease;
38
+ }
39
+ .question-card:hover {
40
+ transform: translateY(-2px);
41
+ box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
42
+ }
43
+ .solution {
44
+ max-height: 0;
45
+ overflow: hidden;
46
+ transition: max-height 0.5s ease;
47
+ }
48
+ .solution.open {
49
+ max-height: 500px;
50
+ }
51
+ @media (max-width: 640px) {
52
+ .topic-item {
53
+ padding: 6px 12px;
54
+ font-size: 0.875rem;
55
+ }
56
+ }
57
+ </style>
58
+ </head>
59
+ <body class="bg-gray-50 min-h-screen font-sans">
60
+ <!-- Header -->
61
+ <header class="bg-white shadow-sm">
62
+ <div class="container mx-auto px-4 py-6 flex justify-between items-center">
63
+ <div class="flex items-center space-x-2">
64
+ <i class="fas fa-graduation-cap text-3xl text-blue-600"></i>
65
+ <h1 class="text-2xl font-bold text-gray-800">ExamPrep Pro</h1>
66
+ </div>
67
+ <nav class="hidden md:flex space-x-6">
68
+ <a href="#" class="text-blue-600 font-medium">Startseite</a>
69
+ <a href="#" class="text-gray-600 hover:text-blue-600">Funktionen</a>
70
+ <a href="#" class="text-gray-600 hover:text-blue-600">Hilfe</a>
71
+ <a href="#" class="text-gray-600 hover:text-blue-600">Über uns</a>
72
+ </nav>
73
+ <button class="md:hidden text-gray-600">
74
+ <i class="fas fa-bars text-2xl"></i>
75
+ </button>
76
+ </div>
77
+ </header>
78
+
79
+ <!-- Main Content -->
80
+ <main class="container mx-auto px-4 py-8">
81
+ <!-- Hero Section -->
82
+ <section class="text-center mb-16">
83
+ <h2 class="text-4xl font-bold text-gray-800 mb-4">Intelligente Prüfungsvorbereitung</h2>
84
+ <p class="text-xl text-gray-600 max-w-3xl mx-auto mb-8">
85
+ Analysiere vergangene Prüfungen und erhalte maßgeschneiderte Übungstests mit KI-Unterstützung.
86
+ Perfekt für Studierende und Dozierende.
87
+ </p>
88
+ <div class="flex justify-center space-x-4">
89
+ <button id="startAnalysisBtn" class="bg-blue-600 hover:bg-blue-700 text-white font-medium py-3 px-6 rounded-lg transition">
90
+ Jetzt beginnen <i class="fas fa-arrow-right ml-2"></i>
91
+ </button>
92
+ <button class="border border-blue-600 text-blue-600 hover:bg-blue-50 font-medium py-3 px-6 rounded-lg transition">
93
+ Mehr erfahren
94
+ </button>
95
+ </div>
96
+ </section>
97
+
98
+ <!-- Upload Section -->
99
+ <section id="uploadSection" class="bg-white rounded-xl shadow-md p-8 mb-12 max-w-4xl mx-auto">
100
+ <div class="text-center mb-8">
101
+ <h3 class="text-2xl font-bold text-gray-800 mb-2">Prüfungen hochladen</h3>
102
+ <p class="text-gray-600">
103
+ Lade mindestens 3 Prüfungen desselben Moduls hoch (PDF bevorzugt). Je mehr Prüfungen, desto besser die Analyse.
104
+ </p>
105
+ </div>
106
+
107
+ <div id="dropzone" class="dropzone rounded-xl p-12 text-center cursor-pointer mb-6">
108
+ <div class="flex flex-col items-center justify-center">
109
+ <i class="fas fa-cloud-upload-alt text-5xl text-blue-500 mb-4"></i>
110
+ <p class="text-lg font-medium text-gray-700 mb-2">Dateien hierher ziehen und ablegen</p>
111
+ <p class="text-gray-500 mb-4">oder</p>
112
+ <label for="fileInput" class="bg-blue-600 hover:bg-blue-700 text-white font-medium py-2 px-6 rounded-lg transition cursor-pointer">
113
+ Dateien auswählen
114
+ </label>
115
+ <input id="fileInput" type="file" class="hidden" multiple accept=".pdf,.doc,.docx">
116
+ </div>
117
+ </div>
118
+
119
+ <div id="fileList" class="mb-6 hidden">
120
+ <h4 class="font-medium text-gray-700 mb-3">Ausgewählte Dateien:</h4>
121
+ <ul id="fileListItems" class="space-y-2"></ul>
122
+ </div>
123
+
124
+ <div class="flex justify-center">
125
+ <button id="analyzeBtn" class="bg-blue-600 hover:bg-blue-700 text-white font-medium py-3 px-8 rounded-lg transition disabled:opacity-50 disabled:cursor-not-allowed" disabled>
126
+ Analyse starten <i class="fas fa-magic ml-2"></i>
127
+ </button>
128
+ </div>
129
+ </section>
130
+
131
+ <!-- Analysis Progress Section -->
132
+ <section id="progressSection" class="bg-white rounded-xl shadow-md p-8 mb-12 max-w-4xl mx-auto hidden">
133
+ <div class="text-center mb-8">
134
+ <h3 class="text-2xl font-bold text-gray-800 mb-2">Analyse läuft</h3>
135
+ <p class="text-gray-600">
136
+ Unsere KI analysiert die hochgeladenen Prüfungen. Dies kann einige Minuten dauern.
137
+ </p>
138
+ </div>
139
+
140
+ <div class="mb-6">
141
+ <div class="flex justify-between mb-2">
142
+ <span class="text-sm font-medium text-gray-700">Fortschritt</span>
143
+ <span id="progressPercent" class="text-sm font-medium text-gray-700">0%</span>
144
+ </div>
145
+ <div class="w-full bg-gray-200 rounded-full h-2.5">
146
+ <div id="progressBar" class="progress-bar bg-blue-600 h-2.5 rounded-full" style="width: 0%"></div>
147
+ </div>
148
+ </div>
149
+
150
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6">
151
+ <div class="bg-blue-50 p-4 rounded-lg">
152
+ <div class="flex items-center mb-2">
153
+ <div class="bg-blue-100 p-2 rounded-full mr-3">
154
+ <i class="fas fa-tags text-blue-600"></i>
155
+ </div>
156
+ <span class="font-medium text-gray-700">Themenanalyse</span>
157
+ </div>
158
+ <p id="topicStatus" class="text-sm text-gray-600">Wird vorbereitet...</p>
159
+ </div>
160
+ <div class="bg-blue-50 p-4 rounded-lg">
161
+ <div class="flex items-center mb-2">
162
+ <div class="bg-blue-100 p-2 rounded-full mr-3">
163
+ <i class="fas fa-question-circle text-blue-600"></i>
164
+ </div>
165
+ <span class="font-medium text-gray-700">Frageformate</span>
166
+ </div>
167
+ <p id="formatStatus" class="text-sm text-gray-600">Wird vorbereitet...</p>
168
+ </div>
169
+ <div class="bg-blue-50 p-4 rounded-lg">
170
+ <div class="flex items-center mb-2">
171
+ <div class="bg-blue-100 p-2 rounded-full mr-3">
172
+ <i class="fas fa-chart-line text-blue-600"></i>
173
+ </div>
174
+ <span class="font-medium text-gray-700">Schwierigkeitsgrad</span>
175
+ </div>
176
+ <p id="difficultyStatus" class="text-sm text-gray-600">Wird vorbereitet...</p>
177
+ </div>
178
+ </div>
179
+
180
+ <div class="text-center">
181
+ <p class="text-gray-500 text-sm">
182
+ <i class="fas fa-info-circle mr-1"></i> Die Analyse wird auf unseren Servern durchgeführt. Ihre Dateien werden nach der Verarbeitung automatisch gelöscht.
183
+ </p>
184
+ </div>
185
+ </section>
186
+
187
+ <!-- Results Section -->
188
+ <section id="resultsSection" class="hidden">
189
+ <div class="bg-white rounded-xl shadow-md p-8 mb-8">
190
+ <div class="flex flex-col md:flex-row justify-between items-start md:items-center mb-6">
191
+ <div>
192
+ <h3 class="text-2xl font-bold text-gray-800 mb-2">Analyseergebnisse</h3>
193
+ <p class="text-gray-600">Basierend auf <span id="examCount" class="font-medium">3</span> hochgeladenen Prüfungen</p>
194
+ </div>
195
+ <button id="generateExamBtn" class="bg-green-600 hover:bg-green-700 text-white font-medium py-2 px-6 rounded-lg transition mt-4 md:mt-0">
196
+ Übungsprüfung generieren <i class="fas fa-file-alt ml-2"></i>
197
+ </button>
198
+ </div>
199
+
200
+ <!-- Topics Cloud -->
201
+ <div class="mb-8">
202
+ <h4 class="font-bold text-gray-700 mb-4">Häufigste Themengebiete</h4>
203
+ <div class="topic-cloud mb-4">
204
+ <span class="topic-item bg-blue-100 text-blue-800 text-lg">Grundlagen (32%)</span>
205
+ <span class="topic-item bg-blue-200 text-blue-900 text-xl">Algorithmen (28%)</span>
206
+ <span class="topic-item bg-blue-300 text-blue-900 text-lg">Datenstrukturen (24%)</span>
207
+ <span class="topic-item bg-blue-100 text-blue-800">Komplexität (12%)</span>
208
+ <span class="topic-item bg-blue-100 text-blue-800">Rekursion (10%)</span>
209
+ <span class="topic-item bg-blue-50 text-blue-700 text-sm">Graphen (8%)</span>
210
+ <span class="topic-item bg-blue-50 text-blue-700 text-sm">Sortierverfahren (6%)</span>
211
+ </div>
212
+ </div>
213
+
214
+ <!-- Charts -->
215
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-8 mb-8">
216
+ <div>
217
+ <h4 class="font-bold text-gray-700 mb-4">Frageformate Verteilung</h4>
218
+ <div class="bg-gray-100 rounded-lg p-4 h-64 flex items-center justify-center">
219
+ <p class="text-gray-500">[Balkendiagramm der Frageformate]</p>
220
+ </div>
221
+ </div>
222
+ <div>
223
+ <h4 class="font-bold text-gray-700 mb-4">Schwierigkeitsgrad</h4>
224
+ <div class="bg-gray-100 rounded-lg p-4 h-64 flex items-center justify-center">
225
+ <p class="text-gray-500">[Kreisdiagramm der Schwierigkeitsgrade]</p>
226
+ </div>
227
+ </div>
228
+ </div>
229
+
230
+ <!-- Detailed Stats -->
231
+ <div>
232
+ <h4 class="font-bold text-gray-700 mb-4">Detaillierte Statistik</h4>
233
+ <div class="overflow-x-auto">
234
+ <table class="min-w-full bg-white rounded-lg overflow-hidden">
235
+ <thead class="bg-gray-100">
236
+ <tr>
237
+ <th class="py-3 px-4 text-left text-gray-700">Themengebiet</th>
238
+ <th class="py-3 px-4 text-left text-gray-700">Häufigkeit</th>
239
+ <th class="py-3 px-4 text-left text-gray-700">Durchschn. Punkte</th>
240
+ <th class="py-3 px-4 text-left text-gray-700">Frageformate</th>
241
+ </tr>
242
+ </thead>
243
+ <tbody class="divide-y divide-gray-200">
244
+ <tr>
245
+ <td class="py-3 px-4">Algorithmen</td>
246
+ <td class="py-3 px-4">28%</td>
247
+ <td class="py-3 px-4">12/20</td>
248
+ <td class="py-3 px-4">Offen (60%), MC (30%), Berechnung (10%)</td>
249
+ </tr>
250
+ <tr>
251
+ <td class="py-3 px-4">Datenstrukturen</td>
252
+ <td class="py-3 px-4">24%</td>
253
+ <td class="py-3 px-4">15/20</td>
254
+ <td class="py-3 px-4">MC (50%), Offen (40%), Diagramm (10%)</td>
255
+ </tr>
256
+ <tr>
257
+ <td class="py-3 px-4">Grundlagen</td>
258
+ <td class="py-3 px-4">32%</td>
259
+ <td class="py-3 px-4">18/20</td>
260
+ <td class="py-3 px-4">MC (70%), Offen (30%)</td>
261
+ </tr>
262
+ </tbody>
263
+ </table>
264
+ </div>
265
+ </div>
266
+ </div>
267
+ </section>
268
+
269
+ <!-- Generated Exam Section -->
270
+ <section id="generatedExamSection" class="hidden">
271
+ <div class="bg-white rounded-xl shadow-md p-8 mb-8">
272
+ <div class="flex flex-col md:flex-row justify-between items-start md:items-center mb-6">
273
+ <div>
274
+ <h3 class="text-2xl font-bold text-gray-800 mb-2">Generierte Übungsprüfung</h3>
275
+ <p class="text-gray-600">Basierend auf den Analyseergebnissen</p>
276
+ </div>
277
+ <div class="flex space-x-3 mt-4 md:mt-0">
278
+ <button class="border border-blue-600 text-blue-600 hover:bg-blue-50 font-medium py-2 px-4 rounded-lg transition">
279
+ <i class="fas fa-download mr-2"></i> PDF
280
+ </button>
281
+ <button class="border border-green-600 text-green-600 hover:bg-green-50 font-medium py-2 px-4 rounded-lg transition">
282
+ <i class="fas fa-edit mr-2"></i> Anpassen
283
+ </button>
284
+ </div>
285
+ </div>
286
+
287
+ <div class="mb-6 p-4 bg-blue-50 rounded-lg">
288
+ <div class="flex items-start">
289
+ <div class="bg-blue-100 p-2 rounded-full mr-3 mt-1">
290
+ <i class="fas fa-info-circle text-blue-600"></i>
291
+ </div>
292
+ <div>
293
+ <p class="text-sm text-gray-700">
294
+ Diese Prüfung wurde von unserer KI erstellt und deckt die wichtigsten Themen ab. Sie enthält eine Mischung aus verschiedenen Fragetypen mit einem vergleichbaren Schwierigkeitsgrad wie die Originalprüfungen.
295
+ </p>
296
+ </div>
297
+ </div>
298
+ </div>
299
+
300
+ <!-- Exam Content -->
301
+ <div class="space-y-6">
302
+ <!-- Question 1 -->
303
+ <div class="question-card bg-gray-50 rounded-lg p-6">
304
+ <div class="flex justify-between items-start mb-3">
305
+ <h4 class="font-bold text-gray-800">Frage 1: Algorithmen (12 Punkte)</h4>
306
+ <span class="bg-blue-100 text-blue-800 text-xs font-medium px-2.5 py-0.5 rounded">Offene Frage</span>
307
+ </div>
308
+ <p class="text-gray-700 mb-4">
309
+ Erläutern Sie den Unterschied zwischen Greedy-Algorithmen und dynamischer Programmierung. Nennen Sie jeweils ein Beispiel und beschreiben Sie, wann welche Methode bevorzugt wird.
310
+ </p>
311
+ <button class="toggle-solution text-blue-600 hover:text-blue-800 text-sm font-medium flex items-center">
312
+ <i class="fas fa-chevron-down mr-1"></i> Lösung anzeigen
313
+ </button>
314
+ <div class="solution mt-3 bg-white p-4 rounded-lg border border-gray-200">
315
+ <p class="text-gray-700 mb-2"><strong>Greedy-Algorithmen:</strong> Lösen Probleme in Schritten, wobei jeder Schritt die lokal optimale Wahl trifft (z.B. Kruskals Algorithmus für minimale Spannbäume).</p>
316
+ <p class="text-gray-700 mb-2"><strong>Dynamische Programmierung:</strong> Löst Teilprobleme und speichert Ergebnisse für spätere Verwendung (z.B. Fibonacci-Zahlen).</p>
317
+ <p class="text-gray-700">Greedy ist einfacher aber nicht immer optimal. DP ist rechenintensiver aber garantiert optimale Lösungen.</p>
318
+ </div>
319
+ </div>
320
+
321
+ <!-- Question 2 -->
322
+ <div class="question-card bg-gray-50 rounded-lg p-6">
323
+ <div class="flex justify-between items-start mb-3">
324
+ <h4 class="font-bold text-gray-800">Frage 2: Datenstrukturen (8 Punkte)</h4>
325
+ <span class="bg-green-100 text-green-800 text-xs font-medium px-2.5 py-0.5 rounded">Multiple Choice</span>
326
+ </div>
327
+ <p class="text-gray-700 mb-3">
328
+ Welche der folgenden Aussagen über Hash-Tabellen sind korrekt? (Mehrere Antworten möglich)
329
+ </p>
330
+ <div class="space-y-2 mb-4">
331
+ <div class="flex items-center">
332
+ <input type="checkbox" class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500">
333
+ <label class="ml-2 text-gray-700">Die durchschnittliche Zeitkomplexität für Suche ist O(1)</label>
334
+ </div>
335
+ <div class="flex items-center">
336
+ <input type="checkbox" class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500">
337
+ <label class="ml-2 text-gray-700">Kollisionen können mit Verkettung oder offener Adressierung behandelt werden</label>
338
+ </div>
339
+ <div class="flex items-center">
340
+ <input type="checkbox" class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500">
341
+ <label class="ml-2 text-gray-700">Die Load-Factor sollte immer unter 0.5 bleiben</label>
342
+ </div>
343
+ <div class="flex items-center">
344
+ <input type="checkbox" class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500">
345
+ <label class="ml-2 text-gray-700">Perfektes Hashing garantiert O(1) Zeitkomplexität im Worst-Case</label>
346
+ </div>
347
+ </div>
348
+ <button class="toggle-solution text-blue-600 hover:text-blue-800 text-sm font-medium flex items-center">
349
+ <i class="fas fa-chevron-down mr-1"></i> Lösung anzeigen
350
+ </button>
351
+ <div class="solution mt-3 bg-white p-4 rounded-lg border border-gray-200">
352
+ <p class="text-gray-700">Korrekte Antworten: 1, 2, 4. Die Load-Factor kann je nach Implementierung höher sein, typischerweise wird bei 0.7-0.8 neu gehasht.</p>
353
+ </div>
354
+ </div>
355
+
356
+ <!-- Question 3 -->
357
+ <div class="question-card bg-gray-50 rounded-lg p-6">
358
+ <div class="flex justify-between items-start mb-3">
359
+ <h4 class="font-bold text-gray-800">Frage 3: Komplexität (10 Punkte)</h4>
360
+ <span class="bg-purple-100 text-purple-800 text-xs font-medium px-2.5 py-0.5 rounded">Berechnung</span>
361
+ </div>
362
+ <p class="text-gray-700 mb-4">
363
+ Gegeben ist folgender Algorithmus. Bestimmen Sie die Zeitkomplexität in O-Notation und begründen Sie Ihre Antwort:
364
+ <pre class="bg-gray-800 text-gray-100 p-3 rounded mt-2 overflow-x-auto">
365
+ function example(n) {
366
+ let sum = 0;
367
+ for (let i = 0; i < n; i++) {
368
+ for (let j = 0; j < i; j++) {
369
+ sum += i * j;
370
+ }
371
+ }
372
+ return sum;
373
+ }</pre>
374
+ </p>
375
+ <button class="toggle-solution text-blue-600 hover:text-blue-800 text-sm font-medium flex items-center">
376
+ <i class="fas fa-chevron-down mr-1"></i> Lösung anzeigen
377
+ </button>
378
+ <div class="solution mt-3 bg-white p-4 rounded-lg border border-gray-200">
379
+ <p class="text-gray-700">Die Zeitkomplexität ist O(n²). Die äußere Schleife läuft n-mal. Die innere Schleife läuft im ersten Durchgang 0-mal, dann 1-mal, dann 2-mal usw. bis n-1-mal. Die Gesamtanzahl der Operationen ist daher 0 + 1 + 2 + ... + (n-1) = n(n-1)/2 ∈ O(n²).</p>
380
+ </div>
381
+ </div>
382
+ </div>
383
+ </div>
384
+ </section>
385
+ </main>
386
+
387
+ <!-- Footer -->
388
+ <footer class="bg-gray-800 text-white py-12">
389
+ <div class="container mx-auto px-4">
390
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
391
+ <div>
392
+ <h4 class="text-lg font-bold mb-4">ExamPrep Pro</h4>
393
+ <p class="text-gray-400">
394
+ Intelligente Prüfungsvorbereitung mit KI-Unterstützung für Studierende und Dozierende.
395
+ </p>
396
+ </div>
397
+ <div>
398
+ <h4 class="text-lg font-bold mb-4">Funktionen</h4>
399
+ <ul class="space-y-2">
400
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Prüfungsanalyse</a></li>
401
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Übungstests</a></li>
402
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Themenvisualisierung</a></li>
403
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Schwierigkeitsgrad</a></li>
404
+ </ul>
405
+ </div>
406
+ <div>
407
+ <h4 class="text-lg font-bold mb-4">Rechtliches</h4>
408
+ <ul class="space-y-2">
409
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Datenschutz</a></li>
410
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Nutzungsbedingungen</a></li>
411
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Impressum</a></li>
412
+ </ul>
413
+ </div>
414
+ <div>
415
+ <h4 class="text-lg font-bold mb-4">Kontakt</h4>
416
+ <ul class="space-y-2">
417
+ <li class="flex items-center">
418
+ <i class="fas fa-envelope mr-2 text-gray-400"></i>
419
+ <span class="text-gray-400">support@exampreppro.de</span>
420
+ </li>
421
+ <li class="flex items-center">
422
+ <i class="fas fa-phone mr-2 text-gray-400"></i>
423
+ <span class="text-gray-400">+49 123 456789</span>
424
+ </li>
425
+ </ul>
426
+ </div>
427
+ </div>
428
+ <div class="border-t border-gray-700 mt-8 pt-8 text-center text-gray-400">
429
+ <p>&copy; 2023 ExamPrep Pro. Alle Rechte vorbehalten.</p>
430
+ </div>
431
+ </div>
432
+ </footer>
433
+
434
+ <script>
435
+ document.addEventListener('DOMContentLoaded', function() {
436
+ // DOM Elements
437
+ const dropzone = document.getElementById('dropzone');
438
+ const fileInput = document.getElementById('fileInput');
439
+ const fileList = document.getElementById('fileList');
440
+ const fileListItems = document.getElementById('fileListItems');
441
+ const analyzeBtn = document.getElementById('analyzeBtn');
442
+ const startAnalysisBtn = document.getElementById('startAnalysisBtn');
443
+ const uploadSection = document.getElementById('uploadSection');
444
+ const progressSection = document.getElementById('progressSection');
445
+ const resultsSection = document.getElementById('resultsSection');
446
+ const generateExamBtn = document.getElementById('generateExamBtn');
447
+ const generatedExamSection = document.getElementById('generatedExamSection');
448
+ const progressBar = document.getElementById('progressBar');
449
+ const progressPercent = document.getElementById('progressPercent');
450
+ const topicStatus = document.getElementById('topicStatus');
451
+ const formatStatus = document.getElementById('formatStatus');
452
+ const difficultyStatus = document.getElementById('difficultyStatus');
453
+ const toggleSolutionButtons = document.getElementsByClassName('toggle-solution');
454
+
455
+ // Variables
456
+ let files = [];
457
+
458
+ // Event Listeners
459
+ startAnalysisBtn.addEventListener('click', function() {
460
+ uploadSection.scrollIntoView({ behavior: 'smooth' });
461
+ });
462
+
463
+ // Drag and Drop functionality
464
+ dropzone.addEventListener('dragover', function(e) {
465
+ e.preventDefault();
466
+ this.classList.add('active');
467
+ });
468
+
469
+ dropzone.addEventListener('dragleave', function() {
470
+ this.classList.remove('active');
471
+ });
472
+
473
+ dropzone.addEventListener('drop', function(e) {
474
+ e.preventDefault();
475
+ this.classList.remove('active');
476
+ handleFiles(e.dataTransfer.files);
477
+ });
478
+
479
+ fileInput.addEventListener('change', function() {
480
+ handleFiles(this.files);
481
+ });
482
+
483
+ analyzeBtn.addEventListener('click', function() {
484
+ startAnalysis();
485
+ });
486
+
487
+ generateExamBtn.addEventListener('click', function() {
488
+ generateExam();
489
+ });
490
+
491
+ // Toggle solution visibility
492
+ for (let button of toggleSolutionButtons) {
493
+ button.addEventListener('click', function() {
494
+ const solution = this.nextElementSibling;
495
+ solution.classList.toggle('open');
496
+
497
+ const icon = this.querySelector('i');
498
+ if (solution.classList.contains('open')) {
499
+ icon.classList.remove('fa-chevron-down');
500
+ icon.classList.add('fa-chevron-up');
501
+ } else {
502
+ icon.classList.remove('fa-chevron-up');
503
+ icon.classList.add('fa-chevron-down');
504
+ }
505
+ });
506
+ }
507
+
508
+ // Functions
509
+ function handleFiles(newFiles) {
510
+ // Filter for PDFs and docs
511
+ const allowedTypes = ['application/pdf', 'application/msword', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'];
512
+ const filteredFiles = Array.from(newFiles).filter(file =>
513
+ allowedTypes.includes(file.type) || file.name.endsWith('.pdf') || file.name.endsWith('.doc') || file.name.endsWith('.docx')
514
+ );
515
+
516
+ if (filteredFiles.length < 3) {
517
+ alert('Bitte laden Sie mindestens 3 Prüfungen hoch (PDF oder Word bevorzugt).');
518
+ return;
519
+ }
520
+
521
+ files = filteredFiles;
522
+ updateFileList();
523
+
524
+ // Enable analyze button if we have at least 3 files
525
+ if (files.length >= 3) {
526
+ analyzeBtn.disabled = false;
527
+ }
528
+ }
529
+
530
+ function updateFileList() {
531
+ fileListItems.innerHTML = '';
532
+
533
+ files.forEach((file, index) => {
534
+ const listItem = document.createElement('li');
535
+ listItem.className = 'flex items-center justify-between bg-gray-100 p-3 rounded-lg';
536
+
537
+ const fileInfo = document.createElement('div');
538
+ fileInfo.className = 'flex items-center';
539
+
540
+ const icon = document.createElement('i');
541
+ if (file.type === 'application/pdf') {
542
+ icon.className = 'fas fa-file-pdf text-red-500 mr-2';
543
+ } else {
544
+ icon.className = 'fas fa-file-word text-blue-500 mr-2';
545
+ }
546
+
547
+ const fileName = document.createElement('span');
548
+ fileName.className = 'text-gray-700 truncate max-w-xs';
549
+ fileName.textContent = file.name;
550
+
551
+ const fileSize = document.createElement('span');
552
+ fileSize.className = 'text-gray-500 text-sm ml-2';
553
+ fileSize.textContent = `(${(file.size / 1024 / 1024).toFixed(2)} MB)`;
554
+
555
+ const removeBtn = document.createElement('button');
556
+ removeBtn.className = 'text-red-500 hover:text-red-700 ml-2';
557
+ removeBtn.innerHTML = '<i class="fas fa-times"></i>';
558
+ removeBtn.addEventListener('click', () => removeFile(index));
559
+
560
+ fileInfo.appendChild(icon);
561
+ fileInfo.appendChild(fileName);
562
+ fileInfo.appendChild(fileSize);
563
+
564
+ listItem.appendChild(fileInfo);
565
+ listItem.appendChild(removeBtn);
566
+
567
+ fileListItems.appendChild(listItem);
568
+ });
569
+
570
+ fileList.classList.remove('hidden');
571
+ }
572
+
573
+ function removeFile(index) {
574
+ files.splice(index, 1);
575
+ updateFileList();
576
+
577
+ if (files.length < 3) {
578
+ analyzeBtn.disabled = true;
579
+ }
580
+ }
581
+
582
+ function startAnalysis() {
583
+ uploadSection.classList.add('hidden');
584
+ progressSection.classList.remove('hidden');
585
+ progressSection.scrollIntoView({ behavior: 'smooth' });
586
+
587
+ // Simulate analysis progress
588
+ let progress = 0;
589
+ const interval = setInterval(() => {
590
+ progress += Math.random() * 10;
591
+ if (progress > 100) progress = 100;
592
+
593
+ progressBar.style.width = `${progress}%`;
594
+ progressPercent.textContent = `${Math.floor(progress)}%`;
595
+
596
+ // Update status messages
597
+ if (progress > 20) {
598
+ topicStatus.textContent = "In Bearbeitung...";
599
+ }
600
+ if (progress > 45) {
601
+ formatStatus.textContent = "In Bearbeitung...";
602
+ }
603
+ if (progress > 70) {
604
+ difficultyStatus.textContent = "In Bearbeitung...";
605
+ }
606
+
607
+ if (progress === 100) {
608
+ clearInterval(interval);
609
+ setTimeout(showResults, 1000);
610
+ }
611
+ }, 500);
612
+ }
613
+
614
+ function showResults() {
615
+ progressSection.classList.add('hidden');
616
+ resultsSection.classList.remove('hidden');
617
+ resultsSection.scrollIntoView({ behavior: 'smooth' });
618
+ }
619
+
620
+ function generateExam() {
621
+ resultsSection.classList.add('hidden');
622
+ generatedExamSection.classList.remove('hidden');
623
+ generatedExamSection.scrollIntoView({ behavior: 'smooth' });
624
+ }
625
+ });
626
+ </script>
627
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=Lukasusem3/examprep-pro" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
628
+ </html>
prompts.txt ADDED
File without changes