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
This commit is contained in:
Alireza
GitHub
parent
4c5d14c624
commit
42dca11ae3
@ -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 {
|
||||
|
||||
@ -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"
|
||||
}
|
||||
}
|
||||
|
||||
@ -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",
|
||||
|
||||
@ -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);
|
||||
}
|
||||
|
||||
@ -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",
|
||||
|
||||
@ -86,6 +86,8 @@ function TrackedCornerstoneViewport(props) {
|
||||
cineService.playClip(element, {
|
||||
framesPerSecond: validFrameRate,
|
||||
});
|
||||
} else {
|
||||
cineService.stopClip(element);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
@ -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(
|
||||
|
||||
@ -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`);
|
||||
}
|
||||
|
||||
@ -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:
|
||||
|
||||
@ -59,7 +59,7 @@ const StudyListPagination = ({
|
||||
<Button
|
||||
size="initial"
|
||||
className="px-4 py-2 text-base"
|
||||
color="white"
|
||||
color="translucent"
|
||||
border="primary"
|
||||
variant="outlined"
|
||||
onClick={() => navigateToPage(1)}
|
||||
@ -69,7 +69,7 @@ const StudyListPagination = ({
|
||||
<Button
|
||||
size="initial"
|
||||
className="py-2 px-2 text-base"
|
||||
color="white"
|
||||
color="translucent"
|
||||
border="primary"
|
||||
variant="outlined"
|
||||
onClick={() => navigateToPage(currentPage - 1)}
|
||||
@ -79,7 +79,7 @@ const StudyListPagination = ({
|
||||
<Button
|
||||
size="initial"
|
||||
className="py-2 px-4 text-base"
|
||||
color="white"
|
||||
color="translucent"
|
||||
border="primary"
|
||||
variant="outlined"
|
||||
onClick={() => navigateToPage(currentPage + 1)}
|
||||
|
||||
58
platform/viewer/src/routes/Debug.tsx
Normal file
58
platform/viewer/src/routes/Debug.tsx
Normal file
@ -0,0 +1,58 @@
|
||||
import React from 'react';
|
||||
import { Icon } from '@ohif/ui';
|
||||
|
||||
// this is a debug component that is used to list various things that might
|
||||
// be useful for debugging such as cross origin errors, etc.
|
||||
function Debug() {
|
||||
return (
|
||||
<div style={{ width: '100%', height: '100%' }}>
|
||||
<div className="h-screen w-screen flex justify-center items-center ">
|
||||
<div className="py-8 px-8 mx-auto bg-secondary-dark drop-shadow-md space-y-2 rounded-lg">
|
||||
<img
|
||||
className="block mx-auto h-14"
|
||||
src="./ohif-logo.svg"
|
||||
alt="OHIF"
|
||||
/>
|
||||
<div className="text-center space-y-2 pt-4">
|
||||
<div className="flex flex-col justify-center items-center">
|
||||
<p className="text-xl text-primary-active font-semibold mt-4">
|
||||
Debug Information
|
||||
</p>
|
||||
<div className="flex space-x-2 mt-4 items-center">
|
||||
<p className="text-md text-white">
|
||||
Cross Origin Isolated (COOP/COEP)
|
||||
</p>
|
||||
<Icon
|
||||
name={
|
||||
window.crossOriginIsolated
|
||||
? 'notifications-success'
|
||||
: 'notifications-error'
|
||||
}
|
||||
className="w-5 h-5"
|
||||
/>
|
||||
{!window.crossOriginIsolated && (
|
||||
<div className="text-md text-white flex-1">
|
||||
We use SharedArrayBuffer to render volume data (e.g., MPR).
|
||||
If you are seeing this message, it means that your browser
|
||||
has not enabled COOP/COEP. Please see the following link for
|
||||
more information:{' '}
|
||||
<a
|
||||
href="https://web.dev/coop-coep/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="text-primary-active"
|
||||
>
|
||||
Learn More
|
||||
</a>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default Debug;
|
||||
@ -6,6 +6,7 @@ import { ErrorBoundary } from '@ohif/ui';
|
||||
import DataSourceWrapper from './DataSourceWrapper';
|
||||
import WorkList from './WorkList';
|
||||
import Local from './Local';
|
||||
import Debug from './Debug';
|
||||
import NotFound from './NotFound';
|
||||
import buildModeRoutes from './buildModeRoutes';
|
||||
import PrivateRoute from './PrivateRoute';
|
||||
@ -13,6 +14,16 @@ import PrivateRoute from './PrivateRoute';
|
||||
// TODO: Include "routes" debug route if dev build
|
||||
const bakedInRoutes = [
|
||||
// WORK LIST
|
||||
{
|
||||
path: '/',
|
||||
children: DataSourceWrapper,
|
||||
private: true,
|
||||
props: { children: WorkList },
|
||||
},
|
||||
{
|
||||
path: '/debug',
|
||||
children: Debug,
|
||||
},
|
||||
{
|
||||
path: '/local',
|
||||
children: Local,
|
||||
|
||||
36
yarn.lock
36
yarn.lock
@ -2383,36 +2383,28 @@
|
||||
resolved "https://registry.yarnpkg.com/@cornerstonejs/codec-openjpeg/-/codec-openjpeg-0.1.1.tgz#5bd1c52a33a425299299e970312731fa0cc2711b"
|
||||
integrity sha512-HOMMOLV6xy8O/agNGGvrl0a8DwShpBvWxAzEzv2pqq12d3r5z/3MyIgNA3Oj/8bIBVvvVXxh9RX7rMDRHJdowg==
|
||||
|
||||
"@cornerstonejs/core@^0.21.4":
|
||||
version "0.21.4"
|
||||
resolved "https://registry.npmjs.org/@cornerstonejs/core/-/core-0.21.4.tgz#d1dab2c985c382495a8ec91a28f2d62872cdb350"
|
||||
integrity sha512-8D8QyK5bjqxefSVr3vLzsp2MUprmABAbX4qpvpp1XRmC76i1dKKR8Yo9G9jdreR5xwKvJN7pY6/n1F2ZYSN48w==
|
||||
"@cornerstonejs/core@^0.22.3":
|
||||
version "0.22.3"
|
||||
resolved "https://registry.npmjs.org/@cornerstonejs/core/-/core-0.22.3.tgz#57bf1482ce91d094342bf116636dea1335bff0b3"
|
||||
integrity sha512-WqV6TnsTpsgezSj9SmnSgGCdY3u/EwYr6nKD8KnRQI8lqRTmMIKzbcIvPWAKJ/sU+A9Da6A5tweZvrhrcSorGg==
|
||||
dependencies:
|
||||
detect-gpu "^4.0.45"
|
||||
lodash.clonedeep "4.5.0"
|
||||
|
||||
"@cornerstonejs/core@^0.21.5":
|
||||
version "0.21.5"
|
||||
resolved "https://registry.npmjs.org/@cornerstonejs/core/-/core-0.21.5.tgz#2c172379378fdead2417973578160b433c1d0519"
|
||||
integrity sha512-dbjGRzYbEySdYGwwONqM9P83Da7MUJDp0OY37mZ9BAhzQFhbCJPNC6GLa8ZbAQIwyTVopUVXlFme601bSVMVXw==
|
||||
"@cornerstonejs/streaming-image-volume-loader@^0.6.11":
|
||||
version "0.6.11"
|
||||
resolved "https://registry.npmjs.org/@cornerstonejs/streaming-image-volume-loader/-/streaming-image-volume-loader-0.6.11.tgz#53800b12d588300320aa479eef24f168a38826bd"
|
||||
integrity sha512-UrgiWIsTSPFWEgCKxsKZUZ5hgir8ymdXes2UB8OT7yX6M4QeTmKi26nVNP21vebKMMPBootK//geSToqBoBs4Q==
|
||||
dependencies:
|
||||
detect-gpu "^4.0.45"
|
||||
lodash.clonedeep "4.5.0"
|
||||
|
||||
"@cornerstonejs/streaming-image-volume-loader@^0.6.5":
|
||||
version "0.6.5"
|
||||
resolved "https://registry.npmjs.org/@cornerstonejs/streaming-image-volume-loader/-/streaming-image-volume-loader-0.6.5.tgz#f3f2ab362bf494e4072a146b45acedce0197fb36"
|
||||
integrity sha512-dowoZYz0tMVtuUQl2WIZjOC/2TC0zMgas8KtpVcxJcGEu9HWA9oatgPlY0WqtFniDU7Oxnyy7OqYawtEoSSwdw==
|
||||
dependencies:
|
||||
"@cornerstonejs/core" "^0.21.4"
|
||||
"@cornerstonejs/core" "^0.22.3"
|
||||
cornerstone-wado-image-loader "^4.2.1"
|
||||
|
||||
"@cornerstonejs/tools@^0.29.8":
|
||||
version "0.29.8"
|
||||
resolved "https://registry.npmjs.org/@cornerstonejs/tools/-/tools-0.29.8.tgz#b90bf1d195adb28f8871e1f8c59de397e3f12ea6"
|
||||
integrity sha512-61aOYqXYwRRtv+tqcX7BMdFVlOq+YdV7sVLLsLz52RCXruPcfs7A8QWE+Y2PzBjNwX3I6G+fzcwsnKK3JRVY1Q==
|
||||
"@cornerstonejs/tools@^0.30.6":
|
||||
version "0.30.6"
|
||||
resolved "https://registry.npmjs.org/@cornerstonejs/tools/-/tools-0.30.6.tgz#a6e5209f00fe00a919f20fe1387f06062b289a16"
|
||||
integrity sha512-GEm2xWOlBwgS/3aZDBZObyu+KJESyOmkCo3hA+tellLKCVr207wBUUDndEmkNX6PJ/mR4o9Md6ZjMfNF7CAYiA==
|
||||
dependencies:
|
||||
"@cornerstonejs/core" "^0.21.5"
|
||||
"@cornerstonejs/core" "^0.22.3"
|
||||
lodash.clonedeep "4.5.0"
|
||||
lodash.get "^4.4.2"
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user