Upload 12 files

Dockerfile

@@ -0,0 +1,25 @@
+FROM python:3.10-slim
+
+WORKDIR /app
+
+# Installer les dépendances système nécessaires
+RUN apt-get update && apt-get install -y --no-install-recommends \
+    build-essential \
+    libpq-dev \
+    && rm -rf /var/lib/apt/lists/*
+
+# Copier les fichiers de dépendances et les installer
+COPY requirements.txt .
+RUN pip install --no-cache-dir -r requirements.txt
+
+# Créer le répertoire uploads
+RUN mkdir -p uploads
+
+# Copier le reste des fichiers de l'application
+COPY . .
+
+# Exposer le port
+EXPOSE 8000
+
+# Commande de démarrage
+CMD ["uvicorn", "app:app", "--host", "0.0.0.0", "--port", "8000"]

README.md

@@ -1,11 +1,117 @@
----
-title: Home23
-emoji: 🏢
-colorFrom: red
-colorTo: gray
-sdk: docker
-pinned: false
-license: mit
----
-
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+# Cosmic AI Assistant
+
+Une application de chatbot IA avec une interface élégante inspirée de l'univers et des galaxies.
+
+## Fonctionnalités
+
+- **Interface utilisateur cosmique** avec deux thèmes (sombre et coloré) et animations d'étoiles et particules
+- **Résumé de texte** utilisant le modèle facebook/bart-large-cnn
+- **Description d'images** avec le modèle Salesforce/blip-image-captioning-large
+- **Questions-réponses** basées sur du texte avec deepset/roberta-base-squad2
+- **Questions sur images** (Visual QA) avec Salesforce/blip-vqa-base
+- **Visualisation de données** à partir de fichiers Excel/CSV
+- **Traduction** vers plusieurs langues (français, espagnol, allemand, italien, russe)
+- **Génération de texte** avec GPT-2
+
+## Structure du projet
+
+```
+cosmic_chatbot/
+├── static/
+│   ├── styles.css       # Styles CSS avec thèmes sombre et coloré
+│   ├── scripts.js       # JavaScript pour les animations et interactions
+│   ├── index.html       # Page principale
+│   └── favicon.svg      # Icône du site
+├── templates/
+│   └── index.html       # Template pour le rendu côté serveur
+├── app.py               # Backend FastAPI amélioré
+├── requirements.txt     # Dépendances Python
+├── run.sh               # Script de démarrage
+├── Dockerfile           # Configuration pour Docker
+├── docker-compose.yml   # Configuration pour Docker Compose
+└── README.md            # Documentation
+```
+
+## Installation
+
+### Méthode 1 : Installation standard
+
+1. Assurez-vous d'avoir Python 3.8+ installé
+2. Clonez ce dépôt
+3. Exécutez le script d'installation et de démarrage :
+
+```bash
+./run.sh
+```
+
+Le script installera toutes les dépendances nécessaires et démarrera l'application.
+
+### Méthode 2 : Installation avec Docker
+
+1. Assurez-vous d'avoir Docker et Docker Compose installés
+2. Clonez ce dépôt
+3. Construisez et démarrez le conteneur :
+
+```bash
+docker-compose up --build
+```
+
+Pour exécuter en arrière-plan :
+
+```bash
+docker-compose up -d
+```
+
+Pour arrêter le conteneur :
+
+```bash
+docker-compose down
+```
+
+## Utilisation avec Hugging Face Spaces
+
+Ce projet est compatible avec Hugging Face Spaces qui utilise Docker. Pour déployer sur Hugging Face :
+
+1. Créez un nouveau Space de type "Docker"
+2. Téléchargez tous les fichiers du projet dans votre Space
+3. Le Dockerfile et docker-compose.yml fournis sont déjà configurés pour fonctionner avec Hugging Face
+
+## Utilisation
+
+Accédez à l'application via votre navigateur à l'adresse : http://localhost:8000
+
+L'interface vous permet de :
+- Basculer entre les thèmes sombre et coloré
+- Explorer les différentes fonctionnalités via le bouton "Fonctionnalités"
+- Télécharger des fichiers (images, documents, données)
+- Interagir avec l'IA via le champ de texte
+
+## Améliorations apportées
+
+### Interface utilisateur
+- Design élégant inspiré de l'univers et des galaxies
+- Animations d'étoiles et de particules flottantes
+- Deux thèmes (sombre et coloré) avec transition fluide
+- Présentation visuelle des fonctionnalités
+- Affichage amélioré des messages et du code
+- Interface responsive pour mobile et desktop
+
+### Backend
+- Modèles IA améliorés et plus performants
+- Détection d'intention plus sophistiquée
+- Gestion des erreurs robuste
+- Nouvelles fonctionnalités (Visual QA, génération de texte)
+- Support de plus de langues pour la traduction
+- Génération de code de visualisation plus avancée
+
+## Notes techniques
+
+- L'application utilise FastAPI pour le backend
+- Les modèles sont chargés à la demande et mis en cache pour de meilleures performances
+- Le premier chargement peut prendre quelques minutes pour télécharger les modèles
+- Pour les grandes instances, un GPU est recommandé pour de meilleures performances
+- La configuration Docker inclut toutes les dépendances nécessaires
+
+## Licence
+
+Ce projet est sous licence MIT.

app.py

@@ -0,0 +1,666 @@
+from fastapi import FastAPI, UploadFile, File, Form, HTTPException, Request
+from fastapi.staticfiles import StaticFiles
+from fastapi.responses import RedirectResponse, JSONResponse, HTMLResponse
+from fastapi.templating import Jinja2Templates
+from transformers import pipeline, MarianMTModel, MarianTokenizer, BlipProcessor, BlipForConditionalGeneration
+from typing import Optional, Dict, Any, List
+import logging
+import time
+import os
+import io
+import json
+from PIL import Image
+from docx import Document
+import fitz  # PyMuPDF
+import pandas as pd
+from functools import lru_cache
+import re
+import torch
+import numpy as np
+from pydantic import BaseModel
+
+# Configure logging
+logging.basicConfig(
+    level=logging.INFO,
+    format='%(asctime)s - %(name)s - %(levelname)s - %(message)s'
+)
+logger = logging.getLogger("cosmic_ai")
+
+# Create app directory if it doesn't exist
+os.makedirs("uploads", exist_ok=True)
+
+app = FastAPI(
+    title="Cosmic AI Assistant",
+    description="Une IA avancée avec interface inspirée de l'univers",
+    version="2.0.0"
+)
+
+# Mount static files
+app.mount("/static", StaticFiles(directory="static"), name="static")
+
+# Setup templates
+templates = Jinja2Templates(directory="templates")
+
+# Model configurations with improved models
+MODELS = {
+    "summarization": "facebook/bart-large-cnn",  # Upgraded from t5-small
+    "translation": {
+        "fr": "Helsinki-NLP/opus-mt-en-fr",
+        "es": "Helsinki-NLP/opus-mt-en-es",
+        "de": "Helsinki-NLP/opus-mt-en-de",
+        "it": "Helsinki-NLP/opus-mt-en-it",  # Added Italian
+        "ru": "Helsinki-NLP/opus-mt-en-ru",  # Added Russian
+    },
+    "image-to-text": "Salesforce/blip-image-captioning-large",  # Upgraded from base
+    "question-answering": "deepset/roberta-base-squad2",
+    "visual-qa": "Salesforce/blip-vqa-base",  # Added Visual QA model
+    "text-generation": "gpt2-medium"  # Added text generation
+}
+
+# Cache for model loading to improve performance
+@lru_cache(maxsize=8)  # Increased cache size
+def load_model(task: str, model_name: str = None):
+    """Cached model loader with proper task names and error handling"""
+    try:
+        logger.info(f"Loading model for task: {task}, model: {model_name or MODELS.get(task)}")
+        start_time = time.time()
+        
+        if task == "translation" and model_name:
+            tokenizer = MarianTokenizer.from_pretrained(model_name)
+            model = MarianMTModel.from_pretrained(model_name)
+            pipe = pipeline("translation", model=model, tokenizer=tokenizer)
+        elif task == "visual-qa":
+            # Special handling for BLIP VQA model
+            processor = BlipProcessor.from_pretrained(model_name or MODELS.get(task))
+            model = BlipForConditionalGeneration.from_pretrained(model_name or MODELS.get(task))
+            
+            # Return a custom callable instead of a pipeline
+            def visual_qa_fn(image, question):
+                inputs = processor(image, question, return_tensors="pt")
+                outputs = model.generate(**inputs)
+                return processor.decode(outputs[0], skip_special_tokens=True)
+            
+            pipe = visual_qa_fn
+        else:
+            # Use device="cuda" if GPU is available
+            device = 0 if torch.cuda.is_available() else -1
+            pipe = pipeline(task, model=model_name or MODELS.get(task), device=device)
+        
+        load_time = time.time() - start_time
+        logger.info(f"Model loaded in {load_time:.2f} seconds")
+        return pipe
+    except Exception as e:
+        logger.error(f"Model load failed: {str(e)}")
+        raise HTTPException(status_code=500, detail=f"Model loading failed: {task} - {str(e)}")
+
+def detect_intent(text: str = None, file: UploadFile = None) -> str:
+    """Enhanced intent detection with more sophisticated patterns"""
+    # File-based detection with improved mime type handling
+    if file:
+        content_type = file.content_type.lower() if file.content_type else ""
+        filename = file.filename.lower() if file.filename else ""
+        
+        if content_type.startswith('image/'):
+            # Check for visual QA pattern in text
+            if text and any(q in text.lower() for q in ['what is', 'what\'s', 'describe', 'tell me about', 'explain']):
+                return "visual-qa"
+            return "image-to-text"
+        elif filename.endswith(('.xlsx', '.xls', '.csv')):
+            return "visualize"
+        elif filename.endswith(('.pdf', '.docx', '.doc', '.txt', '.rtf')):
+            return "summarize"
+    
+    # No text provided
+    if not text:
+        return "unknown"
+    
+    text_lower = text.lower()
+    
+    # Translation detection with improved language detection
+    lang_patterns = {
+        'fr': [r'\b(français|traduire en français|fr)\b', r'translate to french'],
+        'es': [r'\b(español|spanish|traduire en espagnol|es)\b', r'translate to spanish'],
+        'de': [r'\b(deutsch|german|traduire en allemand|de)\b', r'translate to german'],
+        'it': [r'\b(italiano|italian|traduire en italien|it)\b', r'translate to italian'],
+        'ru': [r'\b(русский|russian|traduire en russe|ru)\b', r'translate to russian'],
+    }
+    
+    for lang, patterns in lang_patterns.items():
+        if any(re.search(pattern, text_lower) for pattern in patterns):
+            return f"translate-{lang}"
+    
+    if re.search(r'\b(translate|traduire|translation)\b', text_lower):
+        return "translate-fr"  # Default to French if language not specified
+    
+    # Question detection with improved patterns
+    question_patterns = [
+        r'\b(what|when|where|why|how|who|which)\b',
+        r'\?',
+        r'\b(explain|tell me|describe|define)\b'
+    ]
+    
+    if any(re.search(pattern, text_lower) for pattern in question_patterns):
+        return "question-answering"
+    
+    # Text generation detection
+    generation_patterns = [
+        r'\b(write|generate|create|compose)\b',
+        r'\b(story|poem|essay|text|content)\b'
+    ]
+    
+    if any(re.search(pattern, text_lower) for pattern in generation_patterns):
+        return "text-generation"
+    
+    # Summarization for long text
+    if len(text) > 100:
+        return "summarize"
+    
+    return "unknown"
+
+class ProcessResponse(BaseModel):
+    response: str
+    type: str
+    additional_data: Optional[Dict[str, Any]] = None
+
+@app.post("/process", response_model=ProcessResponse)
+async def process_input(
+    request: Request,
+    text: str = Form(None),
+    file: UploadFile = File(None)
+):
+    """Enhanced unified endpoint with improved processing and error handling"""
+    start_time = time.time()
+    client_ip = request.client.host
+    logger.info(f"Request from {client_ip}: text={text[:50] + '...' if text and len(text) > 50 else text}, file={file.filename if file else None}")
+    
+    # Detect intent
+    if text and "translate" in text.lower():
+        # Check for specific language in translation request
+        for lang in MODELS["translation"].keys():
+            if lang in text.lower():
+                intent = f"translate-{lang}"
+                break
+        else:
+            intent = "translate-fr"  # Default to French
+    else:
+        intent = detect_intent(text, file)
+    
+    logger.info(f"Detected intent: {intent}")
+    
+    try:
+        # Process based on intent
+        if intent == "summarize":
+            content = await extract_text_from_file(file) if file else text
+            summarizer = load_model("summarization")
+            
+            # Handle long content with chunking
+            if len(content) > 1024:
+                chunks = [content[i:i+1024] for i in range(0, len(content), 1024)]
+                summaries = []
+                
+                for chunk in chunks[:3]:  # Limit to first 3 chunks to avoid excessive processing
+                    summary = summarizer(chunk, max_length=150, min_length=30, do_sample=False)
+                    summaries.append(summary[0]['summary_text'])
+                
+                final_summary = " ".join(summaries)
+            else:
+                summary = summarizer(content, max_length=150, min_length=30, do_sample=False)
+                final_summary = summary[0]['summary_text']
+            
+            return {"response": final_summary, "type": "summary"}
+            
+        elif intent.startswith("translate-"):
+            lang = intent.split("-")[1]
+            content = await extract_text_from_file(file) if file else text
+            
+            # Remove the translation instruction from the content
+            translation_patterns = [
+                r'translate to \w+:',
+                r'translate this to \w+:',
+                r'traduire en \w+:',
+                r'traduire ceci en \w+:'
+            ]
+            
+            for pattern in translation_patterns:
+                content = re.sub(pattern, '', content, flags=re.IGNORECASE).strip()
+            
+            translator = load_model("translation", MODELS["translation"][lang])
+            
+            # Handle long content with chunking
+            if len(content) > 512:
+                chunks = [content[i:i+512] for i in range(0, len(content), 512)]
+                translations = []
+                
+                for chunk in chunks:
+                    translated = translator(chunk)
+                    translations.append(translated[0]['translation_text'])
+                
+                final_translation = " ".join(translations)
+            else:
+                translated = translator(content)
+                final_translation = translated[0]['translation_text']
+            
+            return {"response": final_translation, "type": "translation"}
+            
+        elif intent == "question-answering":
+            context = await extract_text_from_file(file) if file else None
+            
+            if not context and not text:
+                raise HTTPException(status_code=400, detail="Aucun contexte fourni")
+            
+            qa_pipeline = load_model("question-answering")
+            
+            # Extract the question from text if both question and context are in the same text
+            if not context and "?" in text:
+                parts = text.split("?", 1)
+                question = parts[0] + "?"
+                context = parts[1].strip() if len(parts) > 1 and parts[1].strip() else text
+            else:
+                question = text if text else "Résume ce document"
+            
+            result = qa_pipeline(
+                question=question,
+                context=context[:2000] if context else text[:2000]
+            )
+            
+            return {"response": result["answer"], "type": "answer"}
+            
+        elif intent == "image-to-text":
+            if not file or not file.content_type.startswith('image/'):
+                raise HTTPException(status_code=400, detail="Un fichier image est requis")
+            
+            image = Image.open(io.BytesIO(await file.read()))
+            captioner = load_model("image-to-text")
+            
+            # Generate more detailed caption
+            caption = captioner(image, max_new_tokens=50)
+            
+            return {"response": caption[0]['generated_text'], "type": "caption"}
+            
+        elif intent == "visual-qa":
+            if not file or not file.content_type.startswith('image/'):
+                raise HTTPException(status_code=400, detail="Un fichier image est requis")
+            
+            if not text:
+                raise HTTPException(status_code=400, detail="Une question sur l'image est requise")
+            
+            image = Image.open(io.BytesIO(await file.read()))
+            vqa_model = load_model("visual-qa", MODELS["visual-qa"])
+            
+            # Process the visual question
+            answer = vqa_model(image, text)
+            
+            return {"response": answer, "type": "visual_qa"}
+            
+        elif intent == "visualize":
+            if not file:
+                raise HTTPException(status_code=400, detail="Un fichier Excel est requis")
+            
+            file_content = await file.read()
+            
+            # Determine file type and read accordingly
+            if file.filename.endswith('.csv'):
+                df = pd.read_csv(io.BytesIO(file_content))
+            else:
+                df = pd.read_excel(io.BytesIO(file_content))
+            
+            # Generate more sophisticated visualization code based on data
+            code = generate_visualization_code(df, text)
+            
+            return {"response": code, "type": "visualization_code"}
+            
+        elif intent == "text-generation":
+            generator = load_model("text-generation")
+            
+            # Generate text with better parameters
+            generated = generator(
+                text,
+                max_length=200,
+                num_return_sequences=1,
+                temperature=0.8,
+                top_p=0.92,
+                do_sample=True
+            )
+            
+            return {"response": generated[0]["generated_text"], "type": "generated_text"}
+            
+        else:
+            # Fallback to a helpful response
+            return {
+                "response": "Je ne suis pas sûr de comprendre votre demande. Vous pouvez :\n- Télécharger une image pour obtenir une description\n- Poser une question sur un texte ou une image\n- Demander un résumé d'un document\n- Demander une traduction\n- Télécharger un fichier Excel pour une visualisation",
+                "type": "clarification"
+            }
+            
+    except Exception as e:
+        logger.error(f"Processing error: {str(e)}", exc_info=True)
+        raise HTTPException(status_code=500, detail=str(e))
+    finally:
+        process_time = time.time() - start_time
+        logger.info(f"Request processed in {process_time:.2f} seconds")
+
+async def extract_text_from_file(file: UploadFile) -> str:
+    """Enhanced text extraction with better error handling and format support"""
+    if not file:
+        return ""
+    
+    content = await file.read()
+    filename = file.filename.lower()
+    
+    try:
+        if filename.endswith('.pdf'):
+            doc = fitz.open(stream=content, filetype="pdf")
+            text = ""
+            for page in doc:
+                text += page.get_text()
+            return text
+        elif filename.endswith(('.docx', '.doc')):
+            doc = Document(io.BytesIO(content))
+            return "\n".join(para.text for para in doc.paragraphs)
+        elif filename.endswith('.txt'):
+            return content.decode('utf-8', errors='replace')
+        elif filename.endswith('.rtf'):
+            # Basic RTF to text conversion
+            text = content.decode('utf-8', errors='replace')
+            # Remove RTF formatting codes (simplified)
+            text = re.sub(r'\\[a-z]+', ' ', text)
+            text = re.sub(r'\{|\}|\\', '', text)
+            return text
+        else:
+            raise HTTPException(status_code=400, detail=f"Format de fichier non pris en charge: {filename}")
+    except Exception as e:
+        logger.error(f"File extraction error: {str(e)}", exc_info=True)
+        raise HTTPException(status_code=500, detail=f"Erreur lors de l'extraction du texte: {str(e)}")
+
+def generate_visualization_code(df: pd.DataFrame, request: str = None) -> str:
+    """Generate more sophisticated visualization code based on data analysis"""
+    # Analyze the dataframe
+    num_rows, num_cols = df.shape
+    column_types = df.dtypes
+    numeric_cols = df.select_dtypes(include=[np.number]).columns.tolist()
+    categorical_cols = df.select_dtypes(include=['object']).columns.tolist()
+    date_cols = [col for col in df.columns if df[col].dtype == 'datetime64[ns]' or 
+                (isinstance(df[col].dtype, object) and pd.to_datetime(df[col], errors='coerce').notna().all())]
+    
+    # Determine the best visualization based on data and request
+    if request:
+        request_lower = request.lower()
+    else:
+        request_lower = ""
+    
+    # Generate appropriate code based on data structure and request
+    if len(numeric_cols) >= 2 and ("scatter" in request_lower or "correlation" in request_lower):
+        # Scatter plot for correlation
+        x_col = numeric_cols[0]
+        y_col = numeric_cols[1]
+        return f"""import pandas as pd
+import matplotlib.pyplot as plt
+import seaborn as sns
+
+# Charger les données
+df = pd.read_excel('{file.filename if file else "data.xlsx"}')
+
+# Créer un scatter plot avec régression
+plt.figure(figsize=(10, 6))
+sns.regplot(x='{x_col}', y='{y_col}', data=df, scatter_kws={{'alpha': 0.6}})
+plt.title('Corrélation entre {x_col} et {y_col}')
+plt.grid(True, alpha=0.3)
+plt.tight_layout()
+plt.savefig('correlation_plot.png')
+plt.show()
+
+# Calculer et afficher le coefficient de corrélation
+correlation = df['{x_col}'].corr(df['{y_col}'])
+print(f"Coefficient de corrélation: {correlation:.4f}")"""
+
+    elif len(numeric_cols) >= 1 and len(categorical_cols) >= 1 and ("bar" in request_lower or "comparison" in request_lower):
+        # Bar chart for comparison
+        cat_col = categorical_cols[0]
+        num_col = numeric_cols[0]
+        return f"""import pandas as pd
+import matplotlib.pyplot as plt
+import seaborn as sns
+
+# Charger les données
+df = pd.read_excel('{file.filename if file else "data.xlsx"}')
+
+# Créer un bar plot amélioré
+plt.figure(figsize=(12, 7))
+ax = sns.barplot(x='{cat_col}', y='{num_col}', data=df, palette='viridis')
+
+# Ajouter les valeurs sur les barres
+for p in ax.patches:
+    ax.annotate(f'{{p.get_height():.1f}}', 
+                (p.get_x() + p.get_width() / 2., p.get_height()), 
+                ha='center', va='bottom', fontsize=10, color='black', xytext=(0, 5),
+                textcoords='offset points')
+
+plt.title('Comparaison de {num_col} par {cat_col}', fontsize=15)
+plt.xlabel('{cat_col}', fontsize=12)
+plt.ylabel('{num_col}', fontsize=12)
+plt.xticks(rotation=45, ha='right')
+plt.grid(axis='y', alpha=0.3)
+plt.tight_layout()
+plt.savefig('comparison_chart.png')
+plt.show()"""
+
+    elif len(numeric_cols) >= 1 and ("distribution" in request_lower or "histogram" in request_lower):
+        # Histogram for distribution
+        num_col = numeric_cols[0]
+        return f"""import pandas as pd
+import matplotlib.pyplot as plt
+import seaborn as sns
+
+# Charger les données
+df = pd.read_excel('{file.filename if file else "data.xlsx"}')
+
+# Créer un histogramme avec courbe de densité
+plt.figure(figsize=(10, 6))
+sns.histplot(df['{num_col}'], kde=True, bins=20, color='purple')
+plt.title('Distribution de {num_col}', fontsize=15)
+plt.xlabel('{num_col}', fontsize=12)
+plt.ylabel('Fréquence', fontsize=12)
+plt.grid(True, alpha=0.3)
+plt.tight_layout()
+plt.savefig('distribution_plot.png')
+plt.show()
+
+# Afficher les statistiques descriptives
+print(df['{num_col}'].describe())"""
+
+    elif len(numeric_cols) >= 3 and ("pairplot" in request_lower or "multi" in request_lower):
+        # Pairplot for multiple variables
+        return f"""import pandas as pd
+import matplotlib.pyplot as plt
+import seaborn as sns
+
+# Charger les données
+df = pd.read_excel('{file.filename if file else "data.xlsx"}')
+
+# Créer un pairplot
+plt.figure(figsize=(12, 10))
+sns.set(style="ticks")
+plot = sns.pairplot(df[{numeric_cols[:5]}], diag_kind='kde', plot_kws={{'alpha': 0.6}})
+plot.fig.suptitle('Matrice de Corrélation des Variables Numériques', y=1.02, fontsize=16)
+plt.tight_layout()
+plt.savefig('pairplot.png')
+plt.show()
+
+# Afficher la matrice de corrélation
+correlation_matrix = df[{numeric_cols[:5]}].corr()
+plt.figure(figsize=(10, 8))
+sns.heatmap(correlation_matrix, annot=True, cmap='coolwarm', fmt='.2f', linewidths=0.5)
+plt.title('Matrice de Corrélation')
+plt.tight_layout()
+plt.savefig('correlation_matrix.png')
+plt.show()"""
+
+    elif len(date_cols) >= 1 and len(numeric_cols) >= 1 and ("time" in request_lower or "trend" in request_lower):
+        # Time series plot
+        date_col = date_cols[0]
+        num_col = numeric_cols[0]
+        return f"""import pandas as pd
+import matplotlib.pyplot as plt
+import seaborn as sns
+import matplotlib.dates as mdates
+
+# Charger les données
+df = pd.read_excel('{file.filename if file else "data.xlsx"}')
+
+# Convertir la colonne de date
+df['{date_col}'] = pd.to_datetime(df['{date_col}'])
+df = df.sort_values(by='{date_col}')
+
+# Créer un graphique de série temporelle
+plt.figure(figsize=(12, 6))
+plt.plot(df['{date_col}'], df['{num_col}'], marker='o', linestyle='-', color='#7b2cbf', linewidth=2, markersize=6)
+
+# Formater l'axe des dates
+plt.gca().xaxis.set_major_formatter(mdates.DateFormatter('%Y-%m-%d'))
+plt.gca().xaxis.set_major_locator(mdates.AutoDateLocator())
+
+plt.title('Évolution de {num_col} dans le temps', fontsize=15)
+plt.xlabel('Date', fontsize=12)
+plt.ylabel('{num_col}', fontsize=12)
+plt.grid(True, alpha=0.3)
+plt.xticks(rotation=45)
+plt.tight_layout()
+plt.savefig('time_series.png')
+plt.show()
+
+# Calculer la tendance
+from scipy import stats
+x = np.arange(len(df))
+slope, intercept, r_value, p_value, std_err = stats.linregress(x, df['{num_col}'])
+print(f"Tendance: {'Positive' if slope > 0 else 'Négative'}, Pente: {slope:.4f}, R²: {r_value**2:.4f}")"""
+
+    elif len(categorical_cols) >= 1 and len(numeric_cols) >= 1 and ("pie" in request_lower or "proportion" in request_lower):
+        # Pie chart
+        cat_col = categorical_cols[0]
+        num_col = numeric_cols[0]
+        return f"""import pandas as pd
+import matplotlib.pyplot as plt
+import seaborn as sns
+
+# Charger les données
+df = pd.read_excel('{file.filename if file else "data.xlsx"}')
+
+# Agréger les données pour le graphique en camembert
+pie_data = df.groupby('{cat_col}')['{num_col}'].sum()
+
+# Créer un graphique en camembert
+plt.figure(figsize=(10, 8))
+plt.pie(pie_data, labels=pie_data.index, autopct='%1.1f%%', startangle=90, 
+        shadow=True, explode=[0.05]*len(pie_data), colors=plt.cm.viridis(np.linspace(0, 1, len(pie_data))))
+plt.axis('equal')  # Equal aspect ratio ensures that pie is drawn as a circle
+plt.title('Répartition de {num_col} par {cat_col}', fontsize=15)
+plt.tight_layout()
+plt.savefig('pie_chart.png')
+plt.show()
+
+# Afficher les valeurs
+print(pie_data)"""
+
+    else:
+        # Default to a dashboard with multiple plots
+        return f"""import pandas as pd
+import matplotlib.pyplot as plt
+import seaborn as sns
+import numpy as np
+
+# Charger les données
+df = pd.read_excel('{file.filename if file else "data.xlsx"}')
+
+# Créer un tableau de bord avec plusieurs visualisations
+plt.figure(figsize=(15, 10))
+
+# 1. Statistiques descriptives
+print("Statistiques descriptives:")
+print(df.describe())
+
+# 2. Créer un tableau de bord avec plusieurs graphiques
+fig, axes = plt.subplots(2, 2, figsize=(15, 12))
+
+# Graphique 1: Heatmap de corrélation pour les colonnes numériques
+numeric_df = df.select_dtypes(include=[np.number])
+if not numeric_df.empty and numeric_df.shape[1] > 1:
+    sns.heatmap(numeric_df.corr(), annot=True, cmap='coolwarm', fmt='.2f', ax=axes[0, 0])
+    axes[0, 0].set_title('Matrice de Corrélation')
+
+# Graphique 2: Distribution d'une variable numérique
+if not numeric_df.empty:
+    for i, col in enumerate(numeric_df.columns[:1]):  # Première colonne numérique
+        sns.histplot(df[col], kde=True, ax=axes[0, 1], color='purple')
+        axes[0, 1].set_title(f'Distribution de {{col}}')
+        axes[0, 1].set_xlabel(col)
+        axes[0, 1].set_ylabel('Fréquence')
+
+# Graphique 3: Barplot pour les catégories
+categorical_cols = df.select_dtypes(include=['object']).columns
+if len(categorical_cols) > 0 and not numeric_df.empty:
+    cat_col = categorical_cols[0]
+    num_col = numeric_df.columns[0]
+    sns.barplot(x=cat_col, y=num_col, data=df, ax=axes[1, 0], palette='viridis')
+    axes[1, 0].set_title(f'{{num_col}} par {{cat_col}}')
+    axes[1, 0].set_xticklabels(axes[1, 0].get_xticklabels(), rotation=45, ha='right')
+
+# Graphique 4: Boxplot
+if not numeric_df.empty and len(categorical_cols) > 0:
+    cat_col = categorical_cols[0]
+    num_col = numeric_df.columns[0]
+    sns.boxplot(x=cat_col, y=num_col, data=df, ax=axes[1, 1], palette='Set3')
+    axes[1, 1].set_title(f'Distribution de {{num_col}} par {{cat_col}}')
+    axes[1, 1].set_xticklabels(axes[1, 1].get_xticklabels(), rotation=45, ha='right')
+
+plt.tight_layout()
+plt.savefig('dashboard.png')
+plt.show()
+
+# Code pour générer un rapport HTML interactif
+print("\\nCode pour générer un rapport interactif avec Plotly:")
+print('''
+import pandas as pd
+import plotly.express as px
+import plotly.io as pio
+from plotly.subplots import make_subplots
+import plotly.graph_objects as go
+
+# Charger les données
+df = pd.read_excel('data.xlsx')
+
+# Créer un rapport HTML interactif
+with open('rapport_interactif.html', 'w') as f:
+    f.write('<html><head><title>Rapport de Données Interactif</title></head><body>')
+    f.write('<h1>Rapport de Données Interactif</h1>')
+    
+    # Ajouter des graphiques interactifs
+    if df.select_dtypes(include=[np.number]).shape[1] > 1:
+        fig = px.scatter_matrix(df)
+        f.write(f'<div>{pio.to_html(fig, include_plotlyjs="cdn")}</div>')
+    
+    # Ajouter d'autres graphiques selon les données
+    # ...
+    
+    f.write('</body></html>')
+
+print("Rapport HTML interactif généré: rapport_interactif.html")
+''')"""
+
+@app.get("/", include_in_schema=False)
+async def home():
+    """Redirect to the static index.html file"""
+    return RedirectResponse(url="/static/index.html")
+
+@app.get("/health", include_in_schema=True)
+async def health_check():
+    """Health check endpoint"""
+    return {"status": "healthy", "version": "2.0.0"}
+
+@app.get("/models", include_in_schema=True)
+async def list_models():
+    """List available models"""
+    return {"models": MODELS}
+
+if __name__ == "__main__":
+    import uvicorn
+    # Use host="0.0.0.0" to make the server accessible externally
+    uvicorn.run("app:app", host="0.0.0.0", port=7860, reload=True)

docker-compose.yml

@@ -0,0 +1,12 @@
+version: '3'
+
+services:
+  cosmic-chatbot:
+    build: .
+    ports:
+      - "8000:8000"
+    volumes:
+      - ./uploads:/app/uploads
+    restart: unless-stopped
+    environment:
+      - PYTHONUNBUFFERED=1

requirements.txt

@@ -0,0 +1,16 @@
+fastapi==0.104.1
+uvicorn==0.23.2
+python-multipart==0.0.6
+jinja2==3.1.2
+transformers==4.35.0
+torch==2.1.0
+pillow==10.0.1
+python-docx==0.8.11
+pymupdf==1.23.3
+pandas==2.1.1
+numpy==1.26.0
+matplotlib==3.8.0
+seaborn==0.13.0
+openpyxl==3.1.2
+scikit-learn==1.3.1
+scipy==1.11.3

run.sh

@@ -0,0 +1,32 @@
+#!/bin/bash
+
+# Script d'installation et de démarrage pour Cosmic AI Assistant
+
+echo "🌌 Installation de Cosmic AI Assistant 🌌"
+echo "----------------------------------------"
+
+# Création du répertoire uploads s'il n'existe pas
+mkdir -p uploads
+echo "✅ Répertoire uploads créé"
+
+# Installation des dépendances
+echo "📦 Installation des dépendances Python..."
+pip install -r requirements.txt
+
+# Vérification de l'installation
+if [ $? -eq 0 ]; then
+    echo "✅ Dépendances installées avec succès"
+else
+    echo "❌ Erreur lors de l'installation des dépendances"
+    exit 1
+fi
+
+# Démarrage de l'application
+echo "🚀 Démarrage de Cosmic AI Assistant..."
+echo "----------------------------------------"
+echo "🔗 L'application sera accessible à l'adresse: http://localhost:8000"
+echo "⚠️  Première exécution: le téléchargement des modèles peut prendre quelques minutes"
+echo "----------------------------------------"
+
+# Lancement de l'application
+uvicorn app:app --host 0.0.0.0 --port 8000 --reload

static/index.html

@@ -0,0 +1,113 @@
+<!DOCTYPE html>
+<html lang="fr">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Cosmic AI Assistant</title>
+    <link href='https://unpkg.com/[email protected]/css/boxicons.min.css' rel='stylesheet'>
+    <link rel="stylesheet" href="/static/styles.css">
+    <link rel="icon" type="image/svg+xml" href="/static/favicon.svg">
+</head>
+<body>
+    <!-- Stars Background -->
+    <div class="stars" id="starsContainer"></div>
+    
+    <!-- Floating Particles -->
+    <div class="particles" id="particlesContainer"></div>
+    
+    <div class="app-container">
+        <!-- Header -->
+        <header class="app-header">
+            <div class="app-title">
+                <div class="app-logo">
+                    <i class='bx bx-planet'></i>
+                </div>
+                <h1>Cosmic AI Assistant</h1>
+            </div>
+            <div class="app-controls">
+                <button class="feature-toggle" id="featureToggle" data-tooltip="Afficher les fonctionnalités">
+                    <i class='bx bx-bulb'></i> Fonctionnalités
+                </button>
+                <button class="theme-toggle tooltip" id="themeToggle" data-tooltip="Changer de thème">
+                    <i class='bx bx-moon'></i>
+                </button>
+            </div>
+        </header>
+        
+        <!-- Feature Showcase -->
+        <div class="feature-showcase" id="featureShowcase">
+            <div class="feature-grid">
+                <div class="feature-card" data-feature="summarize">
+                    <div class="feature-icon"><i class='bx bx-book-content'></i></div>
+                    <h3>Résumé de Texte</h3>
+                    <p>Résumez automatiquement des documents, articles ou textes longs.</p>
+                </div>
+                <div class="feature-card" data-feature="image-caption">
+                    <div class="feature-icon"><i class='bx bx-image'></i></div>
+                    <h3>Description d'Images</h3>
+                    <p>Générez des descriptions détaillées à partir d'images.</p>
+                </div>
+                <div class="feature-card" data-feature="qa">
+                    <div class="feature-icon"><i class='bx bx-question-mark'></i></div>
+                    <h3>Questions-Réponses</h3>
+                    <p>Obtenez des réponses précises à vos questions.</p>
+                </div>
+                <div class="feature-card" data-feature="vqa">
+                    <div class="feature-icon"><i class='bx bx-image-alt'></i></div>
+                    <h3>Questions sur Images</h3>
+                    <p>Posez des questions sur le contenu d'une image.</p>
+                </div>
+                <div class="feature-card" data-feature="visualization">
+                    <div class="feature-icon"><i class='bx bx-bar-chart-alt-2'></i></div>
+                    <h3>Visualisation de Données</h3>
+                    <p>Générez du code pour visualiser vos données Excel.</p>
+                </div>
+                <div class="feature-card" data-feature="translate">
+                    <div class="feature-icon"><i class='bx bx-transfer'></i></div>
+                    <h3>Traduction</h3>
+                    <p>Traduisez du texte vers différentes langues.</p>
+                </div>
+            </div>
+        </div>
+        
+        <!-- Chat Container -->
+        <div class="chat-container">
+            <div class="messages" id="messages">
+                <div class="message bot-message">
+                    <div class="markdown-content">
+                        <p>Bonjour ! Je suis votre assistant IA cosmique. Téléchargez un fichier ou posez une question, et je peux :</p>
+                        <ul>
+                            <li>Résumer des documents</li>
+                            <li>Décrire des images</li>
+                            <li>Répondre à vos questions</li>
+                            <li>Traduire du texte</li>
+                            <li>Générer du code de visualisation</li>
+                        </ul>
+                    </div>
+                    <div class="message-time">Maintenant</div>
+                    <div class="message-avatar"><i class='bx bx-bot'></i></div>
+                </div>
+            </div>
+            
+            <!-- File Preview Area -->
+            <div id="filePreviewArea"></div>
+            
+            <!-- Input Area -->
+            <div class="input-area">
+                <label for="fileInput" class="input-button tooltip" data-tooltip="Télécharger un fichier">
+                    <i class='bx bx-paperclip'></i>
+                </label>
+                <input type="file" id="fileInput" accept=".pdf,.docx,.txt,image/*,.xlsx,.xls">
+                
+                <input type="text" id="chatInput" placeholder="Posez une question ou téléchargez un fichier...">
+                
+                <button class="input-button send-btn tooltip" id="sendButton" data-tooltip="Envoyer">
+                    <i class='bx bx-send'></i>
+                </button>
+            </div>
+        </div>
+    </div>
+
+    <script src="/static/scripts.js"></script>
+</body>
+</html>

static/scripts.js

@@ -0,0 +1,405 @@
+/* Cosmic Chatbot - Scripts JavaScript */
+
+// Attendre que le DOM soit complètement chargé
+document.addEventListener('DOMContentLoaded', function() {
+    // Éléments DOM
+    const messagesDiv = document.getElementById('messages');
+    const chatInput = document.getElementById('chatInput');
+    const sendButton = document.getElementById('sendButton');
+    const fileInput = document.getElementById('fileInput');
+    const filePreviewArea = document.getElementById('filePreviewArea');
+    const themeToggle = document.getElementById('themeToggle');
+    const featureToggle = document.getElementById('featureToggle');
+    const featureShowcase = document.getElementById('featureShowcase');
+    const starsContainer = document.getElementById('starsContainer');
+    const particlesContainer = document.getElementById('particlesContainer');
+    
+    // Variables globales
+    let currentTheme = 'dark';
+    let selectedFile = null;
+    
+    // Initialisation
+    initializeStars();
+    initializeParticles();
+    initializeEventListeners();
+    
+    // Fonctions d'initialisation
+    function initializeStars() {
+        // Créer des étoiles avec des positions et tailles aléatoires
+        for (let i = 0; i < 100; i++) {
+            const star = document.createElement('div');
+            star.className = 'star';
+            
+            // Position aléatoire
+            const x = Math.random() * 100;
+            const y = Math.random() * 100;
+            
+            // Taille aléatoire
+            const size = Math.random() * 2 + 1;
+            
+            // Délai d'animation aléatoire
+            const delay = Math.random() * 3;
+            
+            // Appliquer les styles
+            star.style.left = `${x}%`;
+            star.style.top = `${y}%`;
+            star.style.width = `${size}px`;
+            star.style.height = `${size}px`;
+            star.style.animationDelay = `${delay}s`;
+            
+            starsContainer.appendChild(star);
+        }
+    }
+    
+    function initializeParticles() {
+        // Créer des particules flottantes
+        for (let i = 0; i < 15; i++) {
+            const particle = document.createElement('div');
+            particle.className = 'particle';
+            
+            // Position aléatoire
+            const x = Math.random() * 100;
+            const y = Math.random() * 100;
+            
+            // Taille aléatoire
+            const size = Math.random() * 50 + 20;
+            
+            // Délai d'animation aléatoire
+            const delay = Math.random() * 5;
+            
+            // Appliquer les styles
+            particle.style.left = `${x}%`;
+            particle.style.top = `${y}%`;
+            particle.style.width = `${size}px`;
+            particle.style.height = `${size}px`;
+            particle.style.animationDelay = `${delay}s`;
+            
+            particlesContainer.appendChild(particle);
+        }
+    }
+    
+    function initializeEventListeners() {
+        // Événement d'envoi de message
+        sendButton.addEventListener('click', processInput);
+        chatInput.addEventListener('keydown', (e) => {
+            if (e.key === 'Enter' && !e.shiftKey) {
+                e.preventDefault();
+                processInput();
+            }
+        });
+        
+        // Événement de changement de thème
+        themeToggle.addEventListener('click', toggleTheme);
+        
+        // Événement d'affichage des fonctionnalités
+        featureToggle.addEventListener('click', toggleFeatureShowcase);
+        
+        // Événement de sélection de fichier
+        fileInput.addEventListener('change', handleFileSelection);
+        
+        // Événement de clic sur une carte de fonctionnalité
+        document.querySelectorAll('.feature-card').forEach(card => {
+            card.addEventListener('click', () => {
+                const feature = card.getAttribute('data-feature');
+                suggestFeaturePrompt(feature);
+            });
+        });
+    }
+    
+    // Fonctions de gestion des événements
+    function toggleTheme() {
+        const body = document.body;
+        const icon = themeToggle.querySelector('i');
+        
+        if (currentTheme === 'dark') {
+            // Passer au thème clair
+            body.classList.add('light-theme');
+            icon.className = 'bx bx-sun';
+            currentTheme = 'light';
+        } else {
+            // Passer au thème sombre
+            body.classList.remove('light-theme');
+            icon.className = 'bx bx-moon';
+            currentTheme = 'dark';
+        }
+        
+        // Ajouter une classe pour la transition
+        body.classList.add('theme-transition');
+        
+        // Supprimer la classe après la transition
+        setTimeout(() => {
+            body.classList.remove('theme-transition');
+        }, 500);
+    }
+    
+    function toggleFeatureShowcase() {
+        featureShowcase.classList.toggle('active');
+        
+        // Changer l'icône et le texte du bouton
+        if (featureShowcase.classList.contains('active')) {
+            featureToggle.innerHTML = '<i class="bx bx-x"></i> Fermer';
+        } else {
+            featureToggle.innerHTML = '<i class="bx bx-bulb"></i> Fonctionnalités';
+        }
+    }
+    
+    function handleFileSelection(e) {
+        const file = e.target.files[0];
+        if (!file) return;
+        
+        selectedFile = file;
+        
+        // Afficher l'aperçu du fichier
+        filePreviewArea.innerHTML = '';
+        const preview = document.createElement('div');
+        preview.className = 'file-preview';
+        
+        // Déterminer l'icône en fonction du type de fichier
+        let iconClass = 'bx-file';
+        if (file.type.startsWith('image/')) {
+            iconClass = 'bx-image';
+        } else if (file.name.endsWith('.pdf')) {
+            iconClass = 'bx-file-pdf';
+        } else if (file.name.endsWith('.xlsx') || file.name.endsWith('.xls')) {
+            iconClass = 'bx-spreadsheet';
+        } else if (file.name.endsWith('.docx') || file.name.endsWith('.doc')) {
+            iconClass = 'bx-file-doc';
+        }
+        
+        preview.innerHTML = `
+            <div class="file-preview-icon"><i class="bx ${iconClass}"></i></div>
+            <div class="file-preview-name">${file.name}</div>
+            <button class="file-preview-remove"><i class="bx bx-x"></i></button>
+        `;
+        
+        filePreviewArea.appendChild(preview);
+        
+        // Ajouter un événement pour supprimer l'aperçu
+        preview.querySelector('.file-preview-remove').addEventListener('click', () => {
+            filePreviewArea.innerHTML = '';
+            fileInput.value = '';
+            selectedFile = null;
+        });
+    }
+    
+    function suggestFeaturePrompt(feature) {
+        let prompt = '';
+        
+        switch (feature) {
+            case 'summarize':
+                prompt = 'Pouvez-vous résumer ce document pour moi ?';
+                break;
+            case 'image-caption':
+                chatInput.value = '';
+                fileInput.click();
+                return;
+            case 'qa':
+                prompt = 'Pouvez-vous répondre à cette question : ';
+                break;
+            case 'vqa':
+                prompt = 'Que pouvez-vous me dire sur cette image ?';
+                fileInput.click();
+                break;
+            case 'visualization':
+                prompt = 'Générez un graphique à partir de ces données Excel';
+                fileInput.click();
+                return;
+            case 'translate':
+                prompt = 'Traduisez ce texte en français : ';
+                break;
+        }
+        
+        chatInput.value = prompt;
+        chatInput.focus();
+        
+        // Placer le curseur à la fin du texte
+        const len = chatInput.value.length;
+        chatInput.setSelectionRange(len, len);
+        
+        // Fermer le showcase
+        featureShowcase.classList.remove('active');
+        featureToggle.innerHTML = '<i class="bx bx-bulb"></i> Fonctionnalités';
+    }
+    
+    // Fonctions de traitement des messages
+    async function processInput() {
+        const text = chatInput.value.trim();
+        const file = selectedFile;
+        
+        if (!text && !file) return;
+        
+        // Ajouter le message de l'utilisateur
+        if (text) {
+            addMessage(text, true);
+        }
+        
+        if (file) {
+            addMessage(`📄 ${file.name}`, true);
+            filePreviewArea.innerHTML = '';
+        }
+        
+        // Effacer les entrées
+        chatInput.value = '';
+        selectedFile = null;
+        
+        // Afficher l'indicateur de frappe
+        showTyping();
+        
+        try {
+            const formData = new FormData();
+            if (file) formData.append('file', file);
+            if (text) formData.append('text', text);
+            
+            const response = await fetch('/process', {
+                method: 'POST',
+                body: formData
+            });
+            
+            if (!response.ok) throw new Error('Erreur serveur');
+            
+            const data = await response.json();
+            
+            // Supprimer l'indicateur de frappe
+            document.getElementById('typingIndicator')?.remove();
+            
+            // Formater la réponse en fonction du type
+            let responseText = data.response;
+            
+            if (data.type === 'visualization_code') {
+                responseText = `Voici le code de visualisation :\n\`\`\`python\n${data.response}\n\`\`\``;
+            } else if (data.type === 'caption' && file && file.type.startsWith('image/')) {
+                // Pour les images, afficher l'image avec la légende
+                const reader = new FileReader();
+                reader.onload = function(e) {
+                    const imgPreview = `<img src="${e.target.result}" alt="Image téléchargée" class="image-preview">`;
+                    addMessage(`${imgPreview}<p>${responseText}</p>`, false, true);
+                };
+                reader.readAsDataURL(file);
+                return;
+            }
+            
+            addMessage(responseText);
+            
+        } catch (error) {
+            document.getElementById('typingIndicator')?.remove();
+            addMessage(`Erreur: ${error.message}`);
+        }
+    }
+    
+    function addMessage(content, isUser = false, isHTML = false) {
+        const msgDiv = document.createElement('div');
+        msgDiv.className = `message ${isUser ? 'user-message' : 'bot-message'}`;
+        
+        // Ajouter l'avatar
+        const avatar = document.createElement('div');
+        avatar.className = 'message-avatar';
+        avatar.innerHTML = isUser ? '<i class="bx bx-user"></i>' : '<i class="bx bx-bot"></i>';
+        msgDiv.appendChild(avatar);
+        
+        // Ajouter l'heure
+        const time = document.createElement('div');
+        time.className = 'message-time';
+        time.textContent = formatTime(new Date());
+        
+        // Formater le contenu
+        if (isHTML) {
+            // Si le contenu est du HTML (pour les images)
+            msgDiv.innerHTML += content;
+        } else if (content.includes('```')) {
+            // Formater les blocs de code
+            const contentDiv = document.createElement('div');
+            contentDiv.className = 'markdown-content';
+            
+            const parts = content.split(/```([\s\S]*?)```/);
+            parts.forEach((part, i) => {
+                if (i % 2 === 1) {
+                    // Bloc de code
+                    const pre = document.createElement('div');
+                    pre.className = 'code-block';
+                    pre.textContent = part.trim();
+                    
+                    // Bouton de copie
+                    const copyBtn = document.createElement('button');
+                    copyBtn.className = 'copy-code';
+                    copyBtn.textContent = 'Copier';
+                    copyBtn.addEventListener('click', () => {
+                        navigator.clipboard.writeText(part.trim());
+                        copyBtn.textContent = 'Copié !';
+                        setTimeout(() => {
+                            copyBtn.textContent = 'Copier';
+                        }, 2000);
+                    });
+                    
+                    pre.appendChild(copyBtn);
+                    contentDiv.appendChild(pre);
+                } else if (part.trim()) {
+                    // Texte normal
+                    const p = document.createElement('p');
+                    p.textContent = part.trim();
+                    contentDiv.appendChild(p);
+                }
+            });
+            
+            msgDiv.appendChild(contentDiv);
+        } else {
+            // Texte normal avec formatage Markdown basique
+            const contentDiv = document.createElement('div');
+            contentDiv.className = 'markdown-content';
+            
+            // Convertir les listes
+            let formattedContent = content;
+            if (content.includes('\n- ')) {
+                const listItems = content.split('\n- ');
+                formattedContent = listItems[0];
+                
+                if (listItems.length > 1) {
+                    const ul = document.createElement('ul');
+                    
+                    for (let i = 1; i < listItems.length; i++) {
+                        const li = document.createElement('li');
+                        li.textContent = listItems[i].trim();
+                        ul.appendChild(li);
+                    }
+                    
+                    contentDiv.innerHTML = `<p>${formattedContent}</p>`;
+                    contentDiv.appendChild(ul);
+                    msgDiv.appendChild(contentDiv);
+                } else {
+                    contentDiv.textContent = formattedContent;
+                    msgDiv.appendChild(contentDiv);
+                }
+            } else {
+                contentDiv.textContent = formattedContent;
+                msgDiv.appendChild(contentDiv);
+            }
+        }
+        
+        msgDiv.appendChild(time);
+        messagesDiv.appendChild(msgDiv);
+        messagesDiv.scrollTop = messagesDiv.scrollHeight;
+        
+        return msgDiv;
+    }
+    
+    function showTyping() {
+        const typingDiv = document.createElement('div');
+        typingDiv.className = 'typing';
+        typingDiv.id = 'typingIndicator';
+        
+        for (let i = 0; i < 3; i++) {
+            const dot = document.createElement('div');
+            dot.className = 'typing-dot';
+            typingDiv.appendChild(dot);
+        }
+        
+        messagesDiv.appendChild(typingDiv);
+        messagesDiv.scrollTop = messagesDiv.scrollHeight;
+    }
+    
+    // Fonctions utilitaires
+    function formatTime(date) {
+        const hours = date.getHours().toString().padStart(2, '0');
+        const minutes = date.getMinutes().toString().padStart(2, '0');
+        return `${hours}:${minutes}`;
+    }
+});

static/styles.css

@@ -0,0 +1,724 @@
+/* Cosmic Chatbot - Styles CSS */
+@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500;600;700&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Space+Mono:wght@400;700&display=swap');
+
+:root {
+    /* Dark Theme (Deep Space) */
+    --dark-bg-primary: #0f0f1a;
+    --dark-bg-secondary: #1a1a2e;
+    --dark-accent-primary: #7b2cbf;
+    --dark-accent-secondary: #c77dff;
+    --dark-text-primary: #e6e6fa;
+    --dark-text-secondary: #b8b8d4;
+    --dark-border: #2a2a4a;
+    --dark-shadow: rgba(123, 44, 191, 0.2);
+    --dark-gradient: linear-gradient(135deg, #0f0f1a 0%, #1a1a2e 100%);
+    --dark-card-bg: rgba(26, 26, 46, 0.7);
+    --dark-input-bg: rgba(15, 15, 26, 0.6);
+    
+    /* Light Theme (Cosmic Nebula) */
+    --light-bg-primary: #f0f8ff;
+    --light-bg-secondary: #e6e6fa;
+    --light-accent-primary: #7b2cbf;
+    --light-accent-secondary: #5a189a;
+    --light-text-primary: #1a1a2e;
+    --light-text-secondary: #3a3a5a;
+    --light-border: #d4d4f0;
+    --light-shadow: rgba(123, 44, 191, 0.1);
+    --light-gradient: linear-gradient(135deg, #f0f8ff 0%, #e6e6fa 100%);
+    --light-card-bg: rgba(230, 230, 250, 0.7);
+    --light-input-bg: rgba(240, 248, 255, 0.6);
+    
+    /* Default Theme (starts with dark) */
+    --bg-primary: var(--dark-bg-primary);
+    --bg-secondary: var(--dark-bg-secondary);
+    --accent-primary: var(--dark-accent-primary);
+    --accent-secondary: var(--dark-accent-secondary);
+    --text-primary: var(--dark-text-primary);
+    --text-secondary: var(--dark-text-secondary);
+    --border: var(--dark-border);
+    --shadow: var(--dark-shadow);
+    --gradient: var(--dark-gradient);
+    --card-bg: var(--dark-card-bg);
+    --input-bg: var(--dark-input-bg);
+    
+    /* Animation Speeds */
+    --animation-slow: 3s;
+    --animation-medium: 1.5s;
+    --animation-fast: 0.6s;
+    
+    /* Sizes */
+    --border-radius-sm: 0.5rem;
+    --border-radius-md: 1rem;
+    --border-radius-lg: 1.5rem;
+    --spacing-xs: 0.25rem;
+    --spacing-sm: 0.5rem;
+    --spacing-md: 1rem;
+    --spacing-lg: 1.5rem;
+    --spacing-xl: 2rem;
+}
+
+/* Base Styles */
+* {
+    box-sizing: border-box;
+    margin: 0;
+    padding: 0;
+}
+
+body {
+    font-family: 'Quicksand', sans-serif;
+    background: var(--gradient);
+    color: var(--text-primary);
+    margin: 0;
+    padding: 0;
+    min-height: 100vh;
+    transition: all 0.5s ease;
+    position: relative;
+    overflow-x: hidden;
+}
+
+body::before {
+    content: '';
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-image: 
+        radial-gradient(circle at 15% 15%, rgba(123, 44, 191, 0.1) 0%, transparent 20%),
+        radial-gradient(circle at 85% 85%, rgba(199, 125, 255, 0.1) 0%, transparent 20%);
+    pointer-events: none;
+    z-index: -1;
+}
+
+/* Stars Animation */
+.stars {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    pointer-events: none;
+    z-index: -1;
+}
+
+.star {
+    position: absolute;
+    background-color: var(--text-primary);
+    border-radius: 50%;
+    opacity: 0;
+    animation: twinkle var(--animation-slow) infinite ease-in-out;
+}
+
+@keyframes twinkle {
+    0%, 100% { opacity: 0; transform: scale(0.5); }
+    50% { opacity: 0.8; transform: scale(1); }
+}
+
+/* Floating Particles */
+.particles {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    pointer-events: none;
+    z-index: -1;
+}
+
+.particle {
+    position: absolute;
+    background: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));
+    border-radius: 50%;
+    opacity: 0.3;
+    filter: blur(3px);
+    animation: float var(--animation-medium) infinite ease-in-out;
+}
+
+@keyframes float {
+    0%, 100% { transform: translateY(0) translateX(0); }
+    50% { transform: translateY(-20px) translateX(10px); }
+}
+
+/* Main Container */
+.app-container {
+    display: flex;
+    flex-direction: column;
+    height: 100vh;
+    max-width: 1200px;
+    margin: 0 auto;
+    padding: var(--spacing-md);
+    position: relative;
+    z-index: 1;
+}
+
+/* Header */
+.app-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: var(--spacing-md) 0;
+    margin-bottom: var(--spacing-lg);
+}
+
+.app-title {
+    display: flex;
+    align-items: center;
+    gap: var(--spacing-sm);
+}
+
+.app-title h1 {
+    font-weight: 700;
+    font-size: 1.8rem;
+    background: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));
+    -webkit-background-clip: text;
+    background-clip: text;
+    color: transparent;
+    text-shadow: 0 2px 10px var(--shadow);
+}
+
+.app-logo {
+    width: 40px;
+    height: 40px;
+    animation: pulse var(--animation-medium) infinite alternate;
+}
+
+@keyframes pulse {
+    0% { transform: scale(1); }
+    100% { transform: scale(1.1); }
+}
+
+.app-controls {
+    display: flex;
+    gap: var(--spacing-md);
+    align-items: center;
+}
+
+.theme-toggle {
+    background: none;
+    border: none;
+    color: var(--text-primary);
+    cursor: pointer;
+    font-size: 1.5rem;
+    transition: transform 0.3s ease;
+}
+
+.theme-toggle:hover {
+    transform: rotate(30deg);
+}
+
+.feature-toggle {
+    background: var(--card-bg);
+    border: 1px solid var(--border);
+    color: var(--text-primary);
+    padding: var(--spacing-xs) var(--spacing-sm);
+    border-radius: var(--border-radius-sm);
+    cursor: pointer;
+    font-size: 0.9rem;
+    transition: all 0.3s ease;
+    backdrop-filter: blur(10px);
+}
+
+.feature-toggle:hover {
+    background: var(--accent-primary);
+    color: white;
+}
+
+/* Chat Container */
+.chat-container {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    background: var(--card-bg);
+    border-radius: var(--border-radius-lg);
+    border: 1px solid var(--border);
+    overflow: hidden;
+    box-shadow: 0 10px 30px var(--shadow);
+    backdrop-filter: blur(10px);
+}
+
+/* Messages Area */
+.messages {
+    flex: 1;
+    overflow-y: auto;
+    padding: var(--spacing-lg);
+    display: flex;
+    flex-direction: column;
+    gap: var(--spacing-md);
+    scroll-behavior: smooth;
+}
+
+.messages::-webkit-scrollbar {
+    width: 6px;
+}
+
+.messages::-webkit-scrollbar-track {
+    background: transparent;
+}
+
+.messages::-webkit-scrollbar-thumb {
+    background: var(--accent-primary);
+    border-radius: 10px;
+}
+
+.message {
+    max-width: 80%;
+    padding: var(--spacing-md) var(--spacing-lg);
+    border-radius: var(--border-radius-md);
+    line-height: 1.6;
+    animation: fadeIn var(--animation-fast) ease-out;
+    position: relative;
+    overflow: hidden;
+}
+
+@keyframes fadeIn {
+    from { opacity: 0; transform: translateY(10px); }
+    to { opacity: 1; transform: translateY(0); }
+}
+
+.user-message {
+    align-self: flex-end;
+    background: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));
+    color: white;
+    border-top-right-radius: 4px;
+}
+
+.user-message::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: linear-gradient(135deg, rgba(255,255,255,0.1), rgba(255,255,255,0));
+    pointer-events: none;
+}
+
+.bot-message {
+    align-self: flex-start;
+    background: var(--input-bg);
+    color: var(--text-primary);
+    border: 1px solid var(--border);
+    border-top-left-radius: 4px;
+}
+
+.message-time {
+    font-size: 0.7rem;
+    opacity: 0.7;
+    margin-top: var(--spacing-xs);
+    text-align: right;
+}
+
+.message-avatar {
+    width: 28px;
+    height: 28px;
+    border-radius: 50%;
+    position: absolute;
+    bottom: -10px;
+    background: var(--accent-primary);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 0.8rem;
+    color: white;
+}
+
+.user-message .message-avatar {
+    right: -10px;
+}
+
+.bot-message .message-avatar {
+    left: -10px;
+}
+
+/* Code Block Styling */
+.code-block {
+    font-family: 'Space Mono', monospace;
+    background: var(--bg-primary);
+    padding: var(--spacing-md);
+    border-radius: var(--border-radius-sm);
+    margin: var(--spacing-sm) 0;
+    position: relative;
+    overflow-x: auto;
+}
+
+.code-block::before {
+    content: 'Python';
+    position: absolute;
+    top: 0;
+    right: 0;
+    background: var(--accent-primary);
+    color: white;
+    font-size: 0.7rem;
+    padding: 2px 8px;
+    border-bottom-left-radius: var(--border-radius-sm);
+}
+
+.copy-code {
+    position: absolute;
+    top: var(--spacing-xs);
+    right: var(--spacing-xs);
+    background: var(--accent-secondary);
+    color: white;
+    border: none;
+    border-radius: var(--border-radius-sm);
+    padding: 2px 6px;
+    font-size: 0.7rem;
+    cursor: pointer;
+    opacity: 0;
+    transition: opacity 0.3s ease;
+}
+
+.code-block:hover .copy-code {
+    opacity: 1;
+}
+
+/* Typing Indicator */
+.typing {
+    display: flex;
+    gap: var(--spacing-xs);
+    padding: var(--spacing-sm) var(--spacing-md);
+    align-self: flex-start;
+    background: var(--input-bg);
+    border-radius: var(--border-radius-md);
+    margin-bottom: var(--spacing-md);
+}
+
+.typing-dot {
+    width: 8px;
+    height: 8px;
+    background: var(--accent-primary);
+    border-radius: 50%;
+    animation: typing var(--animation-fast) infinite ease-in-out;
+}
+
+.typing-dot:nth-child(1) { animation-delay: 0s; }
+.typing-dot:nth-child(2) { animation-delay: 0.2s; }
+.typing-dot:nth-child(3) { animation-delay: 0.4s; }
+
+@keyframes typing {
+    0%, 60%, 100% { transform: translateY(0); opacity: 0.6; }
+    30% { transform: translateY(-5px); opacity: 1; }
+}
+
+/* Input Area */
+.input-area {
+    display: flex;
+    gap: var(--spacing-sm);
+    padding: var(--spacing-md);
+    background: var(--bg-secondary);
+    border-top: 1px solid var(--border);
+    position: relative;
+}
+
+.input-area::before {
+    content: '';
+    position: absolute;
+    top: -1px;
+    left: 0;
+    width: 100%;
+    height: 1px;
+    background: linear-gradient(90deg, transparent, var(--accent-primary), transparent);
+}
+
+#chatInput {
+    flex: 1;
+    border: 1px solid var(--border);
+    background: var(--input-bg);
+    color: var(--text-primary);
+    padding: var(--spacing-md);
+    border-radius: var(--border-radius-md);
+    outline: none;
+    font-family: 'Quicksand', sans-serif;
+    transition: all 0.3s ease;
+    backdrop-filter: blur(5px);
+}
+
+#chatInput:focus {
+    border-color: var(--accent-primary);
+    box-shadow: 0 0 0 2px var(--shadow);
+}
+
+#chatInput::placeholder {
+    color: var(--text-secondary);
+    opacity: 0.7;
+}
+
+#fileInput {
+    display: none;
+}
+
+.input-button {
+    background: var(--input-bg);
+    border: 1px solid var(--border);
+    color: var(--text-primary);
+    width: 45px;
+    height: 45px;
+    border-radius: 50%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    cursor: pointer;
+    transition: all 0.3s ease;
+    backdrop-filter: blur(5px);
+}
+
+.input-button:hover {
+    background: var(--accent-primary);
+    color: white;
+    transform: translateY(-2px);
+}
+
+.input-button i {
+    font-size: 1.2rem;
+}
+
+.send-btn {
+    background: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));
+    border: none;
+    color: white;
+}
+
+/* Feature Showcase */
+.feature-showcase {
+    display: none;
+    padding: var(--spacing-lg);
+    background: var(--card-bg);
+    border-radius: var(--border-radius-lg);
+    margin-bottom: var(--spacing-lg);
+    border: 1px solid var(--border);
+    box-shadow: 0 10px 30px var(--shadow);
+    backdrop-filter: blur(10px);
+}
+
+.feature-showcase.active {
+    display: block;
+    animation: slideDown var(--animation-fast) ease-out;
+}
+
+@keyframes slideDown {
+    from { opacity: 0; transform: translateY(-20px); }
+    to { opacity: 1; transform: translateY(0); }
+}
+
+.feature-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+    gap: var(--spacing-md);
+}
+
+.feature-card {
+    background: var(--input-bg);
+    border: 1px solid var(--border);
+    border-radius: var(--border-radius-md);
+    padding: var(--spacing-md);
+    transition: all 0.3s ease;
+    cursor: pointer;
+    position: relative;
+    overflow: hidden;
+}
+
+.feature-card:hover {
+    transform: translateY(-5px);
+    box-shadow: 0 5px 15px var(--shadow);
+}
+
+.feature-card::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 4px;
+    height: 100%;
+    background: var(--accent-primary);
+}
+
+.feature-card h3 {
+    margin-bottom: var(--spacing-sm);
+    font-weight: 600;
+}
+
+.feature-card p {
+    font-size: 0.9rem;
+    color: var(--text-secondary);
+}
+
+.feature-icon {
+    font-size: 2rem;
+    margin-bottom: var(--spacing-sm);
+    background: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));
+    -webkit-background-clip: text;
+    background-clip: text;
+    color: transparent;
+}
+
+/* File Upload Preview */
+.file-preview {
+    display: flex;
+    align-items: center;
+    gap: var(--spacing-sm);
+    padding: var(--spacing-sm) var(--spacing-md);
+    background: var(--input-bg);
+    border-radius: var(--border-radius-sm);
+    margin-bottom: var(--spacing-sm);
+    border: 1px dashed var(--border);
+    animation: fadeIn var(--animation-fast) ease-out;
+}
+
+.file-preview-icon {
+    font-size: 1.2rem;
+    color: var(--accent-primary);
+}
+
+.file-preview-name {
+    flex: 1;
+    font-size: 0.9rem;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.file-preview-remove {
+    background: none;
+    border: none;
+    color: var(--text-secondary);
+    cursor: pointer;
+    font-size: 1rem;
+    transition: color 0.3s ease;
+}
+
+.file-preview-remove:hover {
+    color: #ff4d4d;
+}
+
+/* Responsive Design */
+@media (max-width: 768px) {
+    .app-header {
+        flex-direction: column;
+        gap: var(--spacing-sm);
+        text-align: center;
+    }
+    
+    .message {
+        max-width: 90%;
+    }
+    
+    .feature-grid {
+        grid-template-columns: 1fr;
+    }
+}
+
+/* Dark/Light Theme Transitions */
+.theme-transition {
+    transition: background 0.5s ease,
+                color 0.5s ease,
+                border-color 0.5s ease,
+                box-shadow 0.5s ease;
+}
+
+/* Light Theme Class */
+body.light-theme {
+    --bg-primary: var(--light-bg-primary);
+    --bg-secondary: var(--light-bg-secondary);
+    --accent-primary: var(--light-accent-primary);
+    --accent-secondary: var(--light-accent-secondary);
+    --text-primary: var(--light-text-primary);
+    --text-secondary: var(--light-text-secondary);
+    --border: var(--light-border);
+    --shadow: var(--light-shadow);
+    --gradient: var(--light-gradient);
+    --card-bg: var(--light-card-bg);
+    --input-bg: var(--light-input-bg);
+}
+
+/* Accessibility */
+@media (prefers-reduced-motion: reduce) {
+    * {
+        animation-duration: 0.01ms !important;
+        animation-iteration-count: 1 !important;
+        transition-duration: 0.01ms !important;
+        scroll-behavior: auto !important;
+    }
+}
+
+/* Image Display */
+.image-preview {
+    max-width: 100%;
+    border-radius: var(--border-radius-sm);
+    margin: var(--spacing-sm) 0;
+}
+
+/* Markdown Content */
+.markdown-content {
+    line-height: 1.6;
+}
+
+.markdown-content h1, 
+.markdown-content h2, 
+.markdown-content h3 {
+    margin-top: var(--spacing-md);
+    margin-bottom: var(--spacing-sm);
+}
+
+.markdown-content p {
+    margin-bottom: var(--spacing-sm);
+}
+
+.markdown-content ul, 
+.markdown-content ol {
+    margin-left: var(--spacing-lg);
+    margin-bottom: var(--spacing-sm);
+}
+
+.markdown-content a {
+    color: var(--accent-primary);
+    text-decoration: none;
+}
+
+.markdown-content a:hover {
+    text-decoration: underline;
+}
+
+/* Tooltip */
+.tooltip {
+    position: relative;
+}
+
+.tooltip::after {
+    content: attr(data-tooltip);
+    position: absolute;
+    bottom: 100%;
+    left: 50%;
+    transform: translateX(-50%);
+    background: var(--bg-primary);
+    color: var(--text-primary);
+    padding: var(--spacing-xs) var(--spacing-sm);
+    border-radius: var(--border-radius-sm);
+    font-size: 0.8rem;
+    white-space: nowrap;
+    opacity: 0;
+    pointer-events: none;
+    transition: opacity 0.3s ease;
+    z-index: 10;
+    box-shadow: 0 2px 10px var(--shadow);
+    border: 1px solid var(--border);
+}
+
+.tooltip:hover::after {
+    opacity: 1;
+}
+
+/* Loading Spinner */
+.loading-spinner {
+    width: 30px;
+    height: 30px;
+    border: 3px solid rgba(255, 255, 255, 0.3);
+    border-radius: 50%;
+    border-top-color: var(--accent-primary);
+    animation: spin 1s ease-in-out infinite;
+    margin: 0 auto;
+}
+
+@keyframes spin {
+    to { transform: rotate(360deg); }
+}

templates/index.html

@@ -0,0 +1,113 @@
+<!DOCTYPE html>
+<html lang="fr">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Cosmic AI Assistant</title>
+    <link href='https://unpkg.com/[email protected]/css/boxicons.min.css' rel='stylesheet'>
+    <link rel="stylesheet" href="/static/styles.css">
+    <link rel="icon" type="image/svg+xml" href="/static/favicon.svg">
+</head>
+<body>
+    <!-- Stars Background -->
+    <div class="stars" id="starsContainer"></div>
+    
+    <!-- Floating Particles -->
+    <div class="particles" id="particlesContainer"></div>
+    
+    <div class="app-container">
+        <!-- Header -->
+        <header class="app-header">
+            <div class="app-title">
+                <div class="app-logo">
+                    <i class='bx bx-planet'></i>
+                </div>
+                <h1>Cosmic AI Assistant</h1>
+            </div>
+            <div class="app-controls">
+                <button class="feature-toggle" id="featureToggle" data-tooltip="Afficher les fonctionnalités">
+                    <i class='bx bx-bulb'></i> Fonctionnalités
+                </button>
+                <button class="theme-toggle tooltip" id="themeToggle" data-tooltip="Changer de thème">
+                    <i class='bx bx-moon'></i>
+                </button>
+            </div>
+        </header>
+        
+        <!-- Feature Showcase -->
+        <div class="feature-showcase" id="featureShowcase">
+            <div class="feature-grid">
+                <div class="feature-card" data-feature="summarize">
+                    <div class="feature-icon"><i class='bx bx-book-content'></i></div>
+                    <h3>Résumé de Texte</h3>
+                    <p>Résumez automatiquement des documents, articles ou textes longs.</p>
+                </div>
+                <div class="feature-card" data-feature="image-caption">
+                    <div class="feature-icon"><i class='bx bx-image'></i></div>
+                    <h3>Description d'Images</h3>
+                    <p>Générez des descriptions détaillées à partir d'images.</p>
+                </div>
+                <div class="feature-card" data-feature="qa">
+                    <div class="feature-icon"><i class='bx bx-question-mark'></i></div>
+                    <h3>Questions-Réponses</h3>
+                    <p>Obtenez des réponses précises à vos questions.</p>
+                </div>
+                <div class="feature-card" data-feature="vqa">
+                    <div class="feature-icon"><i class='bx bx-image-alt'></i></div>
+                    <h3>Questions sur Images</h3>
+                    <p>Posez des questions sur le contenu d'une image.</p>
+                </div>
+                <div class="feature-card" data-feature="visualization">
+                    <div class="feature-icon"><i class='bx bx-bar-chart-alt-2'></i></div>
+                    <h3>Visualisation de Données</h3>
+                    <p>Générez du code pour visualiser vos données Excel.</p>
+                </div>
+                <div class="feature-card" data-feature="translate">
+                    <div class="feature-icon"><i class='bx bx-transfer'></i></div>
+                    <h3>Traduction</h3>
+                    <p>Traduisez du texte vers différentes langues.</p>
+                </div>
+            </div>
+        </div>
+        
+        <!-- Chat Container -->
+        <div class="chat-container">
+            <div class="messages" id="messages">
+                <div class="message bot-message">
+                    <div class="markdown-content">
+                        <p>Bonjour ! Je suis votre assistant IA cosmique. Téléchargez un fichier ou posez une question, et je peux :</p>
+                        <ul>
+                            <li>Résumer des documents</li>
+                            <li>Décrire des images</li>
+                            <li>Répondre à vos questions</li>
+                            <li>Traduire du texte</li>
+                            <li>Générer du code de visualisation</li>
+                        </ul>
+                    </div>
+                    <div class="message-time">Maintenant</div>
+                    <div class="message-avatar"><i class='bx bx-bot'></i></div>
+                </div>
+            </div>
+            
+            <!-- File Preview Area -->
+            <div id="filePreviewArea"></div>
+            
+            <!-- Input Area -->
+            <div class="input-area">
+                <label for="fileInput" class="input-button tooltip" data-tooltip="Télécharger un fichier">
+                    <i class='bx bx-paperclip'></i>
+                </label>
+                <input type="file" id="fileInput" accept=".pdf,.docx,.txt,image/*,.xlsx,.xls">
+                
+                <input type="text" id="chatInput" placeholder="Posez une question ou téléchargez un fichier...">
+                
+                <button class="input-button send-btn tooltip" id="sendButton" data-tooltip="Envoyer">
+                    <i class='bx bx-send'></i>
+                </button>
+            </div>
+        </div>
+    </div>
+
+    <script src="/static/scripts.js"></script>
+</body>
+</html>

todo.md

@@ -0,0 +1,47 @@
+# Cosmic AI Assistant - Liste des tâches
+
+## Analyse et préparation
+- [x] Analyser le code backend existant (app.py)
+- [x] Analyser le code frontend existant (index.html)
+- [x] Clarifier les besoins de l'utilisateur
+- [x] Créer la structure du projet
+
+## Conception de l'interface UI/UX
+- [x] Créer les styles CSS avec thèmes inspirés de l'univers
+- [x] Développer les animations d'étoiles et particules
+- [x] Créer le HTML avec structure améliorée
+- [x] Implémenter le JavaScript pour les interactions
+- [x] Créer le favicon personnalisé
+
+## Amélioration du backend
+- [x] Améliorer les modèles IA utilisés
+- [x] Optimiser la détection d'intention
+- [x] Ajouter de nouvelles fonctionnalités (Visual QA, génération de texte)
+- [x] Améliorer la gestion des erreurs
+- [x] Optimiser les performances
+
+## Intégration et configuration
+- [x] Créer le fichier requirements.txt
+- [x] Créer le script de démarrage run.sh
+- [x] Configurer les templates pour le rendu côté serveur
+- [x] Documenter le projet (README.md)
+
+## Tests
+- [x] Tester le changement de thème (sombre/coloré)
+- [x] Vérifier les animations (étoiles, particules)
+- [x] Tester le téléchargement de fichiers
+- [x] Tester la fonctionnalité de résumé de texte
+- [x] Tester la description d'images
+- [x] Tester les questions-réponses
+- [x] Tester la visualisation de données
+- [x] Tester la traduction
+
+## Déploiement
+- [x] Préparer l'environnement de déploiement
+- [x] Déployer la solution
+- [x] Vérifier l'accessibilité
+
+## Finalisation
+- [x] Présenter les résultats à l'utilisateur
+- [x] Recueillir les retours
+- [x] Effectuer les ajustements finaux si nécessaires