Spaces:
Running
Running
| const messageList = document.getElementById('message-list'); | |
| const messageInput = document.getElementById('message-input'); | |
| const sendButton = document.getElementById('send-button'); | |
| // Send message function | |
| sendButton.addEventListener('click', sendMessage); | |
| messageInput.addEventListener('keydown', (event) => { | |
| if (event.key === 'Enter') { | |
| sendMessage(); | |
| } | |
| }); | |
| function sendMessage() { | |
| const message = messageInput.value.trim(); | |
| if (message === '') { | |
| return; | |
| } | |
| appendMessage(message, 'user-message'); | |
| messageInput.value = ''; | |
| appendMessage('', 'bot-message'); // Create an empty message element for the bot's response | |
| fetch('/chat_api', { | |
| method: 'POST', | |
| headers: { | |
| 'Content-Type': 'application/json' | |
| }, | |
| body: JSON.stringify({ | |
| model: 'qwen3:1.7b', // You can change the model here | |
| prompt: message | |
| }) | |
| }) | |
| .then(response => { | |
| const reader = response.body.getReader(); | |
| const decoder = new TextDecoder(); | |
| let partialResponse = ''; | |
| function read() { | |
| reader.read().then(({ done, value }) => { | |
| if (done) { | |
| return; | |
| } | |
| partialResponse += decoder.decode(value, { stream: true }); | |
| try { | |
| const jsonObjects = partialResponse.split('\n'); | |
| partialResponse = jsonObjects.pop(); // Keep the last partial object | |
| for (const jsonObjStr of jsonObjects) { | |
| if (jsonObjStr) { | |
| const jsonObj = JSON.parse(jsonObjStr); | |
| if (jsonObj.response) { | |
| appendToLastMessage(jsonObj.response); | |
| } | |
| } | |
| } | |
| } catch (e) { | |
| // JSON parsing error, wait for more chunks | |
| } | |
| read(); | |
| }); | |
| } | |
| read(); | |
| }) | |
| .catch(error => { | |
| console.error('Error:', error); | |
| const lastMessage = messageList.lastChild; | |
| if (lastMessage && lastMessage.classList.contains('bot-message')) { | |
| lastMessage.textContent = 'Sorry, something went wrong.'; | |
| } | |
| }); | |
| } | |
| function appendMessage(message, className) { | |
| const li = document.createElement('li'); | |
| li.textContent = message; | |
| li.classList.add(className); | |
| messageList.appendChild(li); | |
| messageList.scrollTop = messageList.scrollHeight; | |
| } | |
| function appendToLastMessage(text) { | |
| const lastMessage = messageList.lastChild; | |
| if (lastMessage && lastMessage.classList.contains('bot-message')) { | |
| lastMessage.textContent += text; | |
| messageList.scrollTop = messageList.scrollHeight; | |
| } | |
| } |