Update js/main.js

js/main.js

@@ -1,6 +1,7 @@
 // js/main.js
 
 // --- INICIO: Importaciones de Módulos ---
+// Asegúrate de que todas las rutas sean correctas
 import { renderIaConfigForm, transcriptionProviders, getIaConfig } from './iaConfigModule.js';
 import { initRecorder } from './recordingModule.js';
 import { analyzeMedical } from './analysisModule.js';
@@ -8,128 +9,174 @@ import { copyText } from './clipboardModule.js';
 import { analyzeLabResults, displayLabResults } from './labAnalysisModule.js';
 // --- FIN: Importaciones de Módulos ---
 
+console.log("[Main] Script main.js cargado. Esperando DOMContentLoaded...");
+
 window.addEventListener('DOMContentLoaded', () => {
+  console.log("[Main] Evento DOMContentLoaded detectado. Iniciando configuración...");
 
   // --- INICIO: Variables y Estado Global ---
   let lastLabResultText = '';
   // --- FIN: Variables y Estado Global ---
 
-  // --- INICIO: Función para Actualizar Etiquetas de Modelo ---
-  function updateModelLabels() {
-    const cfg = getIaConfig();
-    const transProvider = cfg?.transcription?.provider;
-    const transModel = cfg?.transcription?.models?.[transProvider] || 'N/A';
-    const llmProvider = cfg?.llm?.provider;
-    const llmModel = cfg?.llm?.model || 'N/A';
-
-    const transLabel = document.getElementById('trans-model-label');
-    if (transLabel) transLabel.textContent = transModel ? `(${transModel})` : '';
-    const analysisLabel = document.getElementById('analysis-model-label');
-    if (analysisLabel) analysisLabel.textContent = llmModel ? `(${llmModel})` : '';
-    const labLabel = document.getElementById('lab-model-label');
-    if (labLabel) labLabel.textContent = llmModel ? `(${llmModel})` : '';
-  }
-  updateModelLabels();
-  document.addEventListener('iaConfigChanged', updateModelLabels);
-  // --- FIN: Función para Actualizar Etiquetas de Modelo ---
-
-  // --- INICIO: Selección de Elementos DOM (VERIFICAR IDs) ---
-  // Configuración
+  // --- INICIO: Selección de Elementos DOM + VALIDACIÓN ---
+  // Seleccionamos todos los elementos al principio y verificamos si existen
+  console.log("[Main] Seleccionando elementos del DOM...");
   const btnConfig = document.getElementById('btnConfig');
   const modal = document.getElementById('configModal');
-  // Pestaña Análisis Médico
-  const transcriptEl = document.getElementById('transcript'); // id="transcript"
-  const outputEnfermedadEl = document.getElementById('output-enfermedad'); // id="output-enfermedad"
-  const outputExploracionEl = document.getElementById('output-exploracion'); // id="output-exploracion"
+  const transcriptEl = document.getElementById('transcript');
+  const outputEnfermedadEl = document.getElementById('output-enfermedad');
+  const outputExploracionEl = document.getElementById('output-exploracion');
   const btnStart = document.getElementById('btnStart');
   const btnStop = document.getElementById('btnStop');
   const btnCopyTranscript = document.getElementById('btnCopyTranscript');
   const btnCopyAnalysis = document.getElementById('btnCopyAnalysis');
-  // Elementos Pestañas
   const allTabButtons = document.querySelectorAll('.tab-button');
   const allTabContents = document.querySelectorAll('.tab-content');
-  // Elementos Pestaña Análisis de Exámenes (VERIFICAR IDs con index.html)
-  const labInputText = document.getElementById('lab-input-text'); // id="lab-input-text"
-  const btnAnalyzeLabs = document.getElementById('btnAnalyzeLabs'); // id="btnAnalyzeLabs"
-  const labLoadingIndicator = document.getElementById('lab-loading-indicator'); // id="lab-loading-indicator"
-  const filterAlteredLabsCheckbox = document.getElementById('filterAlteredLabs'); // id="filterAlteredLabs"
-  const labResultsOutput = document.getElementById('lab-results-output'); // id="lab-results-output"
-  const btnCopyLabResults = document.getElementById('btnCopyLabResults'); // id="btnCopyLabResults"
-  // --- FIN: Selección de Elementos DOM ---
-
-  // --- INICIO: Lógica Modal Configuración ---
-  renderIaConfigForm('iaConfigContainer');
-  btnConfig.addEventListener('click', () => {
-    renderIaConfigForm('iaConfigContainer');
-    modal.classList.add('active');
-  });
-  modal.addEventListener('mousedown', e => {
-    if (e.target === modal) modal.classList.remove('active');
-  });
-  // --- FIN: Lógica Modal Configuración ---
-
-  // --- INICIO: Lógica Pestaña Análisis Médico ---
-  // (Sin cambios funcionales aquí, igual que antes)
-  document.addEventListener('transcriptionReady', async e => { /* ... */ });
-  function getTranscriptionProviderUrl() { /* ... */ return ''; }
-  initRecorder({ /* ... */ });
-  if (btnCopyTranscript) { btnCopyTranscript.addEventListener('click', async () => { /* ... */ }); }
-  if (btnCopyAnalysis) { btnCopyAnalysis.addEventListener('click', async () => { /* ... */ }); }
-  // --- FIN: Lógica Pestaña Análisis Médico ---
-
-  // --- INICIO: Lógica de Cambio de Pestañas ---
-  // (Sin cambios funcionales aquí, igual que antes)
-  function switchTab(clickedTab) { /* ... */ }
-  allTabButtons.forEach(button => { button.addEventListener('click', (event) => { switchTab(event.currentTarget); }); });
-  // --- FIN: Lógica de Cambio de Pestañas ---
-
-  // --- INICIO: Listener para Limpiar UI al Iniciar Grabación (CON LOGS DETALLADOS) ---
-  document.addEventListener('newRecordingStarted', () => {
-    console.log('[Main] Evento newRecordingStarted recibido. Intentando limpiar campos...');
-
-    // Limpiar campos de la pestaña "Análisis Médico"
-    if (outputEnfermedadEl) {
-        console.log('[Main] Limpiando outputEnfermedadEl...');
-        outputEnfermedadEl.textContent = '';
-    } else {
-        // Este mensaje aparecería si el getElementById falló al inicio
-        console.warn('[Main] Referencia outputEnfermedadEl no encontrada al intentar limpiar.');
+  const labInputText = document.getElementById('lab-input-text');
+  const btnAnalyzeLabs = document.getElementById('btnAnalyzeLabs');
+  const labLoadingIndicator = document.getElementById('lab-loading-indicator');
+  const filterAlteredLabsCheckbox = document.getElementById('filterAlteredLabs');
+  const labResultsOutput = document.getElementById('lab-results-output');
+  const btnCopyLabResults = document.getElementById('btnCopyLabResults');
+
+  // Validaciones básicas (mostrar error en consola si falta un elemento crítico)
+  if (!btnConfig) console.error("!!! ERROR CRÍTICO: Elemento #btnConfig no encontrado!");
+  if (!modal) console.error("!!! ERROR CRÍTICO: Elemento #configModal no encontrado!");
+  if (!transcriptEl) console.error("!!! ERROR CRÍTICO: Elemento #transcript no encontrado!");
+  if (!outputEnfermedadEl) console.error("!!! ERROR CRÍTICO: Elemento #output-enfermedad no encontrado!");
+  if (!outputExploracionEl) console.error("!!! ERROR CRÍTICO: Elemento #output-exploracion no encontrado!");
+  if (!btnStart) console.error("!!! ERROR CRÍTICO: Elemento #btnStart no encontrado!");
+  if (!btnStop) console.error("!!! ERROR CRÍTICO: Elemento #btnStop no encontrado!");
+  if (allTabButtons.length === 0) console.error("!!! ERROR CRÍTICO: No se encontraron botones de pestaña (.tab-button)!");
+  if (allTabContents.length === 0) console.error("!!! ERROR CRÍTICO: No se encontraron contenidos de pestaña (.tab-content)!");
+  if (!labInputText) console.error("!!! ERROR CRÍTICO: Elemento #lab-input-text no encontrado!");
+  if (!btnAnalyzeLabs) console.error("!!! ERROR CRÍTICO: Elemento #btnAnalyzeLabs no encontrado!");
+  if (!labLoadingIndicator) console.error("!!! ERROR CRÍTICO: Elemento #lab-loading-indicator no encontrado!");
+  if (!filterAlteredLabsCheckbox) console.error("!!! ERROR CRÍTICO: Elemento #filterAlteredLabs no encontrado!");
+  if (!labResultsOutput) console.error("!!! ERROR CRÍTICO: Elemento #lab-results-output no encontrado!");
+  console.log("[Main] Selección de elementos del DOM finalizada.");
+  // --- FIN: Selección de Elementos DOM + VALIDACIÓN ---
+
+ // --- INICIO: Bloques de Lógica envueltos en try...catch para aislar errores ---
+  try {
+    // --- INICIO: Función para Actualizar Etiquetas de Modelo ---
+    function updateModelLabels() {
+        const cfg = getIaConfig(); // Asegúrate que getIaConfig funciona
+        const transProvider = cfg?.transcription?.provider;
+        const transModel = cfg?.transcription?.models?.[transProvider] || 'N/A';
+        const llmProvider = cfg?.llm?.provider;
+        const llmModel = cfg?.llm?.model || 'N/A';
+
+        const transLabel = document.getElementById('trans-model-label');
+        if (transLabel) transLabel.textContent = transModel ? `(${transModel})` : '';
+        const analysisLabel = document.getElementById('analysis-model-label');
+        if (analysisLabel) analysisLabel.textContent = llmModel ? `(${llmModel})` : '';
+        const labLabel = document.getElementById('lab-model-label');
+        if (labLabel) labLabel.textContent = llmModel ? `(${llmModel})` : '';
     }
-    if (outputExploracionEl) {
-        console.log('[Main] Limpiando outputExploracionEl...');
-        outputExploracionEl.textContent = '';
-     } else {
-        console.warn('[Main] Referencia outputExploracionEl no encontrada al intentar limpiar.');
+    updateModelLabels(); // Llamada inicial
+    document.addEventListener('iaConfigChanged', updateModelLabels);
+    // --- FIN: Función para Actualizar Etiquetas de Modelo ---
+  } catch(e) { console.error("Error en setup de etiquetas de modelo:", e); }
+
+  try {
+    // --- INICIO: Lógica Modal Configuración ---
+    renderIaConfigForm('iaConfigContainer'); // Pasar ID como string
+    if(btnConfig) {
+        btnConfig.addEventListener('click', () => {
+          renderIaConfigForm('iaConfigContainer'); // Pasar ID como string
+          if (modal) modal.classList.add('active');
+        });
     }
-
-    // Limpiar campos de la pestaña "Análisis de Exámenes"
-    // !! Verificar estas dos secciones con la consola !!
-    if (labInputText) {
-        console.log('[Main] Limpiando labInputText (TextArea)...');
-        labInputText.value = ''; // Limpiar valor del textarea
-    } else {
-        console.warn('[Main] Referencia labInputText no encontrada al intentar limpiar.');
+    if(modal) {
+        modal.addEventListener('mousedown', e => {
+          if (e.target === modal) modal.classList.remove('active');
+        });
     }
-    if (labResultsOutput) {
-        console.log('[Main] Limpiando labResultsOutput (Div)...');
-        labResultsOutput.innerHTML = ''; // Limpiar contenido del div
-    } else {
-        console.warn('[Main] Referencia labResultsOutput no encontrada al intentar limpiar.');
+    // --- FIN: Lógica Modal Configuración ---
+  } catch(e) { console.error("Error en setup del Modal Configuración:", e); }
+
+  try {
+    // --- INICIO: Lógica Pestaña Análisis Médico ---
+    document.addEventListener('transcriptionReady', async e => {
+        const transcriptText = e.detail; if (!transcriptText) return;
+        if(outputEnfermedadEl) outputEnfermedadEl.textContent = 'Analizando...';
+        if(outputExploracionEl) outputExploracionEl.textContent = '';
+        try {
+          const result = await analyzeMedical(transcriptText);
+          const sections = result.split(/\n\s*\n/);
+          if(outputEnfermedadEl) outputEnfermedadEl.textContent = sections[0]?.trim() || '(No gen.)';
+          if(outputExploracionEl) outputExploracionEl.textContent = sections.slice(1).join('\n\n').trim() || '(No gen.)';
+        } catch (err) { console.error("Error en análisis médico:", err); if(outputEnfermedadEl) outputEnfermedadEl.textContent = `Error: ${err.message}`; alert(`Error: ${err.message}`); }
+    });
+    function getTranscriptionProviderUrl() {
+        const cfg = getIaConfig(); const providerValue = cfg?.transcription?.provider;
+        if (providerValue) { const prov = transcriptionProviders.find(p => p.value === providerValue); if (prov?.url) return prov.url; }
+        console.warn('No se pudo obtener URL de proveedor transcripción.'); /* alert('...'); */ return '';
     }
-
-    // Resetear variable de estado
-    console.log(`[Main] Reseteando lastLabResultText (antes: "${lastLabResultText.substring(0, 50)}...")`);
-    lastLabResultText = '';
-
-    console.log('[Main] Intento de limpieza de campos completado.');
-  });
-  // --- FIN: Listener para Limpiar UI al Iniciar Grabación ---
-
-  // --- INICIO: Lógica Pestaña Análisis de Exámenes ---
-  // (Sin cambios funcionales aquí, igual que antes)
-  if (btnAnalyzeLabs) { btnAnalyzeLabs.addEventListener('click', async () => { /* ... */ }); }
-  if (filterAlteredLabsCheckbox) { filterAlteredLabsCheckbox.addEventListener('change', () => { /* ... */ }); }
-  if (btnCopyLabResults) { btnCopyLabResults.addEventListener('click', async () => { /* ... */ }); }
-  // --- FIN: Lógica Pestaña Análisis de Exámenes ---
-
+    if (btnStart && btnStop && transcriptEl && typeof initRecorder === 'function') {
+        initRecorder({ btnStart, btnStop, transcriptEl, getProvider: getTranscriptionProviderUrl });
+    } else { console.error("Faltan elementos/función para initRecorder"); }
+    if (btnCopyTranscript) { btnCopyTranscript.addEventListener('click', async () => { try { await copyText(transcriptEl.value); /* feedback */ } catch (err) { console.error('Error copia transcripción:', err); } }); }
+    if (btnCopyAnalysis) { btnCopyAnalysis.addEventListener('click', async () => { try { const text = `${outputEnfermedadEl?.textContent}\n\n${outputExploracionEl?.textContent}`; await copyText(text); /* feedback */ } catch (err) { console.error('Error copia análisis:', err); } }); }
+    // --- FIN: Lógica Pestaña Análisis Médico ---
+  } catch(e) { console.error("Error en setup Pestaña Análisis Médico:", e); }
+
+  try {
+    // --- INICIO: Lógica de Cambio de Pestañas ---
+    function switchTab(clickedTab) {
+        const targetContentId = clickedTab.dataset.contentId;
+        const targetContent = document.getElementById(targetContentId);
+        if (targetContent && !targetContent.classList.contains('active')) {
+            allTabButtons.forEach(btn => {
+                const activeCls = btn.dataset.activeClasses.split(' '); const inactiveCls = btn.dataset.inactiveClasses.split(' ');
+                btn.classList.remove(...activeCls.filter(c => c)); btn.classList.add(...inactiveCls.filter(c => c));
+            });
+            allTabContents.forEach(content => { content.classList.remove('active'); });
+            const activeClsToAdd = clickedTab.dataset.activeClasses.split(' '); const inactiveClsToRemove = clickedTab.dataset.inactiveClasses.split(' ');
+            clickedTab.classList.remove(...inactiveClsToRemove.filter(c => c)); clickedTab.classList.add(...activeClsToAdd.filter(c => c));
+            targetContent.classList.add('active');
+            console.log(`Cambiado a pestaña: ${targetContentId}`);
+        }
+    }
+    if (allTabButtons.length > 0) {
+        allTabButtons.forEach(button => { button.addEventListener('click', (event) => { switchTab(event.currentTarget); }); });
+    } else { console.error("No se pueden añadir listeners, no hay botones de pestaña."); }
+    // --- FIN: Lógica de Cambio de Pestañas ---
+  } catch(e) { console.error("Error en setup Cambio de Pestañas:", e); }
+
+  try {
+    // --- INICIO: Listener para Limpiar UI al Iniciar Grabación ---
+    document.addEventListener('newRecordingStarted', () => {
+        console.log('[Main] Evento newRecordingStarted recibido. Limpiando campos...');
+        if (outputEnfermedadEl) { console.log('[Main] Limpiando outputEnfermedadEl...'); outputEnfermedadEl.textContent = ''; } else { console.warn('[Main] outputEnfermedadEl no encontrado.'); }
+        if (outputExploracionEl) { console.log('[Main] Limpiando outputExploracionEl...'); outputExploracionEl.textContent = ''; } else { console.warn('[Main] outputExploracionEl no encontrado.'); }
+        if (labInputText) { console.log('[Main] Limpiando labInputText...'); labInputText.value = ''; } else { console.warn('[Main] labInputText no encontrado.'); }
+        if (labResultsOutput) { console.log('[Main] Limpiando labResultsOutput...'); labResultsOutput.innerHTML = ''; } else { console.warn('[Main] labResultsOutput no encontrado.'); }
+        console.log(`[Main] Reseteando lastLabResultText...`); lastLabResultText = '';
+        console.log('[Main] Limpieza de campos completada.');
+    });
+    // --- FIN: Listener para Limpiar UI al Iniciar Grabación ---
+  } catch(e) { console.error("Error añadiendo listener Limpiar UI:", e); }
+
+  try {
+    // --- INICIO: Lógica Pestaña Análisis de Exámenes ---
+    if (btnAnalyzeLabs && labInputText && labLoadingIndicator && filterAlteredLabsCheckbox && labResultsOutput) {
+        btnAnalyzeLabs.addEventListener('click', async () => {
+            const inputText = labInputText.value; if (!inputText.trim()) { alert("Pega resultados."); return; }
+            labLoadingIndicator.style.display = 'flex'; btnAnalyzeLabs.disabled = true; filterAlteredLabsCheckbox.disabled = true; labResultsOutput.innerHTML = ''; lastLabResultText = '';
+            try {
+                const resultText = await analyzeLabResults(inputText); console.log("========= RAW AI RESPONSE START ========="); console.log(resultText); console.log("========= RAW AI RESPONSE END ========="); lastLabResultText = resultText; const filterIsActive = filterAlteredLabsCheckbox.checked; displayLabResults(resultText, labResultsOutput, filterIsActive); updateModelLabels();
+            } catch (error) { console.error("Error análisis lab:", error); labResultsOutput.innerHTML = `<p class="text-red-600">Error: ${error.message}</p>`; alert(`Error: ${error.message}`); }
+            finally { labLoadingIndicator.style.display = 'none'; btnAnalyzeLabs.disabled = false; filterAlteredLabsCheckbox.disabled = false; }
+        });
+        filterAlteredLabsCheckbox.addEventListener('change', () => { if (!lastLabResultText) return; const filterIsActive = filterAlteredLabsCheckbox.checked; displayLabResults(lastLabResultText, labResultsOutput, filterIsActive); });
+    } else { console.error("Faltan elementos para setup Pestaña Análisis Exámenes"); }
+    if (btnCopyLabResults && labResultsOutput) {
+         btnCopyLabResults.addEventListener('click', async () => { const textToCopy = labResultsOutput.textContent; if (!textToCopy || textToCopy.startsWith('Error') || textToCopy.includes('No se generaron')) { alert('No hay resultados válidos.'); return; } try { await copyText(textToCopy); /* feedback */ } catch (err) { console.error('Error copia lab:', err); } });
+    } else { console.error("Faltan elementos para botón Copiar Lab"); }
+    // --- FIN: Lógica Pestaña Análisis de Exámenes ---
+   } catch(e) { console.error("Error en setup Pestaña Análisis Exámenes:", e); }
+
+  console.log("[Main] Configuración de listeners finalizada.");
 }); // Fin de window.addEventListener('DOMContentLoaded', ...)