Differenze
Queste sono le differenze tra la revisione selezionata e la versione attuale della pagina.
| Entrambe le parti precedenti la revisioneRevisione precedenteProssima revisione | Revisione precedente | ||
| chiedi_a_claude [2025/08/25 17:05] – eliminata neoadmin | chiedi_a_claude [2025/08/25 17:09] (versione attuale) – neoadmin | ||
|---|---|---|---|
| Linea 1: | Linea 1: | ||
| + | < | ||
| + | < | ||
| + | <meta charset=" | ||
| + | <meta name=" | ||
| + | < | ||
| + | <script src=" | ||
| + | < | ||
| + | .message-enter { | ||
| + | animation: messageSlideIn 0.3s ease-out; | ||
| + | } | ||
| + | @keyframes messageSlideIn { | ||
| + | from { opacity: 0; transform: translateY(10px); | ||
| + | to { opacity: 1; transform: translateY(0); | ||
| + | } | ||
| + | .typing-indicator { | ||
| + | animation: pulse 1.5s ease-in-out infinite; | ||
| + | } | ||
| + | @keyframes pulse { | ||
| + | 0%, 100% { opacity: 0.4; } | ||
| + | 50% { opacity: 1; } | ||
| + | } | ||
| + | </ | ||
| + | </ | ||
| + | <body class=" | ||
| + | <!-- Header --> | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <svg class=" | ||
| + | <path stroke-linecap=" | ||
| + | </ | ||
| + | </ | ||
| + | <div> | ||
| + | <h1 class=" | ||
| + | <p class=" | ||
| + | <svg class=" | ||
| + | <path stroke-linecap=" | ||
| + | </ | ||
| + | Fonte: " | ||
| + | </p> | ||
| + | </ | ||
| + | </ | ||
| + | </ | ||
| + | <!-- Messages Container --> | ||
| + | <div id=" | ||
| + | <!-- Messages will be inserted here --> | ||
| + | </ | ||
| + | |||
| + | <!-- Quick Questions (shown initially) --> | ||
| + | <div id=" | ||
| + | <div class=" | ||
| + | <h3 class=" | ||
| + | <svg class=" | ||
| + | <path stroke-linecap=" | ||
| + | </ | ||
| + | Domande rapide: | ||
| + | </h3> | ||
| + | <div class=" | ||
| + | <button onclick=" | ||
| + | <button onclick=" | ||
| + | <button onclick=" | ||
| + | <button onclick=" | ||
| + | <button onclick=" | ||
| + | <button onclick=" | ||
| + | <button onclick=" | ||
| + | <button onclick=" | ||
| + | </ | ||
| + | </ | ||
| + | </ | ||
| + | |||
| + | <!-- Input Area --> | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | < | ||
| + | id=" | ||
| + | placeholder=" | ||
| + | class=" | ||
| + | rows=" | ||
| + | onkeydown=" | ||
| + | ></ | ||
| + | < | ||
| + | id=" | ||
| + | onclick=" | ||
| + | class=" | ||
| + | > | ||
| + | <svg class=" | ||
| + | <path stroke-linecap=" | ||
| + | </ | ||
| + | </ | ||
| + | </ | ||
| + | <div class=" | ||
| + | <svg class=" | ||
| + | <path stroke-linecap=" | ||
| + | </ | ||
| + | Le risposte sono basate esclusivamente sul documento fonte fornito | ||
| + | </ | ||
| + | </ | ||
| + | |||
| + | < | ||
| + | .quick-btn { | ||
| + | @apply text-xs bg-blue-50 hover: | ||
| + | } | ||
| + | </ | ||
| + | |||
| + | < | ||
| + | // Knowledge Base dal documento | ||
| + | const knowledgeBase = { | ||
| + | ' | ||
| + | keywords: [' | ||
| + | response: ' | ||
| + | }, | ||
| + | ' | ||
| + | keywords: [' | ||
| + | response: ' | ||
| + | }, | ||
| + | ' | ||
| + | keywords: [' | ||
| + | response: 'La prognosi dipende da diversi fattori. Con il fegato nativo, la sopravvivenza a 10 anni è del 30-50%. Tuttavia, considerando anche i trapianti, la sopravvivenza globale supera il 90%. I fattori prognostici favorevoli includono: età al Kasai <60 giorni, clearance dell\' | ||
| + | }, | ||
| + | ' | ||
| + | keywords: [' | ||
| + | response: 'Il documento descrive due classificazioni principali: | ||
| + | }, | ||
| + | ' | ||
| + | keywords: [' | ||
| + | response: 'I segni clinici tipici dell\' | ||
| + | }, | ||
| + | ' | ||
| + | keywords: [' | ||
| + | response: 'La diagnosi si basa su un approccio multimodale: | ||
| + | }, | ||
| + | ' | ||
| + | keywords: [' | ||
| + | response: 'La procedura di Kasai (portoenterostomia) è il trattamento standard: | ||
| + | }, | ||
| + | ' | ||
| + | keywords: [' | ||
| + | response: 'Il trapianto di fegato è indicato in caso di:\\n- **Fallimento primario** della procedura di Kasai\\n- **Deterioramento della funzione epatica** nonostante successo iniziale del Kasai\\n- **PELD Score >15-20** (pediatric end-stage liver disease)\\n- **Complicanze della cirrosi:** ascite refrattaria, | ||
| + | }, | ||
| + | ' | ||
| + | keywords: [' | ||
| + | response: 'La sindrome BASM è presente nel 10-20% dei casi di atresia biliare e include: | ||
| + | } | ||
| + | }; | ||
| + | |||
| + | let messages = []; | ||
| + | |||
| + | function findBestResponse(userInput) { | ||
| + | const input = userInput.toLowerCase(); | ||
| + | | ||
| + | let bestMatch = null; | ||
| + | let bestScore = 0; | ||
| + | | ||
| + | Object.entries(knowledgeBase).forEach(([key, | ||
| + | let score = 0; | ||
| + | data.keywords.forEach(keyword => { | ||
| + | if (input.includes(keyword)) { | ||
| + | score += keyword.length; | ||
| + | } | ||
| + | }); | ||
| + | | ||
| + | if (score > bestScore) { | ||
| + | bestScore = score; | ||
| + | bestMatch = data.response; | ||
| + | } | ||
| + | }); | ||
| + | | ||
| + | if (!bestMatch) { | ||
| + | if (input.includes(' | ||
| + | return ' | ||
| + | } | ||
| + | | ||
| + | if (input.includes(' | ||
| + | return ' | ||
| + | } | ||
| + | | ||
| + | return 'Mi dispiace, non ho trovato informazioni specifiche su questo argomento nel documento fonte. Le mie conoscenze si limitano esclusivamente al contenuto del paper " | ||
| + | } | ||
| + | | ||
| + | return bestMatch; | ||
| + | } | ||
| + | |||
| + | function addMessage(type, | ||
| + | const timestamp = new Date(); | ||
| + | messages.push({ type, content, timestamp }); | ||
| + | renderMessages(); | ||
| + | scrollToBottom(); | ||
| + | } | ||
| + | |||
| + | function renderMessages() { | ||
| + | const container = document.getElementById(' | ||
| + | container.innerHTML = ''; | ||
| + | |||
| + | messages.forEach((message, | ||
| + | const messageDiv = document.createElement(' | ||
| + | messageDiv.className = `flex ${message.type === ' | ||
| + | | ||
| + | messageDiv.innerHTML = ` | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | ${message.type === ' | ||
| + | '< | ||
| + | '< | ||
| + | } | ||
| + | </ | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | ${message.timestamp.toLocaleTimeString(' | ||
| + | </ | ||
| + | </ | ||
| + | </ | ||
| + | `; | ||
| + | | ||
| + | container.appendChild(messageDiv); | ||
| + | }); | ||
| + | } | ||
| + | |||
| + | function scrollToBottom() { | ||
| + | const container = document.getElementById(' | ||
| + | container.scrollTop = container.scrollHeight; | ||
| + | } | ||
| + | |||
| + | function sendMessage() { | ||
| + | const input = document.getElementById(' | ||
| + | const value = input.value.trim(); | ||
| + | | ||
| + | if (!value) return; | ||
| + | | ||
| + | // Hide quick questions after first message | ||
| + | if (messages.length === 0) { | ||
| + | document.getElementById(' | ||
| + | } | ||
| + | | ||
| + | addMessage(' | ||
| + | input.value = ''; | ||
| + | | ||
| + | // Show typing indicator | ||
| + | showTypingIndicator(); | ||
| + | | ||
| + | // Simulate bot response delay | ||
| + | setTimeout(() => { | ||
| + | hideTypingIndicator(); | ||
| + | const response = findBestResponse(value); | ||
| + | addMessage(' | ||
| + | }, 1000 + Math.random() * 1000); | ||
| + | } | ||
| + | |||
| + | function askQuestion(question) { | ||
| + | document.getElementById(' | ||
| + | sendMessage(); | ||
| + | } | ||
| + | |||
| + | function handleKeyPress(event) { | ||
| + | if (event.key === ' | ||
| + | event.preventDefault(); | ||
| + | sendMessage(); | ||
| + | } | ||
| + | } | ||
| + | |||
| + | function showTypingIndicator() { | ||
| + | const container = document.getElementById(' | ||
| + | const typingDiv = document.createElement(' | ||
| + | typingDiv.id = ' | ||
| + | typingDiv.className = 'flex justify-start'; | ||
| + | typingDiv.innerHTML = ` | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <svg class=" | ||
| + | <path stroke-linecap=" | ||
| + | </ | ||
| + | </ | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | </ | ||
| + | </ | ||
| + | `; | ||
| + | container.appendChild(typingDiv); | ||
| + | scrollToBottom(); | ||
| + | } | ||
| + | |||
| + | function hideTypingIndicator() { | ||
| + | const indicator = document.getElementById(' | ||
| + | if (indicator) { | ||
| + | indicator.remove(); | ||
| + | } | ||
| + | } | ||
| + | |||
| + | // Initialize with welcome message | ||
| + | window.onload = function() { | ||
| + | addMessage(' | ||
| + | }; | ||
| + | </ | ||
| + | </ | ||
| + | </ | ||