ui(settings): Moved Segment Label Display from tools to settings panel (#5422)
Co-authored-by: Joe Boccanfuso <joe.boccanfuso@radicalimaging.com>
This commit is contained in:
parent
41d4398342
commit
c91752d575
@ -1858,22 +1858,16 @@ function commandsModule({
|
||||
}
|
||||
});
|
||||
},
|
||||
toggleSegmentLabel: () => {
|
||||
toggleSegmentLabel: ({ enabled }) => {
|
||||
const toolName = cornerstoneTools.SegmentLabelTool.toolName;
|
||||
const toolGroupIds = toolGroupService.getToolGroupIds();
|
||||
|
||||
const isOn = toolGroupIds.some(toolGroupId => {
|
||||
const toolGroup = cornerstoneTools.ToolGroupManager.getToolGroup(toolGroupId);
|
||||
const mode = toolGroup.getToolInstance(toolName)?.mode;
|
||||
return mode === 'Active';
|
||||
});
|
||||
|
||||
toolGroupIds.forEach(toolGroupId => {
|
||||
const toolGroup = cornerstoneTools.ToolGroupManager.getToolGroup(toolGroupId);
|
||||
if (isOn) {
|
||||
toolGroup.setToolDisabled(toolName);
|
||||
} else {
|
||||
if (enabled) {
|
||||
toolGroup.setToolActive(toolName);
|
||||
} else {
|
||||
toolGroup.setToolDisabled(toolName);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
@ -36,6 +36,7 @@ export default function getSegmentationPanelCustomization({ commandsManager, ser
|
||||
'segmentationToolbox.config': () => {
|
||||
// Get initial states based on current configuration
|
||||
const [previewEdits, setPreviewEdits] = useState(false);
|
||||
const [segmentLabelEnabled, setSegmentLabelEnabled] = useState(false);
|
||||
const [toggleSegmentEnabled, setToggleSegmentEnabled] = useState(false);
|
||||
const [useCenterAsSegmentIndex, setUseCenterAsSegmentIndex] = useState(false);
|
||||
const handlePreviewEditsChange = checked => {
|
||||
@ -53,14 +54,19 @@ export default function getSegmentationPanelCustomization({ commandsManager, ser
|
||||
commandsManager.run('toggleUseCenterSegmentIndex', { toggle: checked });
|
||||
};
|
||||
|
||||
const handleSegmentLabelEnabledChange = checked => {
|
||||
setSegmentLabelEnabled(checked);
|
||||
commandsManager.run('toggleSegmentLabel', { enabled: checked });
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="bg-muted flex flex-col gap-4 border-b border-b-[2px] border-black px-2 py-3">
|
||||
<div className="bg-muted flex flex-col gap-2 border-b border-b-[2px] border-black px-2 py-3">
|
||||
<div className="flex items-center gap-2">
|
||||
<Switch
|
||||
checked={previewEdits}
|
||||
onCheckedChange={handlePreviewEditsChange}
|
||||
/>
|
||||
<span className="text-base text-white">Preview edits before creating</span>
|
||||
<span className="text-foreground text-base">Preview edits before creating</span>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-2">
|
||||
@ -68,7 +74,7 @@ export default function getSegmentationPanelCustomization({ commandsManager, ser
|
||||
checked={useCenterAsSegmentIndex}
|
||||
onCheckedChange={handleUseCenterAsSegmentIndexChange}
|
||||
/>
|
||||
<span className="text-base text-white">Use center as segment index</span>
|
||||
<span className="text-foreground text-base">Use center as segment index</span>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-2">
|
||||
@ -76,7 +82,15 @@ export default function getSegmentationPanelCustomization({ commandsManager, ser
|
||||
checked={toggleSegmentEnabled}
|
||||
onCheckedChange={handleToggleSegmentEnabledChange}
|
||||
/>
|
||||
<span className="text-base text-white">Hover on segment border to activate</span>
|
||||
<span className="text-foreground text-base">Hover on segment border to activate</span>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-2">
|
||||
<Switch
|
||||
checked={segmentLabelEnabled}
|
||||
onCheckedChange={handleSegmentLabelEnabledChange}
|
||||
/>
|
||||
<span className="text-foreground text-base">Show segment name on hover</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -160,8 +160,7 @@ function modeFactory({ modeConfiguration }) {
|
||||
'TagBrowser',
|
||||
'AdvancedMagnify',
|
||||
'UltrasoundDirectionalTool',
|
||||
'WindowLevelRegion',
|
||||
'SegmentLabelTool',
|
||||
'WindowLevelRegion',
|
||||
]);
|
||||
|
||||
customizationService.setCustomizations({
|
||||
|
||||
@ -667,24 +667,6 @@ const toolbarButtons: Button[] = [
|
||||
buttonSection: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'SegmentLabelTool',
|
||||
uiType: 'ohif.toolBoxButton',
|
||||
props: {
|
||||
icon: 'tool-segment-label',
|
||||
label: i18n.t('Buttons:Segment Label Display'),
|
||||
tooltip: i18n.t(
|
||||
'Buttons:Click to show or hide segment labels when hovering with your mouse.'
|
||||
),
|
||||
commands: { commandName: 'toggleSegmentLabel' },
|
||||
evaluate: [
|
||||
'evaluate.cornerstoneTool.toggle',
|
||||
{
|
||||
name: 'evaluate.cornerstone.hasSegmentation',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
// {
|
||||
// id: 'Undo',
|
||||
// uiType: 'ohif.toolButton',
|
||||
|
||||
@ -121,8 +121,7 @@ function modeFactory({ modeConfiguration }) {
|
||||
toolbarService.updateSection('SegmentationUtilities', [
|
||||
'LabelmapSlicePropagation',
|
||||
'InterpolateLabelmap',
|
||||
'SegmentBidirectional',
|
||||
'SegmentLabelTool',
|
||||
'SegmentBidirectional',
|
||||
]);
|
||||
toolbarService.updateSection('SegmentationTools', [
|
||||
'BrushTools',
|
||||
|
||||
@ -749,24 +749,6 @@ const toolbarButtons: Button[] = [
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'SegmentLabelTool',
|
||||
uiType: 'ohif.toolBoxButton',
|
||||
props: {
|
||||
icon: 'tool-segment-label',
|
||||
label: i18n.t('Buttons:Segment Label Display'),
|
||||
tooltip: i18n.t(
|
||||
'Buttons:Click to show or hide segment labels when hovering with your mouse.'
|
||||
),
|
||||
commands: { commandName: 'toggleSegmentLabel' },
|
||||
evaluate: [
|
||||
'evaluate.cornerstoneTool.toggle',
|
||||
{
|
||||
name: 'evaluate.cornerstone.hasSegmentation',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
export default toolbarButtons;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user