KOS Company · Liquid Glass (launcher + chat)
KOS COMPANY
Ask AI
`; messages.appendChild(h); messages.scrollTop=messages.scrollHeight; } function hideTyping(){ const el=document.getElementById("typingIndicator"); if(el) el.remove(); } function ensureWelcome(){ if(!messages.querySelector("[data-welcome]")){ const w=document.createElement("div"); w.className="bubble-bot"; w.setAttribute("data-welcome","1"); w.innerHTML=`Ciao, vuoi informazioni sul nostro servizio?
Oppure hai intenzione di sviluppare un prodotto?`; messages.appendChild(w); } } /* overlay */ function openChat(){ overlay.classList.add("open"); overlay.setAttribute("aria-hidden","false"); ensureWelcome(); setTimeout(()=> chatI.focus(), 100); } function closeChat(){ overlay.classList.remove("open"); overlay.setAttribute("aria-hidden","true"); launchI.focus(); } closeBtn?.addEventListener("click", closeChat); document.addEventListener("keydown", e=>{ if(e.key==="Escape" && overlay.classList.contains("open")) closeChat(); }); /* backend */ async function askBackend(text){ const res = await fetch(WEBHOOK,{ method:"POST", headers:{ "Content-Type":"application/json" }, body: JSON.stringify({ question:text, chat_id:CHAT_ID }) }); return res.json(); } /* flow */ async function handleSend(text){ if(!text) return; if(!overlay.classList.contains("open")) openChat(); appendBubble(text.replace(/,"<"), "user"); showTyping(); try{ const data = await askBackend(text); hideTyping(); const payload = Array.isArray(data) ? (data[0]||{}) : (data||{}); const reply = payload.reply || {}; const raw = reply.details || payload.data || reply.text || ""; appendBubble( / handleSend(launchI.value.trim())); launchI.addEventListener("keypress", e=>{ if(e.key==="Enter") handleSend(launchI.value.trim()); }); document.getElementById("chatSend").addEventListener("click", ()=>{ const t=chatI.value.trim(); chatI.value=""; handleSend(t); }); chatI.addEventListener("keypress", e=>{ if(e.key==="Enter"){ const t=chatI.value.trim(); chatI.value=""; handleSend(t); } }); // chips → compilano il campo attivo document.querySelectorAll(".chip").forEach(btn=>{ btn.addEventListener("click", ()=>{ const topic = btn.dataset.prompt || btn.textContent.trim(); const target = overlay.classList.contains("open") ? chatI : launchI; target.value = `Parliamo di ${topic.toLowerCase()}: `; target.dispatchEvent(new Event('input',{bubbles:true})); target.focus(); }); });