Spaces:
Runtime error
Runtime error
File size: 2,919 Bytes
3c8d75d b821729 ae5391f 3c8d75d 6288a82 3c8d75d b821729 3c8d75d b821729 3c8d75d ae5391f b821729 3c8d75d b821729 3c8d75d ae5391f b821729 ae5391f b821729 ae5391f b821729 ae5391f 3c8d75d ae5391f 3c8d75d ae5391f 3c8d75d |
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 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 |
const msgerForm = get(".msger-inputarea");
const msgerInput = get(".msger-input");
const msgerChat = get(".msger-chat");
const modelSelect = get(".msger-select");
const isUserVerified = false;
// Icons made by Freepik from www.flaticon.com
const BOT_IMG = "../static/icons/dialogflow-insights-svgrepo-com.svg";
const PERSON_IMG = "";
let BOT_NAME = " ChatBot";
let PERSON_NAME = "You";
msgerForm.addEventListener("submit", async (event) => {
event.preventDefault();
const msgText = msgerInput.value;
if (!msgText) return;
const selectedModel = modelSelect.value;
appendMessage(PERSON_NAME, PERSON_IMG, "right", msgText);
msgerInput.value = "";
botResponse(msgText, selectedModel);
});
function appendMessage(name, img, side, text) {
// Simple solution for small apps
const msgHTML = `
<div class="msg ${side}-msg">
<div class="msg-img" style="background-image: url(${img})"></div>
<div class="msg-bubble">
<div class="msg-info">
<div class="msg-info-name">${name}</div>
<div class="msg-info-time">${formatDate(
new Date()
)}</div>
</div>
<div class="msg-text">${text}</div>
</div>
</div>
`;
msgerChat.insertAdjacentHTML("beforeend", msgHTML);
msgerChat.scrollTop += 500;
}
async function botResponse(text, selectedModel) {
// Bot Response
try {
const response = await fetch(
`reply?input=${text}&modelName=${selectedModel}`
);
const data = await response.json();
let reply = data.bot_reply;
if (selectedModel == "bloom") {
reply = reply.response;
}
appendMessage(BOT_NAME + " - " + selectedModel, BOT_IMG, "left", reply);
} catch (error) {
console.error(error);
appendMessage(
BOT_NAME + "- " + selectedModel,
BOT_IMG,
"left",
"Sorry, I'm not able to respond at the moment."
);
}
}
// async function authenticate(token) {
// const response = await fetch(`login?token=${token}`, {
// method: "POST",
// });
// const data = await response.json();
// console.log("data", data);
// if ("error" in data) {
// error = response.json()["error"];
// appendMessage(BOT_NAME, BOT_IMG, "left", error["message"]);
// } else {
// isUserVerified = true;
// appendMessage(BOT_NAME, BOT_IMG, "left", "How can I can help you?");
// }
// }
// Utils
function get(selector, root = document) {
return root.querySelector(selector);
}
function formatDate(date) {
const h = "0" + date.getHours();
const m = "0" + date.getMinutes();
return `${h.slice(-2)}:${m.slice(-2)}`;
}
|