othmane/ohif-viewer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add support for SET_LAYOUT action on viewportGrid reducer

Browse Source
This commit is contained in:
dannyrb 2020-06-07 11:48:13 -04:00
parent 490eefdae0
commit 0573cb18e6
3 changed files with 62 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
extensions/default/src/getCommandsModule.js
View File

@ -3,15 +3,16 @@
import React from 'react'; import React from 'react';
import { useViewportGrid } from '@ohif/ui'; import { useViewportGrid } from '@ohif/ui';
function getCommandsModule({ servicesManager }) {
function getCommandsModule ({ servicesManager }) {
const { UIDialogService } = servicesManager.services; const { UIDialogService } = servicesManager.services;
const definitions = { const definitions = {
toggleLayoutSelectionDialog: { toggleLayoutSelectionDialog: {
commandFn: () => { commandFn: () => {
if (!UIDialogService) { if (!UIDialogService) {
window.alert('Unable to show dialog; no UI Dialog Service available.'); window.alert(
'Unable to show dialog; no UI Dialog Service available.'
);
return; return;
} }
@ -27,13 +28,12 @@ function getCommandsModule ({ servicesManager }) {
showOverlay: true, showOverlay: true,
content: Test, content: Test,
}); });
}, },
storeContexts: [], storeContexts: [],
options: {}, options: {},
context: 'VIEWER', context: 'VIEWER',
}, },
} };
return { return {
definitions, definitions,
@ -47,19 +47,22 @@ function Test() {
dispatch, dispatch,
] = useViewportGrid(); ] = useViewportGrid();
return <div return (
onClick={() => { <div
dispatch({ type: '', payload: { onClick={() => {
numCols: 2, dispatch({
numRows: 2, type: 'SET_LAYOUT',
activeViewportIndex: 0, payload: {
viewports: [], numCols: 2,
}}) numRows: 2,
}} },
style={{ color: 'white' }} });
> }}
Hello World! style={{ color: 'white' }}
</div> >
Hello World!
</div>
);
} }
export default getCommandsModule; export default getCommandsModule;

36
extensions/measurement-tracking/src/getCommandsModule.js
View File

@ -10,7 +10,9 @@ function getCommandsModule({ servicesManager }) {
toggleLayoutSelectionDialog: { toggleLayoutSelectionDialog: {
commandFn: () => { commandFn: () => {
if (!UIDialogService) { if (!UIDialogService) {
window.alert('Unable to show dialog; no UI Dialog Service available.'); window.alert(
'Unable to show dialog; no UI Dialog Service available.'
);
return; return;
} }
@ -26,13 +28,12 @@ function getCommandsModule({ servicesManager }) {
showOverlay: true, showOverlay: true,
content: Test, content: Test,
}); });
}, },
storeContexts: [], storeContexts: [],
options: {}, options: {},
context: 'VIEWER', context: 'VIEWER',
}, },
} };
return { return {
definitions, definitions,
@ -46,19 +47,22 @@ function Test() {
dispatch, dispatch,
] = useViewportGrid(); ] = useViewportGrid();
return <div return (
onClick={() => { <div
dispatch({ type: '', payload: { onClick={() => {
numCols: 2, dispatch({
numRows: 2, type: 'SET_LAYOUT',
activeViewportIndex: 0, payload: {
viewports: [], numCols: 2,
}}) numRows: 2,
}} },
style={{ color: 'white' }} });
> }}
Hello World! style={{ color: 'white' }}
</div> >
Hello World!
</div>
);
} }
export default getCommandsModule; export default getCommandsModule;

22
platform/viewer/src/App.jsx
View File

@ -64,13 +64,33 @@ function App({ config, defaultExtensions }) {
switch (action.type) { switch (action.type) {
case 'SET_ACTIVE_VIEWPORT_INDEX': case 'SET_ACTIVE_VIEWPORT_INDEX':
return { ...state, ...{ activeViewportIndex: action.payload } }; return { ...state, ...{ activeViewportIndex: action.payload } };
case 'SET_DISPLAYSET_FOR_VIEWPORT': case 'SET_DISPLAYSET_FOR_VIEWPORT': {
const { viewportIndex, displaySetInstanceUID } = action.payload; const { viewportIndex, displaySetInstanceUID } = action.payload;
const viewports = state.viewports.slice(); const viewports = state.viewports.slice();
viewports[viewportIndex] = { displaySetInstanceUID }; viewports[viewportIndex] = { displaySetInstanceUID };
return { ...state, ...{ viewports } }; return { ...state, ...{ viewports } };
}
case 'SET_LAYOUT': {
const { numCols, numRows } = action.payload;
const numPanes = numCols * numRows;
const viewports = state.viewports.slice();
const activeViewportIndex =
state.activeViewportIndex >= numPanes ? 0 : state.activeViewportIndex;
while (viewports.length < numPanes) {
viewports.push({});
}
while (viewports.length > numPanes) {
viewports.pop();
}
return {
...state,
...{ activeViewportIndex, numCols, numRows, viewports },
};
}
default: default:
return action.payload; return action.payload;
} }