// TODO: torn, can either bake this here; or have to create a whole new button type // Only ways that you can pass in a custom React component for render :l import { // ListMenu, WindowLevelMenuItem, } from '@ohif/ui'; import { defaults, ToolbarService } from '@ohif/core'; import type { Button } from '@ohif/core/types'; const { windowLevelPresets } = defaults; const { createButton } = ToolbarService; /** * * @param {*} preset - preset number (from above import) * @param {*} title * @param {*} subtitle */ function _createWwwcPreset(preset, title, subtitle) { return { id: preset.toString(), title, subtitle, commands: [ { commandName: 'setWindowLevel', commandOptions: { ...windowLevelPresets[preset], }, context: 'CORNERSTONE', }, ], }; } export const setToolActiveToolbar = { commandName: 'setToolActiveToolbar', commandOptions: { toolGroupIds: ['default', 'mpr', 'SRToolGroup'], }, }; const toolbarButtons: Button[] = [ { id: 'MeasurementTools', uiType: 'ohif.splitButton', props: { groupId: 'MeasurementTools', // group evaluate to determine which item should move to the top evaluate: 'evaluate.group.promoteToPrimaryIfCornerstoneToolNotActiveInTheList', primary: createButton({ id: 'Length', icon: 'tool-length', label: 'Length', tooltip: 'Length Tool', commands: setToolActiveToolbar, evaluate: 'evaluate.cornerstoneTool', }), secondary: { icon: 'chevron-down', tooltip: 'More Measure Tools', }, items: [ createButton({ id: 'Length', icon: 'tool-length', label: 'Length', tooltip: 'Length Tool', commands: setToolActiveToolbar, evaluate: 'evaluate.cornerstoneTool', }), createButton({ id: 'Bidirectional', icon: 'tool-bidirectional', label: 'Bidirectional', tooltip: 'Bidirectional Tool', commands: setToolActiveToolbar, evaluate: 'evaluate.cornerstoneTool', }), createButton({ id: 'ArrowAnnotate', icon: 'tool-annotate', label: 'Annotation', tooltip: 'Arrow Annotate', commands: setToolActiveToolbar, evaluate: 'evaluate.cornerstoneTool', }), createButton({ id: 'EllipticalROI', icon: 'tool-ellipse', label: 'Ellipse', tooltip: 'Ellipse ROI', commands: setToolActiveToolbar, evaluate: 'evaluate.cornerstoneTool', }), createButton({ id: 'CircleROI', icon: 'tool-circle', label: 'Circle', tooltip: 'Circle Tool', commands: setToolActiveToolbar, evaluate: 'evaluate.cornerstoneTool', }), createButton({ id: 'PlanarFreehandROI', icon: 'icon-tool-freehand-roi', label: 'Freehand ROI', tooltip: 'Freehand ROI', commands: setToolActiveToolbar, evaluate: 'evaluate.cornerstoneTool', }), createButton({ id: 'SplineROI', icon: 'icon-tool-spline-roi', label: 'Spline ROI', tooltip: 'Spline ROI', commands: setToolActiveToolbar, evaluate: 'evaluate.cornerstoneTool', }), createButton({ id: 'LivewireContour', icon: 'icon-tool-livewire', label: 'Livewire tool', tooltip: 'Livewire tool', commands: setToolActiveToolbar, evaluate: 'evaluate.cornerstoneTool', }), ], }, }, { id: 'Zoom', uiType: 'ohif.radioGroup', props: { icon: 'tool-zoom', label: 'Zoom', commands: setToolActiveToolbar, evaluate: 'evaluate.cornerstoneTool', }, }, // Window Level { id: 'WindowLevel', uiType: 'ohif.splitButton', props: { groupId: 'WindowLevel', primary: createButton({ id: 'WindowLevel', icon: 'tool-window-level', label: 'Window Level', tooltip: 'Window Level', commands: setToolActiveToolbar, evaluate: 'evaluate.cornerstoneTool', }), secondary: { icon: 'chevron-down', label: 'W/L Manual', tooltip: 'W/L Presets', }, renderer: WindowLevelMenuItem, items: [ _createWwwcPreset(1, 'Soft tissue', '400 / 40'), _createWwwcPreset(2, 'Lung', '1500 / -600'), _createWwwcPreset(3, 'Liver', '150 / 90'), _createWwwcPreset(4, 'Bone', '2500 / 480'), _createWwwcPreset(5, 'Brain', '80 / 40'), ], }, }, // Pan... { id: 'Pan', uiType: 'ohif.radioGroup', props: { type: 'tool', icon: 'tool-move', label: 'Pan', commands: setToolActiveToolbar, evaluate: 'evaluate.cornerstoneTool', }, }, { id: 'MPR', uiType: 'ohif.radioGroup', props: { icon: 'icon-mpr', label: 'MPR', commands: [ { commandName: 'toggleHangingProtocol', commandOptions: { protocolId: 'mpr', }, }, ], evaluate: 'evaluate.mpr', }, }, { id: 'TrackBallRotate', type: 'ohif.radioGroup', props: { type: 'tool', icon: 'tool-3d-rotate', label: '3D Rotate', commands: setToolActiveToolbar, }, }, { id: 'Capture', uiType: 'ohif.radioGroup', props: { icon: 'tool-capture', label: 'Capture', commands: 'showDownloadViewportModal', evaluate: 'evaluate.action', }, }, { id: 'Layout', uiType: 'ohif.layoutSelector', props: { rows: 3, columns: 4, evaluate: 'evaluate.action', commands: 'setViewportGridLayout', }, }, { id: 'Crosshairs', uiType: 'ohif.radioGroup', props: { type: 'tool', icon: 'tool-crosshair', label: 'Crosshairs', commands: { commandName: 'setToolActiveToolbar', commandOptions: { toolGroupIds: ['mpr'], }, }, evaluate: 'evaluate.cornerstoneTool', }, }, ]; export default toolbarButtons;