basic drop to set displaySet

This commit is contained in:
dannyrb 2020-05-20 01:26:44 -04:00
parent 6baeaa9619
commit 6bbe206a45
4 changed files with 57 additions and 47 deletions

View File

@ -178,7 +178,7 @@ export default class ExtensionManager {
try {
const extensionModule = getModuleFn({
getDataSources: this.getDataSources,
getDataSources: this.getDataSources, // Why pass this in if we're passing in `extensionManager`?
servicesManager: this._servicesManager,
commandsManager: this._commandsManager,
appConfig: this._appConfig,

View File

@ -46,12 +46,13 @@ export default class DisplaySetService {
);
};
getDisplaySetByUID = displaySetInstanceUid => {
// TODO: Why is this searching active, not just displaySets?
return displaySetCache.find(
/**
* @param {string} displaySetInstanceUID
* @returns {object} displaySet
*/
getDisplaySetByUID = displaySetInstanceUid => displaySetCache.find(
displaySet => displaySet.displaySetInstanceUID === displaySetInstanceUid
);
};
/**
* Broadcasts displaySetService changes.

View File

@ -20,8 +20,16 @@ function ViewerViewportGrid(props) {
// TODO -> Make a HangingProtocolService
const HangingProtocolService = displaySets => {
const displaySet = DisplaySetService.activeDisplaySets[0]
const displaySetInstanceUID = displaySet.displaySetInstanceUID;
let displaySetInstanceUID;
// Fallback
if(!displaySets || !displaySets.length) {
const displaySet = DisplaySetService.activeDisplaySets[0]
displaySetInstanceUID = displaySet.displaySetInstanceUID;
} else {
const displaySet = displaySets[0];
displaySetInstanceUID = displaySet.displaySetInstanceUID;
}
return {
numRows: 1,
@ -35,19 +43,6 @@ function ViewerViewportGrid(props) {
};
};
const handleDisplaySetSubscription = useCallback(displaySets => {
setViewportGrid(HangingProtocolService(displaySets));
});
useEffect(() => {
const { unsubscribe } = DisplaySetService.subscribe(
DisplaySetService.EVENTS.DISPLAY_SETS_ADDED,
handleDisplaySetSubscription
);
return unsubscribe;
}, []);
// From ViewportGridService and/or ContextProvider
const [viewportGrid, setViewportGrid] = useState({
numCols: 1,
@ -55,6 +50,32 @@ function ViewerViewportGrid(props) {
viewports: []
});
useEffect(() => {
const { unsubscribe } = DisplaySetService.subscribe(
DisplaySetService.EVENTS.DISPLAY_SETS_ADDED,
displaySets => {
setViewportGrid(HangingProtocolService(displaySets));
},
);
return unsubscribe;
}, []);
// TODO: either need hover to change "active viewport"
// so we can use it as our target for setting the displaySet,
// or the dropHandler needs to know which viewport was dropped on
// in event data
const onDropHandler = ({displaySetInstanceUID}) => {
const droppedDisplaySet = DisplaySetService.getDisplaySetByUID(displaySetInstanceUID);
const updatedViewportGridState = HangingProtocolService([droppedDisplaySet]);
console.warn('DROPPED: ', displaySetInstanceUID, droppedDisplaySet, updatedViewportGridState);
// This is not updating the displayed DisplaySet
setViewportGrid(updatedViewportGridState);
}
// viewportData --> displaySets
const getViewportPanes = () =>
viewportGrid.viewports.map((viewport, viewportIndex) => {
@ -65,6 +86,7 @@ function ViewerViewportGrid(props) {
const displaySet = DisplaySetService.getDisplaySetByUID(displaySetInstanceUID);
// TODO: Better Empty Viewport
if (!displaySet) {
return (
<ViewportPane
@ -72,24 +94,12 @@ function ViewerViewportGrid(props) {
className="m-1"
// Pass in as prop?
acceptDropsFor="displayset"
onDrop={droppedItem => {
console.warn('DROPPED ITEM:', droppedItem);
}}
onDrop={onDropHandler}
isActive={activeViewportIndex === viewportIndex}
/>
);
}
// if (!displaySet) {
// // TODO: Empty Viewport
// return null;
// }
// const pluginName =
// !layout.plugin && displaySet && displaySet.plugin
// ? displaySet.plugin
// : layout.plugin;
// TODO -> Need way for other viewport e.g. vtk to be used.
const ViewportComponent = _getViewportComponent(
@ -102,9 +112,7 @@ function ViewerViewportGrid(props) {
key={viewportIndex}
className="m-1"
acceptDropsFor="displayset"
onDrop={droppedItem => {
console.warn('DROPPED ITEM:', droppedItem);
}}
onDrop={onDropHandler}
isActive={activeViewportIndex === viewportIndex}
>
<ViewportComponent
@ -116,15 +124,16 @@ function ViewerViewportGrid(props) {
);
});
const ViewportPanes = React.useMemo(getViewportPanes, [
viewportComponents,
activeViewportIndex,
viewportGrid
]);
// const ViewportPanes = React.useMemo(getViewportPanes, [
// viewportComp'onents,
// activeViewportIndex,
// viewportGrid,
// ]);
return (
<ViewportGrid numRows={viewportGrid.numRows} numCols={viewportGrid.numCols}>
{ViewportPanes}
{/* {ViewportPanes} */}
{getViewportPanes()}
</ViewportGrid>
);
}

View File

@ -1,4 +1,5 @@
import React, { useEffect, useCallback } from 'react';
import { useParams } from 'react-router';
import PropTypes from 'prop-types';
//
import { ToolBarManager } from '@ohif/core';
@ -73,21 +74,19 @@ export default function ModeRoute({
route.init({ toolBarManager });
}, [mode, dataSourceName, location]);
const createDisplaySets = useCallback(() => {
// This queries for series, but... What does it do with them?
useEffect(() => {
// Add SOPClassHandlers to a new SOPClassManager.
DisplaySetService.init(extensionManager, sopClassHandlers);
const queryParams = location.search;
console.log('queryParams: ', queryParams);
// Call the data source to start building the view model?
dataSource.retrieve.series.metadata(
queryParams,
DisplaySetService.makeDisplaySets
);
}, [location]);
useEffect(() => {
createDisplaySets();
}, [mode, dataSourceName, location]);
return (
@ -98,6 +97,7 @@ export default function ModeRoute({
<DragAndDropProvider>
<LayoutComponent
{...layoutTemplateData.props}
StudyInstanceUIDs={StudyInstanceUIDs}
ViewportGridComp={ViewportGridWithDataSource}
/>
</DragAndDropProvider>