ImageIQ / static /script.js
OpenRAG128's picture
Create static/script.js
87b8c5c verified
function sendMessage() {
const inputField = document.getElementById('userInput');
const message = inputField.value.trim();
const imageUpload = document.getElementById('imageUpload').files[0];
const complexity = document.getElementById('complexity').value;
const model = document.getElementById('model').value; // Get the selected model
const chatbox = document.getElementById('chatbox');
if (message === "" && !imageUpload) return;
// Append user message
const userMessageDiv = document.createElement('div');
userMessageDiv.classList.add('user-message');
const userText = document.createElement('span');
userText.textContent = message;
userMessageDiv.appendChild(userText);
if (imageUpload) {
const imagePreview = document.createElement('img');
imagePreview.src = URL.createObjectURL(imageUpload);
imagePreview.style.maxWidth = '100px';
imagePreview.style.maxHeight = '100px';
imagePreview.style.marginTop = '10px';
userMessageDiv.appendChild(imagePreview);
}
chatbox.appendChild(userMessageDiv);
// Clear input field
inputField.value = '';
document.getElementById('imageUpload').value = '';
// Scroll chatbox to the bottom
chatbox.scrollTop = chatbox.scrollHeight;
// Send request to Flask backend
const formData = new FormData();
formData.append('image', imageUpload);
formData.append('question', message);
formData.append('complexity', complexity);
formData.append('model', model); // Append selected model
fetch('/ask', {
method: 'POST',
body: formData
})
.then(response => response.json())
.then(data => {
const botMessageDiv = document.createElement('div');
botMessageDiv.classList.add('bot-message');
const botText = document.createElement('span');
botText.textContent = data.answer;
botMessageDiv.appendChild(botText);
chatbox.appendChild(botMessageDiv);
// Scroll chatbox to the bottom
chatbox.scrollTop = chatbox.scrollHeight;
})
.catch(error => {
console.error('Error:', error);
});
}