AskLAQ3 / static /script.js
OUAREDAEK's picture
Upload folder using huggingface_hub
cb26b7f verified
console.log('✅ script.js chargé');
document.addEventListener('DOMContentLoaded', () => {
const btn = document.getElementById('sendBtn');
const input = document.getElementById('question');
const chat = document.getElementById('chat');
const intentLbl = document.getElementById('intent');
const matchedLbl = document.getElementById('matched');
const confFill = document.getElementById('conf-fill');
const stars = document.querySelectorAll('.star');
const surveyLink = document.getElementById('survey-link');
let isLoading = false;
async function sendQuestion(q) {
const question = q.trim();
if (!question || isLoading) return;
chat.innerHTML += `<div class="user-msg"><b>Vous :</b> ${question}</div>`;
input.value = '';
input.focus();
stars.forEach(s => { s.textContent = "☆"; s.style.pointerEvents = 'auto'; });
const loaderDiv = document.createElement('div');
loaderDiv.className = 'bot-msg';
loaderDiv.innerHTML = '<i>💭 Bot réfléchit…</i>';
chat.appendChild(loaderDiv);
chat.scrollTop = chat.scrollHeight;
isLoading = true;
try {
const res = await fetch('/ask', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ question })
});
const data = await res.json();
loaderDiv.remove();
chat.innerHTML += `<div class="bot-msg"><b>Bot :</b> ${data.response}</div>`;
if (data.recs && data.recs.length > 0) {
const suggDiv = document.createElement('div');
suggDiv.className = 'recs';
data.recs.forEach(r => {
const a = document.createElement('a');
a.textContent = r;
suggDiv.appendChild(a);
});
chat.appendChild(suggDiv);
}
intentLbl.textContent = data.intent;
matchedLbl.textContent = data.matched;
confFill.style.width = data.confidence + "%";
confFill.textContent = data.confidence + "%";
confFill.style.background =
data.confidence < 40 ? "#E53935" :
data.confidence < 80 ? "#FB8C00" : "#43A047";
} catch (err) {
loaderDiv.remove();
chat.innerHTML += '<div class="bot-msg"><b>Erreur :</b> Impossible de contacter le serveur.</div>';
console.error(err);
}
chat.scrollTop = chat.scrollHeight;
isLoading = false;
}
btn.addEventListener('click', () => sendQuestion(input.value));
input.addEventListener('keypress', e => { if (e.key === 'Enter') sendQuestion(input.value); });
// Étoiles de satisfaction + affichage questionnaire
stars.forEach(s => {
s.addEventListener('click', () => {
const val = parseInt(s.dataset.value);
stars.forEach((st, i) => {
st.textContent = i < val ? "★" : "☆";
st.style.pointerEvents = 'none';
});
chat.innerHTML += `<div><i>⭐ Merci pour votre évaluation : ${val} / 5</i></div>`;
surveyLink.style.display = 'block';
});
});
chat.addEventListener('click', (e) => {
if (e.target.tagName === 'A' && e.target.parentElement.classList.contains('recs')) {
sendQuestion(e.target.textContent);
}
});
});