Spaces:
Sleeping
Sleeping
File size: 2,512 Bytes
81e5563 a1955ce 256e3d5 a1955ce 81e5563 256e3d5 81e5563 256e3d5 81e5563 256e3d5 a1955ce 81e5563 a1955ce 256e3d5 a1955ce 81e5563 256e3d5 81e5563 a1955ce 81e5563 a1955ce 256e3d5 a1955ce |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 |
const socket = io.connect(document.baseURI);
const chatBox = document.getElementById('chat-box');
const chatInput = document.getElementById('chat-input');
const sendButton = document.getElementById('send-button');
var converter = new showdown.Converter();
var response="";
function addLoader(){
// loader_ele = `
// <div class="dot-loader">
// <div></div>
// <div></div>
// <div></div>
// </div>
// `
const loader_ele = document.createElement('div');
loader_ele.classList.add('dot-loader');
loader_ele.innerHTML = `
<div></div>
<div></div>
<div></div>
`;
chatBox.appendChild(loader_ele);
}
function appendMessage(message, sender) {
if(sender == "bot"){
response += message;
message = converter.makeHtml(response);
let loader_ele = chatBox.lastElementChild;
if(!loader_ele.classList.contains("hidden")){
chatBox.removeChild(loader_ele);
const messageElement = document.createElement('div');
messageElement.classList.add('chat-message', sender);
messageElement.innerHTML = `<span>${message}</span>`;
chatBox.append(messageElement);
chatBox.scrollTop = chatBox.scrollHeight;
}else{
last_message_ele = chatBox.lastElementChild.lastChild;
last_message_ele.innerHTML = message;
chatBox.scrollTop = chatBox.scrollHeight;
}
}else{
const messageElement = document.createElement('div');
messageElement.classList.add('chat-message', sender);
messageElement.innerHTML = `<span>${message}</span>`;
chatBox.append(messageElement);
chatBox.scrollTop = chatBox.scrollHeight;
setTimeout(() => {
addLoader()
}, 500);
}
chatBox.scrollTop = chatBox.scrollHeight;
}
sendButton.addEventListener('click', () => {
const message = chatInput.value.trim();
if (message) {
appendMessage(message, 'user');
socket.emit('message', { question: message, session_id: 'abc123' });
// setInterval(()=>{
// appendMessage("This is a test message", "bot");
// }, 2000)
chatInput.value = '';
response = "";
}
});
chatInput.addEventListener('keypress', (e) => {
if (e.key === 'Enter') {
sendButton.click();
}
});
socket.on('response', (response) => {
appendMessage(response, 'bot');
});
|