3

Dockerfile

@@ -1,37 +1,44 @@
 FROM python:3.9-slim
 
-# Installation des outils essentiels
+# Install essential tools
 RUN apt-get update && apt-get install -y \
     poppler-utils \
     pandoc \
     && apt-get clean \
     && rm -rf /var/lib/apt/lists/*
 
-# Définir le répertoire de travail
+# Set working directory
 WORKDIR /app
 
-# Copier d'abord les fichiers de dépendances
+# Copy requirements file first for better caching
 COPY requirements.txt ./
 
-# Installer les dépendances avec mise en cache
+# Install dependencies
 RUN pip install --no-cache-dir -r requirements.txt \
-    && pip install python-multipart uvicorn fastapi pydantic requests matplotlib pandas seaborn
+    && pip install python-multipart uvicorn fastapi pydantic requests jinja2
 
-# Créer les répertoires nécessaires avec les bonnes permissions
+# Create directories and set permissions
 RUN mkdir -p /app/frontend \
     && mkdir -p /tmp/.matplotlib \
     && chmod 777 /tmp/.matplotlib
 
-# Variables d'environnement
+# Set environment variables
 ENV MPLCONFIGDIR=/tmp/.matplotlib
 ENV PYTHONUNBUFFERED=1
+# Uncomment and set your HF API key if needed
+# ENV HF_API_KEY=your_huggingface_api_key
 
-# Copier le code de l'application et les fichiers statiques
+# Copy application code and static files
 COPY backend_fastapi.py ./
 COPY frontend ./frontend/
 
-# Exposer le port
+# Create requirements.txt if it doesn't exist yet
+RUN if [ ! -f requirements.txt ]; then \
+    echo "fastapi==0.103.1\nuvicorn==0.23.2\npython-multipart==0.0.6\nrequests==2.31.0\nJinja2==3.1.2\npydantic==2.4.2" > requirements.txt; \
+    fi
+
+# Expose port
 EXPOSE 7860
 
-# Commande de démarrage
+# Start command
 CMD ["uvicorn", "backend_fastapi:app", "--host", "0.0.0.0", "--port", "7860"]

frontend/script.js

@@ -1,10 +1,10 @@
 // Constante pour l'URL de base
-const BASE_URL = "";  // Laisser vide pour utiliser l'URL relative (important pour Hugging Face)
+const BASE_URL = window.location.origin;  // Utiliser l'URL complète pour éviter les erreurs CORS
 
 // Gestion des onglets
 function openTab(tabName) {
-  // Liste des onglets que nous utilisons (uniquement summarize et answer-question)
-  const tabs = ['summarize', 'answer-question'];
+  // Liste des onglets disponibles
+  const tabs = ['summarize', 'answer-question', 'interpret-image', 'generate-visualization', 'translate-document'];
   
   // Cacher/montrer les sections appropriées
   tabs.forEach(tab => {
@@ -87,6 +87,9 @@ document.addEventListener('DOMContentLoaded', () => {
     // Configurer les uploads de fichiers
     setupFileUpload('summarize-file');
     setupFileUpload('answer-question-file');
+    setupFileUpload('interpret-image-file');
+    setupFileUpload('visualization-file');
+    setupFileUpload('translate-file');
     
     // Configurer les onglets
     document.querySelectorAll('.tab-btn').forEach(btn => {
@@ -113,6 +116,19 @@ document.addEventListener('DOMContentLoaded', () => {
         handleQASubmit();
       });
     }
+
+    // Désactiver temporairement les onglets non implémentés
+    document.querySelectorAll('.tab-btn').forEach(btn => {
+      const tabName = btn.getAttribute('data-tab');
+      if (tabName !== 'summarize' && tabName !== 'answer-question') {
+        btn.addEventListener('click', (e) => {
+          e.preventDefault();
+          alert("Cette fonctionnalité n'est pas encore implémentée.");
+          // Ne pas changer d'onglet
+          return false;
+        });
+      }
+    });
     
   } catch (error) {
     console.error('Erreur d\'initialisation:', error);
@@ -137,13 +153,19 @@ async function handleSummarizeSubmit() {
     const formData = new FormData();
     formData.append('file', fileInput.files[0]);
     
+    // Utiliser fetch avec timeout et gestion d'erreur améliorée
+    const controller = new AbortController();
+    const timeoutId = setTimeout(() => controller.abort(), 60000); // 60s timeout
+    
     const response = await fetch(`${BASE_URL}/summarize`, {
       method: 'POST',
       body: formData,
-    });
+      signal: controller.signal
+    }).finally(() => clearTimeout(timeoutId));
     
     if (!response.ok) {
-      throw new Error(`Erreur: ${response.status} ${response.statusText}`);
+      const errorText = await response.text();
+      throw new Error(`Erreur: ${response.status} ${response.statusText}\n${errorText}`);
     }
     
     const data = await response.json();
@@ -168,7 +190,16 @@ async function handleSummarizeSubmit() {
     }
   } catch (error) {
     console.error('Erreur lors du résumé:', error);
-    showError(resultDiv, `Erreur lors du traitement du fichier: ${error.message}`);
+    
+    // Message d'erreur plus descriptif
+    let errorMessage = error.message;
+    if (error.name === 'AbortError') {
+      errorMessage = "La requête a pris trop de temps. Veuillez réessayer avec un fichier plus petit.";
+    } else if (error.message.includes("Failed to fetch")) {
+      errorMessage = "Impossible de contacter le serveur. Veuillez vérifier votre connexion ou contactez l'administrateur.";
+    }
+    
+    showError(resultDiv, `Erreur: ${errorMessage}`);
   }
 }
 
@@ -195,13 +226,19 @@ async function handleQASubmit() {
       formData.append('file', fileInput.files[0]);
     }
     
+    // Utiliser fetch avec timeout et gestion d'erreur améliorée
+    const controller = new AbortController();
+    const timeoutId = setTimeout(() => controller.abort(), 60000); // 60s timeout
+    
     const response = await fetch(`${BASE_URL}/answer-question`, {
       method: 'POST',
       body: formData,
-    });
+      signal: controller.signal
+    }).finally(() => clearTimeout(timeoutId));
     
     if (!response.ok) {
-      throw new Error(`Erreur: ${response.status} ${response.statusText}`);
+      const errorText = await response.text();
+      throw new Error(`Erreur: ${response.status} ${response.statusText}\n${errorText}`);
     }
     
     const data = await response.json();
@@ -226,6 +263,15 @@ async function handleQASubmit() {
     }
   } catch (error) {
     console.error('Erreur de question-réponse:', error);
-    showError(resultDiv, `Erreur lors du traitement de la question: ${error.message}`);
+    
+    // Message d'erreur plus descriptif
+    let errorMessage = error.message;
+    if (error.name === 'AbortError') {
+      errorMessage = "La requête a pris trop de temps. Veuillez réessayer avec une question plus courte ou un fichier plus petit.";
+    } else if (error.message.includes("Failed to fetch")) {
+      errorMessage = "Impossible de contacter le serveur. Veuillez vérifier votre connexion ou contactez l'administrateur.";
+    }
+    
+    showError(resultDiv, `Erreur: ${errorMessage}`);
   }
 }