Feat: icc profiles toggle (#168)

* Add icc toggle

* Add get for icc profile

* Address unit test

* Bump dcmjs

Author: igoroctaviano

jest.config.js

@@ -16,7 +16,7 @@ module.exports = {
     '\\.(wasm)$': '<rootDir>/src/__mocks__/wasmMock.js'
   },
   transformIgnorePatterns: [
-    'node_modules/(?!(ol|@cornerstonejs|dicomicc)/)' // <- transform libraries
+    'node_modules/(?!(ol|@cornerstonejs|dicomicc|rbush|color-rgba|color-parse|color-name|color-space|quickselect|earcut)/)' // <- transform libraries
   ],
   testMatch: [
     '<rootDir>/src/**/*.test.js'

package.json

@@ -81,14 +81,14 @@
     "@cornerstonejs/codec-charls": "^1.2.3",
     "@cornerstonejs/codec-libjpeg-turbo-8bit": "^1.2.2",
     "@cornerstonejs/codec-openjpeg": "^1.2.2",
-    "dicomweb-client": "^0.10.3",
     "@cornerstonejs/codec-openjph": "^2.4.5",
+    "dicomweb-client": "^0.10.3",
     "colormap": "^2.3",
-    "dcmjs": "^0.29.8",
+    "dcmjs": "^0.38.1",
     "dicomicc": "^0.1",
     "image-type": "^4.1",
     "mathjs": "^11.2",
-    "ol": "^7.5.1",
+    "ol": "^10.4.0",
     "uuid": "^9.0"
   },
   "resolutions": {

src/viewer.js

@@ -765,6 +765,9 @@ const _rotation = Symbol('rotation')
 const _tileGrid = Symbol('tileGrid')
 const _updateOverviewMapSize = Symbol('updateOverviewMapSize')
 const _annotationOptions = Symbol('annotationOptions')
+const _isICCProfilesEnabled = Symbol('isICCProfilesEnabled')
+const _iccProfiles = Symbol('iccProfiles')
+const _container = Symbol('container')
 
 /**
  * Interactive viewer for DICOM VL Whole Slide Microscopy Image instances
@@ -810,8 +813,11 @@ class VolumeImageViewer {
     this[_options] = options
     this[_retrievedBulkdata] = {}
     this[_annotationOptions] = {}
-
+    this[_isICCProfilesEnabled] = true
+    this[_container] = null
     this[_clients] = {}
+    this[_iccProfiles] = []
+
     if (this[_options].client) {
       this[_clients].default = this[_options].client
     } else {
@@ -1614,7 +1620,6 @@ class VolumeImageViewer {
     }
     if (this[_options].controls.has('position')) {
       this[_controls].position = new MousePosition({
-        projection: this[_projection],
         coordinateFormat: (imageCoordinates) => {
           const slideCoordinates = _geometryCoordinates2scoord3dCoordinates(
             imageCoordinates,
@@ -1963,6 +1968,59 @@ class VolumeImageViewer {
     }
   }
 
+  /**
+   * Get ICC profiles.
+   *
+   * @returns {any[]} ICC profiles
+   */
+  getICCProfiles () {
+    return this[_iccProfiles] || []
+  }
+
+  /**
+   * Toggle ICC profiles.
+   *
+   * @returns {void}
+   */
+  toggleICCProfiles () {
+    console.debug('toggle ICC profiles:', this[_isICCProfilesEnabled])
+    const itemsRequiringDecodersAndTransformers = [
+      ...Object.values(this[_opticalPaths]),
+      ...Object.values(this[_segments]),
+      ...Object.values(this[_mappings])
+    ]
+
+    itemsRequiringDecodersAndTransformers.forEach(item => {
+      const metadata = item.pyramid.metadata
+      const client = _getClient(
+        this[_clients],
+        Enums.SOPClassUIDs.VL_WHOLE_SLIDE_MICROSCOPY_IMAGE
+      )
+      _getIccProfiles(metadata, client).then(profiles => {
+        this[_iccProfiles] = profiles
+        const source = item.layer.getSource()
+        if (!source) {
+          return
+        }
+        const loaderWithICCProfiles = _createTileLoadFunction({
+          targetElement: this[_container],
+          iccProfiles: profiles,
+          ...item.loaderParams
+        })
+        const loaderWithoutICCProfiles = _createTileLoadFunction({
+          targetElement: this[_container],
+          ...item.loaderParams
+        })
+        const loader = this[_isICCProfilesEnabled] ? loaderWithICCProfiles : loaderWithoutICCProfiles
+        source.setLoader(loader)
+        source.refresh()
+        item.hasLoader = true
+      })
+    })
+
+    this[_isICCProfilesEnabled] = !this[_isICCProfilesEnabled]
+  }
+
   /**
    * Show an optical path.
    *
@@ -1996,6 +2054,8 @@ class VolumeImageViewer {
         Enums.SOPClassUIDs.VL_WHOLE_SLIDE_MICROSCOPY_IMAGE
       )
       _getIccProfiles(metadata, client).then(profiles => {
+        console.debug('icc profiles (optical path):', profiles)
+        this[_iccProfiles] = profiles
         const loader = _createTileLoadFunction({
           targetElement: container,
           iccProfiles: profiles,
@@ -2111,13 +2171,17 @@ class VolumeImageViewer {
    * @param {(string|HTMLElement)} options.container - HTML Element in which the viewer should be injected.
    */
   render ({ container }) {
+    window.toggleICCProfiles = this.toggleICCProfiles.bind(this)
+    window.getICCProfiles = this.getICCProfiles.bind(this)
     window.cleanup = this.cleanup.bind(this)
 
     if (container == null) {
       console.error('container must be provided for rendering images')
       return
     }
 
+    this[_container] = container
+
     const itemsRequiringDecodersAndTransformers = [
       ...Object.values(this[_opticalPaths]),
       ...Object.values(this[_segments]),
@@ -2138,13 +2202,14 @@ class VolumeImageViewer {
         Enums.SOPClassUIDs.VL_WHOLE_SLIDE_MICROSCOPY_IMAGE
       )
       _getIccProfiles(metadata, client).then(profiles => {
+        this[_iccProfiles] = profiles
         const source = item.layer.getSource()
         if (!source) {
           return
         }
         const loader = _createTileLoadFunction({
           targetElement: container,
-          iccProfiles: profiles,
+          iccProfiles: this[_isICCProfilesEnabled] ? profiles : null,
           ...item.loaderParams
         })
         source.setLoader(loader)