2019-12-02 17:29:04 +01:00
|
|
|
import throttle from 'lodash.throttle';
|
2019-06-15 11:51:56 +02:00
|
|
|
import {
|
2019-06-17 05:11:43 +02:00
|
|
|
vtkInteractorStyleMPRCrosshairs,
|
2019-06-17 15:02:24 +02:00
|
|
|
vtkInteractorStyleMPRWindowLevel,
|
2019-10-01 22:21:31 +02:00
|
|
|
vtkInteractorStyleMPRRotate,
|
2019-06-17 14:23:03 +02:00
|
|
|
vtkSVGCrosshairsWidget,
|
2019-06-15 11:51:56 +02:00
|
|
|
} from 'react-vtkjs-viewport';
|
|
|
|
|
|
|
|
|
|
import setMPRLayout from './utils/setMPRLayout.js';
|
2019-06-17 05:11:43 +02:00
|
|
|
import setViewportToVTK from './utils/setViewportToVTK.js';
|
2019-07-18 13:39:00 +02:00
|
|
|
import Constants from 'vtk.js/Sources/Rendering/Core/VolumeMapper/Constants.js';
|
|
|
|
|
|
|
|
|
|
const { BlendMode } = Constants;
|
2019-06-15 11:51:56 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
const commandsModule = ({ commandsManager }) => {
|
|
|
|
|
// TODO: Put this somewhere else
|
|
|
|
|
let apis = {};
|
|
|
|
|
|
|
|
|
|
async function _getActiveViewportVTKApi(viewports) {
|
|
|
|
|
const {
|
|
|
|
|
numRows,
|
|
|
|
|
numColumns,
|
|
|
|
|
layout,
|
|
|
|
|
viewportSpecificData,
|
|
|
|
|
activeViewportIndex,
|
|
|
|
|
} = viewports;
|
|
|
|
|
|
|
|
|
|
const currentData = layout.viewports[activeViewportIndex];
|
|
|
|
|
if (currentData && currentData.plugin === 'vtk') {
|
|
|
|
|
// TODO: I was storing/pulling this from Redux but ran into weird issues
|
|
|
|
|
if (apis[activeViewportIndex]) {
|
|
|
|
|
return apis[activeViewportIndex];
|
|
|
|
|
}
|
2019-06-15 11:51:56 +02:00
|
|
|
}
|
|
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
const displaySet = viewportSpecificData[activeViewportIndex];
|
|
|
|
|
|
|
|
|
|
let api;
|
|
|
|
|
if (!api) {
|
|
|
|
|
try {
|
|
|
|
|
api = await setViewportToVTK(
|
|
|
|
|
displaySet,
|
|
|
|
|
activeViewportIndex,
|
|
|
|
|
numRows,
|
|
|
|
|
numColumns,
|
|
|
|
|
layout,
|
|
|
|
|
viewportSpecificData
|
|
|
|
|
);
|
|
|
|
|
} catch (error) {
|
|
|
|
|
throw new Error(error);
|
|
|
|
|
}
|
2019-06-15 11:51:56 +02:00
|
|
|
}
|
2019-12-02 17:29:04 +01:00
|
|
|
|
|
|
|
|
return api;
|
2019-06-15 11:51:56 +02:00
|
|
|
}
|
|
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
function _setView(api, sliceNormal, viewUp) {
|
|
|
|
|
const renderWindow = api.genericRenderWindow.getRenderWindow();
|
|
|
|
|
const istyle = renderWindow.getInteractor().getInteractorStyle();
|
|
|
|
|
istyle.setSliceNormal(...sliceNormal);
|
|
|
|
|
istyle.setViewUp(...viewUp);
|
2019-06-15 11:51:56 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
renderWindow.render();
|
|
|
|
|
}
|
2019-06-15 11:51:56 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
function getVOIFromCornerstoneViewport() {
|
|
|
|
|
const dom = commandsManager.runCommand('getActiveViewportEnabledElement');
|
|
|
|
|
const cornerstoneElement = cornerstone.getEnabledElement(dom);
|
2019-06-15 11:51:56 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
if (cornerstoneElement) {
|
|
|
|
|
const imageId = cornerstoneElement.image.imageId;
|
2019-06-15 11:51:56 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
const { modality } = cornerstone.metaData.get(
|
|
|
|
|
'generalSeriesModule',
|
|
|
|
|
imageId
|
|
|
|
|
);
|
2019-06-15 11:51:56 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
if (modality !== 'PT') {
|
|
|
|
|
const { windowWidth, windowCenter } = cornerstoneElement.viewport.voi;
|
2019-06-15 11:51:56 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
return {
|
|
|
|
|
windowWidth,
|
|
|
|
|
windowCenter,
|
|
|
|
|
};
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
2019-06-15 11:51:56 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
function setVOI(voi) {
|
|
|
|
|
const { windowWidth, windowCenter } = voi;
|
|
|
|
|
const lower = windowCenter - windowWidth / 2.0;
|
|
|
|
|
const upper = windowCenter + windowWidth / 2.0;
|
2019-06-15 11:51:56 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
const rgbTransferFunction = apis[0].volumes[0]
|
|
|
|
|
.getProperty()
|
|
|
|
|
.getRGBTransferFunction(0);
|
2019-06-15 11:51:56 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
rgbTransferFunction.setRange(lower, upper);
|
2019-06-15 11:51:56 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
apis.forEach(api => {
|
|
|
|
|
api.updateVOI(windowWidth, windowCenter);
|
2019-06-15 11:51:56 +02:00
|
|
|
});
|
2019-12-02 17:29:04 +01:00
|
|
|
}
|
2019-10-23 09:45:26 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
const actions = {
|
|
|
|
|
axial: async ({ viewports }) => {
|
|
|
|
|
const api = await _getActiveViewportVTKApi(viewports);
|
2019-10-23 09:45:26 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
apis[viewports.activeViewportIndex] = api;
|
2019-10-18 15:53:43 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
_setView(api, [0, 0, 1], [0, -1, 0]);
|
|
|
|
|
},
|
|
|
|
|
sagittal: async ({ viewports }) => {
|
|
|
|
|
const api = await _getActiveViewportVTKApi(viewports);
|
2019-10-23 09:45:26 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
apis[viewports.activeViewportIndex] = api;
|
2019-10-18 15:53:43 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
_setView(api, [1, 0, 0], [0, 0, 1]);
|
|
|
|
|
},
|
|
|
|
|
coronal: async ({ viewports }) => {
|
|
|
|
|
const api = await _getActiveViewportVTKApi(viewports);
|
2019-06-15 11:51:56 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
apis[viewports.activeViewportIndex] = api;
|
2019-07-18 13:39:00 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
_setView(api, [0, 1, 0], [0, 0, 1]);
|
|
|
|
|
},
|
|
|
|
|
enableRotateTool: () => {
|
|
|
|
|
apis.forEach(api => {
|
|
|
|
|
const istyle = vtkInteractorStyleMPRRotate.newInstance();
|
2019-10-01 10:06:56 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
api.setInteractorStyle({ istyle });
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
enableCrosshairsTool: () => {
|
|
|
|
|
apis.forEach((api, apiIndex) => {
|
|
|
|
|
const istyle = vtkInteractorStyleMPRCrosshairs.newInstance();
|
2019-10-18 15:53:43 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
api.setInteractorStyle({
|
|
|
|
|
istyle,
|
|
|
|
|
configuration: { apis, apiIndex },
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
enableLevelTool: () => {
|
|
|
|
|
function updateVOI(apis, windowWidth, windowCenter) {
|
|
|
|
|
apis.forEach(api => {
|
|
|
|
|
api.updateVOI(windowWidth, windowCenter);
|
|
|
|
|
});
|
2019-10-01 10:06:56 +02:00
|
|
|
}
|
|
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
const throttledUpdateVOIs = throttle(updateVOI, 16, { trailing: true }); // ~ 60 fps
|
2019-07-18 13:39:00 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
const callbacks = {
|
|
|
|
|
setOnLevelsChanged: ({ windowCenter, windowWidth }) => {
|
|
|
|
|
apis.forEach(api => {
|
|
|
|
|
const renderWindow = api.genericRenderWindow.getRenderWindow();
|
2019-07-18 13:39:00 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
renderWindow.render();
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
throttledUpdateVOIs(apis, windowWidth, windowCenter);
|
2019-10-18 11:43:23 +02:00
|
|
|
},
|
2019-12-02 17:29:04 +01:00
|
|
|
};
|
2019-10-18 11:43:23 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
apis.forEach(api => {
|
|
|
|
|
const istyle = vtkInteractorStyleMPRWindowLevel.newInstance();
|
2019-06-15 11:51:56 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
api.setInteractorStyle({ istyle, callbacks });
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
setSlabThickness: ({ slabThickness }) => {
|
|
|
|
|
apis.forEach(api => {
|
|
|
|
|
api.setSlabThickness(slabThickness);
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
changeSlabThickness: ({ change }) => {
|
|
|
|
|
apis.forEach(api => {
|
|
|
|
|
const slabThickness = Math.max(api.getSlabThickness() + change, 0.1);
|
2019-10-18 11:43:23 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
api.setSlabThickness(slabThickness);
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
setBlendModeToComposite: () => {
|
|
|
|
|
apis.forEach(api => {
|
|
|
|
|
const renderWindow = api.genericRenderWindow.getRenderWindow();
|
|
|
|
|
const istyle = renderWindow.getInteractor().getInteractorStyle();
|
2019-06-15 11:51:56 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
const slabThickness = api.getSlabThickness();
|
2019-06-15 11:51:56 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
const mapper = api.volumes[0].getMapper();
|
|
|
|
|
if (mapper.setBlendModeToComposite) {
|
|
|
|
|
mapper.setBlendModeToComposite();
|
|
|
|
|
}
|
2019-06-15 11:51:56 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
if (istyle.setSlabThickness) {
|
|
|
|
|
istyle.setSlabThickness(slabThickness);
|
|
|
|
|
}
|
|
|
|
|
renderWindow.render();
|
|
|
|
|
});
|
2019-07-18 13:39:00 +02:00
|
|
|
},
|
2019-12-02 17:29:04 +01:00
|
|
|
setBlendModeToMaximumIntensity: () => {
|
|
|
|
|
apis.forEach(api => {
|
|
|
|
|
const renderWindow = api.genericRenderWindow.getRenderWindow();
|
|
|
|
|
const mapper = api.volumes[0].getMapper();
|
|
|
|
|
if (mapper.setBlendModeToMaximumIntensity) {
|
|
|
|
|
mapper.setBlendModeToMaximumIntensity();
|
|
|
|
|
}
|
|
|
|
|
renderWindow.render();
|
|
|
|
|
});
|
2019-07-18 13:39:00 +02:00
|
|
|
},
|
2019-12-02 17:29:04 +01:00
|
|
|
setBlendMode: ({ blendMode }) => {
|
|
|
|
|
apis.forEach(api => {
|
|
|
|
|
const renderWindow = api.genericRenderWindow.getRenderWindow();
|
2019-06-15 11:51:56 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
api.volumes[0].getMapper().setBlendMode(blendMode);
|
|
|
|
|
|
|
|
|
|
renderWindow.render();
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
mpr2d: async ({ viewports }) => {
|
|
|
|
|
// TODO push a lot of this backdoor logic lower down to the library level.
|
|
|
|
|
const displaySet =
|
|
|
|
|
viewports.viewportSpecificData[viewports.activeViewportIndex];
|
|
|
|
|
|
|
|
|
|
// Get current VOI if cornerstone viewport.
|
|
|
|
|
const cornerstoneVOI = getVOIFromCornerstoneViewport();
|
|
|
|
|
|
|
|
|
|
const viewportProps = [
|
|
|
|
|
{
|
|
|
|
|
//Axial
|
|
|
|
|
orientation: {
|
|
|
|
|
sliceNormal: [0, 0, 1],
|
|
|
|
|
viewUp: [0, -1, 0],
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
// Sagital
|
|
|
|
|
orientation: {
|
|
|
|
|
sliceNormal: [1, 0, 0],
|
|
|
|
|
viewUp: [0, 0, 1],
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
// Coronal
|
|
|
|
|
orientation: {
|
|
|
|
|
sliceNormal: [0, 1, 0],
|
|
|
|
|
viewUp: [0, 0, 1],
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
];
|
2019-10-18 15:53:43 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
try {
|
|
|
|
|
apis = await setMPRLayout(displaySet, viewportProps, 1, 3);
|
|
|
|
|
} catch (error) {
|
|
|
|
|
throw new Error(error);
|
|
|
|
|
}
|
2019-10-18 15:53:43 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
if (cornerstoneVOI) {
|
|
|
|
|
setVOI(cornerstoneVOI);
|
|
|
|
|
}
|
2019-10-18 15:53:43 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
// Add widgets and set default interactorStyle of each viewport.
|
|
|
|
|
apis.forEach((api, apiIndex) => {
|
|
|
|
|
api.addSVGWidget(
|
|
|
|
|
vtkSVGCrosshairsWidget.newInstance(),
|
|
|
|
|
'crosshairsWidget'
|
|
|
|
|
);
|
2019-10-18 15:53:43 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
const istyle = vtkInteractorStyleMPRCrosshairs.newInstance();
|
2019-10-18 15:53:43 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
api.setInteractorStyle({
|
|
|
|
|
istyle,
|
|
|
|
|
configuration: { apis, apiIndex },
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
};
|
2019-10-18 15:53:43 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
window.vtkActions = actions;
|
2019-10-18 15:53:43 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
const definitions = {
|
|
|
|
|
axial: {
|
|
|
|
|
commandFn: actions.axial,
|
|
|
|
|
storeContexts: ['viewports'],
|
|
|
|
|
options: {},
|
|
|
|
|
},
|
|
|
|
|
coronal: {
|
|
|
|
|
commandFn: actions.coronal,
|
|
|
|
|
storeContexts: ['viewports'],
|
|
|
|
|
options: {},
|
|
|
|
|
},
|
|
|
|
|
sagittal: {
|
|
|
|
|
commandFn: actions.sagittal,
|
|
|
|
|
storeContexts: ['viewports'],
|
|
|
|
|
options: {},
|
|
|
|
|
},
|
|
|
|
|
enableRotateTool: {
|
|
|
|
|
commandFn: actions.enableRotateTool,
|
|
|
|
|
storeContexts: [],
|
|
|
|
|
options: {},
|
|
|
|
|
},
|
|
|
|
|
enableCrosshairsTool: {
|
|
|
|
|
commandFn: actions.enableCrosshairsTool,
|
|
|
|
|
storeContexts: [],
|
|
|
|
|
options: {},
|
|
|
|
|
},
|
|
|
|
|
enableLevelTool: {
|
|
|
|
|
commandFn: actions.enableLevelTool,
|
|
|
|
|
storeContexts: [],
|
|
|
|
|
options: {},
|
|
|
|
|
},
|
|
|
|
|
setBlendModeToComposite: {
|
|
|
|
|
commandFn: actions.setBlendModeToComposite,
|
|
|
|
|
storeContexts: [],
|
|
|
|
|
options: { blendMode: BlendMode.COMPOSITE_BLEND },
|
|
|
|
|
},
|
|
|
|
|
setBlendModeToMaximumIntensity: {
|
|
|
|
|
commandFn: actions.setBlendModeToMaximumIntensity,
|
|
|
|
|
storeContexts: [],
|
|
|
|
|
options: { blendMode: BlendMode.MAXIMUM_INTENSITY_BLEND },
|
|
|
|
|
},
|
|
|
|
|
setBlendModeToMinimumIntensity: {
|
|
|
|
|
commandFn: actions.setBlendMode,
|
|
|
|
|
storeContexts: [],
|
|
|
|
|
options: { blendMode: BlendMode.MINIMUM_INTENSITY_BLEND },
|
|
|
|
|
},
|
|
|
|
|
setBlendModeToAverageIntensity: {
|
|
|
|
|
commandFn: actions.setBlendMode,
|
|
|
|
|
storeContexts: [],
|
|
|
|
|
options: { blendMode: BlendMode.AVERAGE_INTENSITY_BLEND },
|
|
|
|
|
},
|
|
|
|
|
setSlabThickness: {
|
|
|
|
|
// TODO: How do we pass in a function argument?
|
|
|
|
|
commandFn: actions.setSlabThickness,
|
|
|
|
|
storeContexts: [],
|
|
|
|
|
options: {},
|
|
|
|
|
},
|
|
|
|
|
increaseSlabThickness: {
|
|
|
|
|
commandFn: actions.changeSlabThickness,
|
|
|
|
|
storeContexts: [],
|
|
|
|
|
options: {
|
|
|
|
|
change: 3,
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
decreaseSlabThickness: {
|
|
|
|
|
commandFn: actions.changeSlabThickness,
|
|
|
|
|
storeContexts: [],
|
|
|
|
|
options: {
|
|
|
|
|
change: -3,
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
mpr2d: {
|
|
|
|
|
commandFn: actions.mpr2d,
|
|
|
|
|
storeContexts: ['viewports'],
|
|
|
|
|
options: {},
|
|
|
|
|
context: 'VIEWER',
|
|
|
|
|
},
|
|
|
|
|
};
|
2019-10-18 15:53:43 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
return {
|
|
|
|
|
definitions,
|
|
|
|
|
defaultContext: 'ACTIVE_VIEWPORT::VTK',
|
|
|
|
|
};
|
|
|
|
|
};
|
2019-10-18 15:53:43 +02:00
|
|
|
|
2019-12-02 17:29:04 +01:00
|
|
|
export default commandsModule;
|