Docfile commited on
Commit
905cf18
·
verified ·
1 Parent(s): 3754501

Delete templates/maj.html

Browse files
Files changed (1) hide show
  1. templates/maj.html +0 -377
templates/maj.html DELETED
@@ -1,377 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="fr">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>Mariam | Solution Mathématique</title>
7
- <!-- Tailwind CSS -->
8
- <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/tailwind.min.css" rel="stylesheet">
9
-
10
- <!-- Configuration MathJax -->
11
- <script>
12
- window.MathJax = {
13
- tex: {
14
- inlineMath: [['$', '$']],
15
- displayMath: [['$$', '$$']],
16
- processEscapes: true,
17
- packages: {'[+]': ['autoload','ams']}
18
- },
19
- options: {
20
- enableMenu: false,
21
- messageStyle: 'none'
22
- },
23
- startup: {
24
- pageReady: () => {
25
- console.log('MathJax est complètement chargé.');
26
- window.mathJaxReady = true;
27
- }
28
- }
29
- };
30
- </script>
31
- <script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js" id="MathJax-script" async></script>
32
- <script src="https://cdn.jsdelivr.net/npm/marked/lib/marked.umd.min.js"></script>
33
-
34
- <style>
35
- @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;700&display=swap');
36
-
37
- body {
38
- font-family: 'Space Grotesk', sans-serif;
39
- }
40
-
41
- .uploadArea {
42
- background: #f3f4f6;
43
- border: 2px dashed #d1d5db;
44
- transition: border-color 0.2s ease;
45
- }
46
- .uploadArea:hover {
47
- border-color: #3b82f6;
48
- }
49
-
50
- .blue-button {
51
- background: #3b82f6;
52
- transition: background-color 0.2s ease;
53
- }
54
- .blue-button:hover {
55
- background: #2563eb;
56
- }
57
-
58
- /* Suppression du style du bouton de téléchargement */
59
-
60
- .loader {
61
- width: 48px;
62
- height: 48px;
63
- border: 3px solid #3b82f6;
64
- border-bottom-color: transparent;
65
- border-radius: 50%;
66
- display: inline-block;
67
- animation: rotation 1s linear infinite;
68
- }
69
- @keyframes rotation {
70
- 0% { transform: rotate(0deg); }
71
- 100% { transform: rotate(360deg); }
72
- }
73
-
74
- .thought-box {
75
- transition: max-height 0.3s ease-out;
76
- max-height: 0;
77
- overflow: hidden;
78
- }
79
- .thought-box.open {
80
- max-height: 500px;
81
- }
82
-
83
- #thoughtsContent, #answerContent {
84
- max-height: 500px;
85
- overflow-y: auto;
86
- scroll-behavior: smooth;
87
- white-space: pre-wrap;
88
- }
89
-
90
- .preview-image {
91
- max-width: 300px;
92
- max-height: 300px;
93
- object-fit: contain;
94
- }
95
-
96
- .timestamp {
97
- color: #3b82f6;
98
- font-size: 0.9em;
99
- margin-left: 8px;
100
- }
101
-
102
- table {
103
- border-collapse: collapse;
104
- width: 100%;
105
- margin-bottom: 1rem;
106
- }
107
- th, td {
108
- border: 1px solid #d1d5db;
109
- padding: 0.5rem;
110
- text-align: left;
111
- }
112
- th {
113
- background-color: #f3f4f6;
114
- font-weight: 600;
115
- }
116
- .table-responsive {
117
- overflow-x: auto;
118
- }
119
-
120
- /* Suppression du style pour l'impression */
121
-
122
- .performance-warning {
123
- color: red;
124
- font-weight: bold;
125
- font-size: 1.2em;
126
- margin-top: 10px;
127
- margin-bottom: 25px;
128
- text-align: center;
129
- }
130
- </style>
131
- </head>
132
- <body class="p-4">
133
- <div class="max-w-4xl mx-auto">
134
- <header class="p-6 text-center mb-8">
135
- <h1 class="text-4xl font-bold text-blue-600">Mariam - M-0</h1>
136
- <p class="text-gray-600">Solution Mathématique/Physique/Chimie Intelligente</p>
137
- <p class="performance-warning">
138
- Vous utilisez actuellement les modèles/performances moyens. Accédez à des performances supérieures avec un abonnement premium !
139
- </p>
140
- </header>
141
-
142
- <main>
143
- <form id="problemForm" class="space-y-6" novalidate>
144
- <div class="uploadArea p-8 text-center relative" aria-label="Zone de dépôt d'image">
145
- <input type="file" id="imageInput" accept="image/*" class="absolute inset-0 w-full h-full opacity-0 cursor-pointer" aria-label="Choisir une image">
146
- <div class="space-y-3">
147
- <div class="w-16 h-16 mx-auto border-2 border-blue-400 rounded-full flex items-center justify-center">
148
- <svg class="w-8 h-8 text-blue-400" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
149
- <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z" />
150
- </svg>
151
- </div>
152
- <p class="text-gray-700 font-medium">Déposez votre image ici</p>
153
- <p class="text-gray-500 text-sm">ou cliquez pour sélectionner</p>
154
- </div>
155
- </div>
156
-
157
- <div id="imagePreview" class="hidden text-center">
158
- <img id="previewImage" class="preview-image mx-auto" alt="Prévisualisation de l'image sélectionnée">
159
- </div>
160
-
161
- <button type="submit" class="blue-button w-full py-3 text-white font-medium rounded-lg">
162
- Résoudre le problème
163
- </button>
164
- </form>
165
-
166
- <div id="loader" class="hidden mt-8 text-center">
167
- <span class="loader"></span>
168
- <p class="mt-4 text-gray-600">Analyse en cours...</p>
169
- </div>
170
-
171
- <section id="solution" class="hidden mt-8 space-y-6">
172
- <div class="border-t pt-4">
173
- <button id="thoughtsToggle" type="button" class="w-full flex justify-between items-center p-2">
174
- <span class="font-medium text-gray-700">Processus de Réflexion</span>
175
- <span id="timestamp" class="timestamp"></span>
176
- </button>
177
- <div id="thoughtsBox" class="thought-box">
178
- <div id="thoughtsContent" class="p-4 text-gray-600"></div>
179
- </div>
180
- </div>
181
- <div class="border-t pt-6">
182
- <div class="flex justify-between items-center mb-4">
183
- <h3 class="text-xl font-bold text-gray-800">Solution</h3>
184
- <!-- Suppression du bouton de téléchargement -->
185
- </div>
186
- <div id="answerContent" class="text-gray-700 table-responsive"></div>
187
- </div>
188
- </section>
189
- </main>
190
- </div>
191
-
192
- <script>
193
- document.addEventListener('DOMContentLoaded', () => {
194
- const form = document.getElementById('problemForm');
195
- const imageInput = document.getElementById('imageInput');
196
- const loader = document.getElementById('loader');
197
- const solutionSection = document.getElementById('solution');
198
- const thoughtsContent = document.getElementById('thoughtsContent');
199
- const answerContent = document.getElementById('answerContent');
200
- const thoughtsToggle = document.getElementById('thoughtsToggle');
201
- const thoughtsBox = document.getElementById('thoughtsBox');
202
- const imagePreview = document.getElementById('imagePreview');
203
- const previewImage = document.getElementById('previewImage');
204
- const timestamp = document.getElementById('timestamp');
205
-
206
- let startTime = null;
207
- let timerInterval = null;
208
- let thoughtsBuffer = '';
209
- let answerBuffer = '';
210
- let currentMode = null;
211
- let updateTimeout = null;
212
-
213
- // Suppression de la fonction generatePDF et de son appel
214
-
215
- const updateTimestamp = () => {
216
- if (startTime) {
217
- const seconds = Math.floor((Date.now() - startTime) / 1000);
218
- timestamp.textContent = `${seconds}s`;
219
- }
220
- };
221
-
222
- const startTimer = () => {
223
- startTime = Date.now();
224
- timerInterval = setInterval(updateTimestamp, 1000);
225
- updateTimestamp();
226
- };
227
-
228
- const stopTimer = () => {
229
- clearInterval(timerInterval);
230
- startTime = null;
231
- timestamp.textContent = '';
232
- };
233
-
234
- const handleFileSelect = file => {
235
- if (!file) return;
236
- const reader = new FileReader();
237
- reader.onload = e => {
238
- previewImage.src = e.target.result;
239
- imagePreview.classList.remove('hidden');
240
- };
241
- reader.readAsDataURL(file);
242
- };
243
-
244
- thoughtsToggle.addEventListener('click', () => {
245
- thoughtsBox.classList.toggle('open');
246
- });
247
-
248
- imageInput.addEventListener('change', e => handleFileSelect(e.target.files[0]));
249
-
250
- const dropZone = document.querySelector('.uploadArea');
251
- dropZone.addEventListener('dragover', e => {
252
- e.preventDefault();
253
- dropZone.classList.add('border-blue-400');
254
- });
255
- dropZone.addEventListener('dragleave', e => {
256
- e.preventDefault();
257
- dropZone.classList.remove('border-blue-400');
258
- });
259
- dropZone.addEventListener('drop', e => {
260
- e.preventDefault();
261
- dropZone.classList.remove('border-blue-400');
262
- handleFileSelect(e.dataTransfer.files[0]);
263
- });
264
-
265
- const typesetAnswerIfReady = async () => {
266
- if (window.mathJaxReady) {
267
- MathJax.startup.document.elements = [document.getElementById('answerContent')];
268
- await MathJax.typesetPromise();
269
- answerContent.scrollTop = answerContent.scrollHeight;
270
- } else {
271
- setTimeout(typesetAnswerIfReady, 200);
272
- }
273
- };
274
-
275
- const updateDisplay = async () => {
276
- thoughtsContent.innerHTML = marked.parse(thoughtsBuffer);
277
- answerContent.innerHTML = marked.parse(answerBuffer);
278
- await typesetAnswerIfReady();
279
- updateTimeout = null;
280
- };
281
-
282
- const scheduleUpdate = () => {
283
- if (updateTimeout) return;
284
- updateTimeout = setTimeout(updateDisplay, 200);
285
- };
286
-
287
- marked.setOptions({
288
- gfm: true,
289
- breaks: true
290
- });
291
-
292
- form.addEventListener('submit', async e => {
293
- e.preventDefault();
294
- const file = imageInput.files[0];
295
- if (!file) {
296
- alert('Veuillez sélectionner une image.');
297
- return;
298
- }
299
-
300
- startTimer();
301
- loader.classList.remove('hidden');
302
- solutionSection.classList.add('hidden');
303
- thoughtsContent.innerHTML = '';
304
- answerContent.innerHTML = '';
305
- thoughtsBuffer = '';
306
- answerBuffer = '';
307
- currentMode = null;
308
- thoughtsBox.classList.add('open');
309
-
310
- const formData = new FormData();
311
- formData.append('image', file);
312
-
313
- try {
314
- const response = await fetch('/solved', {
315
- method: 'POST',
316
- body: formData
317
- });
318
-
319
- const reader = response.body.getReader();
320
- const decoder = new TextDecoder();
321
- let buffer = '';
322
-
323
- const processChunk = async chunk => {
324
- buffer += decoder.decode(chunk, { stream: true });
325
- const lines = buffer.split('\n\n');
326
- buffer = lines.pop();
327
-
328
- for (const line of lines) {
329
- if (!line.startsWith('data:')) continue;
330
- const data = JSON.parse(line.slice(5));
331
-
332
- if (data.mode) {
333
- currentMode = data.mode;
334
- loader.classList.add('hidden');
335
- solutionSection.classList.remove('hidden');
336
- }
337
- if (data.content) {
338
- if (currentMode === 'thinking') {
339
- thoughtsBuffer += data.content;
340
- } else if (currentMode === 'answering') {
341
- answerBuffer += data.content;
342
- }
343
- }
344
- }
345
- scheduleUpdate();
346
- };
347
-
348
- while (true) {
349
- const { done, value } = await reader.read();
350
- if (done) {
351
- if (buffer) {
352
- const data = JSON.parse(buffer.slice(5));
353
- if (data.content) {
354
- if (currentMode === 'thinking') {
355
- thoughtsBuffer += data.content;
356
- } else if (currentMode === 'answering') {
357
- answerBuffer += data.content;
358
- }
359
- }
360
- }
361
- scheduleUpdate();
362
- break;
363
- }
364
- await processChunk(value);
365
- }
366
- stopTimer();
367
- } catch (error) {
368
- console.error('Erreur:', error);
369
- alert('Une erreur est survenue.');
370
- loader.classList.add('hidden');
371
- stopTimer();
372
- }
373
- });
374
- });
375
- </script>
376
- </body>
377
- </html>