fix(crosshairs): reset angle, position, and slabthickness for crosshairs when reset viewport tool is used (#4113)

Co-authored-by: Alireza <ar.sedghi@gmail.com>
This commit is contained in:
Ibrahim 2024-05-23 16:18:44 -04:00 committed by GitHub
parent 1124c409e9
commit 73d9e99d5d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
17 changed files with 200 additions and 49 deletions

View File

@ -46,8 +46,8 @@
},
"dependencies": {
"@babel/runtime": "^7.20.13",
"@cornerstonejs/adapters": "^1.74.6",
"@cornerstonejs/core": "^1.74.6",
"@cornerstonejs/adapters": "^1.74.7",
"@cornerstonejs/core": "^1.74.7",
"@kitware/vtk.js": "30.4.1",
"react-color": "^2.19.3"
}

View File

@ -46,9 +46,9 @@
},
"dependencies": {
"@babel/runtime": "^7.20.13",
"@cornerstonejs/adapters": "^1.74.6",
"@cornerstonejs/core": "^1.74.6",
"@cornerstonejs/tools": "^1.74.6",
"@cornerstonejs/adapters": "^1.74.7",
"@cornerstonejs/core": "^1.74.7",
"@cornerstonejs/tools": "^1.74.7",
"classnames": "^2.3.2"
}
}

View File

@ -42,9 +42,9 @@
},
"dependencies": {
"@babel/runtime": "^7.20.13",
"@cornerstonejs/core": "^1.74.6",
"@cornerstonejs/streaming-image-volume-loader": "^1.74.6",
"@cornerstonejs/tools": "^1.74.6",
"@cornerstonejs/core": "^1.74.7",
"@cornerstonejs/streaming-image-volume-loader": "^1.74.7",
"@cornerstonejs/tools": "^1.74.7",
"classnames": "^2.3.2"
}
}

View File

@ -38,7 +38,7 @@
"@cornerstonejs/codec-libjpeg-turbo-8bit": "^1.2.2",
"@cornerstonejs/codec-openjpeg": "^1.2.2",
"@cornerstonejs/codec-openjph": "^2.4.2",
"@cornerstonejs/dicom-image-loader": "^1.74.6",
"@cornerstonejs/dicom-image-loader": "^1.74.7",
"@icr/polyseg-wasm": "^0.4.0",
"@ohif/core": "3.9.0-beta.16",
"@ohif/ui": "3.9.0-beta.16",
@ -55,10 +55,10 @@
},
"dependencies": {
"@babel/runtime": "^7.20.13",
"@cornerstonejs/adapters": "^1.74.6",
"@cornerstonejs/core": "^1.74.6",
"@cornerstonejs/streaming-image-volume-loader": "^1.74.6",
"@cornerstonejs/tools": "^1.74.6",
"@cornerstonejs/adapters": "^1.74.7",
"@cornerstonejs/core": "^1.74.7",
"@cornerstonejs/streaming-image-volume-loader": "^1.74.7",
"@cornerstonejs/tools": "^1.74.7",
"@icr/polyseg-wasm": "^0.4.0",
"@kitware/vtk.js": "30.4.1",
"html2canvas": "^1.4.1",

View File

@ -1,4 +1,4 @@
import React, { useEffect, useState, useCallback } from 'react';
import React, { useEffect, useState, useCallback, useRef } from 'react';
import PropTypes from 'prop-types';
import { LayoutSelector as OHIFLayoutSelector, ToolbarButton, LayoutPreset } from '@ohif/ui';
@ -134,22 +134,30 @@ function LayoutSelector({
...rest
}: withAppTypes) {
const [isOpen, setIsOpen] = useState(false);
const dropdownRef = useRef(null);
const { customizationService } = servicesManager.services;
const commonPresets = customizationService.get('commonPresets') || defaultCommonPresets;
const advancedPresets =
customizationService.get('advancedPresets') || generateAdvancedPresets({ servicesManager });
const closeOnOutsideClick = () => {
if (isOpen) {
const closeOnOutsideClick = event => {
if (isOpen && dropdownRef.current) {
setIsOpen(false);
}
};
useEffect(() => {
window.addEventListener('click', closeOnOutsideClick);
if (!isOpen) {
return;
}
setTimeout(() => {
window.addEventListener('click', closeOnOutsideClick);
}, 0);
return () => {
window.removeEventListener('click', closeOnOutsideClick);
dropdownRef.current = null;
};
}, [isOpen]);
@ -169,7 +177,10 @@ function LayoutSelector({
disableToolTip={tooltipDisabled}
dropdownContent={
DropdownContent !== null && (
<div className="flex ">
<div
className="flex"
ref={dropdownRef}
>
<div className="bg-secondary-dark flex flex-col gap-2.5 p-2">
<div className="text-aqua-pale text-xs">Common</div>

View File

@ -32,8 +32,8 @@
"start": "yarn run dev"
},
"peerDependencies": {
"@cornerstonejs/core": "^1.74.6",
"@cornerstonejs/tools": "^1.74.6",
"@cornerstonejs/core": "^1.74.7",
"@cornerstonejs/tools": "^1.74.7",
"@ohif/core": "3.9.0-beta.16",
"@ohif/extension-cornerstone-dicom-sr": "3.9.0-beta.16",
"@ohif/ui": "3.9.0-beta.16",

View File

@ -77,9 +77,12 @@ function initDefaultToolGroup(
{ toolName: toolNames.Magnify },
{ toolName: toolNames.SegmentationDisplay },
{ toolName: toolNames.CalibrationLine },
{ toolName: toolNames.PlanarFreehandContourSegmentation, configuration: {
displayOnePointAsCrosshairs: true,
} },
{
toolName: toolNames.PlanarFreehandContourSegmentation,
configuration: {
displayOnePointAsCrosshairs: true,
},
},
{ toolName: toolNames.UltrasoundDirectional },
{ toolName: toolNames.PlanarFreehandROI },
{ toolName: toolNames.SplineROI },
@ -150,9 +153,12 @@ function initSRToolGroup(extensionManager, toolGroupService) {
{ toolName: SRToolNames.SRCircleROI },
{ toolName: SRToolNames.SRPlanarFreehandROI },
{ toolName: SRToolNames.SRRectangleROI },
{ toolName: SRToolNames.SRPlanarFreehandContourSegmentation, configuration: {
displayOnePointAsCrosshairs: true,
} },
{
toolName: SRToolNames.SRPlanarFreehandContourSegmentation,
configuration: {
displayOnePointAsCrosshairs: true,
},
},
],
enabled: [
{
@ -230,15 +236,23 @@ function initMPRToolGroup(extensionManager, toolGroupService, commandsManager, m
{ toolName: toolNames.CobbAngle },
{ toolName: toolNames.PlanarFreehandROI },
{ toolName: toolNames.SegmentationDisplay },
{ toolName: toolNames.PlanarFreehandContourSegmentation, configuration: {
displayOnePointAsCrosshairs: true,
} },
{
toolName: toolNames.PlanarFreehandContourSegmentation,
configuration: {
displayOnePointAsCrosshairs: true,
},
},
],
disabled: [
{
toolName: toolNames.Crosshairs,
configuration: {
viewportIndicators: false,
viewportIndicators: true,
viewportIndicatorsConfig: {
circleRadius: 5,
xOffset: 0.95,
yOffset: 0.05,
},
disableOnPassive: true,
autoPan: {
enabled: false,

View File

@ -55,7 +55,7 @@ function modeFactory({ modeConfiguration }) {
const { toolNames, Enums } = utilityModule.exports;
measurementService.clearMeasurements();
initToolGroups({ toolNames, Enums, toolGroupService, commandsManager });
initToolGroups({ toolNames, Enums, toolGroupService, commandsManager, servicesManager });
toolbarService.addButtons([...toolbarButtons, ...segmentationButtons]);
toolbarService.createButtonSection('secondary', ['ProgressDropdown']);

View File

@ -5,7 +5,20 @@ const toolGroupIds = {
CT: 'dynamic4D-ct',
};
function _initToolGroups(toolNames, Enums, toolGroupService, commandsManager) {
const colours = {
'viewport-0': 'rgb(200, 0, 0)',
'viewport-1': 'rgb(200, 200, 0)',
'viewport-2': 'rgb(0, 200, 0)',
};
const colorsByOrientation = {
axial: 'rgb(200, 0, 0)',
sagittal: 'rgb(200, 200, 0)',
coronal: 'rgb(0, 200, 0)',
};
function _initToolGroups(toolNames, Enums, toolGroupService, commandsManager, servicesManager) {
const { cornerstoneViewportService } = servicesManager.services;
const tools = {
active: [
{
@ -94,12 +107,31 @@ function _initToolGroups(toolNames, Enums, toolGroupService, commandsManager) {
{
toolName: toolNames.Crosshairs,
configuration: {
viewportIndicators: false,
viewportIndicators: true,
viewportIndicatorsConfig: {
circleRadius: 5,
xOffset: 0.95,
yOffset: 0.05,
},
disableOnPassive: true,
autoPan: {
enabled: false,
panSize: 10,
},
getReferenceLineColor: viewportId => {
const viewportInfo = cornerstoneViewportService.getViewportInfo(viewportId);
const viewportOptions = viewportInfo?.viewportOptions;
if (viewportOptions) {
return (
colours[viewportOptions.id] ||
colorsByOrientation[viewportOptions.orientation] ||
'#0c0'
);
} else {
console.warn('missing viewport?', viewportId);
return '#0c0';
}
},
},
},
],
@ -123,8 +155,8 @@ function _initToolGroups(toolNames, Enums, toolGroupService, commandsManager) {
toolGroupService.createToolGroupAndAddTools(toolGroupIds.default, tools);
}
function initToolGroups({ toolNames, Enums, toolGroupService, commandsManager }) {
_initToolGroups(toolNames, Enums, toolGroupService, commandsManager);
function initToolGroups({ toolNames, Enums, toolGroupService, commandsManager, servicesManager }) {
_initToolGroups(toolNames, Enums, toolGroupService, commandsManager, servicesManager);
}
export { initToolGroups as default, toolGroupIds };

View File

@ -1,3 +1,15 @@
const colours = {
'viewport-0': 'rgb(200, 0, 0)',
'viewport-1': 'rgb(200, 200, 0)',
'viewport-2': 'rgb(0, 200, 0)',
};
const colorsByOrientation = {
axial: 'rgb(200, 0, 0)',
sagittal: 'rgb(200, 200, 0)',
coronal: 'rgb(0, 200, 0)',
};
function createTools(utilityModule) {
const { toolNames, Enums } = utilityModule.exports;
return {
@ -94,17 +106,38 @@ function initMPRToolGroup(extensionManager, toolGroupService, commandsManager) {
const utilityModule = extensionManager.getModuleEntry(
'@ohif/extension-cornerstone.utilityModule.tools'
);
const servicesManager = extensionManager._servicesManager;
const { cornerstoneViewportService } = servicesManager.services;
const tools = createTools(utilityModule);
tools.disabled.push(
{
toolName: utilityModule.exports.toolNames.Crosshairs,
configuration: {
viewportIndicators: false,
viewportIndicators: true,
viewportIndicatorsConfig: {
circleRadius: 5,
xOffset: 0.95,
yOffset: 0.05,
},
disableOnPassive: true,
autoPan: {
enabled: false,
panSize: 10,
},
getReferenceLineColor: viewportId => {
const viewportInfo = cornerstoneViewportService.getViewportInfo(viewportId);
const viewportOptions = viewportInfo?.viewportOptions;
if (viewportOptions) {
return (
colours[viewportOptions.id] ||
colorsByOrientation[viewportOptions.orientation] ||
'#0c0'
);
} else {
console.warn('missing viewport?', viewportId);
return '#0c0';
}
},
},
},
{ toolName: utilityModule.exports.toolNames.ReferenceLines }

View File

@ -63,7 +63,7 @@ function modeFactory({ modeConfiguration }) {
const { toolNames, Enums } = utilityModule.exports;
// Init Default and SR ToolGroups
initToolGroups(toolNames, Enums, toolGroupService, commandsManager);
initToolGroups(toolNames, Enums, toolGroupService, commandsManager, null, servicesManager);
const { unsubscribe } = toolGroupService.subscribe(
toolGroupService.EVENTS.VIEWPORT_ADDED,

View File

@ -6,7 +6,14 @@ export const toolGroupIds = {
default: 'default',
};
function _initToolGroups(toolNames, Enums, toolGroupService, commandsManager, modeLabelConfig) {
function _initToolGroups(
toolNames,
Enums,
toolGroupService,
commandsManager,
modeLabelConfig,
servicesManager
) {
const tools = {
active: [
{
@ -125,7 +132,12 @@ function _initToolGroups(toolNames, Enums, toolGroupService, commandsManager, mo
{
toolName: toolNames.Crosshairs,
configuration: {
viewportIndicators: false,
viewportIndicators: true,
viewportIndicatorsConfig: {
circleRadius: 5,
xOffset: 0.95,
yOffset: 0.05,
},
disableOnPassive: true,
autoPan: {
enabled: false,
@ -178,8 +190,22 @@ function _initToolGroups(toolNames, Enums, toolGroupService, commandsManager, mo
toolGroupService.createToolGroupAndAddTools(toolGroupIds.MIP, mipTools);
}
function initToolGroups(toolNames, Enums, toolGroupService, commandsManager, modeLabelConfig) {
_initToolGroups(toolNames, Enums, toolGroupService, commandsManager, modeLabelConfig);
function initToolGroups(
toolNames,
Enums,
toolGroupService,
commandsManager,
modeLabelConfig,
servicesManager
) {
_initToolGroups(
toolNames,
Enums,
toolGroupService,
commandsManager,
modeLabelConfig,
servicesManager
);
}
export default initToolGroups;

View File

@ -53,7 +53,7 @@
"@cornerstonejs/codec-libjpeg-turbo-8bit": "^1.2.2",
"@cornerstonejs/codec-openjpeg": "^1.2.2",
"@cornerstonejs/codec-openjph": "^2.4.5",
"@cornerstonejs/dicom-image-loader": "^1.74.6",
"@cornerstonejs/dicom-image-loader": "^1.74.7",
"@emotion/serialize": "^1.1.3",
"@ohif/core": "3.9.0-beta.16",
"@ohif/extension-cornerstone": "3.9.0-beta.16",

View File

@ -1,4 +1,5 @@
window.config = {
/** @type {import('@ohif/core').OHIFConfig} */
const config = {
routerBasename: '/',
// whiteLabeling: {},
extensions: [],
@ -232,3 +233,5 @@ window.config = {
},
],
};
window.config = config;

View File

@ -37,7 +37,7 @@
"@cornerstonejs/codec-libjpeg-turbo-8bit": "^1.2.2",
"@cornerstonejs/codec-openjpeg": "^1.2.2",
"@cornerstonejs/codec-openjph": "^2.4.2",
"@cornerstonejs/dicom-image-loader": "^1.74.6",
"@cornerstonejs/dicom-image-loader": "^1.74.7",
"@ohif/ui": "3.9.0-beta.16",
"cornerstone-math": "0.1.9",
"dicom-parser": "^1.8.21"

View File

@ -13,7 +13,6 @@ import defaults from './defaults';
import * as Types from './types';
import * as Enums from './enums';
import { useToolbar } from './hooks/useToolbar';
import {
CineService,
UIDialogService,

View File

@ -2086,7 +2086,7 @@
"@docusaurus/theme-search-algolia" "2.4.3"
"@docusaurus/types" "2.4.3"
"@docusaurus/react-loadable@5.5.2", "react-loadable@npm:@docusaurus/react-loadable@5.5.2":
"@docusaurus/react-loadable@5.5.2":
version "5.5.2"
resolved "https://registry.yarnpkg.com/@docusaurus/react-loadable/-/react-loadable-5.5.2.tgz#81aae0db81ecafbdaee3651f12804580868fa6ce"
integrity sha512-A3dYjdBGuy0IGT+wyLIGIKLRE+sAk1iNk0f1HjNDysO7u8lhL4N3VEm+FAubmJbAztn94F7MxBTPmnixbiyFdQ==
@ -17783,6 +17783,14 @@ react-loadable-ssr-addon-v5-slorber@^1.0.1:
dependencies:
"@babel/runtime" "^7.10.3"
"react-loadable@npm:@docusaurus/react-loadable@5.5.2":
version "5.5.2"
resolved "https://registry.yarnpkg.com/@docusaurus/react-loadable/-/react-loadable-5.5.2.tgz#81aae0db81ecafbdaee3651f12804580868fa6ce"
integrity sha512-A3dYjdBGuy0IGT+wyLIGIKLRE+sAk1iNk0f1HjNDysO7u8lhL4N3VEm+FAubmJbAztn94F7MxBTPmnixbiyFdQ==
dependencies:
"@types/react" "*"
prop-types "^15.6.2"
react-modal@3.11.2:
version "3.11.2"
resolved "https://registry.yarnpkg.com/react-modal/-/react-modal-3.11.2.tgz#bad911976d4add31aa30dba8a41d11e21c4ac8a4"
@ -19573,7 +19581,7 @@ string-natural-compare@^3.0.1:
resolved "https://registry.yarnpkg.com/string-natural-compare/-/string-natural-compare-3.0.1.tgz#7a42d58474454963759e8e8b7ae63d71c1e7fdf4"
integrity sha512-n3sPwynL1nwKi3WJ6AIsClwBMa0zTi54fn2oLU6ndfTSIO05xaznjSf15PcBZU6FNWbmN5Q6cxT4V5hGvB4taw==
"string-width-cjs@npm:string-width@^4.2.0", "string-width@^1.0.2 || 2 || 3 || 4", string-width@^4.0.0, string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.2, string-width@^4.2.3:
"string-width-cjs@npm:string-width@^4.2.0":
version "4.2.3"
resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
@ -19591,6 +19599,15 @@ string-width@^1.0.1:
is-fullwidth-code-point "^1.0.0"
strip-ansi "^3.0.0"
"string-width@^1.0.2 || 2 || 3 || 4", string-width@^4.0.0, string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.2, string-width@^4.2.3:
version "4.2.3"
resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
dependencies:
emoji-regex "^8.0.0"
is-fullwidth-code-point "^3.0.0"
strip-ansi "^6.0.1"
string-width@^2.1.0, string-width@^2.1.1:
version "2.1.1"
resolved "https://registry.yarnpkg.com/string-width/-/string-width-2.1.1.tgz#ab93f27a8dc13d28cac815c462143a6d9012ae9e"
@ -19686,7 +19703,7 @@ stringify-object@^3.3.0:
is-obj "^1.0.1"
is-regexp "^1.0.0"
"strip-ansi-cjs@npm:strip-ansi@^6.0.1", strip-ansi@^6.0.0, strip-ansi@^6.0.1:
"strip-ansi-cjs@npm:strip-ansi@^6.0.1":
version "6.0.1"
resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9"
integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
@ -19714,6 +19731,13 @@ strip-ansi@^5.1.0:
dependencies:
ansi-regex "^4.1.0"
strip-ansi@^6.0.0, strip-ansi@^6.0.1:
version "6.0.1"
resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9"
integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
dependencies:
ansi-regex "^5.0.1"
strip-ansi@^7.0.0, strip-ansi@^7.0.1:
version "7.1.0"
resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-7.1.0.tgz#d5b6568ca689d8561370b0707685d22434faff45"
@ -21757,7 +21781,7 @@ worker-loader@3.0.8, worker-loader@^3.0.8:
loader-utils "^2.0.0"
schema-utils "^3.0.0"
"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0", wrap-ansi@^7.0.0:
"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0":
version "7.0.0"
resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43"
integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==
@ -21783,6 +21807,15 @@ wrap-ansi@^6.0.1, wrap-ansi@^6.2.0:
string-width "^4.1.0"
strip-ansi "^6.0.0"
wrap-ansi@^7.0.0:
version "7.0.0"
resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43"
integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==
dependencies:
ansi-styles "^4.0.0"
string-width "^4.1.0"
strip-ansi "^6.0.0"
wrap-ansi@^8.0.1, wrap-ansi@^8.1.0:
version "8.1.0"
resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-8.1.0.tgz#56dc22368ee570face1b49819975d9b9a5ead214"