feat: Segmentations Settings UI - Phase 1 #1391 (#1392)

* Filter segs and fetch correct metadata. * Initiate seg loading logic on series load into viewport. Need to write. * Automatic consumption of SEG functional. * Pull in master. * Fix issues after pulling in master. * Clean up old segmentation handlers. * WIP * WIP * Poppulate viewport with metadata. * Show hide/segmentation in react-vtkjs-viewport. * feat: 🎸 View segmentations in vtkjs viewport * Filter segs and fetch correct metadata. * Initiate seg loading logic on series load into viewport. Need to write. * Automatic consumption of SEG functional. * Pull in master. * Fix issues after pulling in master. * Clean up old segmentation handlers. * WIP * WIP * Poppulate viewport with metadata. * Show hide/segmentation in react-vtkjs-viewport. * feat: 🎸 View segmentations in vtkjs viewport * Rebase on master. * format format format * add basic extension parts * Updated yarn lock * Fetch derived/referenced displaysets in sidepanel * Add buttons, expose seriesDescription, write notes for Danny. * Add growcut tool extention. -> Move to a seperate repo. * Change some text fields. * expose dialog provider * hide draggable area * No pointer events for now; need to revisit * Don't filter seg from the outset for now * fiddling about * fix path to series data * fix logic to determine next available labelmapindex * Ability to swtich between labelmaps * Return a promise so we can make sure our labelmap is loaded before pulling metadata * Better UI to toggle labelmaps * Fix accidental untoggle of active labelmap for ui * Remove brush tool from cornerstone extension * Add cstools in preInit for seg extension * Add buttons for seg magic * Hide the measurements panel for now * Slightly better seg/scissor icons * Add eraser * ability to switch segments * seg color / switcher * Fix vtk labelmap cache. * sidepanel should scroll if there's overflow * Use a fancier range slider * Slightly prettier buttons * Push in progress * A bit more reactive; handle no-meta * Update to vtk.js 11.14.0 and react-vtkjs-viewport 0.6.0 * chore: kickstart preview * Fix conflict issues * Refactor panel * Isolate increment functions * Wip segment table * Hide selector and add scroll to segmentation * Increase width of segment description * Hide not used items * Add new select for segmentations * Align ui * Fix default segmentation * Fix broken import test * Get measurements panel back and add spacing to grouped buttons * Hide brush and selector and refresh when switching segmentations * Add pointer events back and fix broken tests for measurement table * Update segment list when switching humbnails * CR Update: Minor UI adjustments * CR Update: Set active segment * Move components to components folder * Add new settings ui * Integrate configuration * Improve styles * Float numbers * Improve css * Refresh settings menu if side panel changed * Fix settings rendering logic and remove comments * Extract components * Remove not used tools * Remove non used extension * Use style variables and remove comments * Remove non used dep from lock * Remove tools * Remove segmentation from toolbar * Add todo and brushradius from config * Fix packagejson growcut import * Remove webpack config already defined in parent * Update package json description * Change component name to british english to us * Improve prop types * Rename cornerstone label map event * Scope css * Extract and add doc to helper * Update jsdocs for getDerivedDatasets * Add proptypes and cr updates * Update tablistitem proptypes * config is readonly, rollback destructuring * Remove event for side panel * Add jsdocs for util * Extract getimageid to studymetada * Use ohif log instead of console * Remove specific style from side panel * Fix default props for brush radius * Descructure configuration props from settings component to avoid invalid props * Update proptypes to be required (settings) * Update readme * Remove commandsmodule * Get configuration module inside the component * Set selected segment * Rename extension and use modality to filter * Fix for failing tests (#1423) * hello world * Finish rebase for Igor. * Re-fix cornerstoneTools version that got messed up in merge. * Fix reactivity of isDisabled, write implementation for the SEG panel. * Nuke yarn.lock to stack CST to 4.12.0 * Remove debugger statements. * fix: bump cornerstone-tools version to address toFixed issue * test: force tests for MISTER^MR to navigate to study directly * test: remove eraser tool test * test: count is off by one * test: don't save SR state for the time being * test: disable more tests Co-authored-by: James A. Petts <jamesapetts@gmail.com> Co-authored-by: dannyrb <danny.ri.brown@gmail.com> Co-authored-by: igoroctaviano] <igoroctaviano@users.noreply.github.com> Co-authored-by: Mirna Silva <mirna.silva@radicalimaging.com>
2020-03-13 15:45:26 -04:00
1 parent d426b78967
commit e8842cf8ae
@@ -12,6 +12,7 @@
  flex: 1;
  height: 100%;
  transition: var(--sidepanel-transition);
+  overflow-y: auto;
 }

 .from-left {
@@ -1,13 +1,16 @@
 import './ViewportGrid.css';

-import React from 'react';
+import React, { useEffect } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
+import { utils } from '@ohif/core';
 //
 import ViewportPane from './ViewportPane.js';
 import DefaultViewport from './DefaultViewport.js';
 import EmptyViewport from './EmptyViewport.js';

+const { loadAndCacheDerivedDisplaySets } = utils;
+
 const ViewportGrid = function(props) {
  const {
    activeViewportIndex,
@@ -30,6 +33,12 @@ const ViewportGrid = function(props) {
    return null;
  }

+  useEffect(() => {
+    viewportData.forEach(displaySet => {
+      loadAndCacheDerivedDisplaySets(displaySet, studies);
+    });
+  }, [viewportData]);
+
  const ViewportPanes = layout.viewports.map((layout, viewportIndex) => {
    const displaySet = viewportData[viewportIndex];

@@ -42,6 +51,8 @@ const ViewportGrid = function(props) {
      studies,
    };

+    // JAMES TODO:
+
    // Use whichever plugin is currently in use in the panel
    // unless nothing is specified. If nothing is specified
    // and the display set has a plugin specified, use that.
@@ -1,10 +1,10 @@
-import OHIF from "@ohif/core";
-import ViewerMain from "./ViewerMain";
-import { connect } from "react-redux";
+import OHIF from '@ohif/core';
+import ViewerMain from './ViewerMain';
+import { connect } from 'react-redux';

 const {
  setViewportSpecificData,
-  clearViewportSpecificData
+  clearViewportSpecificData,
 } = OHIF.redux.actions;

 const mapStateToProps = state => {
@@ -14,7 +14,7 @@ const mapStateToProps = state => {
    activeViewportIndex,
    layout,
    viewportSpecificData,
-    viewports: state.viewports
+    viewports: state.viewports,
  };
 };

@@ -25,7 +25,7 @@ const mapDispatchToProps = dispatch => {
    },
    clearViewportSpecificData: () => {
      dispatch(clearViewportSpecificData());
-    }
+    },
  };
 };

@@ -1,6 +1,6 @@
 import { connect } from 'react-redux';
 import ViewerRetrieveStudyData from './ViewerRetrieveStudyData.js';
-import OHIF from "@ohif/core";
+import OHIF from '@ohif/core';

 const { clearViewportSpecificData } = OHIF.redux.actions;
 const isActive = a => a.active === true;
@@ -55,8 +55,14 @@ class ToolbarRow extends Component {
      activeButtons: [],
    };

+    this.seriesPerStudyCount = [];
+
    this._handleBuiltIn = _handleBuiltIn.bind(this);

+    this.updateButtonGroups();
+  }
+
+  updateButtonGroups() {
    const panelModules = extensionManager.modules[MODULE_TYPES.PANEL];

    this.buttonGroups = {
@@ -106,6 +112,29 @@ class ToolbarRow extends Component {
    const activeContextsChanged =
      prevProps.activeContexts !== this.props.activeContexts;

+    const prevStudies = prevProps.studies;
+    const studies = this.props.studies;
+    const seriesPerStudyCount = this.seriesPerStudyCount;
+
+    let studiesUpdated = false;
+
+    if (prevStudies.length !== studies.length) {
+      studiesUpdated = true;
+    } else {
+      for (let i = 0; i < studies.length; i++) {
+        if (studies[i].series.length !== seriesPerStudyCount[i]) {
+          seriesPerStudyCount[i] = studies[i].series.length;
+
+          studiesUpdated = true;
+          break;
+        }
+      }
+    }
+
+    if (studiesUpdated) {
+      this.updateButtonGroups();
+    }
+
    if (activeContextsChanged) {
      this.setState({
        toolbarButtons: _getVisibleToolbarButtons.call(this),
@@ -286,14 +286,15 @@ class Viewer extends Component {
            {VisiblePanelLeft ? (
              <VisiblePanelLeft
                viewports={this.props.viewports}
+                studies={this.props.studies}
                activeIndex={this.props.activeViewportIndex}
              />
            ) : (
-              <ConnectedStudyBrowser
-                studies={this.state.thumbnails}
-                studyMetadata={this.props.studies}
-              />
-            )}
+                <ConnectedStudyBrowser
+                  studies={this.state.thumbnails}
+                  studyMetadata={this.props.studies}
+                />
+              )}
          </SidePanel>

          {/* MAIN */}
@@ -305,7 +306,9 @@ class Viewer extends Component {
          <SidePanel from="right" isOpen={this.state.isRightSidePanelOpen}>
            {VisiblePanelRight && (
              <VisiblePanelRight
+                isOpen={this.state.isRightSidePanelOpen}
                viewports={this.props.viewports}
+                studies={this.props.studies}
                activeIndex={this.props.activeViewportIndex}
              />
            )}
@@ -329,7 +332,7 @@ export default withDialog(Viewer);
 * @param {Study[]} studies
 * @param {DisplaySet[]} studies[].displaySets
 */
-const _mapStudiesToThumbnails = function(studies) {
+const _mapStudiesToThumbnails = function (studies) {
  return studies.map(study => {
    const { StudyInstanceUID } = study;

@@ -77,6 +77,7 @@ class ViewerMain extends Component {
  }

  fillEmptyViewportPanes = () => {
+    // TODO: Here is the entry point for filling viewports on load.
    const dirtyViewportPanes = [];
    const { layout, viewportSpecificData } = this.props;
    const { displaySets } = this.state;
@@ -8,6 +8,7 @@ import 'regenerator-runtime/runtime';
 import App from './App.js';
 import React from 'react';
 import ReactDOM from 'react-dom';
+// test

 /**
 * EXTENSIONS
@@ -24,6 +25,7 @@ import ReactDOM from 'react-dom';
 */
 import OHIFVTKExtension from '@ohif/extension-vtk';
 import OHIFDicomHtmlExtension from '@ohif/extension-dicom-html';
+import OHIFDicomSegmentationExtension from '@ohif/extension-dicom-segmentation';
 import OHIFDicomMicroscopyExtension from '@ohif/extension-dicom-microscopy';
 import OHIFDicomPDFExtension from '@ohif/extension-dicom-pdf';

@@ -43,6 +45,7 @@ const appProps = {
    OHIFDicomHtmlExtension,
    OHIFDicomMicroscopyExtension,
    OHIFDicomPDFExtension,
+    OHIFDicomSegmentationExtension,
  ],
 };