Hugging Face's logo

Spaces:
docto41
/
conai
Running

App Files Community
docto41 commited on
Commit
467209a
·
verified ·
1 Parent(s): 33d424b

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +319 -19
  3. prompts.txt +1 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Conai
3
- emoji: 🔥
4
- colorFrom: blue
5
- colorTo: blue
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: conai
3
+ emoji: 🐳
4
+ colorFrom: pink
5
+ colorTo: gray
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,319 @@
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="fr">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>CONAI - Assistant Médical</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
+ .gradient-bg {
11
+ background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
12
+ }
13
+ .chat-message.user {
14
+ background-color: #e0f2fe;
15
+ border-radius: 1rem 1rem 0 1rem;
16
+ }
17
+ .chat-message.bot {
18
+ background-color: #f8fafc;
19
+ border-radius: 1rem 1rem 1rem 0;
20
+ }
21
+ .typing-indicator span {
22
+ animation: bounce 1.5s infinite ease-in-out;
23
+ }
24
+ .typing-indicator span:nth-child(2) {
25
+ animation-delay: 0.2s;
26
+ }
27
+ .typing-indicator span:nth-child(3) {
28
+ animation-delay: 0.4s;
29
+ }
30
+ @keyframes bounce {
31
+ 0%, 100% { transform: translateY(0); }
32
+ 50% { transform: translateY(-5px); }
33
+ }
34
+ </style>
35
+ </head>
36
+ <body class="bg-gray-50 font-sans">
37
+ <div class="min-h-screen flex flex-col">
38
+ <!-- Header -->
39
+ <header class="gradient-bg text-white shadow-lg">
40
+ <div class="container mx-auto px-4 py-6">
41
+ <div class="flex justify-between items-center">
42
+ <div class="flex items-center space-x-4">
43
+ <i class="fas fa-robot text-3xl"></i>
44
+ <div>
45
+ <h1 class="text-2xl font-bold">CONAI</h1>
46
+ <p class="text-sm opacity-80">Assistant Médical Intelligent</p>
47
+ </div>
48
+ </div>
49
+ <div class="hidden md:flex items-center space-x-4">
50
+ <a href="#" class="hover:underline">Accueil</a>
51
+ <a href="#" class="hover:underline">Fonctionnalités</a>
52
+ <a href="#" class="hover:underline">À propos</a>
53
+ </div>
54
+ <button class="md:hidden text-2xl">
55
+ <i class="fas fa-bars"></i>
56
+ </button>
57
+ </div>
58
+ </div>
59
+ </header>
60
+
61
+ <!-- Main Content -->
62
+ <main class="flex-grow container mx-auto px-4 py-8 flex flex-col md:flex-row gap-8">
63
+ <!-- Sidebar -->
64
+ <aside class="md:w-1/4 bg-white p-6 rounded-xl shadow-md">
65
+ <div class="mb-8">
66
+ <h2 class="text-xl font-semibold mb-4 text-gray-800">Présentation</h2>
67
+ <p class="text-gray-600 mb-4">
68
+ CONAI est un assistant médical intelligent conçu pour vous aider dans vos questions de santé.
69
+ </p>
70
+ <div class="bg-blue-50 p-4 rounded-lg border border-blue-100">
71
+ <h3 class="font-medium text-blue-800 mb-2">⚠️ Avertissement</h3>
72
+ <p class="text-sm text-blue-700">
73
+ Les informations fournies ne remplacent pas un avis médical professionnel. Consultez toujours un médecin pour des problèmes de santé.
74
+ </p>
75
+ </div>
76
+ </div>
77
+
78
+ <div class="mb-8">
79
+ <h2 class="text-xl font-semibold mb-4 text-gray-800">Exemples de questions</h2>
80
+ <ul class="space-y-2">
81
+ <li>
82
+ <button onclick="setExampleQuestion(this)" class="text-left w-full px-3 py-2 bg-gray-100 hover:bg-gray-200 rounded-lg transition">
83
+ Quels sont les symptômes de la grippe ?
84
+ </button>
85
+ </li>
86
+ <li>
87
+ <button onclick="setExampleQuestion(this)" class="text-left w-full px-3 py-2 bg-gray-100 hover:bg-gray-200 rounded-lg transition">
88
+ Comment traiter une migraine ?
89
+ </button>
90
+ </li>
91
+ <li>
92
+ <button onclick="setExampleQuestion(this)" class="text-left w-full px-3 py-2 bg-gray-100 hover:bg-gray-200 rounded-lg transition">
93
+ Quand dois-je consulter un médecin pour une fièvre ?
94
+ </button>
95
+ </li>
96
+ </ul>
97
+ </div>
98
+
99
+ <div class="bg-green-50 p-4 rounded-lg border border-green-100">
100
+ <h3 class="font-medium text-green-800 mb-2">💡 Conseil</h3>
101
+ <p class="text-sm text-green-700">
102
+ Soyez aussi précis que possible dans vos questions pour obtenir des réponses plus pertinentes.
103
+ </p>
104
+ </div>
105
+ </aside>
106
+
107
+ <!-- Chat Container -->
108
+ <div class="md:w-3/4 flex flex-col">
109
+ <div class="bg-white rounded-xl shadow-md flex-grow flex flex-col">
110
+ <!-- Chat Header -->
111
+ <div class="border-b p-4 flex items-center space-x-3">
112
+ <div class="w-10 h-10 rounded-full gradient-bg flex items-center justify-center text-white">
113
+ <i class="fas fa-robot"></i>
114
+ </div>
115
+ <div>
116
+ <h3 class="font-semibold">CONAI Assistant</h3>
117
+ <p class="text-xs text-gray-500">En ligne</p>
118
+ </div>
119
+ </div>
120
+
121
+ <!-- Chat Messages -->
122
+ <div id="chat-container" class="flex-grow p-4 overflow-y-auto space-y-4 h-96">
123
+ <div class="chat-message bot p-4 shadow-sm">
124
+ <div class="flex items-start space-x-2">
125
+ <div class="w-8 h-8 rounded-full bg-blue-100 flex items-center justify-center text-blue-600">
126
+ <i class="fas fa-robot text-sm"></i>
127
+ </div>
128
+ <div>
129
+ <p class="font-medium text-gray-800">CONAI</p>
130
+ <p class="text-gray-700">Bonjour ! Je suis CONAI, votre assistant médical intelligent. Posez-moi vos questions sur la santé et je ferai de mon mieux pour vous répondre.</p>
131
+ </div>
132
+ </div>
133
+ </div>
134
+ </div>
135
+
136
+ <!-- Input Area -->
137
+ <div class="border-t p-4">
138
+ <form id="chat-form" class="flex space-x-2">
139
+ <input
140
+ type="text"
141
+ id="user-input"
142
+ placeholder="Posez votre question médicale..."
143
+ class="flex-grow px-4 py-2 border rounded-full focus:outline-none focus:ring-2 focus:ring-blue-500"
144
+ autocomplete="off"
145
+ >
146
+ <button
147
+ type="submit"
148
+ class="w-12 h-12 rounded-full gradient-bg text-white flex items-center justify-center hover:opacity-90 transition"
149
+ >
150
+ <i class="fas fa-paper-plane"></i>
151
+ </button>
152
+ </form>
153
+ <p class="text-xs text-gray-500 mt-2 text-center">
154
+ CONAI peut produire des réponses inexactes. Vérifiez toujours les informations importantes.
155
+ </p>
156
+ </div>
157
+ </div>
158
+ </div>
159
+ </main>
160
+
161
+ <!-- Footer -->
162
+ <footer class="bg-gray-800 text-white py-8">
163
+ <div class="container mx-auto px-4">
164
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
165
+ <div>
166
+ <h3 class="text-lg font-semibold mb-4">CONAI</h3>
167
+ <p class="text-gray-300">
168
+ Assistant médical intelligent conçu pour fournir des informations de santé fiables et accessibles.
169
+ </p>
170
+ </div>
171
+ <div>
172
+ <h3 class="text-lg font-semibold mb-4">Liens utiles</h3>
173
+ <ul class="space-y-2">
174
+ <li><a href="#" class="text-gray-300 hover:text-white transition">Mentions légales</a></li>
175
+ <li><a href="#" class="text-gray-300 hover:text-white transition">Politique de confidentialité</a></li>
176
+ <li><a href="#" class="text-gray-300 hover:text-white transition">Contact</a></li>
177
+ </ul>
178
+ </div>
179
+ <div>
180
+ <h3 class="text-lg font-semibold mb-4">Connectez-vous</h3>
181
+ <div class="flex space-x-4">
182
+ <a href="#" class="w-10 h-10 rounded-full bg-gray-700 hover:bg-blue-600 transition flex items-center justify-center">
183
+ <i class="fab fa-facebook-f"></i>
184
+ </a>
185
+ <a href="#" class="w-10 h-10 rounded-full bg-gray-700 hover:bg-blue-400 transition flex items-center justify-center">
186
+ <i class="fab fa-twitter"></i>
187
+ </a>
188
+ <a href="#" class="w-10 h-10 rounded-full bg-gray-700 hover:bg-pink-600 transition flex items-center justify-center">
189
+ <i class="fab fa-instagram"></i>
190
+ </a>
191
+ </div>
192
+ </div>
193
+ </div>
194
+ <div class="border-t border-gray-700 mt-8 pt-6 text-center text-gray-400">
195
+ <p>© 2023 CONAI. Tous droits réservés.</p>
196
+ </div>
197
+ </div>
198
+ </footer>
199
+ </div>
200
+
201
+ <script>
202
+ // Set example question
203
+ function setExampleQuestion(button) {
204
+ const question = button.textContent.trim();
205
+ document.getElementById('user-input').value = question;
206
+ document.getElementById('user-input').focus();
207
+ }
208
+
209
+ // Chat functionality
210
+ document.getElementById('chat-form').addEventListener('submit', function(e) {
211
+ e.preventDefault();
212
+ const userInput = document.getElementById('user-input');
213
+ const message = userInput.value.trim();
214
+
215
+ if (message) {
216
+ // Add user message to chat
217
+ addMessage(message, 'user');
218
+ userInput.value = '';
219
+
220
+ // Show typing indicator
221
+ showTypingIndicator();
222
+
223
+ // Simulate bot response after delay
224
+ setTimeout(() => {
225
+ removeTypingIndicator();
226
+ const botResponse = generateBotResponse(message);
227
+ addMessage(botResponse, 'bot');
228
+ }, 1500);
229
+ }
230
+ });
231
+
232
+ function addMessage(text, sender) {
233
+ const chatContainer = document.getElementById('chat-container');
234
+ const messageDiv = document.createElement('div');
235
+ messageDiv.className = `chat-message ${sender} p-4 shadow-sm`;
236
+
237
+ if (sender === 'user') {
238
+ messageDiv.innerHTML = `
239
+ <div class="flex items-start space-x-2 justify-end">
240
+ <div>
241
+ <p class="font-medium text-gray-800 text-right">Vous</p>
242
+ <p class="text-gray-700">${text}</p>
243
+ </div>
244
+ <div class="w-8 h-8 rounded-full bg-blue-600 flex items-center justify-center text-white">
245
+ <i class="fas fa-user text-sm"></i>
246
+ </div>
247
+ </div>
248
+ `;
249
+ } else {
250
+ messageDiv.innerHTML = `
251
+ <div class="flex items-start space-x-2">
252
+ <div class="w-8 h-8 rounded-full bg-blue-100 flex items-center justify-center text-blue-600">
253
+ <i class="fas fa-robot text-sm"></i>
254
+ </div>
255
+ <div>
256
+ <p class="font-medium text-gray-800">CONAI</p>
257
+ <p class="text-gray-700">${text}</p>
258
+ </div>
259
+ </div>
260
+ `;
261
+ }
262
+
263
+ chatContainer.appendChild(messageDiv);
264
+ chatContainer.scrollTop = chatContainer.scrollHeight;
265
+ }
266
+
267
+ function showTypingIndicator() {
268
+ const chatContainer = document.getElementById('chat-container');
269
+ const typingDiv = document.createElement('div');
270
+ typingDiv.className = 'chat-message bot p-4 shadow-sm';
271
+ typingDiv.id = 'typing-indicator';
272
+ typingDiv.innerHTML = `
273
+ <div class="flex items-start space-x-2">
274
+ <div class="w-8 h-8 rounded-full bg-blue-100 flex items-center justify-center text-blue-600">
275
+ <i class="fas fa-robot text-sm"></i>
276
+ </div>
277
+ <div>
278
+ <p class="font-medium text-gray-800">CONAI</p>
279
+ <div class="typing-indicator flex space-x-1 mt-1">
280
+ <span class="w-2 h-2 bg-gray-400 rounded-full inline-block"></span>
281
+ <span class="w-2 h-2 bg-gray-400 rounded-full inline-block"></span>
282
+ <span class="w-2 h-2 bg-gray-400 rounded-full inline-block"></span>
283
+ </div>
284
+ </div>
285
+ </div>
286
+ `;
287
+ chatContainer.appendChild(typingDiv);
288
+ chatContainer.scrollTop = chatContainer.scrollHeight;
289
+ }
290
+
291
+ function removeTypingIndicator() {
292
+ const typingIndicator = document.getElementById('typing-indicator');
293
+ if (typingIndicator) {
294
+ typingIndicator.remove();
295
+ }
296
+ }
297
+
298
+ // Simple response generation (in a real app, this would call an API)
299
+ function generateBotResponse(message) {
300
+ const lowerMessage = message.toLowerCase();
301
+
302
+ if (lowerMessage.includes('grippe')) {
303
+ return "Les symptômes courants de la grippe incluent fièvre, frissons, toux, maux de gorge, écoulement nasal, douleurs musculaires, maux de tête et fatigue. La grippe peut varier de légère à sévère. Consultez un médecin si les symptômes sont graves ou persistent.";
304
+ } else if (lowerMessage.includes('migraine')) {
305
+ return "Pour traiter une migraine, vous pouvez :\n1. Prendre des analgésiques comme l'ibuprofène ou le paracétamol\n2. Vous reposer dans un endroit calme et sombre\n3. Appliquer une compresse froide sur le front\n4. Boire beaucoup d'eau\n5. Éviter les déclencheurs comme le stress, certains aliments ou le manque de sommeil.\nSi les migraines sont fréquentes ou sévères, consultez un médecin.";
306
+ } else if (lowerMessage.includes('fièvre')) {
307
+ return "Vous devriez consulter un médecin pour une fièvre dans les cas suivants :\n- Si la fièvre dépasse 39°C chez un adulte\n- Si elle dure plus de 3 jours\n- Si elle s'accompagne de raideur de la nuque, confusion, difficultés respiratoires\n- Pour les nourrissons de moins de 3 mois avec une température rectale de 38°C ou plus.";
308
+ } else {
309
+ const responses = [
310
+ "Je comprends votre préoccupation. Pour cette question, je recommande de consulter un professionnel de santé pour un avis personnalisé.",
311
+ "C'est une question intéressante. Les informations que je peux fournir sont générales. Pour des conseils spécifiques à votre situation, veuillez consulter un médecin.",
312
+ "Je peux vous donner des informations générales sur ce sujet, mais rappelez-vous que seul un professionnel de santé peut vous fournir un diagnostic ou un traitement personnalisé."
313
+ ];
314
+ return responses[Math.floor(Math.random() * responses.length)];
315
+ }
316
+ }
317
+ </script>
318
+ <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=docto41/conai" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
319
+ </html>
prompts.txt ADDED
@@ -0,0 +1 @@
 
 
1
+ corrige le site :https://huggingface.co/spaces/doctorblog/conai