Update static/script.js

static/script.js

@@ -18,65 +18,10 @@ document.addEventListener("DOMContentLoaded", () => {
         const savedChatId = localStorage.getItem('currentChatId');
 
         fetch("/get_chats")
-            .then(response => response.json())
-            .then(chats => {
-                renderChatList(chats);
-
-                if (savedChatId && chats.some(c => c.chat_id === savedChatId)) {
-                    loadChat(savedChatId);
-                } else if (chats.length > 0) {
-                    loadChat(chats[0].chat_id);
-                } else {
-                    startNewChat();
-                }
+            .then(response => {
+                if (!response.ok) throw new Error("Network response was not ok");
+                return response.json();
             })
-            .catch(error => {
-                console.error("Ошибка загрузки чатов:", error);
-                startNewChat();
-            });
-    }
-
-    function renderChatList(chats) {
-        chatList.innerHTML = '';
-        chats.forEach(chat => {
-            const chatItem = document.createElement("div");
-            chatItem.className = "chat-item";
-            chatItem.dataset.chatId = chat.chat_id;
-            chatItem.innerHTML = `
-                <i class="fas fa-comment"></i>
-                <span class="chat-title">${chat.title}</span>
-            `;
-            chatItem.addEventListener("click", () => {
-                loadChat(chat.chat_id);
-                localStorage.setItem('currentChatId', chat.chat_id);
-            });
-            chatList.appendChild(chatItem);
-        });
-    }
-
-    newChatBtn.addEventListener("click", startNewChat);
-
-document.addEventListener("DOMContentLoaded", () => {
-    let mediaRecorder, audioChunks = [], audioStream, currentChatId = null;
-    const recordBtn = document.getElementById("record-btn");
-    const stopBtn = document.getElementById("stop-btn");
-    const sendBtn = document.getElementById("send-btn");
-    const uploadBtn = document.getElementById("upload-btn");
-    const userInput = document.getElementById("user-input");
-    const chatBox = document.getElementById("chat-box");
-    const audioFileInput = document.getElementById("audio-file");
-    const newChatBtn = document.getElementById("new-chat-btn");
-    const chatList = document.getElementById("chat-list");
-    const currentChatTitle = document.getElementById("current-chat-title");
-
-    // Инициализация при загрузке
-    initializeChats();
-
-    function initializeChats() {
-        const savedChatId = localStorage.getItem('currentChatId');
-
-        fetch("/get_chats")
-            .then(response => response.json())
             .then(chats => {
                 renderChatList(chats);
 
@@ -112,30 +57,49 @@ document.addEventListener("DOMContentLoaded", () => {
         });
     }
 
-    newChatBtn.addEventListener("click", startNewChat);
-
     function startNewChat() {
         fetch("/start_chat", {
             method: "POST",
             headers: { "Content-Type": "application/json" },
         })
-        .then(response => response.json())
+        .then(response => {
+            if (!response.ok) throw new Error("Network response was not ok");
+            return response.json();
+        })
         .then(data => {
             currentChatId = data.chat_id;
             currentChatTitle.textContent = data.title;
             chatBox.innerHTML = '<div class="message bot-message">Привет! Отправьте текст или голосовое сообщение для анализа эмоций.</div>';
-            initializeChats(); // Обновляем список чатов
+            
+            // Добавляем новый чат в список без полной перезагрузки
+            const chatItem = document.createElement("div");
+            chatItem.className = "chat-item active";
+            chatItem.dataset.chatId = data.chat_id;
+            chatItem.innerHTML = `
+                <i class="fas fa-comment"></i>
+                <span class="chat-title">${data.title}</span>
+            `;
+            chatItem.addEventListener("click", () => {
+                loadChat(data.chat_id);
+                localStorage.setItem('currentChatId', data.chat_id);
+            });
+            chatList.prepend(chatItem);
+            
             localStorage.setItem('currentChatId', data.chat_id);
         })
-        .catch(console.error);
+        .catch(error => {
+            console.error("Ошибка создания чата:", error);
+            appendMessage("bot", `❌ Ошибка: ${error.message}`);
+        });
     }
 
     function loadChat(chatId) {
         fetch(`/load_chat/${chatId}`)
-        .then(response => response.json())
+        .then(response => {
+            if (!response.ok) throw new Error("Network response was not ok");
+            return response.json();
+        })
         .then(data => {
-            if (data.error) throw new Error(data.error);
-
             currentChatId = chatId;
             currentChatTitle.textContent = data.title;
             updateActiveChat(chatId);
@@ -159,59 +123,59 @@ document.addEventListener("DOMContentLoaded", () => {
         });
     }
 
-    sendBtn.addEventListener("click", sendMessage);
-
-    async function sendMessage() {
+    function sendMessage() {
         const text = userInput.value.trim();
         if (!text || !currentChatId) return;
 
         appendAndSaveMessage("user", text);
         userInput.value = "";
 
-        try {
-            const response = await fetch("/analyze", {
-                method: "POST",
-                headers: { "Content-Type": "application/json" },
-                body: JSON.stringify({ text })
-            });
-            const data = await response.json();
+        fetch("/analyze", {
+            method: "POST",
+            headers: { "Content-Type": "application/json" },
+            body: JSON.stringify({ text })
+        })
+        .then(response => {
+            if (!response.ok) throw new Error("Network response was not ok");
+            return response.json();
+        })
+        .then(data => {
             appendAndSaveMessage("bot", `Эмоция: ${data.emotion} (${(data.confidence * 100).toFixed(1)}%)`);
-        } catch (error) {
+        })
+        .catch(error => {
             console.error("Ошибка:", error);
             appendAndSaveMessage("bot", `❌ Ошибка: ${error.message}`);
-        }
+        });
     }
 
-    uploadBtn.addEventListener("click", async () => {
+    function handleAudioUpload() {
         const file = audioFileInput.files[0];
         if (!file || !currentChatId) return;
 
         appendAndSaveMessage("user", "Загружен аудиофайл...");
 
-        try {
-            const formData = new FormData();
-            formData.append("audio", file);
+        const formData = new FormData();
+        formData.append("audio", file);
 
-            const response = await fetch("/analyze_audio", {
-                method: "POST",
-                body: formData
-            });
-            const data = await response.json();
-
-            // Добавляем распознанный текст в чат
+        fetch("/analyze_audio", {
+            method: "POST",
+            body: formData
+        })
+        .then(response => {
+            if (!response.ok) throw new Error("Network response was not ok");
+            return response.json();
+        })
+        .then(data => {
             if (data.transcribed_text) {
                 appendAndSaveMessage("user", `Распознанный текст: ${data.transcribed_text}`);
             }
-
             appendAndSaveMessage("bot", `Эмоция: ${data.emotion} (${(data.confidence * 100).toFixed(1)}%)`);
-        } catch (error) {
+        })
+        .catch(error => {
             console.error("Ошибка:", error);
             appendAndSaveMessage("bot", `❌ Ошибка: ${error.message}`);
-        }
-    });
-
-    recordBtn.addEventListener("click", startRecording);
-    stopBtn.addEventListener("click", stopRecording);
+        });
+    }
 
     async function startRecording() {
         try {
@@ -220,33 +184,7 @@ document.addEventListener("DOMContentLoaded", () => {
             audioChunks = [];
 
             mediaRecorder.ondataavailable = e => audioChunks.push(e.data);
-            mediaRecorder.onstop = async () => {
-                try {
-                    const audioBlob = new Blob(audioChunks, { type: "audio/wav" });
-                    appendAndSaveMessage("user", "Отправлено голосовое сообщение...");
-
-                    const formData = new FormData();
-                    formData.append("audio", audioBlob, "recording.wav");
-
-                    const response = await fetch("/analyze_audio", {
-                        method: "POST",
-                        body: formData
-                    });
-                    const data = await response.json();
-
-                    // Добавляем распознанный текст в чат
-                    if (data.transcribed_text) {
-                        appendAndSaveMessage("user", `Распознанный текст: ${data.transcribed_text}`);
-                    }
-
-                    appendAndSaveMessage("bot", `Эмоция: ${data.emotion} (${(data.confidence * 100).toFixed(1)}%)`);
-                } catch (error) {
-                    console.error("Ошибка:", error);
-                    appendAndSaveMessage("bot", `❌ Ошибка: ${error.message}`);
-                } finally {
-                    audioStream.getTracks().forEach(track => track.stop());
-                }
-            };
+            mediaRecorder.onstop = handleRecordingStop;
 
             mediaRecorder.start();
             recordBtn.disabled = true;
@@ -257,163 +195,39 @@ document.addEventListener("DOMContentLoaded", () => {
         }
     }
 
-    function stopRecording() {
-        if (mediaRecorder?.state === "recording") {
-            mediaRecorder.stop();
-            recordBtn.disabled = false;
-            stopBtn.disabled = true;
-        }
-    }
-
-    function appendMessage(sender, text) {
-        const message = document.createElement("div");
-        message.className = `message ${sender}-message`;
-        message.innerHTML = text;
-        chatBox.appendChild(message);
-        chatBox.scrollTop = chatBox.scrollHeight;
-    }
-
-    function appendAndSaveMessage(sender, text) {
-        appendMessage(sender, text);
-
-        if (currentChatId) {
-            fetch("/save_message", {
-                method: "POST",
-                headers: { "Content-Type": "application/json" },
-                body: JSON.stringify({
-                    chat_id: currentChatId,
-                    sender: sender,
-                    content: text
-                })
-            }).catch(console.error);
-        }
-    }
-});
-
-    function loadChat(chatId) {
-        fetch(`/load_chat/${chatId}`)
-        .then(response => response.json())
-        .then(data => {
-            if (data.error) throw new Error(data.error);
-
-            currentChatId = chatId;
-            currentChatTitle.textContent = data.title;
-            updateActiveChat(chatId);
-
-            chatBox.innerHTML = "";
-            data.messages.forEach(msg => {
-                appendMessage(msg.sender, msg.content);
-            });
-
-            localStorage.setItem('currentChatId', chatId);
-        })
-        .catch(error => {
-            console.error("Ошибка загрузки чата:", error);
-            appendMessage("bot", `❌ Ошибка: ${error.message}`);
-        });
-    }
-
-    function updateActiveChat(chatId) {
-        document.querySelectorAll(".chat-item").forEach(item => {
-            item.classList.toggle("active", item.dataset.chatId === chatId);
-        });
-    }
-
-    sendBtn.addEventListener("click", sendMessage);
-
-    async function sendMessage() {
-        const text = userInput.value.trim();
-        if (!text || !currentChatId) return;
-
-        appendAndSaveMessage("user", text);
-        userInput.value = "";
-
+    function handleRecordingStop() {
         try {
-            const response = await fetch("/analyze", {
-                method: "POST",
-                headers: { "Content-Type": "application/json" },
-                body: JSON.stringify({ text })
-            });
-            const data = await response.json();
-            appendAndSaveMessage("bot", `Эмоция: ${data.emotion} (${(data.confidence * 100).toFixed(1)}%)`);
-        } catch (error) {
-            console.error("Ошибка:", error);
-            appendAndSaveMessage("bot", `❌ Ошибка: ${error.message}`);
-        }
-    }
+            const audioBlob = new Blob(audioChunks, { type: "audio/wav" });
+            appendAndSaveMessage("user", "Отправлено голосовое сообщение...");
 
-    uploadBtn.addEventListener("click", async () => {
-        const file = audioFileInput.files[0];
-        if (!file || !currentChatId) return;
-
-        appendAndSaveMessage("user", "Загружен аудиофайл...");
-
-        try {
             const formData = new FormData();
-            formData.append("audio", file);
+            formData.append("audio", audioBlob, "recording.wav");
 
-            const response = await fetch("/analyze_audio", {
+            fetch("/analyze_audio", {
                 method: "POST",
                 body: formData
+            })
+            .then(response => {
+                if (!response.ok) throw new Error("Network response was not ok");
+                return response.json();
+            })
+            .then(data => {
+                if (data.transcribed_text) {
+                    appendAndSaveMessage("user", `Распознанный текст: ${data.transcribed_text}`);
+                }
+                appendAndSaveMessage("bot", `Эмоция: ${data.emotion} (${(data.confidence * 100).toFixed(1)}%)`);
+            })
+            .catch(error => {
+                console.error("Ошибка:", error);
+                appendAndSaveMessage("bot", `❌ Ошибка: ${error.message}`);
             });
-            const data = await response.json();
-
-            // Добавляем распознанный текст в чат
-            if (data.transcribed_text) {
-                appendAndSaveMessage("user", `Распознанный текст: ${data.transcribed_text}`);
-            }
-
-            appendAndSaveMessage("bot", `Эмоция: ${data.emotion} (${(data.confidence * 100).toFixed(1)}%)`);
         } catch (error) {
             console.error("Ошибка:", error);
             appendAndSaveMessage("bot", `❌ Ошибка: ${error.message}`);
-        }
-    });
-
-    recordBtn.addEventListener("click", startRecording);
-    stopBtn.addEventListener("click", stopRecording);
-
-    async function startRecording() {
-        try {
-            audioStream = await navigator.mediaDevices.getUserMedia({ audio: true });
-            mediaRecorder = new MediaRecorder(audioStream);
-            audioChunks = [];
-
-            mediaRecorder.ondataavailable = e => audioChunks.push(e.data);
-            mediaRecorder.onstop = async () => {
-                try {
-                    const audioBlob = new Blob(audioChunks, { type: "audio/wav" });
-                    appendAndSaveMessage("user", "Отправлено голосовое сообщение...");
-
-                    const formData = new FormData();
-                    formData.append("audio", audioBlob, "recording.wav");
-
-                    const response = await fetch("/analyze_audio", {
-                        method: "POST",
-                        body: formData
-                    });
-                    const data = await response.json();
-
-                    // Добавляем распознанный текст в чат
-                    if (data.transcribed_text) {
-                        appendAndSaveMessage("user", `Распознанный текст: ${data.transcribed_text}`);
-                    }
-
-                    appendAndSaveMessage("bot", `Эмоция: ${data.emotion} (${(data.confidence * 100).toFixed(1)}%)`);
-                } catch (error) {
-                    console.error("Ошибка:", error);
-                    appendAndSaveMessage("bot", `❌ Ошибка: ${error.message}`);
-                } finally {
-                    audioStream.getTracks().forEach(track => track.stop());
-                }
-            };
-
-            mediaRecorder.start();
-            recordBtn.disabled = true;
-            stopBtn.disabled = false;
-        } catch (error) {
-            console.error("Ошибка записи:", error);
-            appendMessage("bot", "❌ Не удалось получить доступ к микрофону");
+        } finally {
+            if (audioStream) {
+                audioStream.getTracks().forEach(track => track.stop());
+            }
         }
     }
 
@@ -428,7 +242,7 @@ document.addEventListener("DOMContentLoaded", () => {
     function appendMessage(sender, text) {
         const message = document.createElement("div");
         message.className = `message ${sender}-message`;
-        message.innerHTML = text;
+        message.textContent = text; // Используем textContent вместо innerHTML для безопасности
         chatBox.appendChild(message);
         chatBox.scrollTop = chatBox.scrollHeight;
     }
@@ -445,7 +259,21 @@ document.addEventListener("DOMContentLoaded", () => {
                     sender: sender,
                     content: text
                 })
-            }).catch(console.error);
+            }).catch(error => console.error("Ошибка сохранения сообщения:", error));
         }
     }
+
+    // Назначаем обработчики событий
+    newChatBtn.addEventListener("click", startNewChat);
+    sendBtn.addEventListener("click", sendMessage);
+    uploadBtn.addEventListener("click", handleAudioUpload);
+    recordBtn.addEventListener("click", startRecording);
+    stopBtn.addEventListener("click", stopRecording);
+
+    // Обработка отправки по Enter
+    userInput.addEventListener("keypress", (e) => {
+        if (e.key === "Enter") {
+            sendMessage();
+        }
+    });
 });