From 42dca11ae38fe38dbc2c51ea0f5a90be9712a8e1 Mon Sep 17 00:00:00 2001 From: Alireza Date: Mon, 5 Dec 2022 09:53:59 -0500 Subject: [PATCH] fix: various bugs with v33 re cine and colors (#3052) * fix various bugs * feat: initial work for debug page * change throw to console error for color lookup table * update packages * apply review * apply review comments --- .docker/Viewer-v3.x/default.conf.template | 7 +++ extensions/cornerstone-dicom-sr/package.json | 4 +- extensions/cornerstone/package.json | 6 +- extensions/cornerstone/src/init.tsx | 10 ++++ extensions/measurement-tracking/package.json | 4 +- .../viewports/TrackedCornerstoneViewport.tsx | 2 + modes/tmtv/src/utils/setFusionActiveVolume.js | 7 ++- .../fetchPaletteColorLookupTableData.js | 42 +++++++++----- platform/ui/src/components/Button/Button.tsx | 7 ++- .../StudyListPagination.tsx | 6 +- platform/viewer/src/routes/Debug.tsx | 58 +++++++++++++++++++ platform/viewer/src/routes/index.tsx | 11 ++++ yarn.lock | 36 +++++------- 13 files changed, 149 insertions(+), 51 deletions(-) create mode 100644 platform/viewer/src/routes/Debug.tsx diff --git a/.docker/Viewer-v3.x/default.conf.template b/.docker/Viewer-v3.x/default.conf.template index 354d5df16..33aadb25b 100644 --- a/.docker/Viewer-v3.x/default.conf.template +++ b/.docker/Viewer-v3.x/default.conf.template @@ -5,6 +5,13 @@ server { root /usr/share/nginx/html; index index.html index.htm; try_files $uri $uri/ /index.html; + add_header Cross-Origin-Opener-Policy same-origin; + add_header Cross-Origin-Embedder-Policy require-corp; + add_header Cross-Origin-Resource-Policy same-origin; + proxy_set_header Host $host; + proxy_set_header X-Real-IP $remote_addr; + proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; + proxy_set_header X-Forwarded-Proto $http_x_forwarded_proto; } error_page 500 502 503 504 /50x.html; location = /50x.html { diff --git a/extensions/cornerstone-dicom-sr/package.json b/extensions/cornerstone-dicom-sr/package.json index 7c55901a1..a6b8e1abf 100644 --- a/extensions/cornerstone-dicom-sr/package.json +++ b/extensions/cornerstone-dicom-sr/package.json @@ -45,7 +45,7 @@ "dependencies": { "@babel/runtime": "7.16.3", "classnames": "^2.2.6", - "@cornerstonejs/core": "^0.21.5", - "@cornerstonejs/tools": "^0.29.8" + "@cornerstonejs/core": "^0.22.3", + "@cornerstonejs/tools": "^0.30.6" } } diff --git a/extensions/cornerstone/package.json b/extensions/cornerstone/package.json index 1a6cd8e13..d655625b1 100644 --- a/extensions/cornerstone/package.json +++ b/extensions/cornerstone/package.json @@ -43,9 +43,9 @@ }, "dependencies": { "@babel/runtime": "7.17.9", - "@cornerstonejs/core": "^0.21.5", - "@cornerstonejs/streaming-image-volume-loader": "^0.6.5", - "@cornerstonejs/tools": "^0.29.8", + "@cornerstonejs/core": "^0.22.3", + "@cornerstonejs/streaming-image-volume-loader": "^0.6.11", + "@cornerstonejs/tools": "^0.30.6", "@kitware/vtk.js": "25.9.0", "html2canvas": "^1.4.1", "lodash.debounce": "4.0.8", diff --git a/extensions/cornerstone/src/init.tsx b/extensions/cornerstone/src/init.tsx index 4fb056b78..fc19e384e 100644 --- a/extensions/cornerstone/src/init.tsx +++ b/extensions/cornerstone/src/init.tsx @@ -70,6 +70,7 @@ export default async function init({ DisplaySetService, UIDialogService, UIModalService, + UINotificationService, CineService, CornerstoneViewportService, HangingProtocolService, @@ -79,6 +80,15 @@ export default async function init({ window.services = servicesManager.services; + if (!window.crossOriginIsolated) { + UINotificationService.show({ + title: 'Cross Origin Isolation', + message: + 'Cross Origin Isolation is not enabled, volume rendering will not work (e.g., MPR)', + type: 'warning', + }); + } + if (cornerstone.getShouldUseCPURendering()) { _showCPURenderingModal(UIModalService, HangingProtocolService); } diff --git a/extensions/measurement-tracking/package.json b/extensions/measurement-tracking/package.json index b070e4067..99ce2f3cc 100644 --- a/extensions/measurement-tracking/package.json +++ b/extensions/measurement-tracking/package.json @@ -32,8 +32,8 @@ "peerDependencies": { "@ohif/core": "^3.0.0", "classnames": "^2.2.6", - "@cornerstonejs/core": "^0.21.5", - "@cornerstonejs/tools": "^0.29.8", + "@cornerstonejs/core": "^0.22.3", + "@cornerstonejs/tools": "^0.30.6", "@ohif/extension-cornerstone-dicom-sr": "^3.0.0", "dcmjs": "^0.28.3", "prop-types": "^15.6.2", diff --git a/extensions/measurement-tracking/src/viewports/TrackedCornerstoneViewport.tsx b/extensions/measurement-tracking/src/viewports/TrackedCornerstoneViewport.tsx index c987d92f9..4cf48444a 100644 --- a/extensions/measurement-tracking/src/viewports/TrackedCornerstoneViewport.tsx +++ b/extensions/measurement-tracking/src/viewports/TrackedCornerstoneViewport.tsx @@ -86,6 +86,8 @@ function TrackedCornerstoneViewport(props) { cineService.playClip(element, { framesPerSecond: validFrameRate, }); + } else { + cineService.stopClip(element); } }; diff --git a/modes/tmtv/src/utils/setFusionActiveVolume.js b/modes/tmtv/src/utils/setFusionActiveVolume.js index c7dbe20d4..44790eebe 100644 --- a/modes/tmtv/src/utils/setFusionActiveVolume.js +++ b/modes/tmtv/src/utils/setFusionActiveVolume.js @@ -32,14 +32,17 @@ export default function setFusionActiveVolume( toolNames.EllipticalROI ); + // Todo: this should not take into account the loader id + const volumeId = `cornerstoneStreamingImageVolume:${displaySets[0].displaySetInstanceUID}`; + const windowLevelConfig = { ...wlToolConfig, - volumeId: displaySets[0].displaySetInstanceUID, + volumeId, }; const ellipticalROIConfig = { ...ellipticalToolConfig, - volumeId: displaySets[0].displaySetInstanceUID, + volumeId, }; ToolGroupService.setToolConfiguration( diff --git a/platform/core/src/utils/metadataProvider/fetchPaletteColorLookupTableData.js b/platform/core/src/utils/metadataProvider/fetchPaletteColorLookupTableData.js index e79749958..54cdff170 100644 --- a/platform/core/src/utils/metadataProvider/fetchPaletteColorLookupTableData.js +++ b/platform/core/src/utils/metadataProvider/fetchPaletteColorLookupTableData.js @@ -12,16 +12,16 @@ * Returns undefined if the palette data is absent. */ export default function fetchPaletteColorLookupTableData( - item, tag, descriptorTag + item, + tag, + descriptorTag ) { const { PaletteColorLookupTableUID } = item; const paletteData = item[tag]; - if (paletteData === undefined && PaletteColorLookupTableUID === undefined) return; + if (paletteData === undefined && PaletteColorLookupTableUID === undefined) + return; // performance optimization - read UID and cache by UID - return _getPaletteColor( - item[tag], - item[descriptorTag] - ) + return _getPaletteColor(item[tag], item[descriptorTag]); } function _getPaletteColor(paletteColorLookupTableData, lutDescriptor) { @@ -36,13 +36,12 @@ function _getPaletteColor(paletteColorLookupTableData, lutDescriptor) { if (bits === 16) { let j = 0; for (let i = 0; i < numLutEntries; i++) { - lut[i] = arraybuffer[j++] + arraybuffer[j++] << 8; + lut[i] = (arraybuffer[j++] + arraybuffer[j++]) << 8; } } else { for (let i = 0; i < numLutEntries; i++) { lut[i] = byteArray[i]; } - } return lut; }; @@ -53,20 +52,33 @@ function _getPaletteColor(paletteColorLookupTableData, lutDescriptor) { if (paletteColorLookupTableData.InlineBinary) { try { - const arraybuffer = Uint8Array.from(atob(paletteColorLookupTableData.InlineBinary), c => - c.charCodeAt(0) + const arraybuffer = Uint8Array.from( + atob(paletteColorLookupTableData.InlineBinary), + c => c.charCodeAt(0) ); - return (paletteColorLookupTableData.palette = arrayBufferToPaletteColorLUT(arraybuffer)); + return (paletteColorLookupTableData.palette = arrayBufferToPaletteColorLUT( + arraybuffer + )); } catch (e) { - console.log("Couldn't decode", paletteColorLookupTableData.InlineBinary, e); + console.log( + "Couldn't decode", + paletteColorLookupTableData.InlineBinary, + e + ); return undefined; } } if (paletteColorLookupTableData.retrieveBulkData) { - return paletteColorLookupTableData.retrieveBulkData().then(val => - (paletteColorLookupTableData.palette = arrayBufferToPaletteColorLUT(val))); + return paletteColorLookupTableData + .retrieveBulkData() + .then( + val => + (paletteColorLookupTableData.palette = arrayBufferToPaletteColorLUT( + val + )) + ); } - throw new Error(`No data found for ${paletteColorLookupTableData} palette`) + console.error(`No data found for ${paletteColorLookupTableData} palette`); } diff --git a/platform/ui/src/components/Button/Button.tsx b/platform/ui/src/components/Button/Button.tsx index 03c4ea1de..39888c01c 100644 --- a/platform/ui/src/components/Button/Button.tsx +++ b/platform/ui/src/components/Button/Button.tsx @@ -44,9 +44,12 @@ const variants = { 'text-primary-main hover:opacity-80 active:opacity-100 focus:opacity-80', secondary: 'text-secondary-light hover:opacity-80 active:opacity-100 focus:opacity-80', - white: 'text-white hover:opacity-80 active:opacity-100 focus:opacity-80', - black: + translucent: + 'text-white hover:opacity-80 active:opacity-100 focus:opacity-80', + white: 'text-black hover:bg-primary-main focus:bg-primary-main hover:border-black focus:border-black', + black: + 'text-white hover:bg-primary-main focus:bg-primary-main hover:border-black focus:border-black', primaryActive: 'text-primary-active hover:opacity-80 active:opacity-100 focus:opacity-80', primaryLight: diff --git a/platform/ui/src/components/StudyListPagination/StudyListPagination.tsx b/platform/ui/src/components/StudyListPagination/StudyListPagination.tsx index 8f02d6003..c03f02b81 100644 --- a/platform/ui/src/components/StudyListPagination/StudyListPagination.tsx +++ b/platform/ui/src/components/StudyListPagination/StudyListPagination.tsx @@ -59,7 +59,7 @@ const StudyListPagination = ({