script.js

// Configuration OpenAI
const OPENAI_API_KEY = "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";
const OPENAI_API_URL = "https://api.openai.com/v1";

// Éléments DOM
const chatMessages = document.getElementById('chatMessages');
const chatInput = document.querySelector('.chat-input input');
const sendButton = document.querySelector('.chat-input button[title="Envoyer"]');
const codeOutput = document.getElementById('codeOutput');

// Gestionnaire d'envoi de message
sendButton.addEventListener('click', sendMessage);
chatInput.addEventListener('keypress', (e) => {
    if (e.key === 'Enter') sendMessage();
});

async function sendMessage() {
    const message = chatInput.value.trim();
    if (!message) return;

    // Afficher le message de l'utilisateur
    addMessage('user', message);
    chatInput.value = '';

    try {
        // Appel à l'API OpenAI
        const response = await fetch(`${OPENAI_API_URL}/chat/completions`, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                'Authorization': `Bearer ${OPENAI_API_KEY}`
            },
            body: JSON.stringify({
                model: "gpt-4",
                messages: [{ role: "user", content: message }],
                temperature: 0.7
            })
        });

        const data = await response.json();
        const aiResponse = data.choices[0].message.content;

        // Afficher la réponse de l'IA
        addMessage('assistant', aiResponse);

        // Si la réponse contient du code, l'afficher dans la sortie code
        if (aiResponse.includes('```')) {
            const codeBlocks = aiResponse.match(/```[\s\S]*?```/g);
            codeOutput.innerHTML = `<pre><code>${codeBlocks.join('\n\n').replace(/```/g, '')}</code></pre>`;
        }
    } catch (error) {
        console.error('Erreur OpenAI:', error);
        addMessage('assistant', "Désolé, une erreur s'est produite. Veuillez réessayer.");
    }
}

function addMessage(sender, content) {
    const messageDiv = document.createElement('div');
    messageDiv.className = `message ${sender}`;
    messageDiv.innerHTML = `
        <div class="message-content">${content}</div>
    `;
    chatMessages.appendChild(messageDiv);
    chatMessages.scrollTop = chatMessages.scrollHeight;
}

// Fonction pour générer des images
async function generateImage(prompt) {
    try {
        const response = await fetch(`${OPENAI_API_URL}/images/generations`, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                'Authorization': `Bearer ${OPENAI_API_KEY}`
            },
            body: JSON.stringify({
                prompt: prompt,
                n: 1,
                size: "1024x1024"
            })
        });

        const data = await response.json();
        return data.data[0].url;
    } catch (error) {
        console.error('Erreur génération image:', error);
        return null;
    }
}

// Exposer la fonction pour le bouton "Nouvelle tâche"
document.querySelector('.menu button:nth-child(1)').addEventListener('click', () => {
    const prompt = prompt("Décrivez l'image que vous souhaitez générer:");
    if (prompt) {
        generateImage(prompt).then(url => {
            if (url) {
                const resultOutput = document.querySelector('.result-output');
                resultOutput.innerHTML = `<img src="${url}" alt="Image générée" style="max-width:100%;">`;
            }
        });
    }
});

console.log("Interface Espace Codage chargée avec intégration OpenAI.");