Differenze

Queste sono le differenze tra la revisione selezionata e la versione attuale della pagina.

Link a questa pagina di confronto

Entrambe le parti precedenti la revisioneRevisione precedente
Prossima revisione
Revisione precedente
chiedi_a_claude [2025/08/11 06:39] neoadminchiedi_a_claude [2025/08/25 17:09] (versione attuale) neoadmin
Linea 3: Linea 3:
     <meta charset="UTF-8">     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Claude AI Assistente DocuNeo</title>+    <title>Chatbot Medico Atresia Biliare</title
 +    <script src="https://cdn.tailwindcss.com"></script>
     <style>     <style>
-        body +        .message-enter 
-            font-family: Arial, sans-serif; +            animationmessageSlideIn 0.3s ease-out;
-            max-width: 1200px; +
-            margin: 0 auto; +
-            padding: 20px; +
-            background-color: #f8f9fa;+
         }         }
-         +        @keyframes messageSlideIn {
-        .claude-container { +
-            background: white; +
-            border-radius: 12px; +
-            padding: 25px; +
-            box-shadow: 0 4px 12px rgba(0,0,0,0.1); +
-            margin-bottom: 20px; +
-        } +
-         +
-        .header { +
-            text-align: center; +
-            margin-bottom: 30px; +
-        } +
-         +
-        .header h1 { +
-            color: #2c3e50; +
-            margin: 0; +
-            font-size: 2.5em; +
-        } +
-         +
-        .header p { +
-            color: #7f8c8d; +
-            margin: 10px 0 0 0; +
-            font-size: 1.1em; +
-        } +
-         +
-        .input-section { +
-            margin-bottom: 25px; +
-        } +
-         +
-        .question-input { +
-            width: 100%; +
-            padding: 15px; +
-            font-size: 16px; +
-            border: 2px solid #e1e8ed; +
-            border-radius: 8px; +
-            box-sizing: border-box; +
-            transition: border-color 0.3s ease; +
-        } +
-         +
-        .question-input:focus { +
-            outline: none; +
-            border-color: #007acc; +
-            box-shadow: 0 0 0 3px rgba(0, 122, 204, 0.1); +
-        } +
-         +
-        .button-group { +
-            display: flex; +
-            gap: 10px; +
-            margin-top: 15px; +
-            flex-wrap: wrap; +
-        } +
-         +
-        .btn { +
-            padding: 12px 24px; +
-            border: none; +
-            border-radius: 6px; +
-            font-size: 14px; +
-            font-weight: 600; +
-            cursor: pointer; +
-            transition: all 0.3s ease; +
-            display: flex; +
-            align-items: center; +
-            gap: 8px; +
-        } +
-         +
-        .btn-primary { +
-            background: #007acc; +
-            color: white; +
-        } +
-         +
-        .btn-primary:hover { +
-            background: #005fa3; +
-            transform: translateY(-1px); +
-        } +
-         +
-        .btn-secondary { +
-            background: #6c757d; +
-            color: white; +
-        } +
-         +
-        .btn-secondary:hover { +
-            background: #545b62; +
-        } +
-         +
-        .btn:disabled { +
-            background: #ccc; +
-            cursor: not-allowed; +
-            transform: none; +
-        } +
-         +
-        .status { +
-            margin: 20px 0; +
-            padding: 15px; +
-            border-radius: 6px; +
-            display: none; +
-        } +
-         +
-        .status.loading { +
-            background: #e3f2fd; +
-            color: #1565c0; +
-            border-left: 4px solid #2196f3; +
-        } +
-         +
-        .status.error { +
-            background: #ffebee; +
-            color: #c62828; +
-            border-left: 4px solid #f44336; +
-        } +
-         +
-        .status.info { +
-            background: #e8f5e8; +
-            color: #2d5a2d; +
-            border-left: 4px solid #28a745; +
-        } +
-         +
-        .answer-section { +
-            margin-top: 25px; +
-        } +
-         +
-        .answer-box { +
-            background: #f8f9fa; +
-            border: 1px solid #e9ecef; +
-            border-radius: 8px; +
-            padding: 20px; +
-            min-height: 100px; +
-            line-height: 1.6; +
-            display: none; +
-        } +
-         +
-        .answer-box.show { +
-            display: block; +
-            animation: fadeIn 0.5s ease; +
-        } +
-         +
-        @keyframes fadeIn {+
             from { opacity: 0; transform: translateY(10px); }             from { opacity: 0; transform: translateY(10px); }
             to { opacity: 1; transform: translateY(0); }             to { opacity: 1; transform: translateY(0); }
         }         }
-         +        .typing-indicator 
-        .config-section +            animationpulse 1.5s ease-in-out infinite;
-            margin-top30px; +
-            padding-top: 25px; +
-            border-top: 2px solid #e9ecef;+
         }         }
-         +        @keyframes pulse 
-        .config-grid +            0%100% opacity: 0.4; } 
-            display: grid; +            50% opacity1; }
-            grid-template-columns: repeat(auto-fitminmax(300px, 1fr)); +
-            gap: 20px; +
-        } +
-         +
-        .config-item { +
-            display: flex; +
-            flex-direction: column; +
-            gap: 8px; +
-        } +
-         +
-        .config-item label { +
-            font-weight: 600; +
-            color: #495057; +
-        } +
-         +
-        .config-item input, .config-item select { +
-            padding: 10px; +
-            border: 1px solid #ced4da; +
-            border-radius: 4px; +
-            font-size: 14px; +
-        } +
-         +
-        .examples { +
-            background: #e8f5e8; +
-            border-radius: 8px; +
-            padding: 20px; +
-            margin-top: 20px; +
-        } +
-         +
-        .examples h3 { +
-            margin: 0 0 15px 0; +
-            color: #2d5a2d; +
-        } +
-         +
-        .example-questions { +
-            display: flex; +
-            flex-wrap: wrap; +
-            gap: 10px; +
-        } +
-         +
-        .example-btn { +
-            background: white; +
-            border: 1px solid #28a745; +
-            color: #28a745; +
-            padding: 8px 12px; +
-            border-radius: 20px; +
-            font-size: 12px; +
-            cursor: pointer; +
-            transition: all 0.3s ease; +
-        } +
-         +
-        .example-btn:hover { +
-            background#28a745; +
-            color: white; +
-        } +
-         +
-        .footer { +
-            text-align: center; +
-            margin-top: 40px; +
-            padding: 20px; +
-            color: #6c757d; +
-            font-size: 14px; +
-        } +
-         +
-        .info-box { +
-            margin-bottom: 20px;  +
-            padding: 15px;  +
-            background: #fff3cd;  +
-            border-radius: 8px;  +
-            border-left: 4px solid #ffc107; +
-        } +
-         +
-        @media (max-width: 768px) { +
-            body { +
-                padding: 10px; +
-            } +
-             +
-            .claude-container { +
-                padding: 15px; +
-            } +
-             +
-            .header h1 { +
-                font-size: 2em; +
-            } +
-             +
-            .button-group { +
-                flex-direction: column; +
-            } +
-             +
-            .btn { +
-                justify-content: center; +
-            }+
         }         }
     </style>     </style>
 </head> </head>
-<body+<body class="bg-gray-50 h-screen flex flex-col"> 
-    <div class="claude-container"> +    <!-- Header --> 
-        <div class="header"> +    <div class="bg-white border-b shadow-sm px-4 py-3 flex-shrink-0"> 
-            <h1>🤖 Claude AI</h1> +        <div class="flex items-center space-x-3"> 
-            <p>Assistente per DocuNeo.org Domande sui protocolli neonatali</p+            <div class="bg-blue-100 p-2 rounded-full"> 
-        </div> +                <svg class="h-6 w-6 text-blue-600fill="nonestroke="currentColorviewBox="0 0 24 24"> 
-         +                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z"/> 
-        <div class="input-section"> +                </svg>
-            <textarea  +
-                id="questionInput"  +
-                class="question-input"  +
-                placeholder="Scrivi qui la tua domanda sui protocolli di DocuNeo..." +
-                rows="3" +
-            ></textarea> +
-             +
-            <div class="button-group"> +
-                <button class="btn btn-primaryonclick="askClaude()"+
-                    <span>🚀</span> Chiedi a Claude +
-                </button> +
-                <button class="btn btn-secondaryonclick="clearAll()"> +
-                    <span>🗑️</span> Cancella tutto +
-                </button> +
-                <button class="btn btn-secondaryonclick="useOfflineMode()"+
-                    <span>📋</spanCarica Contenuti +
-                </button>+
             </div>             </div>
-        </div> +            <div> 
-         +                <h1 class="text-lg font-semibold text-gray-900">Assistant Medico Specializzato</h1
-        <div id="status" class="status"></div+                <class="text-sm text-gray-600 flex items-center"> 
-         +                    <svg class="h-4 w-4 mr-1fill="none" stroke="currentColor" viewBox="0 0 24 24"> 
-        <div class="answer-section"> +                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/> 
-            <div id="answerBoxclass="answer-box"> +                    </svg> 
-                <strong>Le risposte di Claude appariranno qui...</strong>+                    Fonte: "Biliary Atresia: Multidisciplinary Approach" - Columbia University 
 +                </p>
             </div>             </div>
         </div>         </div>
-         +    </div> 
-        <div class="examples"> + 
-            <h3>💡 Esempi di domande per DocuNeo:</h3> +    <!-- Messages Container --> 
-            <div class="example-questions"> +    <div id="messages-container" class="flex-1 overflow-y-auto p-4 space-y-4"> 
-                <span class="example-btn" onclick="setQuestion('Come si gestisce la NEC neonatale?')">Come si gestisce la NEC?</span+        <!-- Messages will be inserted here --> 
-                <span class="example-btn" onclick="setQuestion('Quali sono i protocolli per l\'ipoglicemia neonatale?')">Protocolli ipoglicemia</span+    </div
-                <span class="example-btn" onclick="setQuestion('Come si tratta il dolore nel neonato?')">Trattamento del dolore</span+ 
-                <span class="example-btn" onclick="setQuestion('Linee guida per la sepsi neonatale')">Sepsi neonatale</span+    <!-- Quick Questions (shown initially) --> 
-                <span class="example-btn" onclick="setQuestion('Protocolli per la ventilazione del pretermine')">Ventilazione pretermine</span>+    <div id="quick-questions" class="px-4 pb-2"> 
 +        <div class="bg-white border rounded-lg p-4"> 
 +            <h3 class="text-sm font-semibold text-gray-700 mb-2 flex items-center"> 
 +                <svg class="h-4 w-4 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"> 
 +                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/> 
 +                </svg> 
 +                Domande rapide: 
 +            </h3> 
 +            <div class="flex flex-wrap gap-2"> 
 +                <button onclick="askQuestion('Qual è l\'incidenza dell\'atresia biliare?')" class="quick-btn">Qual è l'incidenza dell'atresia biliare?</button
 +                <button onclick="askQuestion('Quali sono i sintomi principali?')" class="quick-btn">Quali sono i sintomi principali?</button
 +                <button onclick="askQuestion('Quando si deve fare la procedura di Kasai?')" class="quick-btn">Quando si deve fare la procedura di Kasai?</button> 
 +                <button onclick="askQuestion('Qual è la prognosi a lungo termine?')" class="quick-btn">Qual è la prognosi a lungo termine?</button
 +                <button onclick="askQuestion('Come si fa la diagnosi?')" class="quick-btn">Come si fa la diagnosi?</button> 
 +                <button onclick="askQuestion('Quali sono le complicanze del Kasai?')" class="quick-btn">Quali sono le complicanze del Kasai?</button
 +                <button onclick="askQuestion('Quando è indicato il trapianto?')" class="quick-btn">Quando è indicato il trapianto?</button> 
 +                <button onclick="askQuestion('Cos\'è la sindrome BASM?')" class="quick-btn">Cos'è la sindrome BASM?</button>
             </div>             </div>
         </div>         </div>
     </div>     </div>
-     + 
-    <div class="claude-container config-section"> +    <!-- Input Area --> 
-        <h2>⚙️ Configurazione</h2> +    <div class="bg-white border-t p-4 flex-shrink-0"> 
-         +        <div class="flex space-x-2"> 
-        <div class="info-box"> +            <textarea  
-            <h4 style="margin0 0 10px 0; color#856404;">🔧 Come iniziare</h4+                id="message-input"  
-            <p style="margin0; font-size13px; color#856404;"> +                placeholder="Chiedi qualcosa sull'atresia biliare... (es'Quali sono i sintomi?' o 'Quando fare il Kasai?')" 
-                1. Clicca "📋 Carica Contenutiper preparare i dati DocuNeo<br+                class="flex-1 px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent resize-none" 
-                2. Inserisci la tua API key Anthropic qui sotto<br> +                rows="2" 
-                3. Fai una domanda sui protocolli neonatali +                onkeydown="handleKeyPress(event)" 
-            </p>+            ></textarea
 +            <button  
 +                id="send-button" 
 +                onclick="sendMessage()"  
 +                class="px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-colors flex items-center" 
 +            
 +                <svg class="h-4 w-4fill="none" stroke="currentColor" viewBox="0 0 24 24"> 
 +                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 19l9 2-9-18-9 18 9-2zm0 0v-8"/
 +                </svg
 +            </button>
         </div>         </div>
-         +        <div class="mt-2 text-xs text-gray-500 flex items-center"> 
-        <div class="config-grid"> +            <svg class="h-3 w-3 mr-1fill="nonestroke="currentColorviewBox="0 0 24 24"> 
-            <div class="config-item"> +                <path stroke-linecap="roundstroke-linejoin="roundstroke-width="2d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/> 
-                <label for="apiKey">API Key Anthropic:</label> +            </svg
-                <input type="password" id="apiKey" placeholder="sk-ant-api03-..."> +            Le risposte sono basate esclusivamente sul documento fonte fornito
-            </div> +
-            <div class="config-item"> +
-                <label for="claudeModel">Modello Claude:</label> +
-                <select id="claudeModel"> +
-                    <option value="claude-3-sonnet-20240229">Claude Sonnet</option> +
-                    <option value="claude-3-opus-20240229">Claude 3 Opus</option> +
-                    <option value="claude-3-haiku-20240307">Claude 3 Haiku</option> +
-                </select> +
-            </div> +
-            <div class="config-item"+
-                <label for="maxTokens">Max Token Risposta:</label+
-                <input type="numberid="maxTokensvalue="1500min="100max="4000"> +
-            </div+
-            <div class="config-item"> +
-                <label for="contextLimit">Limite Caratteri Contesto:</label> +
-                <input type="number" id="contextLimit" value="50000" min="10000" max="100000"+
-            </div>+
         </div>         </div>
     </div>     </div>
-     + 
-    <div class="footer"+    <style
-        <p>Powered by Claude AI • Contenuti estratti da <strong>DocuNeo.org</strong></p> +        .quick-btn { 
-        <p style="font-size12px; margin-top: 10px;"> +            @apply text-xs bg-blue-50 hover:bg-blue-100 text-blue-700 px-2 py-1 rounded border transition-colors cursor-pointer
-            🏥 Sistema di gestione documenti per Terapia Intensiva Neonatale +        } 
-        </p> +    </style>
-    </div>+
  
     <script>     <script>
-        // Variabili globali +        // Knowledge Base dal documento 
-        let wikiContent = ''; +        const knowledgeBase 
-        let isProcessing = false; +            'incidenza': { 
-         +                keywords: ['incidenza', 'epidemiologia', 'frequenza', 'casi', 'nascite'], 
-        // Inizializzazione +                response: 'Secondo il documento, l\'incidenza dell\'atresia biliare è di 5-6 casi per 100.000 nascite vive in Europa e USA. Tuttavia, c\'è una significativa variabilità geografica: in Polinesia Francese l\'incidenza raggiunge 32 per 100.000 nascite vive, suggerendo possibili fattori genetici o ambientali specifici.' 
-        window.onload = function() +            }, 
-            loadConfig(); +            'definizione': { 
-             +                keywords: ['cos\'è', 'definizione', 'cosa significa', 'che cos\'è'], 
-            // Controlla se abbiamo contenuti in cache +                response: 'L\'atresia biliare è una malattia colestatica progressiva che colpisce neonati e lattanti, caratterizzata da infiammazione e ostruzione dei dotti biliari extraepatici. È la principale indicazione per il trapianto di fegato nei bambini piccoli. Se non trattata, è universalmente fatale entro i primi 2 anni di vita.' 
-            if (loadCachedContent()) { +            }, 
-                showStatus('💡 Contenuti DocuNeo già caricati! Inserisci la tua API key fai una domanda.', 'info'); +            'prognosi':
-            } else +                keywords: ['prognosi', 'sopravvivenza', 'esiti', 'outcome', 'mortalità'], 
-                showStatus('💡 Benvenuto! Clicca "Carica Contenuti" per iniziarepoi inserisci la tua API key.', 'info');+                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\'ittero entro 3-6 mesi, assenza di colangite ricorrente, e forma non sindromica.' 
 +            }, 
 +            'classificazione':
 +                keywords: ['tipi', 'classificazione', 'forme', 'categorie'], 
 +                response: 'Il documento descrive due classificazioni principali:\\n\\n1) **Classificazione clinica:**\\n- Forma embrionale/fetale (10-20%): associata a malformazioni multiple (sindrome BASM)\\n- Forma perinatale/postnatale (80-90%): generalmente isolata\\n\\n2) **Classificazione anatomica di Kasai:**\\n- Tipo I (5%): atresia del dotto biliare comune distale\\n- Tipo II (2%): atresia del dotto epatico comune\\n- Tipo III (93%): atresia coinvolgente i dotti epatici destro e sinistro' 
 +            }, 
 +            'sintomi':
 +                keywords: ['sintomi', 'segni', 'clinica', 'presentazione', 'manifestazioni'], 
 +                response: 'I segni clinici tipici dell\'atresia biliare includono:\\n- **Ittero prolungato** che persiste oltre le prime 2-3 settimane di vita\\n- **Feci acoliche o ipocoliche** (chiare, color argilla)\\n- **Urine ipercromiche** (scure)\\n- **Epatomegalia** alla palpazione\\n- **Crescita normale** nelle prime settimane (importante per la diagnosi differenziale)\\n\\nLa combinazione di ittero persistente + feci acoliche è altamente suggestiva.' 
 +            }, 
 +            'diagnosi': 
 +                keywords: ['diagnosi', 'come diagnosticare', 'esami', 'test'], 
 +                response: 'La diagnosi si basa su un approccio multimodale:\\n\\n**Laboratorio:** Bilirubina diretta >50% del totale, ALT/AST moderatamente elevate, fosfatasi alcalina GGT marcatamente elevate.\\n\\n**Imaging:** Ecografia con "triangular cord sign" (specificità alta, sensibilità 57-85%) e cistifellea piccola/contratta.\\n\\n**Istologia:** Biopsia epatica con reazione duttulare marcata, fibrosi portale, tappi biliari intraepatici. Score ≥6/9 altamente suggestivo.\\n\\n**Conferma:** Laparoscopia con colangiografia per visualizzazione diretta dell\'albero biliare.' 
 +            }, 
 +            'kasai': { 
 +                keywords: ['kasai', 'portoenterostomia', 'chirurgia', 'intervento', 'operazione'], 
 +                response: 'La procedura di Kasai (portoenterostomiaè il trattamento standard:\\n\\n**Timing critico:** Ideale <45 giorni di vita, accettabile 45-60 giorni, limite assoluto 90-120 giorni. Ogni giorno di ritardo peggiora la prognosi.\\n\\n**Tecnica:** Approccio con laparotomia sottocostale, resezione del tessuto fibrotico della porta hepatis, anastomosi Roux-en-Y epatico-digiunale.\\n\\n**Successo:** Definito come clearance dell\'ittero (bilirubina <2 mg/dL) entro 3-6 mesi e ritorno delle feci a colorazione normale.\\n\\n**Fattori prognostici:** Dimensioni dei dotti residui >150-200 μm, assenza di fibrosi completa.' 
 +            }
 +            'trapianto': 
 +                keywords: ['trapianto', 'transplant', 'fallimento kasai', 'peld'], 
 +                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, encefalopatia epatica\\n- **Qualità di vita compromessa**\\n\\nL\'atresia biliare rimane la principale indicazione per trapianto epatico nei bambini piccoli. La sopravvivenza post-trapianto è eccellente (>90%) con buona qualità di vita.' 
 +            }, 
 +            'sindrome basm': { 
 +                keywords: ['basm', 'sindromica', 'malformazioni', 'situs inversus'], 
 +                response: 'La sindrome BASM è presente nel 10-20% dei casi di atresia biliare e include:\\n- **Situs inversus o eterotassia**\\n- **Malformazioni cardiache**\\n- **Anomalie spleniche** (asplenia o polisplenia)\\n- **Malrotazione intestinale**\\n\\nLa presenza della sindrome BASM è associata a una prognosi generalmente peggiore rispetto alla forma isolata di atresia biliare. È importante il riconoscimento precoce per la gestione multidisciplinare.'
             }             }
-            setTimeout(hideStatus, 5000); 
         };         };
-         + 
-        // Salva/carica configurazione +        let messages = []; 
-        function saveConfig() { + 
-            const config +        function findBestResponse(userInput) { 
-                apiKey: document.getElementById('apiKey').value, +            const input userInput.toLowerCase(); 
-                claudeModel: document.getElementById('claudeModel').value, +             
-                maxTokens: document.getElementById('maxTokens').value, +            let bestMatch = null; 
-                contextLimit: document.getElementById('contextLimit').value +            let bestScore = 0; 
-            }+             
-            Object.keys(config).forEach(key => { +            Object.entries(knowledgeBase).forEach(([key, data]) => { 
-                if (config[key]) +                let score = 0; 
-                    localStorage.setItem('claude_' key, config[key]);+                data.keywords.forEach(keyword => 
 +                    if (input.includes(keyword)) { 
 +                        score += keyword.length; 
 +                    } 
 +                })
 +                 
 +                if (score > bestScore) { 
 +                    bestScore = score; 
 +                    bestMatch = data.response;
                 }                 }
             });             });
-        } +             
-         +            if (!bestMatch) { 
-        function loadConfig() { +                if (input.includes('età') || input.includes('bambini') || input.includes('neonati')) { 
-            ['apiKey''claudeModel', 'maxTokens', 'contextLimit'].forEach(key => { +                    return 'L\'atresia biliare colpisce neonati e lattantiIl timing è critico: la diagnosi e il trattamento devono avvenire idealmente entro 45 giorni di vita per ottimizzare i risultatiOltre i 90-120 giorni, i risultati della procedura di Kasai peggiorano significativamente.';
-                const stored = localStorage.getItem('claude_+ key)+
-                if (stored) { +
-                    document.getElementById(key).value = stored;+
                 }                 }
-            }); +                 
-        } +                if (input.includes('mortalità'|| input.includes('morte'|| input.includes('fatale')) { 
-         +                    return 'Secondo il documento, se non trattata, l\'atresia biliare è universalmente fatale entro i primi 2 anni di vitaTuttavia, con il trattamento appropriato (Kasai ± trapianto), la sopravvivenza globale supera il 90%.'; 
-        // Funzioni interfaccia +                
-        function setQuestion(question) { +                 
-            document.getElementById('questionInput').value = question; +                return 'Mi dispiace, non ho trovato informazioni specifiche su questo argomento nel documento fonteLe mie conoscenze si limitano esclusivamente al contenuto del paper "Biliary Atresia: A Multidisciplinary Approach to Diagnosis and Management" della Columbia UniversityPotresti riformulare la domanda usando termini come: incidenza, sintomi, diagnosi, kasai, trapianto, prognosi, complicanze?'; 
-            document.getElementById('questionInput').focus(); +            }
-        } +
-         +
-        function clearAll() { +
-            document.getElementById('questionInput').value = ''; +
-            hideAnswer(); +
-            hideStatus(); +
-        } +
-         +
-        function showStatus(message, type = 'loading') { +
-            const status = document.getElementById('status'); +
-            status.textContent = message; +
-            status.className = `status ${type}`; +
-            status.style.display = 'block'; +
-        } +
-         +
-        function hideStatus() +
-            document.getElementById('status').style.display = 'none'; +
-        +
-         +
-        function showAnswer(content) { +
-            const answerBox = document.getElementById('answerBox'); +
-            answerBox.innerHTML = content; +
-            answerBox.classList.add('show'); +
-        } +
-         +
-        function hideAnswer() { +
-            const answerBox = document.getElementById('answerBox'); +
-            answerBox.classList.remove('show'); +
-        } +
-         +
-        // Modalità offline - carica contenuti base DocuNeo +
-        function useOfflineMode() { +
-            if (isProcessing) return;+
                          
-            showStatus('📋 Caricamento contenuti DocuNeo...', 'loading'); +            return bestMatch;
-            wikiContent = getPreExtractedContent(); +
-             +
-            // Salva in cache +
-            localStorage.setItem('docuneo_content_cache', wikiContent); +
-            localStorage.setItem('docuneo_content_timestamp', Date.now().toString()); +
-             +
-            showStatus(`✅ Contenuti DocuNeo caricati! (${Math.round(wikiContent.length / 1000)}k caratteri)`, 'info'); +
-            setTimeout(hideStatus, 3000);+
         }         }
-         
-        // Contenuto pre-estratto da DocuNeo 
-        function getPreExtractedContent() { 
-            return ` 
-=== DocuNeo - Sistema di Gestione Documenti Neonatali === 
  
-DocuNeo è il sistema di gestione dei documenti di reparto per la Terapia Intensiva Neonatale. +        function addMessage(typecontent) { 
-Include linee guidapercorsi diagnostico-terapeutici (PDT), protocolliCAT e bibliografia di riferimento.+            const timestamp = new Date()
 +            messages.push({ typecontenttimestamp }); 
 +            renderMessages(); 
 +            scrollToBottom(); 
 +        }
  
-## AREE PRINCIPALI:+        function renderMessages() { 
 +            const container = document.getElementById('messages-container'); 
 +            container.innerHTML = '';
  
-### DOLORE +            messages.forEach((message, index) => { 
-Indicazioni operative per il trattamento del dolore nel neonato +                const messageDiv = document.createElement('div'); 
-Approccio pratico al controllo del dolore da procedura +                messageDiv.className = `flex ${message.type === 'user' ? 'justify-end' : 'justify-start'} message-enter`; 
-Gestione farmacologica e non farmacologica del dolore neonatale+                 
 +                messageDiv.innerHTML = ` 
 +                    <div class="flex space-x-2 max-w-4xl ${message.type === 'user' ? 'flex-row-reverse space-x-reverse' : ''}"> 
 +                        <div class="flex-shrink-0 ${message.type === 'user' ? 'bg-blue-100' : 'bg-gray-100'} p-2 rounded-full"> 
 +                            ${message.type === 'user' ?  
 +                                '<svg class="h-4 w-4 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"/></svg>'
 +                                '<svg class="h-4 w-4 text-gray-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z"/></svg>' 
 +                            } 
 +                        </div> 
 +                        <div class="px-4 py-2 rounded-lg ${message.type === 'user' ? 'bg-blue-600 text-white' : 'bg-white border shadow-sm text-gray-800'}"> 
 +                            <div class="whitespace-pre-wrap text-sm">${message.content.replace(/\\n/g, '\n')}</div> 
 +                            <div class="text-xs mt-1 ${message.type === 'user' ? 'text-blue-200' : 'text-gray-500'}"> 
 +                                ${message.timestamp.toLocaleTimeString('it-IT', { hour: '2-digit', minute: '2-digit' })} 
 +                            </div> 
 +                        </div> 
 +                    </div> 
 +                `; 
 +                 
 +                container.appendChild(messageDiv); 
 +            }); 
 +        }
  
-### EMATOLOGIA   +        function scrollToBottom() { 
-Guida alla trasfusione dei concentrati piastrinici nel neonato +            const container = document.getElementById('messages-container'); 
-- Profilassi malattia emorragica nel neonato con vitamina K +            container.scrollTop = container.scrollHeight; 
-- Spremitura del funicolo per la prevenzione dell'anemia del neonato pretermine +        }
-- Gestione dell'anemia neonatale e criteri trasfusionali+
  
-### GASTROENTEROLOGIA +        function sendMessage() { 
-- Modalità di esecuzione del test di Apt per sangue nelle feci +            const input document.getElementById('message-input'); 
-- Linee guida per la gestione della NEC (Enterocolite Necrotizzante) +            const value input.value.trim();
-- Valutazione ecografica della NEC e staging radiologico +
-- Linee guida ESPGHAN e NASPGHAN per la gestione del Reflusso gastroesofageo +
-- Gestione nutrizionale post-NEC +
- +
-### INFEZIONI +
-- Infezione perinatale da streptococco: screening e profilassi +
-- Linee guida per la terapia della sepsi e delle infezioni in epoca neonatale +
-- Infezione congenita da Cytomegalovirus: diagnosi e follow-up +
-- Infezioni ed esposizione in gravidanza a CMV, HSV, VZ, sifilide +
-- Infezioni materne ed allattamento: compatibilità farmaci +
-- Profilassi della trasmissione perinatale dell'HIV +
-- Gestione infezioni correlate a dispositivi vascolari +
- +
-### MALATTIE METABOLICHE E IPOGLICEMIA +
-- Ipoglicemia neonatale: definizione, diagnosi e trattamento +
-- Algoritmo per la gestione dell'ipoglicemia transitoria e persistente +
-- Linee Guida per la diagnosi ed il trattamento dei difetti del ciclo dell'urea +
-- Inquadramento delle malattie metaboliche ad esordio neonatale +
-- Screening metabolico allargato e follow-up +
- +
-### NUTRIZIONE E ALLATTAMENTO +
-- Linee guida per la nutrizione e l'alimentazione enterale del neonato +
-- Schema operativo per la determinazione dei fabbisogni di liquidi e nutrienti +
-- Alimentazione per il neonato con rischio atopia +
-- Linee guida per la profilassi dell'Osteopenia nel pretermine +
-- Procedure per il sostegno dell'allattamento materno +
-- Gestione della Banca del Latte umano donato +
-- Composizione dei latti in formula e indicazioni d'uso +
- +
-### NEFRO-UROLOGIA +
-- Indicazioni all'esecuzione dell'ecografia renale in epoca neonatale +
-- Nefrocalcinosi e nefrolitasi nel pretermine: prevenzione e trattamento +
-- Linee guida per la gestione dell'insufficienza renale acuta nel neonato +
-- Gestione della trombosi della vena renale +
- +
-### PATOLOGIA NEUROLOGICA +
-- PDT Trattamento dell'encefalopatia ipossico-ischemica con ipotermia terapeutica +
-- Convulsioni neonatali: diagnosi differenziale e trattamento +
-- Programma diagnostico-terapeutico per mielomeningocele +
-- Protocollo per la dilatazione ventricolare postemorragica +
-- Indicazioni all'indagine ecografica cerebrale +
-- Follow-up neurosviluppo nel pretermine +
- +
-### PATOLOGIA RESPIRATORIA +
-- Standard Clinico per la gestione del neonato con sindrome da distress respiratorio (RDS) +
-- Parametri di ossimetria pulsatile e target di saturazione +
-- Indicazioni all'utilizzo dell'Ossido Nitrico per via inalatoria +
-- Premedicazione per intubazione tracheale: protocollo sedazione +
-- Ipertensione polmonare nel neonato: diagnosi e terapia +
-- Utilizzo dell'ossigenoterapia con nasocannule ad alti flussi (HFNC) +
-- Ventilazione non invasiva: CPAP e BiPAP +
-- Modalità di ventilazione a volume garantito +
-- Gestione dello svezzamento ventilatorio +
- +
-### PATOLOGIA CARDIOCIRCOLATORIA +
-- Terapia di supporto cardiovascolare: inotropi e vasopressori +
-- Gestione del dotto arterioso pervio (PDA) +
-- Screening cardiopatie congenite con ecocardiografia +
-- Gestione dell'ipertensione polmonare persistente +
- +
-### RIANIMAZIONE E URGENZE +
-- Linee guida per la rianimazione neonatale (ERC Guidelines) +
-- Algoritmi di rianimazione in sala parto +
-- Gestione delle emergenze respiratorie e cardiocircolatorie +
-- Protocolli per il trasporto neonatale d'urgenza +
- +
-### FOLLOW-UP E DIMISSIONI +
-- Criteri di dimissione dal reparto di Terapia Intensiva +
-- Programmi di follow-up per il neonato pretermine +
-- Vaccinazioni nel pretermine: calendario e controindicazioni +
-- Screening sensoriali: vista e udito +
- +
-Questo sistema fornisce protocolli evidence-based per la gestione clinica completa in Terapia Intensiva Neonatale, basati su linee guida internazionali e consensi di esperti. +
-            `.trim(); +
-        } +
-         +
-        // Verifica contenuti in cache +
-        function loadCachedContent() { +
-            const cached localStorage.getItem('docuneo_content_cache'); +
-            const timestamp localStorage.getItem('docuneo_content_timestamp');+
                          
-            if (cached && timestamp+            if (!value) return;
-                const cacheAge = Date.now() - parseInt(timestamp); +
-                const maxAge = 24 * 60 * 60 * 1000; // 24 ore +
-                 +
-                if (cacheAge < maxAge) { +
-                    wikiContent = cached; +
-                    return true; +
-                } +
-            } +
-            return false; +
-        } +
-         +
-        // Funzione principale +
-        async function askClaude() { +
-            if (isProcessing) return; +
-             +
-            const question = document.getElementById('questionInput').value.trim(); +
-            const apiKey = document.getElementById('apiKey').value.trim();+
                          
-            if (!question) { +            // Hide quick questions after first message 
-                alert('⚠️ Inserisci una domanda!')+            if (messages.length === 0) { 
-                return;+                document.getElementById('quick-questions').style.display = 'none';
             }             }
                          
-            if (!apiKey) { +            addMessage('user', value); 
-                alert('⚠️ Inserisci la tua API Key Anthropic nella configurazione!'); +            input.value = '';
-                return; +
-            }+
                          
-            if (!wikiContent) { +            // Show typing indicator 
-                alert('⚠️ Carica prima i contenuti DocuNeo cliccando "Carica Contenuti"!'); +            showTypingIndicator();
-                return; +
-            }+
                          
-            isProcessing = true; +            // Simulate bot response delay 
-            saveConfig()+            setTimeout(() => 
-             +                hideTypingIndicator(); 
-            try +                const response = findBestResponse(value); 
-                showStatus('🤖 Claude sta elaborando la risposta...', 'loading'); +                addMessage('bot', response); 
-                 +            }, 1000 Math.random() * 1000);
-                const response = await callClaudeAPI(question, wikiContent); +
-                 +
-                hideStatus(); +
-                showAnswer(response); +
-                 +
-            } catch (error) { +
-                console.error('Errore:'error); +
-                showStatus('❌ Errore: ' error.message, 'error'); +
-                setTimeout(hideStatus, 5000); +
-            } finally { +
-                isProcessing = false; +
-            }+
         }         }
-         
-        // Chiamata API Claude 
-        async function callClaudeAPI(question, context) { 
-            const apiKey = document.getElementById('apiKey').value; 
-            const model = document.getElementById('claudeModel').value; 
-            const maxTokens = parseInt(document.getElementById('maxTokens').value); 
-            const contextLimit = parseInt(document.getElementById('contextLimit').value); 
-             
-            // Limita il contesto 
-            const limitedContext = context.substring(0, contextLimit); 
-             
-            const prompt = `Sei un assistente specializzato in neonatologia che risponde domande basandosi ESCLUSIVAMENTE sui contenuti del sito DocuNeo.org. Non usare conoscenze esterne. 
  
-CONTENUTI DEL SITO DOCUNEO: +        function askQuestion(question) { 
-${limitedContext}+            document.getElementById('message-input').value = question; 
 +            sendMessage(); 
 +        }
  
-DOMANDA: ${question}+        function handleKeyPress(event) { 
 +            if (event.key === 'Enter' && !event.shiftKey) { 
 +                event.preventDefault(); 
 +                sendMessage(); 
 +            } 
 +        }
  
-Rispondi basandoti SOLO sui contenuti sopra provenienti da DocuNeo.orgSe la risposta non è presente nei contenuti forniti, dì che l'informazione non è disponibile nel sito DocuNeo+        function showTypingIndicator() { 
 +            const container = document.getElementById('messages-container'); 
 +            const typingDiv = document.createElement('div'); 
 +            typingDiv.id = 'typing-indicator'; 
 +            typingDiv.className = 'flex justify-start'; 
 +            typingDiv.innerHTML = ` 
 +                <div class="flex space-x-2 max-w-4xl"> 
 +                    <div class="bg-gray-100 p-2 rounded-full"> 
 +                        <svg class="h-4 w-4 text-gray-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"> 
 +                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z"/> 
 +                        </svg> 
 +                    </div> 
 +                    <div class="bg-white border shadow-sm px-4 py-2 rounded-lg"> 
 +                        <div class="flex space-x-1"> 
 +                            <div class="w-2 h-2 bg-gray-400 rounded-full typing-indicator" style="animation-delay: 0s"></div> 
 +                            <div class="w-2 h-2 bg-gray-400 rounded-full typing-indicator" style="animation-delay: 0.1s"></div> 
 +                            <div class="w-2 h-2 bg-gray-400 rounded-full typing-indicator" style="animation-delay: 0.2s"></div> 
 +                        </div> 
 +                    </div> 
 +                </div> 
 +            `; 
 +            container.appendChild(typingDiv); 
 +            scrollToBottom(); 
 +        }
  
-Quando possibile, cita le sezioni specifiche (es. "Secondo le linee guida per la gestione della NEC..."da cui provengono le informazioni. +        function hideTypingIndicator() { 
- +            const indicator document.getElementById('typing-indicator'); 
-Formatta la risposta in HTML per una migliore leggibilità, usando: +            if (indicator) { 
-- <h3> per i titoli principali +                indicator.remove();
-- <ul> e <li> per le liste +
-- <strong> per evidenziare punti importanti +
-- <em> per le citazioni delle fonti`; +
- +
-            const response await fetch('https://api.anthropic.com/v1/messages',+
-                method: 'POST', +
-                headers: { +
-                    'Content-Type': 'application/json', +
-                    'x-api-key': apiKey, +
-                    'anthropic-version': '2023-06-01' +
-                }, +
-                body: JSON.stringify({ +
-                    model: model, +
-                    max_tokens: maxTokens, +
-                    messages: [{ +
-                        role: 'user', +
-                        content: prompt +
-                    }] +
-                }) +
-            }); +
-             +
-            if (!response.ok) { +
-                const errorData = await response.text(); +
-                throw new Error(`API Error ${response.status}: ${errorData}`);+
             }             }
-             
-            const data = await response.json(); 
-             
-            if (!data.content || !data.content[0] || !data.content[0].text) { 
-                throw new Error('Risposta API non valida'); 
-            } 
-             
-            return data.content[0].text; 
         }         }
-         + 
-        // Eventi tastiera +        // Initialize with welcome message 
-        document.getElementById('questionInput').addEventListener('keydown', function(e) { +        window.onload = function() { 
-            if (e.key === 'Enter' && e.ctrlKey) { +            addMessage('bot', 'Ciao! Sono il tuo assistente specializzato in Atresia BiliareLe mie risposte si basano esclusivamente sul documento "Biliary Atresia: A Multidisciplinary Approach to Diagnosis and Management" di Columbia UniversityCosa vorresti sapere?'); 
-                askClaude(); +        };
-            } +
-        }); +
-         +
-        // Auto-save configurazione +
-        ['apiKey', 'claudeModel', 'maxTokens', 'contextLimit'].forEach(id => { +
-            document.getElementById(id).addEventListener('change', saveConfig); +
-        });+
     </script>     </script>
 </body> </body>
 </html> </html>
chiedi_a_claude.1754887145.txt.gz · Ultima modifica: da neoadmin