diff --git a/Packages/ohif-cornerstone/main.js b/Packages/ohif-cornerstone/main.js index b87effb58..687a59ecb 100644 --- a/Packages/ohif-cornerstone/main.js +++ b/Packages/ohif-cornerstone/main.js @@ -1,9 +1,9 @@ import Hammer from 'hammerjs'; -import * as cornerstone from 'cornerstone-core/dist/cornerstone.js'; -import * as cornerstoneMath from 'cornerstone-math/dist/cornerstoneMath.js'; -import * as cornerstoneTools from 'cornerstone-tools/dist/cornerstoneTools.js'; -import * as cornerstoneWADOImageLoader from 'cornerstone-wado-image-loader/dist/cornerstoneWADOImageLoader.js'; -import * as dicomParser from 'dicom-parser'; // Importing from dist breaks instance reference of dicomParser.DataSet class +import cornerstone from 'cornerstone-core/dist/cornerstone.js'; +import cornerstoneMath from 'cornerstone-math/dist/cornerstoneMath.js'; +import cornerstoneTools from 'cornerstone-tools/dist/cornerstoneTools.js'; +import cornerstoneWADOImageLoader from 'cornerstone-wado-image-loader/dist/cornerstoneWADOImageLoader.js'; +import dicomParser from 'dicom-parser'; // Importing from dist breaks instance reference of dicomParser.DataSet class import * as dcmjs from 'dcmjs/build/dcmjs'; cornerstoneTools.external.Hammer = Hammer; diff --git a/Packages/ohif-viewerbase/client/components/viewer/ConnectedCornerstoneViewport.js b/Packages/ohif-viewerbase/client/components/viewer/ConnectedCornerstoneViewport.js new file mode 100644 index 000000000..265fffb7f --- /dev/null +++ b/Packages/ohif-viewerbase/client/components/viewer/ConnectedCornerstoneViewport.js @@ -0,0 +1,26 @@ +import { connect } from 'react-redux'; +import CornerstoneViewport from 'react-cornerstone-viewport'; +import { setViewportActive } from '../../lib/redux/actions.js'; + +const mapStateToProps = state => { + return { + activeViewportIndex: state.viewports.activeViewportIndex, + activeTool: state.tools.buttons.find(tool => tool.active === true).command + }; +}; + +const mapDispatchToProps = dispatch => { + return { + setViewportActive: viewportIndex => { + console.log(`setViewportActive: ${viewportIndex}`); + dispatch(setViewportActive(viewportIndex)) + } + }; +}; + +const ConnectedCornerstoneViewport = connect( + mapStateToProps, + mapDispatchToProps +)(CornerstoneViewport); + +export default ConnectedCornerstoneViewport; diff --git a/Packages/ohif-viewerbase/client/components/viewer/GridLayout/GridLayout.js b/Packages/ohif-viewerbase/client/components/viewer/GridLayout/GridLayout.js index 755bc173e..bd0b392eb 100644 --- a/Packages/ohif-viewerbase/client/components/viewer/GridLayout/GridLayout.js +++ b/Packages/ohif-viewerbase/client/components/viewer/GridLayout/GridLayout.js @@ -2,10 +2,10 @@ import { Component } from 'react'; import React from 'react'; import PropTypes from 'prop-types'; import { OHIF } from 'meteor/ohif:core'; -import CornerstoneViewport from 'react-cornerstone-viewport'; +import { cornerstone, cornerstoneTools } from 'meteor/ohif:cornerstone'; +import ConnectedCornerstoneViewport from '../ConnectedCornerstoneViewport.js'; import './GridLayout.styl'; import StackManager from '../../../lib/StackManager.js'; -import { cornerstone, cornerstoneTools } from 'meteor/ohif:cornerstone'; const TOP_CLASS = 'top'; const BOTTOM_CLASS = 'bottom'; @@ -62,7 +62,7 @@ class GridLayout extends Component { } getActiveClass(index) { - if (this.props.activeViewport === index) { + if (this.props.activeViewportIndex === index) { return 'active'; }; @@ -117,7 +117,7 @@ class GridLayout extends Component { ...data }; - return ( { window.ResizeViewportManager = window.ResizeViewportManager || new ResizeViewportManager(); @@ -21,6 +22,8 @@ Meteor.startup(() => { Session.set('OHIFViewerMainRendered', false); }); +import { connect } from 'react-redux'; + class ViewerMain extends Component { constructor(props) { super(props); @@ -60,7 +63,19 @@ class ViewerMain extends Component { } setContents(Component, props) { - const contents = (); + // TODO[react] Not sure I like this piece much + const mapStateToProps = state => { + return { + activeViewportIndex: state.viewports.activeViewportIndex, + }; + }; + + const ConnectedComponent = connect( + mapStateToProps, + null + )(Component); + + const contents = (); this.setState({ contents @@ -69,9 +84,11 @@ class ViewerMain extends Component { render() { return ( -
- {this.state.contents} -
+ +
+ {this.state.contents} +
+
); } diff --git a/Packages/ohif-viewerbase/client/lib/redux/reducers/tools.js b/Packages/ohif-viewerbase/client/lib/redux/reducers/tools.js index 1a7a653cd..626801442 100644 --- a/Packages/ohif-viewerbase/client/lib/redux/reducers/tools.js +++ b/Packages/ohif-viewerbase/client/lib/redux/reducers/tools.js @@ -18,7 +18,7 @@ const defaultButtons = [ type: 'tool', text: 'Bidirectional', svgUrl: '/icons.svg#icon-tools-measure-target', - active: true + active: false }, { command: 'StackScroll', @@ -39,7 +39,7 @@ const defaultButtons = [ type: 'tool', text: 'Manual', svgUrl: '/icons.svg#icon-tools-levels', - active: false + active: true }, { command: 'setWLPresetSoftTissue', diff --git a/Packages/ohif-viewerbase/client/lib/redux/reducers/viewports.js b/Packages/ohif-viewerbase/client/lib/redux/reducers/viewports.js index 2f8496cd4..8b591c8bd 100644 --- a/Packages/ohif-viewerbase/client/lib/redux/reducers/viewports.js +++ b/Packages/ohif-viewerbase/client/lib/redux/reducers/viewports.js @@ -1,12 +1,12 @@ const defaultState = { - activeViewport: 0 + activeViewportIndex: 0 } const viewports = (state = defaultState, action) => { console.warn(action); switch (action.type) { case 'SET_VIEWPORT_ACTIVE': - return Object.assign({}, state, { activeViewport: action.viewportIndex }); + return Object.assign({}, state, { activeViewportIndex: action.viewportIndex }); default: return state; } diff --git a/Packages/ohif-viewerbase/package.js b/Packages/ohif-viewerbase/package.js index 7bb47ffda..3d6cc4b9a 100644 --- a/Packages/ohif-viewerbase/package.js +++ b/Packages/ohif-viewerbase/package.js @@ -12,6 +12,7 @@ Npm.depends({ 'cornerstone-math': '0.1.7', 'dicom-parser': '1.8.3', 'cornerstone-wado-image-loader': '2.2.3', + 'react-redux': '6.0.0' }); Package.onUse(function(api) { diff --git a/StandaloneViewer/StandaloneViewer/client/config.js b/StandaloneViewer/StandaloneViewer/client/config.js index e99fd869d..7e2ade923 100644 --- a/StandaloneViewer/StandaloneViewer/client/config.js +++ b/StandaloneViewer/StandaloneViewer/client/config.js @@ -1,7 +1,7 @@ import { Meteor } from 'meteor/meteor'; import { OHIF } from 'meteor/ohif:core'; import { cornerstoneWADOImageLoader } from 'meteor/ohif:cornerstone'; -import * as cornerstoneWebImageLoader from 'cornerstone-web-image-loader'; +import * as cornerstoneWebImageLoader from 'cornerstone-web-image-loader'; import sha from './sha.js'; import version from './version.js'; @@ -10,22 +10,21 @@ OHIF.info = { version }; -Meteor.startup(function() { - const maxWebWorkers = Math.max(navigator.hardwareConcurrency - 1, 1); - const config = { - maxWebWorkers: maxWebWorkers, - startWebWorkersOnDemand: true, - webWorkerPath: OHIF.utils.absoluteUrl('packages/ohif_cornerstone/public/js/cornerstoneWADOImageLoaderWebWorker.es5.js'), - taskConfiguration: { - decodeTask: { - loadCodecsOnStartup: true, - initializeCodecsOnStartup: false, - codecsPath: OHIF.utils.absoluteUrl('packages/ohif_cornerstone/public/js/cornerstoneWADOImageLoaderCodecs.es5.js'), - usePDFJS: false - } +const maxWebWorkers = Math.max(navigator.hardwareConcurrency - 1, 1); +const config = { + maxWebWorkers: maxWebWorkers, + startWebWorkersOnDemand: true, + webWorkerPath: OHIF.utils.absoluteUrl('packages/ohif_cornerstone/public/js/cornerstoneWADOImageLoaderWebWorker.es5.js'), + taskConfiguration: { + decodeTask: { + loadCodecsOnStartup: true, + initializeCodecsOnStartup: false, + codecsPath: OHIF.utils.absoluteUrl('packages/ohif_cornerstone/public/js/cornerstoneWADOImageLoaderCodecs.es5.js'), + usePDFJS: false } - }; + } +}; + +cornerstoneWADOImageLoader.webWorkerManager.initialize(config); +cornerstoneWebImageLoader.external.cornerstone = cornerstone; - cornerstoneWADOImageLoader.webWorkerManager.initialize(config); - cornerstoneWebImageLoader.external.cornerstone = cornerstone; -});