<HU-04 Visualización de Información de la Cabecera del Archivo DICOM>

[craulii]

• Descripción: Como usuario, quiero poder cargar un archivo ZIP que contenga múltiples imágenes DICOM, para que pueda ver todas las imágenes de una vez y facilitar la visualización de series de imágenes.
• Criterios de aceptación:
  • 1. Dado que el usuario selecciona un archivo ZIP, cuando se sube el archivo, entonces el sistema debe extraer todas las imágenes DICOM y cargarlas en la interfaz.
  • 2. Dado que las imágenes DICOM están cargadas, cuando el usuario navega a través de ellas, entonces deben ser visibles en el visor y poder ser manipuladas.

[craulii]

Justificación para Prioridad: La HU001 es fundamental para la funcionalidad de cargar y visualizar múltiples imágenes DICOM, facilitando la carga y análisis de series de imágenes. Esta capacidad es crucial para la eficiencia del flujo de trabajo del usuario y la funcionalidad general de la aplicación. Sin esta función no tendría sentido el desplazarse entre imagenes, es decir, es la piedra angular de este proyecto.

[craulii]

1. Implementación de la Función de Carga de ZIP
   • Comentario: Desarrollada la función para seleccionar y extraer imágenes DICOM desde un archivo ZIP. Tiempo empleado: 4 horas.

const handleFileChange = async (event) => {
  const file = event.target.files[0];
  if (file) {
    const zip = new JSZip();
    const zipContent = await file.arrayBuffer();
    const zipFile = await zip.loadAsync(zipContent);
    const imageEntries = [];
    zipFile.forEach((relativePath, zipEntry) => {
      if (!zipEntry.dir && zipEntry.name.endsWith('.dcm')) {
        imageEntries.push({ name: zipEntry.name, entry: zipEntry });
      }
    });

    imageEntries.sort((a, b) => a.name.localeCompare(b.name));
    const imagePromises = imageEntries.map((imageEntry) => imageEntry.entry.async('arraybuffer'));
    Promise.all(imagePromises).then((imageBuffers) => {
      const validImages = [];
      imageBuffers.forEach((buffer, index) => {
        try {
          const blob = new Blob([buffer], { type: 'application/dicom' });
          const imageId = cornerstoneWADOImageLoader.wadouri.fileManager.add(blob);
          validImages.push(imageId);
        } catch (error) {
          console.warn('No es una imagen DICOM válida:', index, error);
        }
      });
      setImages(validImages);
      if (validImages.length > 0) {
        loadImage(validImages[0]);
      }
    });
  }
};

[craulii]

2. Desarrollo de la Interfaz de Usuario para la Carga de ZIP
   • Comentario: Implementada la interfaz para la selección y carga del archivo ZIP con mensajes de retroalimentación. Tiempo empleado: 3 horas.

<label htmlFor="file-upload" className="custom-file-upload">
  Subir Archivo ZIP
</label>
<input id="file-upload" type="file" accept=".zip" onChange={handleFileChange} />

DicomViewer.js

.custom-file-upload {
  background-color: #1f4068;
  color: #ffffff;
  padding: 10px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  text-align: center;
}

input[type="file"] {
  display: none;
}

Styles.css

[craulii]

3. Integración de la Carga de Imágenes DICOM en la Interfaz
   • Comentario: Integrada la carga de imágenes DICOM extraídas del archivo ZIP con el visor existente. Tiempo empleado: 3 horas.

     
     const loadImage = (imageId) => {
     if (imageCache.current[imageId]) {
     displayImage(imageCache.current[imageId]);
     } else {
     cornerstone.loadImage(imageId).then((image) => {
     imageCache.current[imageId] = image;
     displayImage(image);
     }).catch((error) => {
     console.error('Error cargando imagen:', error);
     });
     }
     };

const displayImage = (image) => { const element = divRef.current; if (element) { cornerstone.displayImage(element, image); updateViewport(); } };

[craulii]

4. Implementación de Navegación y Manipulación de Imágenes
   • Comentario: Implementada la funcionalidad para navegación y manipulación de imágenes DICOM. Tiempo empleado: 4 horas.

const handleImageChange = (index) => {
  if (index >= 0 && index < images.length) {
    setCurrentImageIndex(index);
  }
};

const nextImage = () => {
  if (currentImageIndex < images.length - 1) {
    setCurrentImageIndex(currentImageIndex + 1);
  }
};

const prevImage = () => {
  if (currentImageIndex > 0) {
    setCurrentImageIndex(currentImageIndex - 1);
  }
};

const updateViewport = () => {
  const element = divRef.current;
  if (element) {
    const viewport = cornerstone.getViewport(element);
    if (viewport) {
      viewport.voi.windowWidth = 256 * contrast;
      viewport.voi.windowCenter = 128 + brightness;
      viewport.invert = inverted;
      cornerstone.setViewport(element, viewport);
    }
  }
};

[craulii]

5. Pruebas y Ajustes
   • Comentario: Pruebas realizadas para verificar la carga y visualización de imágenes DICOM desde un archivo ZIP, con ajustes según sea necesario. Tiempo empleado: 2 horas.