/* @odoo-module */
//
// This file is meant to regroup your javascript code. You can either copy/past
// any code that should be executed on each page loading or write your own
// taking advantage of the Odoo framework to create new behaviors or modify
// existing ones. For example, doing this will greet any visitor with a 'Hello,
// world !' message in a popup:
//
/*
import { ConfirmationDialog } from '@web/core/confirmation_dialog/confirmation_dialog';
import publicWidget from '@web/legacy/js/public/public_widget';

publicWidget.registry.HelloWorldPopup = publicWidget.Widget.extend({
    selector: '#wrapwrap',

    init() {
        this.dialog = this.bindService("dialog");
    },
    start() {
        this.dialog.add(ConfirmationDialog, { body: 'Hello World' });
        return this._super.apply(this, arguments);
    },
});
*/

document.addEventListener("DOMContentLoaded", function () {
    const chatInput = document.getElementById("chat-input");
    const sendButton = document.getElementById("send-button");
    const chatMessages = document.getElementById("chat-messages");
    const fileInput = document.getElementById("upload-file");
    const filePreviewWrapper = document.getElementById("file-preview-wrapper");
    const filePreviewContainer = document.getElementById("file-preview-container");

    let uploadedFiles = [];

    function sendMessage() {
        const message = chatInput.value.trim();
        if (!message && uploadedFiles.length === 0) return;

        if (message) {
            appendMessage("Du", message, "user-message");
        }

        if (uploadedFiles.length > 0) {
            uploadedFiles.forEach(file => appendFilePreview(file, "user-message"));
        }

        const formData = new FormData();
        formData.append("message", message);
        uploadedFiles.forEach(file => formData.append("files[]", file));

        fetch("/chat/ask", {
            method: "POST",
            body: formData,
        })
        .then((response) => response.json())
        .then((data) => {
            appendMessage("Mr. Y", data.response || "Fehler beim Verarbeiten der Anfrage.", "ai-message");
        })
        .catch(() => {
            appendMessage("Mr. Y", "Netzwerkfehler. Versuche es später erneut.", "error-message");
        });

        chatInput.value = "";
        uploadedFiles = [];
        filePreviewContainer.innerHTML = "";
        filePreviewWrapper.style.display = "none";
    }

    function appendMessage(sender, text, className) {
        const messageDiv = document.createElement("div");
        messageDiv.className = `chat-bubble ${className}`;
        messageDiv.innerHTML = `<strong>${sender}:</strong> ${text}`;
        chatMessages.appendChild(messageDiv);
        chatMessages.scrollTop = chatMessages.scrollHeight;
    }

    function appendFilePreview(file, className) {
        const reader = new FileReader();
        reader.onload = function (event) {
            const previewContainer = document.createElement("div");
            previewContainer.className = "file-preview-container";

            const img = document.createElement("img");
            img.src = event.target.result;
            img.className = "file-preview";

            const removeButton = document.createElement("button");
            removeButton.className = "remove-file";
            removeButton.textContent = "❌";
            removeButton.addEventListener("click", function () {
                uploadedFiles = uploadedFiles.filter(f => f !== file);
                previewContainer.remove();
                if (uploadedFiles.length === 0) {
                    filePreviewWrapper.style.display = "none";
                }
            });

            previewContainer.appendChild(img);
            previewContainer.appendChild(removeButton);
            filePreviewContainer.appendChild(previewContainer);
            filePreviewWrapper.style.display = "flex";
        };
        reader.readAsDataURL(file);
    }

    fileInput.addEventListener("change", function () {
        filePreviewContainer.innerHTML = "";
        uploadedFiles = Array.from(fileInput.files);
        uploadedFiles.forEach(file => appendFilePreview(file));
    });

    sendButton.addEventListener("click", sendMessage);
});