diff --git a/src/App.js b/src/App.js index cec4de83b..7d3718fd3 100644 --- a/src/App.js +++ b/src/App.js @@ -1,47 +1,47 @@ -import React, { Component } from 'react' -import { BrowserRouter as Router } from 'react-router-dom' -import { Provider } from 'react-redux' -import { createStore, combineReducers } from 'redux' -import PropTypes from 'prop-types' -import OHIF from 'ohif-core' -import './config' -import ui from './redux/ui.js' -import OHIFStandaloneViewer from './OHIFStandaloneViewer' -import WhiteLabellingContext from './WhiteLabellingContext' -import OHIFCornerstoneExtension from 'ohif-cornerstone-extension' -import OHIFVTKExtension from 'ohif-vtk-extension' -import OHIFDicomPDFExtension from 'ohif-dicom-pdf-extension' -import OHIFDicomHtmlExtension from 'ohif-dicom-html-extension' -import OHIFDicomMicroscopyExtension from 'ohif-dicom-microscopy-extension' -import { OidcProvider, reducer as oidcReducer } from 'redux-oidc' +import React, { Component } from 'react'; +import { BrowserRouter as Router } from 'react-router-dom'; +import { Provider } from 'react-redux'; +import { createStore, combineReducers } from 'redux'; +import PropTypes from 'prop-types'; +import OHIF from 'ohif-core'; +import './config'; +import ui from './redux/ui.js'; +import OHIFStandaloneViewer from './OHIFStandaloneViewer'; +import WhiteLabellingContext from './WhiteLabellingContext'; +import OHIFCornerstoneExtension from 'ohif-cornerstone-extension'; +import OHIFVTKExtension from 'ohif-vtk-extension'; +import OHIFDicomPDFExtension from 'ohif-dicom-pdf-extension'; +import OHIFDicomHtmlExtension from 'ohif-dicom-html-extension'; +import OHIFDicomMicroscopyExtension from 'ohif-dicom-microscopy-extension'; +import { OidcProvider, reducer as oidcReducer } from 'redux-oidc'; import { getDefaultToolbarButtons, getUserManagerForOpenIdConnectClient, initWebWorkers, -} from './utils/index.js' -import setupTools from './setupTools' -import ConnectedToolContextMenu from './connectedComponents/ConnectedToolContextMenu' +} from './utils/index.js'; +import setupTools from './setupTools'; +import ConnectedToolContextMenu from './connectedComponents/ConnectedToolContextMenu'; -const { ExtensionManager } = OHIF.extensions -const { reducers, localStorage } = OHIF.redux +const { ExtensionManager } = OHIF.extensions; +const { reducers, localStorage } = OHIF.redux; -reducers.ui = ui -reducers.oidc = oidcReducer +reducers.ui = ui; +reducers.oidc = oidcReducer; -const combined = combineReducers(reducers) -const store = createStore(combined, localStorage.loadState()) +const combined = combineReducers(reducers); +const store = createStore(combined, localStorage.loadState()); store.subscribe(() => { localStorage.saveState({ preferences: store.getState().preferences, - }) -}) + }); +}); -setupTools(store) +setupTools(store); const children = { viewport: [], -} +}; /** TODO: extensions should be passed in as prop as soon as we have the extensions as separate packages and then registered by ExtensionsManager */ const extensions = [ @@ -50,15 +50,15 @@ const extensions = [ new OHIFDicomPDFExtension(), new OHIFDicomHtmlExtension(), new OHIFDicomMicroscopyExtension(), -] -ExtensionManager.registerExtensions(store, extensions) +]; +ExtensionManager.registerExtensions(store, extensions); // TODO[react] Use a provider when the whole tree is React -window.store = store +window.store = store; function handleServers(servers) { if (servers) { - OHIF.utils.addServers(servers, store) + OHIF.utils.addServers(servers, store); } } @@ -69,39 +69,41 @@ class App extends Component { servers: PropTypes.object.isRequired, oidc: PropTypes.array, whiteLabelling: PropTypes.object, - } + }; static defaultProps = { whiteLabelling: {}, oidc: [], - } + }; constructor(props) { - super(props) + super(props); // - const defaultButtons = getDefaultToolbarButtons(this.props.routerBasename) - const buttonsAction = OHIF.redux.actions.setAvailableButtons(defaultButtons) + const defaultButtons = getDefaultToolbarButtons(this.props.routerBasename); + const buttonsAction = OHIF.redux.actions.setAvailableButtons( + defaultButtons + ); - store.dispatch(buttonsAction) + store.dispatch(buttonsAction); if (this.props.oidc.length) { - const firstOpenIdClient = this.props.oidc[0] + const firstOpenIdClient = this.props.oidc[0]; this.userManager = getUserManagerForOpenIdConnectClient( store, firstOpenIdClient - ) + ); } - handleServers(this.props.servers) + handleServers(this.props.servers); initWebWorkers( this.props.routerBasename, this.props.relativeWebWorkerScriptsPath - ) + ); } render() { - const userManager = this.userManager + const userManager = this.userManager; if (userManager) { return ( @@ -114,7 +116,7 @@ class App extends Component { - ) + ); } return ( @@ -125,8 +127,8 @@ class App extends Component { - ) + ); } } -export default App +export default App; diff --git a/src/CallbackPage.js b/src/CallbackPage.js index c430c6ed0..a6ba05883 100644 --- a/src/CallbackPage.js +++ b/src/CallbackPage.js @@ -6,7 +6,7 @@ import { CallbackComponent } from 'redux-oidc'; class CallbackPage extends Component { static propTypes = { userManager: PropTypes.object.isRequired, - history: PropTypes.object.isRequired + history: PropTypes.object.isRequired, }; render() { diff --git a/src/OHIFStandaloneViewer.js b/src/OHIFStandaloneViewer.js index 0a26a455d..79caae389 100644 --- a/src/OHIFStandaloneViewer.js +++ b/src/OHIFStandaloneViewer.js @@ -1,19 +1,19 @@ -import React, { Component } from 'react' -import PropTypes from 'prop-types' +import React, { Component } from 'react'; +import PropTypes from 'prop-types'; // import asyncComponent from './components/AsyncComponent.js' -import IHEInvokeImageDisplay from './routes/IHEInvokeImageDisplay.js' -import ViewerRouting from './routes/ViewerRouting.js' -import StudyListRouting from './studylist/StudyListRouting.js' -import StandaloneRouting from './routes/StandaloneRouting.js' -import CallbackPage from './CallbackPage.js' -import { withRouter } from 'react-router' -import { Route, Switch } from 'react-router-dom' -import { connect } from 'react-redux' -import { ViewerbaseDragDropContext } from 'react-viewerbase' +import IHEInvokeImageDisplay from './routes/IHEInvokeImageDisplay.js'; +import ViewerRouting from './routes/ViewerRouting.js'; +import StudyListRouting from './studylist/StudyListRouting.js'; +import StandaloneRouting from './routes/StandaloneRouting.js'; +import CallbackPage from './CallbackPage.js'; +import { withRouter } from 'react-router'; +import { Route, Switch } from 'react-router-dom'; +import { connect } from 'react-redux'; +import { ViewerbaseDragDropContext } from 'react-viewerbase'; -import './OHIFStandaloneViewer.css' -import './variables.css' -import './theme-tide.css' +import './OHIFStandaloneViewer.css'; +import './variables.css'; +import './theme-tide.css'; // Dynamic Import Routes (CodeSplitting) // const IHEInvokeImageDisplay = asyncComponent(() => @@ -29,35 +29,35 @@ import './theme-tide.css' // const CallbackPage = asyncComponent(() => import('./CallbackPage.js')) // -const reload = () => window.location.reload() +const reload = () => window.location.reload(); class OHIFStandaloneViewer extends Component { static propTypes = { history: PropTypes.object.isRequired, user: PropTypes.object, - } + }; componentDidMount() { this.unlisten = this.props.history.listen((location, action) => { if (this.props.setContext) { - this.props.setContext(window.location.pathname) + this.props.setContext(window.location.pathname); } - }) + }); } componentWillUnmount() { - this.unlisten() + this.unlisten(); } render() { - const { user, userManager } = this.props + const { user, userManager } = this.props; - const userNotLoggedIn = userManager && (!user || user.expired) + const userNotLoggedIn = userManager && (!user || user.expired); if (userNotLoggedIn) { - const pathname = this.props.location.pathname + const pathname = this.props.location.pathname; if (pathname !== '/callback') { - sessionStorage.setItem('ohif-redirect-to', pathname) + sessionStorage.setItem('ohif-redirect-to', pathname); } return ( @@ -70,13 +70,13 @@ class OHIFStandaloneViewer extends Component { /> { - userManager.signinRedirect() + userManager.signinRedirect(); - return null + return null; }} /> - ) + ); } return ( @@ -97,21 +97,21 @@ class OHIFStandaloneViewer extends Component { />
Sorry, this page does not exist.
} /> - ) + ); } } const mapStateToProps = state => { return { user: state.oidc.user, - } -} + }; +}; const ConnectedOHIFStandaloneViewer = connect( mapStateToProps, null -)(OHIFStandaloneViewer) +)(OHIFStandaloneViewer); export default ViewerbaseDragDropContext( withRouter(ConnectedOHIFStandaloneViewer) -) +); diff --git a/src/WhiteLabellingContext.js b/src/WhiteLabellingContext.js index 069bae645..345b767fc 100644 --- a/src/WhiteLabellingContext.js +++ b/src/WhiteLabellingContext.js @@ -2,7 +2,7 @@ import OHIFLogo from './components/OHIFLogo/OHIFLogo.js'; import React from 'react'; const defaultContextValues = { - logoComponent: OHIFLogo() + logoComponent: OHIFLogo(), }; const WhiteLabellingContext = React.createContext(defaultContextValues); diff --git a/src/__mocks__/cornerstone-wado-image-loader.js b/src/__mocks__/cornerstone-wado-image-loader.js index bb8a7d488..7146802aa 100644 --- a/src/__mocks__/cornerstone-wado-image-loader.js +++ b/src/__mocks__/cornerstone-wado-image-loader.js @@ -2,4 +2,4 @@ export default { webWorkerManager: { initialize: jest.fn(), }, -} +}; diff --git a/src/__mocks__/fileMock.js b/src/__mocks__/fileMock.js index f07176731..407d724d6 100644 --- a/src/__mocks__/fileMock.js +++ b/src/__mocks__/fileMock.js @@ -1,3 +1,3 @@ // https://jestjs.io/docs/en/webpack#handling-static-assets -module.exports = 'test-file-stub' +module.exports = 'test-file-stub'; diff --git a/src/__mocks__/redux-oidc.js b/src/__mocks__/redux-oidc.js index 7b5ba13a9..38033756e 100644 --- a/src/__mocks__/redux-oidc.js +++ b/src/__mocks__/redux-oidc.js @@ -1,4 +1,4 @@ -const createUserManager = () => jest.fn().mockReturnValue({}) -const loadUser = () => jest.fn() +const createUserManager = () => jest.fn().mockReturnValue({}); +const loadUser = () => jest.fn(); -export { createUserManager, loadUser } +export { createUserManager, loadUser }; diff --git a/src/__tests__/globalSetup.js b/src/__tests__/globalSetup.js index 71c10ffcd..0fecec080 100644 --- a/src/__tests__/globalSetup.js +++ b/src/__tests__/globalSetup.js @@ -1,9 +1,9 @@ -const _ = require('lodash') -const originalConsoleError = console.error +const _ = require('lodash'); +const originalConsoleError = console.error; // JSDom's CSS Parser has limited support for certain features // This supresses error warnings caused by it console.error = function(msg) { - if (_.startsWith(msg, 'Error: Could not parse CSS stylesheet')) return - originalConsoleError(msg) -} + if (_.startsWith(msg, 'Error: Could not parse CSS stylesheet')) return; + originalConsoleError(msg); +}; diff --git a/src/components/AsyncComponent.js b/src/components/AsyncComponent.js index de95a835c..e8f344a35 100644 --- a/src/components/AsyncComponent.js +++ b/src/components/AsyncComponent.js @@ -4,34 +4,34 @@ * Link: https://serverless-stack.com/chapters/code-splitting-in-create-react-app.html */ -import React, { Component } from 'react' +import React, { Component } from 'react'; export default function asyncComponent(importComponent) { class AsyncComponent extends Component { constructor(props) { - super(props) + super(props); this.state = { component: null, - } + }; } async componentDidMount() { // Add dynamically loaded component to state - const { default: component } = await importComponent() + const { default: component } = await importComponent(); this.setState({ component: component, - }) + }); } render() { - const C = this.state.component + const C = this.state.component; // Render the loaded component, or null - return C ? : null + return C ? : null; } } - return AsyncComponent + return AsyncComponent; } diff --git a/src/components/EditDescriptionDialog/EditDescriptionDialog.js b/src/components/EditDescriptionDialog/EditDescriptionDialog.js index a90fcfa19..c95cf13f8 100644 --- a/src/components/EditDescriptionDialog/EditDescriptionDialog.js +++ b/src/components/EditDescriptionDialog/EditDescriptionDialog.js @@ -1,18 +1,18 @@ -import { Component } from 'react' -import React from 'react' -import PropTypes from 'prop-types' -import SimpleDialog from '../SimpleDialog/SimpleDialog.js' +import { Component } from 'react'; +import React from 'react'; +import PropTypes from 'prop-types'; +import SimpleDialog from '../SimpleDialog/SimpleDialog.js'; -import bounding from '../../lib/utils/bounding.js' -import { getDialogStyle } from './../Labelling/labellingPositionUtils.js' +import bounding from '../../lib/utils/bounding.js'; +import { getDialogStyle } from './../Labelling/labellingPositionUtils.js'; -import './EditDescriptionDialog.css' +import './EditDescriptionDialog.css'; export default class EditDescriptionDialog extends Component { static defaultProps = { componentRef: React.createRef(), componentStyle: {}, - } + }; static propTypes = { measurementData: PropTypes.object.isRequired, @@ -20,32 +20,32 @@ export default class EditDescriptionDialog extends Component { componentRef: PropTypes.object, componentStyle: PropTypes.object, onUpdate: PropTypes.func.isRequired, - } + }; constructor(props) { - super(props) + super(props); this.state = { description: props.measurementData.description || '', - } + }; - this.mainElement = React.createRef() + this.mainElement = React.createRef(); } componentDidMount = () => { - bounding(this.mainElement) - } + bounding(this.mainElement); + }; componentDidUpdate(prevProps) { if (this.props.description !== prevProps.description) { this.setState({ description: this.props.description, - }) + }); } } render() { - const style = getDialogStyle(this.props.componentStyle) + const style = getDialogStyle(this.props.componentStyle); return ( - ) + ); } onClose = () => { - this.props.onCancel() - } + this.props.onCancel(); + }; onConfirm = () => { - this.props.onUpdate(this.state.description) - } + this.props.onUpdate(this.state.description); + }; handleChange = event => { - this.setState({ description: event.target.value }) - } + this.setState({ description: event.target.value }); + }; } diff --git a/src/components/Header/Header.js b/src/components/Header/Header.js index 779a90742..010baa830 100644 --- a/src/components/Header/Header.js +++ b/src/components/Header/Header.js @@ -11,32 +11,32 @@ class Header extends Component { home: PropTypes.bool.isRequired, location: PropTypes.object.isRequired, openUserPreferencesModal: PropTypes.func, - children: PropTypes.node + children: PropTypes.node, }; static defaultProps = { home: true, - children: OHIFLogo() + children: OHIFLogo(), }; constructor(props) { super(props); this.state = { - userPreferencesOpen: false + userPreferencesOpen: false, }; this.options = [ { title: 'Preferences ', icon: 'fa fa-user', - onClick: this.props.openUserPreferencesModal + onClick: this.props.openUserPreferencesModal, }, { title: 'About', icon: 'fa fa-info', - link: 'http://ohif.org' - } + link: 'http://ohif.org', + }, ]; } @@ -60,7 +60,7 @@ class Header extends Component { className="header-btn header-studyListLinkSection" to={{ pathname: '/', - state: { studyLink: this.props.location.pathname } + state: { studyLink: this.props.location.pathname }, }} > Study list diff --git a/src/components/Header/index.js b/src/components/Header/index.js index 7cd29d7ab..a9ce1058c 100644 --- a/src/components/Header/index.js +++ b/src/components/Header/index.js @@ -1,3 +1,3 @@ -import Header from './Header' +import Header from './Header'; -export default Header +export default Header; diff --git a/src/components/Labelling/LabellingFlow.js b/src/components/Labelling/LabellingFlow.js index de294d83a..6056df906 100644 --- a/src/components/Labelling/LabellingFlow.js +++ b/src/components/Labelling/LabellingFlow.js @@ -1,14 +1,14 @@ -import React, { Component } from 'react' -import PropTypes from 'prop-types' +import React, { Component } from 'react'; +import PropTypes from 'prop-types'; -import cloneDeep from 'lodash.clonedeep' -import bounding from '../../lib/utils/bounding.js' +import cloneDeep from 'lodash.clonedeep'; +import bounding from '../../lib/utils/bounding.js'; -import LabellingTransition from './LabellingTransition.js' -import { SelectTree } from 'react-viewerbase' -import { getAddLabelButtonStyle } from './labellingPositionUtils.js' +import LabellingTransition from './LabellingTransition.js'; +import { SelectTree } from 'react-viewerbase'; +import { getAddLabelButtonStyle } from './labellingPositionUtils.js'; -import OHIFLabellingData from './OHIFLabellingData.js' +import OHIFLabellingData from './OHIFLabellingData.js'; export default class LabellingFlow extends Component { static propTypes = { @@ -21,16 +21,16 @@ export default class LabellingFlow extends Component { skipAddLabelButton: PropTypes.bool, editLocation: PropTypes.bool, editDescription: PropTypes.bool, - } + }; constructor(props) { - super(props) + super(props); - const { location, locationLabel, description } = props.measurementData + const { location, locationLabel, description } = props.measurementData; - let style = props.componentStyle + let style = props.componentStyle; if (!props.skipAddLabelButton) { - style = getAddLabelButtonStyle(props.measurementData, props.eventData) + style = getAddLabelButtonStyle(props.measurementData, props.eventData); } this.state = { @@ -43,28 +43,28 @@ export default class LabellingFlow extends Component { componentStyle: style, confirmationState: false, displayComponent: true, - } + }; - this.mainElement = React.createRef() - this.descriptionInput = React.createRef() + this.mainElement = React.createRef(); + this.descriptionInput = React.createRef(); - this.initialItems = OHIFLabellingData - this.currentItems = cloneDeep(this.initialItems) + this.initialItems = OHIFLabellingData; + this.currentItems = cloneDeep(this.initialItems); } componentDidUpdate = () => { - this.repositionComponent() - } + this.repositionComponent(); + }; render() { - let mainElementClassName = 'labellingComponent' + let mainElementClassName = 'labellingComponent'; if (this.state.editDescription) { - mainElementClassName += ' editDescription' + mainElementClassName += ' editDescription'; } - const style = Object.assign({}, this.state.componentStyle) + const style = Object.assign({}, this.state.componentStyle); if (this.state.skipAddLabelButton) { - style.left -= 160 + style.left -= 160; } return ( @@ -82,7 +82,7 @@ export default class LabellingFlow extends Component { {this.labellingStateFragment()} - ) + ); } labellingStateFragment = () => { @@ -91,9 +91,12 @@ export default class LabellingFlow extends Component { editLocation, description, locationLabel, - } = this.state + } = this.state; - const Icons = `${window.config.routerBasename}/icons.svg`.replace('//', '/') + const Icons = `${window.config.routerBasename}/icons.svg`.replace( + '//', + '/' + ); if (!skipAddLabelButton) { return ( @@ -106,7 +109,7 @@ export default class LabellingFlow extends Component { {this.state.location ? 'Edit' : 'Add'} Label - ) + ); } else { if (editLocation) { return ( @@ -117,7 +120,7 @@ export default class LabellingFlow extends Component { selectTreeFirstTitle="Assign Label" onComponentChange={this.repositionComponent} /> - ) + ); } else { return ( <> @@ -174,53 +177,53 @@ export default class LabellingFlow extends Component { - ) + ); } } - } + }; relabel = () => { this.setState({ editLocation: true, - }) - } + }); + }; setDescriptionUpdateMode = () => { - this.descriptionInput.current.focus() + this.descriptionInput.current.focus(); this.setState({ editDescription: true, - }) - } + }); + }; descriptionCancel = () => { - const { description = '' } = cloneDeep(this.state) - this.descriptionInput.current.value = description + const { description = '' } = cloneDeep(this.state); + this.descriptionInput.current.value = description; this.setState({ editDescription: false, - }) - } + }); + }; descriptionSave = () => { - const description = this.descriptionInput.current.value - this.props.updateLabelling({ description }) + const description = this.descriptionInput.current.value; + this.props.updateLabelling({ description }); this.setState({ description, editDescription: false, - }) - } + }); + }; selectTreeSelectCalback = (event, itemSelected) => { - const location = itemSelected.value - this.props.updateLabelling({ location }) + const location = itemSelected.value; + this.props.updateLabelling({ location }); - const viewportTopPosition = this.mainElement.current.offsetParent.offsetTop + const viewportTopPosition = this.mainElement.current.offsetParent.offsetTop; const componentStyle = { top: event.nativeEvent.y - viewportTopPosition - 25, left: this.state.componentStyle.left, - } + }; this.setState({ editLocation: false, @@ -228,51 +231,51 @@ export default class LabellingFlow extends Component { location: itemSelected.value, locationLabel: itemSelected.label, componentStyle, - }) + }); if (this.isTouchScreen) { this.setTimeout = setTimeout(() => { this.setState({ displayComponent: false, - }) - }, 2000) + }); + }, 2000); } - } + }; showLabelling = () => { this.setState({ skipAddLabelButton: true, editLocation: false, - }) - } + }); + }; fadeOutAndLeave = () => { // Wait for 1 sec to dismiss the labelling component this.fadeOutTimer = setTimeout(() => { this.setState({ displayComponent: false, - }) - }, 1000) - } + }); + }, 1000); + }; fadeOutAndLeaveFast = () => { this.setState({ displayComponent: false, - }) - } + }); + }; clearFadeOutTimer = () => { if (!this.fadeOutTimer) { - return + return; } - clearTimeout(this.fadeOutTimer) - } + clearTimeout(this.fadeOutTimer); + }; repositionComponent = () => { // SetTimeout for the css animation to end. setTimeout(() => { - bounding(this.mainElement) - }, 200) - } + bounding(this.mainElement); + }, 200); + }; } diff --git a/src/components/Labelling/LabellingManager.js b/src/components/Labelling/LabellingManager.js index e293202ce..e573eb793 100644 --- a/src/components/Labelling/LabellingManager.js +++ b/src/components/Labelling/LabellingManager.js @@ -1,12 +1,12 @@ -import React, { Component } from 'react' -import PropTypes from 'prop-types' +import React, { Component } from 'react'; +import PropTypes from 'prop-types'; -import cloneDeep from 'lodash.clonedeep' +import cloneDeep from 'lodash.clonedeep'; -import EditDescriptionDialog from './../EditDescriptionDialog/EditDescriptionDialog.js' -import LabellingFlow from './LabellingFlow.js' +import EditDescriptionDialog from './../EditDescriptionDialog/EditDescriptionDialog.js'; +import LabellingFlow from './LabellingFlow.js'; -import './LabellingManager.css' +import './LabellingManager.css'; export default class LabellingManager extends Component { static propTypes = { @@ -20,24 +20,24 @@ export default class LabellingManager extends Component { editLocation: PropTypes.bool, editDescription: PropTypes.bool, editDescriptionOnDialog: PropTypes.bool, - } + }; static defaultProps = { skipAddLabelButton: false, editLocation: false, editDescription: false, editDescriptionOnDialog: false, - } + }; constructor(props) { - super(props) + super(props); - const measurementData = cloneDeep(props.measurementData) - this.treatMeasurementData(measurementData) + const measurementData = cloneDeep(props.measurementData); + this.treatMeasurementData(measurementData); - let editLocation = props.editLocation + let editLocation = props.editLocation; if (!props.editDescription && !props.editLocation) { - editLocation = true + editLocation = true; } this.state = { @@ -47,19 +47,19 @@ export default class LabellingManager extends Component { editDescription: props.editDescription, editDescriptionOnDialog: props.editDescriptionOnDialog, measurementData: measurementData, - } + }; } componentDidMount = () => { - document.addEventListener('touchstart', this.onTouchStart) - } + document.addEventListener('touchstart', this.onTouchStart); + }; componentWillUnmount = () => { - document.removeEventListener('touchstart', this.onTouchStart) - } + document.removeEventListener('touchstart', this.onTouchStart); + }; render() { - return this.getRenderComponent() + return this.getRenderComponent(); } getRenderComponent = () => { @@ -68,7 +68,7 @@ export default class LabellingManager extends Component { editDescription, editDescriptionOnDialog, measurementData, - } = this.state + } = this.state; if (editDescriptionOnDialog) { return ( @@ -79,7 +79,7 @@ export default class LabellingManager extends Component { componentStyle={this.state.componentStyle} measurementData={measurementData} /> - ) + ); } if (editLocation || editDescription) { @@ -88,43 +88,43 @@ export default class LabellingManager extends Component { {...this.props} componentStyle={this.state.componentStyle} /> - ) + ); } - } + }; treatMeasurementData = measurementData => { - const { editDescription, editLocation } = this.props + const { editDescription, editLocation } = this.props; if (editDescription) { - measurementData.description = undefined + measurementData.description = undefined; } if (editLocation) { - measurementData.location = undefined + measurementData.location = undefined; } - } + }; responseDialogUpdate = response => { this.props.updateLabelling({ response, - }) - this.props.labellingDoneCallback() - } + }); + this.props.labellingDoneCallback(); + }; descriptionDialogUpdate = description => { this.props.updateLabelling({ description, - }) - this.props.labellingDoneCallback() - } + }); + this.props.labellingDoneCallback(); + }; } function getComponentPosition(eventData) { const { event: { clientX: left, clientY: top }, - } = eventData + } = eventData; return { left, top, - } + }; } diff --git a/src/components/Labelling/LabellingTransition.js b/src/components/Labelling/LabellingTransition.js index dbba1702d..9c33e4696 100644 --- a/src/components/Labelling/LabellingTransition.js +++ b/src/components/Labelling/LabellingTransition.js @@ -1,20 +1,20 @@ -import React, { Component } from 'react' -import PropTypes from 'prop-types' -import { CSSTransition } from 'react-transition-group' +import React, { Component } from 'react'; +import PropTypes from 'prop-types'; +import { CSSTransition } from 'react-transition-group'; -import './LabellingTransition.css' +import './LabellingTransition.css'; // If these variables changes, CSS must be updated -const transitionDuration = 500 -const transitionClassName = 'labelling' -const transitionOnAppear = true +const transitionDuration = 500; +const transitionClassName = 'labelling'; +const transitionOnAppear = true; export default class LabellingTransition extends Component { static propTypes = { children: PropTypes.node.isRequired, displayComponent: PropTypes.bool.isRequired, onTransitionExit: PropTypes.func.isRequired, - } + }; render() { return ( {this.props.children} - ) + ); } } diff --git a/src/components/Labelling/OHIFLabellingData.js b/src/components/Labelling/OHIFLabellingData.js index 060caa78a..f4ef49de9 100644 --- a/src/components/Labelling/OHIFLabellingData.js +++ b/src/components/Labelling/OHIFLabellingData.js @@ -27,13 +27,13 @@ const items = [ 'Spleen', 'Stomach', 'Subcutaneous', -] +]; const OHIFLabellingData = items.map(item => { return { label: item, value: item, - } -}) + }; +}); -export default OHIFLabellingData +export default OHIFLabellingData; diff --git a/src/components/Labelling/labellingPositionUtils.js b/src/components/Labelling/labellingPositionUtils.js index 50fdc8e0a..f581791f7 100644 --- a/src/components/Labelling/labellingPositionUtils.js +++ b/src/components/Labelling/labellingPositionUtils.js @@ -1,53 +1,53 @@ -import cornerstone from 'cornerstone-core' +import cornerstone from 'cornerstone-core'; const buttonSize = { width: 96, height: 28, -} +}; export function getAddLabelButtonStyle(measurementData, eventData) { - const { start, end } = measurementData.handles - const { client } = eventData.currentPoints - const clientStart = cornerstone.pixelToCanvas(eventData.element, start) - const clientEnd = cornerstone.pixelToCanvas(eventData.element, end) - const canvasOffSetLeft = client.x - clientStart.x - const canvasOffSetTop = client.y - clientStart.y + const { start, end } = measurementData.handles; + const { client } = eventData.currentPoints; + const clientStart = cornerstone.pixelToCanvas(eventData.element, start); + const clientEnd = cornerstone.pixelToCanvas(eventData.element, end); + const canvasOffSetLeft = client.x - clientStart.x; + const canvasOffSetTop = client.y - clientStart.y; const position = { left: clientEnd.x + canvasOffSetLeft, top: clientEnd.y + canvasOffSetTop, - } + }; if (start.y > end.y) { - position.top -= buttonSize.height + position.top -= buttonSize.height; } if (start.x > end.x) { - position.left -= buttonSize.width + position.left -= buttonSize.width; } - return position + return position; } export function getDialogStyle(componentStyle) { - const style = Object.assign({}, componentStyle) + const style = Object.assign({}, componentStyle); const dialogProps = { width: 320, height: 230, - } + }; // Get max values to avoid position out of the screen - const maxLeft = window.innerWidth - dialogProps.width - const maxTop = window.innerHeight - dialogProps.height + const maxLeft = window.innerWidth - dialogProps.width; + const maxTop = window.innerHeight - dialogProps.height; // Positioning the dialog with its center on the click event - style.left -= dialogProps.width / 2 - style.top -= dialogProps.height / 2 + style.left -= dialogProps.width / 2; + style.top -= dialogProps.height / 2; if (style.left > maxLeft) { - style.left = maxLeft + style.left = maxLeft; } if (style.top > maxTop) { - style.top = maxTop + style.top = maxTop; } - return style + return style; } diff --git a/src/components/OHIFLogo/OHIFLogo.js b/src/components/OHIFLogo/OHIFLogo.js index 08d60eadd..4126f6de0 100644 --- a/src/components/OHIFLogo/OHIFLogo.js +++ b/src/components/OHIFLogo/OHIFLogo.js @@ -1,7 +1,7 @@ -import React from 'react' -import './OHIFLogo.css' +import React from 'react'; +import './OHIFLogo.css'; -const Icons = `${window.config.routerBasename}/icons.svg`.replace('//', '/') +const Icons = `${window.config.routerBasename}/icons.svg`.replace('//', '/'); function OHIFLogo() { return ( @@ -16,7 +16,7 @@ function OHIFLogo() {
Open Health Imaging Foundation
- ) + ); } -export default OHIFLogo +export default OHIFLogo; diff --git a/src/components/SimpleDialog/SimpleDialog.js b/src/components/SimpleDialog/SimpleDialog.js index 3cb54fe89..aca228cc2 100644 --- a/src/components/SimpleDialog/SimpleDialog.js +++ b/src/components/SimpleDialog/SimpleDialog.js @@ -1,14 +1,14 @@ -import { Component } from 'react' -import React from 'react' -import PropTypes from 'prop-types' +import { Component } from 'react'; +import React from 'react'; +import PropTypes from 'prop-types'; -import './SimpleDialog.css' +import './SimpleDialog.css'; class SimpleDialog extends Component { static defaultProps = { componentStyle: {}, rootClass: '', - } + }; render() { return ( @@ -43,7 +43,7 @@ class SimpleDialog extends Component { - ) + ); } } @@ -51,6 +51,6 @@ SimpleDialog.propTypes = { headerTitle: PropTypes.string.isRequired, onClose: PropTypes.func.isRequired, onConfirm: PropTypes.func.isRequired, -} +}; -export default SimpleDialog +export default SimpleDialog; diff --git a/src/components/StudyLoadingMonitor.js b/src/components/StudyLoadingMonitor.js index f449a1b28..dc88be5d6 100644 --- a/src/components/StudyLoadingMonitor.js +++ b/src/components/StudyLoadingMonitor.js @@ -1,43 +1,42 @@ -import { Component } from "react"; -import PropTypes from "prop-types"; +import { Component } from 'react'; +import PropTypes from 'prop-types'; import OHIF from 'ohif-core'; class StudyLoadingMonitor extends Component { - static propTypes = { - studies: PropTypes.array.isRequired, - setStudyLoadingProgress: PropTypes.func.isRequired, - clearStudyLoadingProgress: PropTypes.func.isRequired, + static propTypes = { + studies: PropTypes.array.isRequired, + setStudyLoadingProgress: PropTypes.func.isRequired, + clearStudyLoadingProgress: PropTypes.func.isRequired, + }; + + componentDidMount() { + // TODO: This is pretty ugly. The thing is that the StudyLoadingListener + // needs to update the Redux store, but shouldn't know that it exists. + // I am therefore passing in some functions to update the store instead, + // but this should definitely be cleaned up somehow. + const options = { + _setProgressData: (progressId, progressData) => { + this.props.setStudyLoadingProgress(progressId, progressData); + }, + _clearProgressById: progressId => { + this.props.clearStudyLoadingProgress(progressId); + }, }; - componentDidMount() { - // TODO: This is pretty ugly. The thing is that the StudyLoadingListener - // needs to update the Redux store, but shouldn't know that it exists. - // I am therefore passing in some functions to update the store instead, - // but this should definitely be cleaned up somehow. - const options = { - _setProgressData: (progressId, progressData) => { - this.props.setStudyLoadingProgress(progressId, progressData) - }, - _clearProgressById: (progressId) => { - this.props.clearStudyLoadingProgress(progressId) - } - } + const { StudyLoadingListener } = OHIF.classes; + this.studyLoadingListener = StudyLoadingListener.getInstance(options); + this.studyLoadingListener.clear(); + this.studyLoadingListener.addStudies(this.props.studies); + } - const { StudyLoadingListener } = OHIF.classes; - this.studyLoadingListener = StudyLoadingListener.getInstance(options); - this.studyLoadingListener.clear(); - this.studyLoadingListener.addStudies(this.props.studies); - } + render() { + return null; + } - render() { - return null; - } - - componentWillUnmount() { - // Destroy stack loading listeners when we close the viewer - this.studyLoadingListener.clear(); - } + componentWillUnmount() { + // Destroy stack loading listeners when we close the viewer + this.studyLoadingListener.clear(); + } } - export default StudyLoadingMonitor; diff --git a/src/components/StudyPrefetcher.js b/src/components/StudyPrefetcher.js index e568ce51b..5ce8015f2 100644 --- a/src/components/StudyPrefetcher.js +++ b/src/components/StudyPrefetcher.js @@ -1,30 +1,29 @@ -import { Component } from "react"; -import PropTypes from "prop-types"; +import { Component } from 'react'; +import PropTypes from 'prop-types'; import OHIF from 'ohif-core'; const { StudyPrefetcher } = OHIF.classes; class StudyPrefetcherComponent extends Component { - static propTypes = { - studies: PropTypes.array, - }; + static propTypes = { + studies: PropTypes.array, + }; - componentDidMount() { - const { studies } = this.props; + componentDidMount() { + const { studies } = this.props; - this.studyPrefetcher = StudyPrefetcher.getInstance(); - this.studyPrefetcher.setStudies(studies); - } + this.studyPrefetcher = StudyPrefetcher.getInstance(); + this.studyPrefetcher.setStudies(studies); + } - render() { - return null; - } + render() { + return null; + } - componentWillUnmount() { - // Stop prefetching when we close the viewer - this.studyPrefetcher.destroy(); - } + componentWillUnmount() { + // Stop prefetching when we close the viewer + this.studyPrefetcher.destroy(); + } } - export default StudyPrefetcherComponent; diff --git a/src/config.js b/src/config.js index 8385e7ead..cd1bd8bec 100644 --- a/src/config.js +++ b/src/config.js @@ -1,37 +1,37 @@ -import dicomParser from 'dicom-parser' -import cornerstone from 'cornerstone-core' -import cornerstoneWADOImageLoader from 'cornerstone-wado-image-loader' -import OHIF from 'ohif-core' -import version from './version.js' +import dicomParser from 'dicom-parser'; +import cornerstone from 'cornerstone-core'; +import cornerstoneWADOImageLoader from 'cornerstone-wado-image-loader'; +import OHIF from 'ohif-core'; +import version from './version.js'; window.info = { version, homepage: `${process.env.PUBLIC_URL}`, -} +}; // For debugging -window.cornerstone = cornerstone -window.cornerstoneWADOImageLoader = cornerstoneWADOImageLoader +window.cornerstone = cornerstone; +window.cornerstoneWADOImageLoader = cornerstoneWADOImageLoader; -cornerstoneWADOImageLoader.external.cornerstone = cornerstone -cornerstoneWADOImageLoader.external.dicomParser = dicomParser +cornerstoneWADOImageLoader.external.cornerstone = cornerstone; +cornerstoneWADOImageLoader.external.dicomParser = dicomParser; OHIF.user.getAccessToken = () => { // TODO: Get the Redux store from somewhere else - const state = window.store.getState() + const state = window.store.getState(); if (!state.oidc || !state.oidc.user) { - return + return; } - return state.oidc.user.access_token -} + return state.oidc.user.access_token; +}; cornerstoneWADOImageLoader.configure({ beforeSend: function(xhr) { - const headers = OHIF.DICOMWeb.getAuthorizationHeader() + const headers = OHIF.DICOMWeb.getAuthorizationHeader(); if (headers.Authorization) { - xhr.setRequestHeader('Authorization', headers.Authorization) + xhr.setRequestHeader('Authorization', headers.Authorization); } }, -}) +}); diff --git a/src/connectedComponents/ConnectedFlexboxLayout.js b/src/connectedComponents/ConnectedFlexboxLayout.js index f76393c97..75a20c8b3 100644 --- a/src/connectedComponents/ConnectedFlexboxLayout.js +++ b/src/connectedComponents/ConnectedFlexboxLayout.js @@ -2,15 +2,15 @@ import { connect } from 'react-redux'; import FlexboxLayout from './FlexboxLayout'; const mapStateToProps = state => { - return { - leftSidebarOpen: state.ui.leftSidebarOpen, - rightSidebarOpen: state.ui.rightSidebarOpen, - }; + return { + leftSidebarOpen: state.ui.leftSidebarOpen, + rightSidebarOpen: state.ui.rightSidebarOpen, + }; }; const ConnectedFlexboxLayout = connect( - mapStateToProps, - null + mapStateToProps, + null )(FlexboxLayout); export default ConnectedFlexboxLayout; diff --git a/src/connectedComponents/ConnectedHeader.js b/src/connectedComponents/ConnectedHeader.js index 22ca6a279..f07576589 100644 --- a/src/connectedComponents/ConnectedHeader.js +++ b/src/connectedComponents/ConnectedHeader.js @@ -4,7 +4,7 @@ import { setUserPreferencesModalOpen } from '../redux/actions.js'; const mapStateToProps = state => { return { - isOpen: state.ui.userPreferencesModalOpen + isOpen: state.ui.userPreferencesModalOpen, }; }; @@ -12,7 +12,7 @@ const mapDispatchToProps = dispatch => { return { openUserPreferencesModal: () => { dispatch(setUserPreferencesModalOpen(true)); - } + }, }; }; diff --git a/src/connectedComponents/ConnectedLabellingOverlay.js b/src/connectedComponents/ConnectedLabellingOverlay.js index dd2a728f1..0354e1159 100644 --- a/src/connectedComponents/ConnectedLabellingOverlay.js +++ b/src/connectedComponents/ConnectedLabellingOverlay.js @@ -1,24 +1,24 @@ -import { connect } from 'react-redux' -import LabellingOverlay from './LabellingOverlay' +import { connect } from 'react-redux'; +import LabellingOverlay from './LabellingOverlay'; const mapStateToProps = state => { if (!state.ui || !state.ui.labelling) { return { visible: false, - } + }; } - const labellingFlowData = state.ui.labelling + const labellingFlowData = state.ui.labelling; return { visible: false, ...labellingFlowData, - } -} + }; +}; const ConnectedLabellingOverlay = connect( mapStateToProps, null -)(LabellingOverlay) +)(LabellingOverlay); -export default ConnectedLabellingOverlay +export default ConnectedLabellingOverlay; diff --git a/src/connectedComponents/ConnectedLayoutButton.js b/src/connectedComponents/ConnectedLayoutButton.js index 5e12c9f25..461740a3b 100644 --- a/src/connectedComponents/ConnectedLayoutButton.js +++ b/src/connectedComponents/ConnectedLayoutButton.js @@ -1,41 +1,41 @@ import { connect } from 'react-redux'; import { LayoutButton } from 'react-viewerbase'; -import OHIF from 'ohif-core' +import OHIF from 'ohif-core'; const { setLayout } = OHIF.redux.actions; const mapStateToProps = state => { - return { - currentLayout: state.viewports.layout, - }; + return { + currentLayout: state.viewports.layout, + }; }; const mapDispatchToProps = dispatch => { - return { - // TODO: Change if layout switched becomes more complex - onChange: selectedCell => { - let viewports = []; - const rows = selectedCell.row + 1; - const columns = selectedCell.col + 1; - const numViewports = rows * columns; - for (let i = 0; i < numViewports; i++) { - viewports.push({ - height: `${100 / rows}%`, - width: `${100 / columns}%` - }); - } - const layout = { - viewports - }; + return { + // TODO: Change if layout switched becomes more complex + onChange: selectedCell => { + let viewports = []; + const rows = selectedCell.row + 1; + const columns = selectedCell.col + 1; + const numViewports = rows * columns; + for (let i = 0; i < numViewports; i++) { + viewports.push({ + height: `${100 / rows}%`, + width: `${100 / columns}%`, + }); + } + const layout = { + viewports, + }; - dispatch(setLayout(layout)) - } - }; + dispatch(setLayout(layout)); + }, + }; }; const ConnectedLayoutButton = connect( - mapStateToProps, - mapDispatchToProps + mapStateToProps, + mapDispatchToProps )(LayoutButton); export default ConnectedLayoutButton; diff --git a/src/connectedComponents/ConnectedLayoutManager.js b/src/connectedComponents/ConnectedLayoutManager.js index 4a0b5dd2b..d18605ac1 100644 --- a/src/connectedComponents/ConnectedLayoutManager.js +++ b/src/connectedComponents/ConnectedLayoutManager.js @@ -27,7 +27,7 @@ const mapStateToProps = state => { layout: state.viewports.layout, activeViewportIndex: state.viewports.activeViewportIndex, availablePlugins, - defaultPlugin + defaultPlugin, }; }; diff --git a/src/connectedComponents/ConnectedMeasurementTable.js b/src/connectedComponents/ConnectedMeasurementTable.js index c18b0858f..9f47aefeb 100644 --- a/src/connectedComponents/ConnectedMeasurementTable.js +++ b/src/connectedComponents/ConnectedMeasurementTable.js @@ -1,41 +1,41 @@ -import { connect } from 'react-redux' -import { MeasurementTable } from 'react-viewerbase' -import OHIF from 'ohif-core' -import moment from 'moment' -import cornerstone from 'cornerstone-core' -import jumpToRowItem from '../lib/jumpToRowItem.js' -import getMeasurementLocationCallback from '../lib/getMeasurementLocationCallback' +import { connect } from 'react-redux'; +import { MeasurementTable } from 'react-viewerbase'; +import OHIF from 'ohif-core'; +import moment from 'moment'; +import cornerstone from 'cornerstone-core'; +import jumpToRowItem from '../lib/jumpToRowItem.js'; +import getMeasurementLocationCallback from '../lib/getMeasurementLocationCallback'; -const { setViewportSpecificData } = OHIF.redux.actions -const { MeasurementApi } = OHIF.measurements +const { setViewportSpecificData } = OHIF.redux.actions; +const { MeasurementApi } = OHIF.measurements; function groupBy(list, props) { return list.reduce((a, b) => { - ;(a[b[props]] = a[b[props]] || []).push(b) - return a - }, {}) + (a[b[props]] = a[b[props]] || []).push(b); + return a; + }, {}); } function getAllTools() { - const config = OHIF.measurements.MeasurementApi.getConfiguration() - let tools = [] + const config = OHIF.measurements.MeasurementApi.getConfiguration(); + let tools = []; config.measurementTools.forEach( toolGroup => (tools = tools.concat(toolGroup.childTools)) - ) + ); - return tools + return tools; } function getMeasurementText(measurementData) { - const { location, description } = measurementData - let text = '...' + const { location, description } = measurementData; + let text = '...'; if (location) { - text = location + text = location; if (description) { - text += `(${description})` + text += `(${description})`; } } - return text + return text; } function getDataForEachMeasurementNumber( @@ -43,54 +43,54 @@ function getDataForEachMeasurementNumber( timepoints, displayFunction ) { - const data = [] + const data = []; // on each measurement number we should get each measurement data by available timepoint measurementNumberList.forEach(measurement => { timepoints.forEach(timepoint => { const eachData = { displayText: '...', - } + }; if (measurement.timepointId === timepoint.timepointId) { - eachData.displayText = displayFunction(measurement) + eachData.displayText = displayFunction(measurement); } - data.push(eachData) - }) - }) + data.push(eachData); + }); + }); - return data + return data; } function convertMeasurementsToTableData(toolCollections, timepoints) { - const config = OHIF.measurements.MeasurementApi.getConfiguration() - const toolGroups = config.measurementTools - const tools = getAllTools() + const config = OHIF.measurements.MeasurementApi.getConfiguration(); + const toolGroups = config.measurementTools; + const tools = getAllTools(); const tableMeasurements = toolGroups.map(toolGroup => { return { groupName: toolGroup.name, groupId: toolGroup.id, measurements: [], - } - }) + }; + }); Object.keys(toolCollections).forEach(toolId => { - const toolMeasurements = toolCollections[toolId] - const tool = tools.find(tool => tool.id === toolId) - const { displayFunction } = tool.options.measurementTable + const toolMeasurements = toolCollections[toolId]; + const tool = tools.find(tool => tool.id === toolId); + const { displayFunction } = tool.options.measurementTable; // Group by measurementNumber so we can display then all in the same line - const groupedMeasurements = groupBy(toolMeasurements, 'measurementNumber') + const groupedMeasurements = groupBy(toolMeasurements, 'measurementNumber'); Object.keys(groupedMeasurements).forEach(groupedMeasurementsIndex => { const measurementNumberList = - groupedMeasurements[groupedMeasurementsIndex] - const measurementData = measurementNumberList[0] + groupedMeasurements[groupedMeasurementsIndex]; + const measurementData = measurementNumberList[0]; const { measurementNumber, lesionNamingNumber, toolType, - } = measurementData - const measurementId = measurementData._id + } = measurementData; + const measurementId = measurementData._id; //check if all measurements with same measurementNumber will have same LABEL const tableMeasurement = { @@ -109,30 +109,30 @@ function convertMeasurementsToTableData(toolCollections, timepoints) { timepoints, displayFunction ), - } + }; // find the group object for the tool const toolGroupMeasurements = tableMeasurements.find(group => { - return group.groupId === tool.toolGroup - }) + return group.groupId === tool.toolGroup; + }); // inject the new measurement for this measurementNumer - toolGroupMeasurements.measurements.push(tableMeasurement) - }) - }) + toolGroupMeasurements.measurements.push(tableMeasurement); + }); + }); // Sort measurements by lesion naming number tableMeasurements.forEach(tm => { tm.measurements.sort((m1, m2) => m1.lesionNamingNumber > m2.lesionNamingNumber ? 1 : -1 - ) - }) + ); + }); - return tableMeasurements + return tableMeasurements; } function convertTimepointsToTableData(timepoints) { if (!timepoints || !timepoints.length) { - return [] + return []; } return [ @@ -140,11 +140,11 @@ function convertTimepointsToTableData(timepoints) { label: 'Study date:', date: moment(timepoints[0].latestDate).format('DD-MMM-YY'), }, - ] + ]; } const mapStateToProps = state => { - const { timepoints, measurements } = state.timepointManager + const { timepoints, measurements } = state.timepointManager; return { timepoints: convertTimepointsToTableData(timepoints), measurementCollection: convertMeasurementsToTableData( @@ -153,22 +153,22 @@ const mapStateToProps = state => { ), timepointManager: state.timepointManager, viewports: state.viewports, - } -} + }; +}; const mapDispatchToProps = dispatch => { return { dispatchRelabel: (event, measurementData, viewportsState) => { const activeViewportIndex = - (viewportsState && viewportsState.activeViewportIndex) || 0 + (viewportsState && viewportsState.activeViewportIndex) || 0; - const enabledElements = cornerstone.getEnabledElements() + const enabledElements = cornerstone.getEnabledElements(); if (!enabledElements || enabledElements.length <= activeViewportIndex) { - OHIF.log.error('Failed to find the enabled element') - return + OHIF.log.error('Failed to find the enabled element'); + return; } - const { element } = enabledElements[activeViewportIndex] + const { element } = enabledElements[activeViewportIndex]; const eventData = { event: { @@ -176,33 +176,33 @@ const mapDispatchToProps = dispatch => { clientY: event.clientY, }, element, - } + }; - const { toolType, measurementId } = measurementData + const { toolType, measurementId } = measurementData; const tool = MeasurementApi.Instance.tools[toolType].find(measurement => { - return measurement._id === measurementId - }) + return measurement._id === measurementId; + }); const options = { skipAddLabelButton: true, editLocation: true, - } + }; // Clone the tool not to set empty location initially - const toolForLocation = Object.assign({}, tool, { location: null }) - getMeasurementLocationCallback(eventData, toolForLocation, options) + const toolForLocation = Object.assign({}, tool, { location: null }); + getMeasurementLocationCallback(eventData, toolForLocation, options); }, dispatchEditDescription: (event, measurementData, viewportsState) => { const activeViewportIndex = - (viewportsState && viewportsState.activeViewportIndex) || 0 + (viewportsState && viewportsState.activeViewportIndex) || 0; - const enabledElements = cornerstone.getEnabledElements() + const enabledElements = cornerstone.getEnabledElements(); if (!enabledElements || enabledElements.length <= activeViewportIndex) { - OHIF.log.error('Failed to find the enabled element') - return + OHIF.log.error('Failed to find the enabled element'); + return; } - const { element } = enabledElements[activeViewportIndex] + const { element } = enabledElements[activeViewportIndex]; const eventData = { event: { @@ -210,18 +210,18 @@ const mapDispatchToProps = dispatch => { clientY: event.clientY, }, element, - } + }; - const { toolType, measurementId } = measurementData + const { toolType, measurementId } = measurementData; const tool = MeasurementApi.Instance.tools[toolType].find(measurement => { - return measurement._id === measurementId - }) + return measurement._id === measurementId; + }); const options = { editDescriptionOnDialog: true, - } + }; - getMeasurementLocationCallback(eventData, tool, options) + getMeasurementLocationCallback(eventData, tool, options); }, dispatchJumpToRowItem: ( measurementData, @@ -235,40 +235,40 @@ const mapDispatchToProps = dispatch => { timepointManagerState, dispatch, options - ) + ); actionData.viewportSpecificData.forEach(viewportSpecificData => { - const { viewportIndex, displaySet } = viewportSpecificData + const { viewportIndex, displaySet } = viewportSpecificData; - dispatch(setViewportSpecificData(viewportIndex, displaySet)) - }) + dispatch(setViewportSpecificData(viewportIndex, displaySet)); + }); - const { toolType, measurementNumber } = measurementData - const measurementApi = MeasurementApi.Instance + const { toolType, measurementNumber } = measurementData; + const measurementApi = MeasurementApi.Instance; Object.keys(measurementApi.tools).forEach(toolType => { - const measurements = measurementApi.tools[toolType] + const measurements = measurementApi.tools[toolType]; measurements.forEach(measurement => { - measurement.active = false - }) - }) + measurement.active = false; + }); + }); const measurementsToActive = measurementApi.tools[toolType].filter( measurement => { - return measurement.measurementNumber === measurementNumber + return measurement.measurementNumber === measurementNumber; } - ) + ); measurementsToActive.forEach(measurementToActive => { - measurementToActive.active = true - }) + measurementToActive.active = true; + }); - measurementApi.syncMeasurementsAndToolData() + measurementApi.syncMeasurementsAndToolData(); cornerstone.getEnabledElements().forEach(enabledElement => { - cornerstone.updateImage(enabledElement.element) - }) + cornerstone.updateImage(enabledElement.element); + }); // Needs to update viewports.layout state to set layout //const layout = actionData.layout; @@ -284,8 +284,8 @@ const mapDispatchToProps = dispatch => { // (later): Needs to set some property on state.extensions.cornerstone to synchronize viewport scrolling }, - } -} + }; +}; const mergeProps = (propsFromState, propsFromDispatch, ownProps) => { return { @@ -298,37 +298,37 @@ const mergeProps = (propsFromState, propsFromDispatch, ownProps) => { // TODO: Tooltype should be on the level below? This should // provide the entire row item? - const viewportsState = propsFromState.viewports - const timepointManagerState = propsFromState.timepointManager + const viewportsState = propsFromState.viewports; + const timepointManagerState = propsFromState.timepointManager; // TODO: invertViewportTimepointsOrder should be stored in / read from user preferences // TODO: childToolKey should come from the measurement table when it supports child tools const options = { invertViewportTimepointsOrder: false, childToolKey: null, - } + }; propsFromDispatch.dispatchJumpToRowItem( measurementData, viewportsState, timepointManagerState, options - ) + ); }, onRelabelClick: (event, measurementData) => { - const viewportsState = propsFromState.viewports - propsFromDispatch.dispatchRelabel(event, measurementData, viewportsState) + const viewportsState = propsFromState.viewports; + propsFromDispatch.dispatchRelabel(event, measurementData, viewportsState); }, onEditDescriptionClick: (event, measurementData) => { - const viewportsState = propsFromState.viewports + const viewportsState = propsFromState.viewports; propsFromDispatch.dispatchEditDescription( event, measurementData, viewportsState - ) + ); }, onDeleteClick: (event, measurementData) => { - const { MeasurementHandlers } = OHIF.measurements + const { MeasurementHandlers } = OHIF.measurements; MeasurementHandlers.onRemoved({ detail: { @@ -339,15 +339,15 @@ const mergeProps = (propsFromState, propsFromDispatch, ownProps) => { measurementNumber: measurementData.measurementNumber, }, }, - }) + }); }, - } -} + }; +}; const ConnectedMeasurementTable = connect( mapStateToProps, mapDispatchToProps, mergeProps -)(MeasurementTable) +)(MeasurementTable); -export default ConnectedMeasurementTable +export default ConnectedMeasurementTable; diff --git a/src/connectedComponents/ConnectedPluginSwitch.js b/src/connectedComponents/ConnectedPluginSwitch.js index 1b22767a4..9d99e4e62 100644 --- a/src/connectedComponents/ConnectedPluginSwitch.js +++ b/src/connectedComponents/ConnectedPluginSwitch.js @@ -1,42 +1,42 @@ -import { connect } from 'react-redux' -import PluginSwitch from './PluginSwitch.js' -import OHIF from 'ohif-core' +import { connect } from 'react-redux'; +import PluginSwitch from './PluginSwitch.js'; +import OHIF from 'ohif-core'; -const { setLayout } = OHIF.redux.actions +const { setLayout } = OHIF.redux.actions; const mapStateToProps = state => { - const { activeViewportIndex, layout } = state.viewports + const { activeViewportIndex, layout } = state.viewports; return { activeViewportIndex, layout, - } -} + }; +}; const mapDispatchToProps = dispatch => { return { setLayout: data => { - dispatch(setLayout(data)) + dispatch(setLayout(data)); }, - } -} + }; +}; function setSingleLayoutData(originalArray, viewportIndex, data) { - const viewports = originalArray.slice() - const layoutData = Object.assign({}, viewports[viewportIndex], data) + const viewports = originalArray.slice(); + const layoutData = Object.assign({}, viewports[viewportIndex], data); - viewports[viewportIndex] = layoutData + viewports[viewportIndex] = layoutData; - return viewports + return viewports; } const mergeProps = (propsFromState, propsFromDispatch, ownProps) => { - const { activeViewportIndex, layout } = propsFromState - const { setLayout } = propsFromDispatch + const { activeViewportIndex, layout } = propsFromState; + const { setLayout } = propsFromDispatch; // TODO: Do not display certain options if the current display set // cannot be displayed using these view types - const Icons = `${window.config.routerBasename}/icons.svg`.replace('//', '/') + const Icons = `${window.config.routerBasename}/icons.svg`.replace('//', '/'); const buttons = [ { text: 'Acquired', @@ -44,15 +44,15 @@ const mergeProps = (propsFromState, propsFromDispatch, ownProps) => { iconClasses: 'fa fa-bars', active: false, onClick: click => { - console.warn('Original Acquisition') + console.warn('Original Acquisition'); const layoutData = setSingleLayoutData( layout.viewports, activeViewportIndex, { plugin: 'cornerstone' } - ) + ); - setLayout({ viewports: layoutData }) + setLayout({ viewports: layoutData }); }, }, { @@ -61,22 +61,22 @@ const mergeProps = (propsFromState, propsFromDispatch, ownProps) => { svgClasses: 'icon-rotate-120', active: false, onClick: click => { - console.warn('Axial') + console.warn('Axial'); const data = { plugin: 'vtk', vtk: { mode: 'mpr', sliceNormal: [0, 0, 1], }, - } + }; const layoutData = setSingleLayoutData( layout.viewports, activeViewportIndex, data - ) + ); - setLayout({ viewports: layoutData }) + setLayout({ viewports: layoutData }); }, }, { @@ -84,22 +84,22 @@ const mergeProps = (propsFromState, propsFromDispatch, ownProps) => { svgUrl: `${Icons}#cube`, active: false, onClick: click => { - console.warn('Sagittal') + console.warn('Sagittal'); const data = { plugin: 'vtk', vtk: { mode: 'mpr', sliceNormal: [1, 0, 0], }, - } + }; const layoutData = setSingleLayoutData( layout.viewports, activeViewportIndex, data - ) + ); - setLayout({ viewports: layoutData }) + setLayout({ viewports: layoutData }); }, }, { @@ -108,22 +108,22 @@ const mergeProps = (propsFromState, propsFromDispatch, ownProps) => { svgClasses: 'fa-rotate-90 fa-flip-horizontal', active: false, onClick: click => { - console.warn('Coronal') + console.warn('Coronal'); const data = { plugin: 'vtk', vtk: { mode: 'mpr', sliceNormal: [0, 1, 0], }, - } + }; const layoutData = setSingleLayoutData( layout.viewports, activeViewportIndex, data - ) + ); - setLayout({ viewports: layoutData }) + setLayout({ viewports: layoutData }); }, }, /*{ @@ -143,17 +143,17 @@ const mergeProps = (propsFromState, propsFromDispatch, ownProps) => { setLayout({ viewports: layoutData }); } }*/ - ] + ]; return { buttons, - } -} + }; +}; const ConnectedPluginSwitch = connect( mapStateToProps, mapDispatchToProps, mergeProps -)(PluginSwitch) +)(PluginSwitch); -export default ConnectedPluginSwitch +export default ConnectedPluginSwitch; diff --git a/src/connectedComponents/ConnectedStudyBrowser.js b/src/connectedComponents/ConnectedStudyBrowser.js index b19ad8815..d8a30ee47 100644 --- a/src/connectedComponents/ConnectedStudyBrowser.js +++ b/src/connectedComponents/ConnectedStudyBrowser.js @@ -6,35 +6,35 @@ import cloneDeep from 'lodash.clonedeep'; // - Determine in which display set is active from Redux (activeViewportIndex and layout viewportData) // - Pass in errors and stack loading progress from Redux const mapStateToProps = (state, ownProps) => { - // If we know that the stack loading progress details have changed, - // we can try to update the component state so that the thumbnail - // progress bar is updated - const stackLoadingProgressMap = state.loading.progress; - const studiesWithLoadingData = cloneDeep(ownProps.studies); + // If we know that the stack loading progress details have changed, + // we can try to update the component state so that the thumbnail + // progress bar is updated + const stackLoadingProgressMap = state.loading.progress; + const studiesWithLoadingData = cloneDeep(ownProps.studies); - studiesWithLoadingData.forEach(study => { - study.thumbnails.forEach(data => { - const { displaySetInstanceUid } = data - const stackId = `StackProgress:${displaySetInstanceUid}`; - const stackProgressData = stackLoadingProgressMap[stackId]; + studiesWithLoadingData.forEach(study => { + study.thumbnails.forEach(data => { + const { displaySetInstanceUid } = data; + const stackId = `StackProgress:${displaySetInstanceUid}`; + const stackProgressData = stackLoadingProgressMap[stackId]; - let stackPercentComplete = 0; - if (stackProgressData) { - stackPercentComplete = stackProgressData.percentComplete; - } + let stackPercentComplete = 0; + if (stackProgressData) { + stackPercentComplete = stackProgressData.percentComplete; + } - data.stackPercentComplete = stackPercentComplete; - }) + data.stackPercentComplete = stackPercentComplete; }); + }); - return { - studies: studiesWithLoadingData - }; + return { + studies: studiesWithLoadingData, + }; }; const ConnectedStudyBrowser = connect( - mapStateToProps, - null + mapStateToProps, + null )(StudyBrowser); export default ConnectedStudyBrowser; diff --git a/src/connectedComponents/ConnectedStudyLoadingMonitor.js b/src/connectedComponents/ConnectedStudyLoadingMonitor.js index 7156f711d..ba4153903 100644 --- a/src/connectedComponents/ConnectedStudyLoadingMonitor.js +++ b/src/connectedComponents/ConnectedStudyLoadingMonitor.js @@ -1,23 +1,26 @@ import { connect } from 'react-redux'; import StudyLoadingMonitor from '../components/StudyLoadingMonitor.js'; -import OHIF from 'ohif-core' +import OHIF from 'ohif-core'; -const { setStudyLoadingProgress, clearStudyLoadingProgress } = OHIF.redux.actions; +const { + setStudyLoadingProgress, + clearStudyLoadingProgress, +} = OHIF.redux.actions; const mapDispatchToProps = dispatch => { - return { - setStudyLoadingProgress: (progressId, progressData) => { - dispatch(setStudyLoadingProgress(progressId, progressData)) - }, - clearStudyLoadingProgress: progressId => { - dispatch(clearStudyLoadingProgress(progressId)) - } - }; + return { + setStudyLoadingProgress: (progressId, progressData) => { + dispatch(setStudyLoadingProgress(progressId, progressData)); + }, + clearStudyLoadingProgress: progressId => { + dispatch(clearStudyLoadingProgress(progressId)); + }, + }; }; const ConnectedStudyLoadingMonitor = connect( - null, - mapDispatchToProps + null, + mapDispatchToProps )(StudyLoadingMonitor); export default ConnectedStudyLoadingMonitor; diff --git a/src/connectedComponents/ConnectedToolContextMenu.js b/src/connectedComponents/ConnectedToolContextMenu.js index 429ea347d..3080f358a 100644 --- a/src/connectedComponents/ConnectedToolContextMenu.js +++ b/src/connectedComponents/ConnectedToolContextMenu.js @@ -1,34 +1,34 @@ -import { connect } from 'react-redux' -import ToolContextMenu from './ToolContextMenu' +import { connect } from 'react-redux'; +import ToolContextMenu from './ToolContextMenu'; const mapStateToProps = (state, ownProps) => { if (!state.ui || !state.ui.contextMenu) { return { visible: false, - } + }; } - const { viewportIndex } = ownProps - const toolContextMenuData = state.ui.contextMenu[viewportIndex] - let availableTools + const { viewportIndex } = ownProps; + const toolContextMenuData = state.ui.contextMenu[viewportIndex]; + let availableTools; if ( state.extensions && state.extensions.cornerstone && state.extensions.cornerstone.availableTools ) { - availableTools = state.extensions.cornerstone.availableTools + availableTools = state.extensions.cornerstone.availableTools; } return { ...toolContextMenuData, availableTools, - } -} + }; +}; const ConnectedToolContextMenu = connect( mapStateToProps, null -)(ToolContextMenu) +)(ToolContextMenu); -export default ConnectedToolContextMenu +export default ConnectedToolContextMenu; diff --git a/src/connectedComponents/ConnectedToolbarRow.js b/src/connectedComponents/ConnectedToolbarRow.js index 66a3ecde0..58ca7b087 100644 --- a/src/connectedComponents/ConnectedToolbarRow.js +++ b/src/connectedComponents/ConnectedToolbarRow.js @@ -5,34 +5,38 @@ import { setLeftSidebarOpen, setRightSidebarOpen } from '../redux/actions.js'; const defaultPlugin = 'cornerstone'; const mapStateToProps = state => { - const { layout, viewportSpecificData, activeViewportIndex } = state.viewports; - const pluginInLayout = layout.viewports[activeViewportIndex] && layout.viewports[activeViewportIndex].plugin; - const pluginInViewportData = viewportSpecificData[activeViewportIndex] && viewportSpecificData[activeViewportIndex].plugin; - const pluginInActiveViewport = pluginInLayout || pluginInViewportData || defaultPlugin; - // const extensionData = state.extensions[pluginInActiveViewport]; + const { layout, viewportSpecificData, activeViewportIndex } = state.viewports; + const pluginInLayout = + layout.viewports[activeViewportIndex] && + layout.viewports[activeViewportIndex].plugin; + const pluginInViewportData = + viewportSpecificData[activeViewportIndex] && + viewportSpecificData[activeViewportIndex].plugin; + const pluginInActiveViewport = + pluginInLayout || pluginInViewportData || defaultPlugin; + // const extensionData = state.extensions[pluginInActiveViewport]; - return { - pluginId: pluginInActiveViewport, - leftSidebarOpen: state.ui.leftSidebarOpen, - rightSidebarOpen: state.ui.rightSidebarOpen - }; + return { + pluginId: pluginInActiveViewport, + leftSidebarOpen: state.ui.leftSidebarOpen, + rightSidebarOpen: state.ui.rightSidebarOpen, + }; }; - const mapDispatchToProps = dispatch => { - return { - setLeftSidebarOpen: state => { - dispatch(setLeftSidebarOpen(state)) - }, - setRightSidebarOpen: state => { - dispatch(setRightSidebarOpen(state)) - } - }; + return { + setLeftSidebarOpen: state => { + dispatch(setLeftSidebarOpen(state)); + }, + setRightSidebarOpen: state => { + dispatch(setRightSidebarOpen(state)); + }, + }; }; const ConnectedToolbarRow = connect( - mapStateToProps, - mapDispatchToProps + mapStateToProps, + mapDispatchToProps )(ToolbarRow); export default ConnectedToolbarRow; diff --git a/src/connectedComponents/ConnectedToolbarSection.js b/src/connectedComponents/ConnectedToolbarSection.js index d2d5163bc..dc0f73bbc 100644 --- a/src/connectedComponents/ConnectedToolbarSection.js +++ b/src/connectedComponents/ConnectedToolbarSection.js @@ -1,29 +1,29 @@ import { connect } from 'react-redux'; import { ToolbarSection } from 'react-viewerbase'; -import OHIF from 'ohif-core' +import OHIF from 'ohif-core'; const { setToolActive } = OHIF.redux.actions; const mapStateToProps = state => { - const activeButton = state.tools.buttons.find(tool => tool.active === true); + const activeButton = state.tools.buttons.find(tool => tool.active === true); - return { - buttons: state.tools.buttons, - activeCommand: activeButton && activeButton.command - }; + return { + buttons: state.tools.buttons, + activeCommand: activeButton && activeButton.command, + }; }; const mapDispatchToProps = dispatch => { - return { - setToolActive: tool => { - dispatch(setToolActive(tool.command)) - } - }; + return { + setToolActive: tool => { + dispatch(setToolActive(tool.command)); + }, + }; }; const ConnectedToolbarSection = connect( - mapStateToProps, - mapDispatchToProps + mapStateToProps, + mapDispatchToProps )(ToolbarSection); export default ConnectedToolbarSection; diff --git a/src/connectedComponents/ConnectedUserPreferencesModal.js b/src/connectedComponents/ConnectedUserPreferencesModal.js index 62ef43432..8d55b0ccd 100644 --- a/src/connectedComponents/ConnectedUserPreferencesModal.js +++ b/src/connectedComponents/ConnectedUserPreferencesModal.js @@ -15,7 +15,7 @@ const mapStateToProps = state => { : {}, hotKeysData: state.preferences[contextName] ? state.preferences[contextName].hotKeysData - : {} + : {}, }; }; @@ -36,7 +36,7 @@ const mapDispatchToProps = dispatch => { dispatch(setUserPreferences()); dispatch(setUserPreferencesModalOpen(false)); OHIF.hotkeysUtil.setHotkeys(); - } + }, }; }; diff --git a/src/connectedComponents/ConnectedViewer.js b/src/connectedComponents/ConnectedViewer.js index 8dffc1c9f..11ce68723 100644 --- a/src/connectedComponents/ConnectedViewer.js +++ b/src/connectedComponents/ConnectedViewer.js @@ -11,7 +11,7 @@ const mapDispatchToProps = dispatch => { }, onMeasurementsUpdated: measurements => { dispatch(setMeasurements(measurements)); - } + }, }; }; diff --git a/src/connectedComponents/ConnectedViewerMain.js b/src/connectedComponents/ConnectedViewerMain.js index 4a021e407..69dc37260 100644 --- a/src/connectedComponents/ConnectedViewerMain.js +++ b/src/connectedComponents/ConnectedViewerMain.js @@ -1,44 +1,44 @@ -import { connect } from 'react-redux' -import ViewerMain from './ViewerMain' -import OHIF from 'ohif-core' +import { connect } from 'react-redux'; +import ViewerMain from './ViewerMain'; +import OHIF from 'ohif-core'; const { setViewportSpecificData, clearViewportSpecificData, setToolActive, setActiveViewportSpecificData, -} = OHIF.redux.actions +} = OHIF.redux.actions; const mapStateToProps = state => { - const { activeViewportIndex, layout, viewportSpecificData } = state.viewports + const { activeViewportIndex, layout, viewportSpecificData } = state.viewports; return { activeViewportIndex, layout, viewportSpecificData, - } -} + }; +}; const mapDispatchToProps = dispatch => { return { setViewportSpecificData: (viewportIndex, data) => { - dispatch(setViewportSpecificData(viewportIndex, data)) + dispatch(setViewportSpecificData(viewportIndex, data)); }, clearViewportSpecificData: () => { - dispatch(clearViewportSpecificData()) + dispatch(clearViewportSpecificData()); }, setToolActive: tool => { - dispatch(setToolActive(tool)) + dispatch(setToolActive(tool)); }, setActiveViewportSpecificData: viewport => { - dispatch(setActiveViewportSpecificData(viewport)) + dispatch(setActiveViewportSpecificData(viewport)); }, - } -} + }; +}; const ConnectedViewerMain = connect( mapStateToProps, mapDispatchToProps -)(ViewerMain) +)(ViewerMain); -export default ConnectedViewerMain +export default ConnectedViewerMain; diff --git a/src/connectedComponents/ConnectedViewerRetrieveStudyData.js b/src/connectedComponents/ConnectedViewerRetrieveStudyData.js index 7dd57437b..4ecb33438 100644 --- a/src/connectedComponents/ConnectedViewerRetrieveStudyData.js +++ b/src/connectedComponents/ConnectedViewerRetrieveStudyData.js @@ -1,19 +1,19 @@ -import { connect } from 'react-redux' -import ViewerRetrieveStudyData from './ViewerRetrieveStudyData.js' +import { connect } from 'react-redux'; +import ViewerRetrieveStudyData from './ViewerRetrieveStudyData.js'; -const isActive = a => a.active === true +const isActive = a => a.active === true; const mapStateToProps = state => { - const activeServer = state.servers.servers.find(isActive) + const activeServer = state.servers.servers.find(isActive); return { server: activeServer, - } -} + }; +}; const ConnectedViewerRetrieveStudyData = connect( mapStateToProps, null -)(ViewerRetrieveStudyData) +)(ViewerRetrieveStudyData); -export default ConnectedViewerRetrieveStudyData +export default ConnectedViewerRetrieveStudyData; diff --git a/src/connectedComponents/FlexboxLayout.js b/src/connectedComponents/FlexboxLayout.js index 6e826b8fe..e4dc47617 100644 --- a/src/connectedComponents/FlexboxLayout.js +++ b/src/connectedComponents/FlexboxLayout.js @@ -1,38 +1,38 @@ -import React, { Component } from 'react' -import PropTypes from 'prop-types' -import ConnectedStudyBrowser from './ConnectedStudyBrowser.js' -import ConnectedViewerMain from './ConnectedViewerMain.js' -import ConnectedMeasurementTable from './ConnectedMeasurementTable' -import './FlexboxLayout.css' +import React, { Component } from 'react'; +import PropTypes from 'prop-types'; +import ConnectedStudyBrowser from './ConnectedStudyBrowser.js'; +import ConnectedViewerMain from './ConnectedViewerMain.js'; +import ConnectedMeasurementTable from './ConnectedMeasurementTable'; +import './FlexboxLayout.css'; class FlexboxLayout extends Component { static propTypes = { studies: PropTypes.array.isRequired, leftSidebarOpen: PropTypes.bool.isRequired, rightSidebarOpen: PropTypes.bool.isRequired, - } + }; state = { studiesForBrowser: [], - } + }; componentDidMount() { - const studiesForBrowser = this.getStudiesForBrowser() + const studiesForBrowser = this.getStudiesForBrowser(); this.setState({ studiesForBrowser, - }) + }); } getStudiesForBrowser = () => { - const { studies } = this.props + const { studies } = this.props; // TODO[react]: // - Add sorting of display sets // - Add useMiddleSeriesInstanceAsThumbnail // - Add showStackLoadingProgressBar option return studies.map(study => { - const { studyInstanceUid } = study + const { studyInstanceUid } = study; const thumbnails = study.displaySets.map(displaySet => { const { @@ -41,12 +41,12 @@ class FlexboxLayout extends Component { seriesNumber, instanceNumber, numImageFrames, - } = displaySet + } = displaySet; - let imageId + let imageId; if (displaySet.images && displaySet.images.length) { - imageId = displaySet.images[0].getImageId() + imageId = displaySet.images[0].getImageId(); } return { @@ -56,24 +56,24 @@ class FlexboxLayout extends Component { seriesNumber, instanceNumber, numImageFrames, - } - }) + }; + }); return { studyInstanceUid, thumbnails, - } - }) - } + }; + }); + }; render() { - let mainContentClassName = 'main-content' + let mainContentClassName = 'main-content'; if (this.props.leftSidebarOpen) { - mainContentClassName += ' sidebar-left-open' + mainContentClassName += ' sidebar-left-open'; } if (this.props.rightSidebarOpen) { - mainContentClassName += ' sidebar-right-open' + mainContentClassName += ' sidebar-right-open'; } // TODO[react]: Make ConnectedMeasurementTable extension with state.timepointManager @@ -101,8 +101,8 @@ class FlexboxLayout extends Component { - ) + ); } } -export default FlexboxLayout +export default FlexboxLayout; diff --git a/src/connectedComponents/LabellingOverlay.js b/src/connectedComponents/LabellingOverlay.js index 564e35f73..cf976424a 100644 --- a/src/connectedComponents/LabellingOverlay.js +++ b/src/connectedComponents/LabellingOverlay.js @@ -1,23 +1,23 @@ -import React, { Component } from 'react' -import PropTypes from 'prop-types' -import LabellingManager from '../components/Labelling/LabellingManager' +import React, { Component } from 'react'; +import PropTypes from 'prop-types'; +import LabellingManager from '../components/Labelling/LabellingManager'; class LabellingOverlay extends Component { static propTypes = { visible: PropTypes.bool.isRequired, - } + }; static defaultProps = { visible: false, - } + }; render() { if (!this.props.visible) { - return null + return null; } - return + return ; } } -export default LabellingOverlay +export default LabellingOverlay; diff --git a/src/connectedComponents/PluginSwitch.js b/src/connectedComponents/PluginSwitch.js index c6ec21123..12debb48a 100644 --- a/src/connectedComponents/PluginSwitch.js +++ b/src/connectedComponents/PluginSwitch.js @@ -5,7 +5,7 @@ import './PluginSwitch.css'; class PluginSwitch extends Component { static propTypes = { - buttons: PropTypes.array + buttons: PropTypes.array, }; static defaultProps = {}; diff --git a/src/connectedComponents/ToolContextMenu.js b/src/connectedComponents/ToolContextMenu.js index 923f303ee..312f9ca72 100644 --- a/src/connectedComponents/ToolContextMenu.js +++ b/src/connectedComponents/ToolContextMenu.js @@ -1,10 +1,10 @@ -import React, { Component } from 'react' -import PropTypes from 'prop-types' -import cornerstone from 'cornerstone-core' -import cornerstoneTools from 'cornerstone-tools' -import getMeasurementLocationCallback from '../lib/getMeasurementLocationCallback' +import React, { Component } from 'react'; +import PropTypes from 'prop-types'; +import cornerstone from 'cornerstone-core'; +import cornerstoneTools from 'cornerstone-tools'; +import getMeasurementLocationCallback from '../lib/getMeasurementLocationCallback'; -import './ToolContextMenu.css' +import './ToolContextMenu.css'; const toolTypes = [ 'Angle', @@ -14,87 +14,87 @@ const toolTypes = [ 'EllipticalRoi', 'CircleRoi', 'RectangleRoi', -] +]; let defaultDropdownItems = [ { actionType: 'Delete', action: ({ nearbyToolData, eventData }) => { - const element = eventData.element + const element = eventData.element; cornerstoneTools.removeToolState( element, nearbyToolData.toolType, nearbyToolData.tool - ) - cornerstone.updateImage(element) + ); + cornerstone.updateImage(element); }, }, { actionType: 'setLabel', action: ({ nearbyToolData, eventData }) => { - const { tool } = nearbyToolData + const { tool } = nearbyToolData; const options = { skipAddLabelButton: true, editLocation: true, - } + }; - getMeasurementLocationCallback(eventData, tool, options) + getMeasurementLocationCallback(eventData, tool, options); }, }, { actionType: 'setDescription', action: ({ nearbyToolData, eventData }) => { - const { tool } = nearbyToolData + const { tool } = nearbyToolData; const options = { editDescriptionOnDialog: true, - } + }; - getMeasurementLocationCallback(eventData, tool, options) + getMeasurementLocationCallback(eventData, tool, options); }, }, -] +]; function getNearbyToolData(element, coords, toolTypes) { - const nearbyTool = {} - let pointNearTool = false + const nearbyTool = {}; + let pointNearTool = false; toolTypes.forEach(toolType => { - const toolData = cornerstoneTools.getToolState(element, toolType) + const toolData = cornerstoneTools.getToolState(element, toolType); if (!toolData) { - return + return; } toolData.data.forEach(function(data, index) { // TODO: Fix this, it's ugly - let toolInterface = cornerstoneTools.getToolForElement(element, toolType) + let toolInterface = cornerstoneTools.getToolForElement(element, toolType); if (!toolInterface) { toolInterface = cornerstoneTools.getToolForElement( element, `${toolType}Tool` - ) + ); } if (!toolInterface) { - throw new Error('Tool not found.') + throw new Error('Tool not found.'); } if (toolInterface.pointNearTool(element, data, coords)) { - pointNearTool = true - nearbyTool.tool = data - nearbyTool.index = index - nearbyTool.toolType = toolType + pointNearTool = true; + nearbyTool.tool = data; + nearbyTool.index = index; + nearbyTool.toolType = toolType; } - }) + }); if (pointNearTool) { - return false + return false; } - }) + }); - return pointNearTool ? nearbyTool : undefined + return pointNearTool ? nearbyTool : undefined; } function getDropdownItems(eventData, isTouchEvent = false, availableTools) { @@ -103,7 +103,7 @@ function getDropdownItems(eventData, isTouchEvent = false, availableTools) { eventData.currentPoints.canvas, toolTypes, availableTools - ) + ); // Annotate tools for touch events already have a press handle to edit it, has a better UX for deleting it if ( @@ -111,36 +111,36 @@ function getDropdownItems(eventData, isTouchEvent = false, availableTools) { nearbyToolData && nearbyToolData.toolType === 'arrowAnnotate' ) { - return + return; } - let dropdownItems = [] + let dropdownItems = []; if (nearbyToolData) { defaultDropdownItems.forEach(function(item) { item.params = { eventData, nearbyToolData, - } + }; if (item.actionType === 'Delete') { - item.text = 'Delete measurement' + item.text = 'Delete measurement'; } if (item.actionType === 'setLabel') { - item.text = 'Relabel' + item.text = 'Relabel'; } if (item.actionType === 'setDescription') { item.text = `${ nearbyToolData.tool.description ? 'Edit' : 'Add' - } Description` + } Description`; } - dropdownItems.push(item) - }) + dropdownItems.push(item); + }); } - return dropdownItems + return dropdownItems; } class ToolContextMenu extends Component { @@ -150,43 +150,43 @@ class ToolContextMenu extends Component { onClose: PropTypes.func, availableTools: PropTypes.array, visible: PropTypes.bool.isRequired, - } + }; static defaultProps = { visible: true, isTouchEvent: false, - } + }; constructor(props) { - super(props) + super(props); - this.mainElement = React.createRef() + this.mainElement = React.createRef(); } render() { if (!this.props.eventData) { - return null + return null; } - const { isTouchEvent, eventData, availableTools } = this.props + const { isTouchEvent, eventData, availableTools } = this.props; const dropdownItems = getDropdownItems( eventData, isTouchEvent, availableTools - ) + ); // Skip if there is no dropdown item if (!dropdownItems.length) { - return '' + return ''; } const dropdownComponents = dropdownItems.map(item => { const itemOnClick = event => { - item.action(item.params) + item.action(item.params); if (this.props.onClose) { - this.props.onClose() + this.props.onClose(); } - } + }; return (
  • @@ -194,32 +194,32 @@ class ToolContextMenu extends Component { {item.text}
    • - ) - }) + ); + }); const position = { top: `${eventData.currentPoints.canvas.y}px`, left: `${eventData.currentPoints.canvas.x}px`, - } + }; return (
      {dropdownComponents}
    - ) + ); } componentDidMount = () => { if (this.mainElement.current) { - this.updateElementPosition() + this.updateElementPosition(); } - } + }; componentDidUpdate = () => { if (this.mainElement.current) { - this.updateElementPosition() + this.updateElementPosition(); } - } + }; updateElementPosition = () => { const { @@ -228,25 +228,26 @@ class ToolContextMenu extends Component { offsetHeight, offsetWidth, offsetLeft, - } = this.mainElement.current + } = this.mainElement.current; - const { eventData } = this.props + const { eventData } = this.props; if (offsetTop + offsetHeight > offsetParent.offsetHeight) { const offBoundPixels = - offsetTop + offsetHeight - offsetParent.offsetHeight - const top = eventData.currentPoints.canvas.y - offBoundPixels + offsetTop + offsetHeight - offsetParent.offsetHeight; + const top = eventData.currentPoints.canvas.y - offBoundPixels; - this.mainElement.current.style.top = `${top > 0 ? top : 0}px` + this.mainElement.current.style.top = `${top > 0 ? top : 0}px`; } if (offsetLeft + offsetWidth > offsetParent.offsetWidth) { - const offBoundPixels = offsetLeft + offsetWidth - offsetParent.offsetWidth - const left = eventData.currentPoints.canvas.x - offBoundPixels + const offBoundPixels = + offsetLeft + offsetWidth - offsetParent.offsetWidth; + const left = eventData.currentPoints.canvas.x - offBoundPixels; - this.mainElement.current.style.left = `${left > 0 ? left : 0}px` + this.mainElement.current.style.left = `${left > 0 ? left : 0}px`; } - } + }; } -export default ToolContextMenu +export default ToolContextMenu; diff --git a/src/connectedComponents/ToolbarRow.js b/src/connectedComponents/ToolbarRow.js index d0a504146..26b1425ba 100644 --- a/src/connectedComponents/ToolbarRow.js +++ b/src/connectedComponents/ToolbarRow.js @@ -1,12 +1,12 @@ -import React, { Component } from 'react' -import PropTypes from 'prop-types' -import OHIF from 'ohif-core' -import { RoundedButtonGroup } from 'react-viewerbase' -import ConnectedLayoutButton from './ConnectedLayoutButton' -import ConnectedPluginSwitch from './ConnectedPluginSwitch.js' -import './ToolbarRow.css' +import React, { Component } from 'react'; +import PropTypes from 'prop-types'; +import OHIF from 'ohif-core'; +import { RoundedButtonGroup } from 'react-viewerbase'; +import ConnectedLayoutButton from './ConnectedLayoutButton'; +import ConnectedPluginSwitch from './ConnectedPluginSwitch.js'; +import './ToolbarRow.css'; -const Icons = `${window.config.routerBasename}/icons.svg`.replace('//', '/') +const Icons = `${window.config.routerBasename}/icons.svg`.replace('//', '/'); class ToolbarRow extends Component { static propTypes = { @@ -15,20 +15,20 @@ class ToolbarRow extends Component { setLeftSidebarOpen: PropTypes.func, setRightSidebarOpen: PropTypes.func, pluginId: PropTypes.string, - } + }; static defaultProps = { leftSidebarOpen: false, rightSidebarOpen: false, - } + }; onLeftSidebarValueChanged = value => { - this.props.setLeftSidebarOpen(!!value) - } + this.props.setLeftSidebarOpen(!!value); + }; onRightSidebarValueChanged = value => { - this.props.setRightSidebarOpen(!!value) - } + this.props.setRightSidebarOpen(!!value); + }; render() { const leftSidebarToggle = [ @@ -39,7 +39,7 @@ class ToolbarRow extends Component { svgHeight: 13, bottomLabel: 'Series', }, - ] + ]; const rightSidebarToggle = [ { @@ -49,28 +49,30 @@ class ToolbarRow extends Component { svgHeight: 13, bottomLabel: 'Measurements', }, - ] + ]; const leftSidebarValue = this.props.leftSidebarOpen ? leftSidebarToggle[0].value - : null + : null; const rightSidebarValue = this.props.rightSidebarOpen ? rightSidebarToggle[0].value - : null + : null; - const currentPluginId = this.props.pluginId + const currentPluginId = this.props.pluginId; - const { PLUGIN_TYPES, availablePlugins } = OHIF.plugins + const { PLUGIN_TYPES, availablePlugins } = OHIF.plugins; const plugin = availablePlugins.find(entry => { - return entry.type === PLUGIN_TYPES.TOOLBAR && entry.id === currentPluginId - }) + return ( + entry.type === PLUGIN_TYPES.TOOLBAR && entry.id === currentPluginId + ); + }); - let pluginComp + let pluginComp; if (plugin) { - const PluginComponent = plugin.component + const PluginComponent = plugin.component; - pluginComp = + pluginComp = ; } return ( @@ -93,8 +95,8 @@ class ToolbarRow extends Component { /> - ) + ); } } -export default ToolbarRow +export default ToolbarRow; diff --git a/src/connectedComponents/Viewer.js b/src/connectedComponents/Viewer.js index 8176d9fd6..1faf3be60 100644 --- a/src/connectedComponents/Viewer.js +++ b/src/connectedComponents/Viewer.js @@ -52,7 +52,7 @@ class Viewer extends Component { studies: PropTypes.array, studyInstanceUids: PropTypes.array, onTimepointsUpdated: PropTypes.func, - onMeasurementsUpdated: PropTypes.func + onMeasurementsUpdated: PropTypes.func, }; constructor(props) { @@ -60,8 +60,8 @@ class Viewer extends Component { OHIF.measurements.MeasurementApi.setConfiguration({ dataExchange: { retrieve: this.retrieveMeasurements, - store: this.storeMeasurements - } + store: this.storeMeasurements, + }, }); OHIF.measurements.TimepointApi.setConfiguration({ @@ -70,8 +70,8 @@ class Viewer extends Component { store: this.storeTimepoints, remove: this.removeTimepoint, update: this.updateTimepoint, - disassociate: this.disassociateStudy - } + disassociate: this.disassociateStudy, + }, }); } @@ -115,8 +115,8 @@ class Viewer extends Component { patientId: filter.patientId, earliestDate, latestDate, - isLocked: false - } + isLocked: false, + }, ]); }; @@ -158,11 +158,11 @@ class Viewer extends Component { const currentTimepointId = 'TimepointId'; const timepointApi = new TimepointApi(currentTimepointId, { - onTimepointsUpdated: this.onTimepointsUpdated + onTimepointsUpdated: this.onTimepointsUpdated, }); const measurementApi = new MeasurementApi(timepointApi, { - onMeasurementsUpdated: this.onMeasurementsUpdated + onMeasurementsUpdated: this.onMeasurementsUpdated, }); const patientId = studies[0] && studies[0].patientId; diff --git a/src/connectedComponents/ViewerMain.js b/src/connectedComponents/ViewerMain.js index 57f60cac2..01ebb9b91 100644 --- a/src/connectedComponents/ViewerMain.js +++ b/src/connectedComponents/ViewerMain.js @@ -1,9 +1,9 @@ -import { Component } from 'react' -import React from 'react' -import PropTypes from 'prop-types' -import { OHIF } from 'ohif-core' -import ConnectedLayoutManager from './ConnectedLayoutManager.js' -import './ViewerMain.css' +import { Component } from 'react'; +import React from 'react'; +import PropTypes from 'prop-types'; +import { OHIF } from 'ohif-core'; +import ConnectedLayoutManager from './ConnectedLayoutManager.js'; +import './ViewerMain.css'; class ViewerMain extends Component { static propTypes = { @@ -12,10 +12,10 @@ class ViewerMain extends Component { clearViewportSpecificData: PropTypes.func.isRequired, setToolActive: PropTypes.func.isRequired, setActiveViewportSpecificData: PropTypes.func.isRequired, - } + }; constructor(props) { - super(props) + super(props); // Initialize hotkeys new OHIF.HotkeysUtil('viewer', { @@ -23,41 +23,41 @@ class ViewerMain extends Component { clearViewportSpecificData: props.clearViewportSpecificData, setToolActive: props.setToolActive, setActiveViewportSpecificData: props.setActiveViewportSpecificData, - }) + }); this.state = { displaySets: [], - } + }; - this.cachedViewportData = {} + this.cachedViewportData = {}; } getDisplaySets(studies) { - const displaySets = [] + const displaySets = []; studies.forEach(study => { study.displaySets.forEach(dSet => { if (!dSet.plugin) { - dSet.plugin = 'cornerstone' + dSet.plugin = 'cornerstone'; } - displaySets.push(dSet) - }) - }) + displaySets.push(dSet); + }); + }); - return displaySets + return displaySets; } findDisplaySet(studies, studyInstanceUid, displaySetInstanceUid) { const study = studies.find(study => { - return study.studyInstanceUid === studyInstanceUid - }) + return study.studyInstanceUid === studyInstanceUid; + }); if (!study) { - return + return; } return study.displaySets.find(displaySet => { - return displaySet.displaySetInstanceUid === displaySetInstanceUid - }) + return displaySet.displaySetInstanceUid === displaySetInstanceUid; + }); } componentDidMount() { @@ -65,27 +65,27 @@ class ViewerMain extends Component { //window.addEventListener('beforeunload', unloadHandlers.beforeUnload); // Get all the display sets for the viewer studies - const displaySets = this.getDisplaySets(this.props.studies) + const displaySets = this.getDisplaySets(this.props.studies); this.setState({ displaySets, - }) + }); } getViewportData = () => { - const viewportData = [] - const { layout, viewportSpecificData } = this.props + const viewportData = []; + const { layout, viewportSpecificData } = this.props; for ( let viewportIndex = 0; viewportIndex < layout.viewports.length; viewportIndex++ ) { - let displaySet = viewportSpecificData[viewportIndex] + let displaySet = viewportSpecificData[viewportIndex]; // Use the cached display set in viewport if the new one is empty if (displaySet && !displaySet.displaySetInstanceUid) { - displaySet = this.cachedViewportData[viewportIndex] + displaySet = this.cachedViewportData[viewportIndex]; } if ( @@ -98,35 +98,35 @@ class ViewerMain extends Component { this.props.studies, displaySet.studyInstanceUid, displaySet.displaySetInstanceUid - ) - viewportData.push(Object.assign({}, originalDisplaySet, displaySet)) + ); + viewportData.push(Object.assign({}, originalDisplaySet, displaySet)); } else { // If the viewport is empty, get one available in study - const { displaySets } = this.state + const { displaySets } = this.state; displaySet = displaySets.find( ds => !viewportData.some( v => v.displaySetInstanceUid === ds.displaySetInstanceUid ) - ) - viewportData.push(Object.assign({}, displaySet)) + ); + viewportData.push(Object.assign({}, displaySet)); } } - this.cachedViewportData = viewportData + this.cachedViewportData = viewportData; - return viewportData - } + return viewportData; + }; setViewportData = ({ viewportIndex, item }) => { const displaySet = this.findDisplaySet( this.props.studies, item.studyInstanceUid, item.displaySetInstanceUid - ) + ); - this.props.setViewportSpecificData(viewportIndex, displaySet) - } + this.props.setViewportSpecificData(viewportIndex, displaySet); + }; render() { return ( @@ -137,15 +137,15 @@ class ViewerMain extends Component { setViewportData={this.setViewportData} /> - ) + ); } componentWillUnmount() { // Clear the entire viewport specific data - const { viewportSpecificData } = this.props + const { viewportSpecificData } = this.props; Object.keys(viewportSpecificData).forEach(viewportIndex => { - this.props.clearViewportSpecificData(viewportIndex) - }) + this.props.clearViewportSpecificData(viewportIndex); + }); // Remove beforeUnload event handler... //window.removeEventListener('beforeunload', unloadHandlers.beforeUnload); @@ -164,4 +164,4 @@ class ViewerMain extends Component { } } -export default ViewerMain +export default ViewerMain; diff --git a/src/connectedComponents/ViewerRetrieveStudyData.js b/src/connectedComponents/ViewerRetrieveStudyData.js index 0a288706e..bf9f5a08b 100644 --- a/src/connectedComponents/ViewerRetrieveStudyData.js +++ b/src/connectedComponents/ViewerRetrieveStudyData.js @@ -9,12 +9,12 @@ class ViewerRetrieveStudyData extends Component { static propTypes = { studyInstanceUids: PropTypes.array.isRequired, seriesInstanceUids: PropTypes.array, - server: PropTypes.object + server: PropTypes.object, }; state = { studies: null, - error: null + error: null, }; componentDidMount() { @@ -33,12 +33,12 @@ class ViewerRetrieveStudyData extends Component { const updatedStudies = createDisplaySets(studies); this.setState({ - studies: updatedStudies + studies: updatedStudies, }); }) .catch(error => { this.setState({ - error: true + error: true, }); throw new Error(error); diff --git a/src/index.js b/src/index.js index 51ad953cb..fff5f61bd 100644 --- a/src/index.js +++ b/src/index.js @@ -2,21 +2,21 @@ * Entry point for development and production PWA builds. * Packaged (NPM) builds go through `index_publish.js` */ -import App from './App.js' -import React from 'react' -import ReactDOM from 'react-dom' +import App from './App.js'; +import React from 'react'; +import ReactDOM from 'react-dom'; -export { App } +export { App }; -window.config = window.config || {} +window.config = window.config || {}; const applicationDefaults = { routerBasename: '/', relativeWebWorkerScriptsPath: '', -} -const applicationProps = Object.assign({}, applicationDefaults, window.config) -const app = React.createElement(App, applicationProps, null) +}; +const applicationProps = Object.assign({}, applicationDefaults, window.config); +const app = React.createElement(App, applicationProps, null); -ReactDOM.render(app, document.getElementById('root')) +ReactDOM.render(app, document.getElementById('root')); /* Example config with OIDC diff --git a/src/lib/getMeasurementLocationCallback.js b/src/lib/getMeasurementLocationCallback.js index 3a03bc9b3..38460ab60 100644 --- a/src/lib/getMeasurementLocationCallback.js +++ b/src/lib/getMeasurementLocationCallback.js @@ -1,21 +1,21 @@ -import cornerstoneTools from 'cornerstone-tools' -import updateTableWithNewMeasurementData from './updateTableWithNewMeasurementData' +import cornerstoneTools from 'cornerstone-tools'; +import updateTableWithNewMeasurementData from './updateTableWithNewMeasurementData'; export default function getMeasurementLocationCallback( eventData, tool, options ) { - const { toolType } = tool - const { element } = eventData - const doneCallback = updateTableWithNewMeasurementData + const { toolType } = tool; + const { element } = eventData; + const doneCallback = updateTableWithNewMeasurementData; - const ToolInstance = cornerstoneTools.getToolForElement(element, toolType) + const ToolInstance = cornerstoneTools.getToolForElement(element, toolType); ToolInstance.configuration.getMeasurementLocationCallback( tool, eventData, doneCallback, options - ) + ); } diff --git a/src/lib/jumpToRowItem.js b/src/lib/jumpToRowItem.js index 9b668c3c7..fb05835e1 100644 --- a/src/lib/jumpToRowItem.js +++ b/src/lib/jumpToRowItem.js @@ -1,4 +1,4 @@ -import { OHIF } from 'ohif-core' +import { OHIF } from 'ohif-core'; // TODO: Move this function to OHIF itself so we can use it on the OHIF measurment table (when it is finished) @@ -16,48 +16,48 @@ export default function jumpToRowItem( timepointManagerState, options = { invertViewportTimepointsOrder: false, childToolKey: null } ) { - const numViewports = viewportsState.layout.viewports.length - const numTimepoints = timepointManagerState.timepoints.length - const { measurements, timepoints } = timepointManagerState - const numViewportsToUpdate = Math.min(numTimepoints, numViewports) - const { toolType, measurementNumber } = measurementData + const numViewports = viewportsState.layout.viewports.length; + const numTimepoints = timepointManagerState.timepoints.length; + const { measurements, timepoints } = timepointManagerState; + const numViewportsToUpdate = Math.min(numTimepoints, numViewports); + const { toolType, measurementNumber } = measurementData; if (options.invertViewportTimepointsOrder) { - timepoints.reverse() + timepoints.reverse(); } - const measurementsForToolGroup = measurements[toolType] + const measurementsForToolGroup = measurements[toolType]; // Retrieve the measurements data - const measurementsToJumpTo = [] + const measurementsToJumpTo = []; for (let i = 0; i < numViewportsToUpdate; i++) { - const { timepointId } = timepoints[i] + const { timepointId } = timepoints[i]; const dataAtThisTimepoint = measurementsForToolGroup.find(entry => { return ( entry.timepointId === timepointId && entry.measurementNumber === measurementNumber - ) - }) + ); + }); if (!dataAtThisTimepoint) { - measurementsToJumpTo.push(null) - continue + measurementsToJumpTo.push(null); + continue; } - let measurement = dataAtThisTimepoint + let measurement = dataAtThisTimepoint; const { tool } = OHIF.measurements.MeasurementApi.getToolConfiguration( toolType - ) + ); if (options.childToolKey) { - measurement = dataAtThisTimepoint[options.childToolKey] + measurement = dataAtThisTimepoint[options.childToolKey]; } else if (Array.isArray(tool.childTools)) { - const key = tool.childTools.find(key => !!dataAtThisTimepoint[key]) - measurement = dataAtThisTimepoint[key] + const key = tool.childTools.find(key => !!dataAtThisTimepoint[key]); + measurement = dataAtThisTimepoint[key]; } - measurementsToJumpTo.push(measurement) + measurementsToJumpTo.push(measurement); } // TODO: Add a single viewports state action which allows @@ -70,41 +70,41 @@ export default function jumpToRowItem( const displaySetContainsSopInstance = (displaySet, sopInstanceUid) => displaySet.images.find( image => image.getSOPInstanceUID() === sopInstanceUid - ) + ); - const viewportSpecificData = [] + const viewportSpecificData = []; measurementsToJumpTo.forEach((data, viewportIndex) => { // Skip if there is no measurement to jump if (!data) { - return + return; } - const study = OHIF.utils.studyMetadataManager.get(data.studyInstanceUid) + const study = OHIF.utils.studyMetadataManager.get(data.studyInstanceUid); if (!study) { - throw new Error('Study not found.') + throw new Error('Study not found.'); } const displaySet = study.findDisplaySet(displaySet => { - return displaySetContainsSopInstance(displaySet, data.sopInstanceUid) - }) + return displaySetContainsSopInstance(displaySet, data.sopInstanceUid); + }); if (!displaySet) { - throw new Error('Display set not found.') + throw new Error('Display set not found.'); } - displaySet.sopInstanceUid = data.sopInstanceUid + displaySet.sopInstanceUid = data.sopInstanceUid; if (data.frameIndex) { - displaySet.frameIndex = data.frameIndex + displaySet.frameIndex = data.frameIndex; } viewportSpecificData.push({ viewportIndex, displaySet, - }) - }) + }); + }); return { viewportSpecificData, layout: [], // TODO: if we need to change layout, we should return this here - } + }; } diff --git a/src/lib/updateTableWithNewMeasurementData.js b/src/lib/updateTableWithNewMeasurementData.js index 534ccdc8d..19ef5c482 100644 --- a/src/lib/updateTableWithNewMeasurementData.js +++ b/src/lib/updateTableWithNewMeasurementData.js @@ -1,5 +1,5 @@ -import OHIF from 'ohif-core' -import cornerstone from 'cornerstone-core' +import OHIF from 'ohif-core'; +import cornerstone from 'cornerstone-core'; export default function updateTableWithNewMeasurementData({ toolType, @@ -8,22 +8,22 @@ export default function updateTableWithNewMeasurementData({ description, }) { // Update all measurements by measurement number - const measurementApi = OHIF.measurements.MeasurementApi.Instance + const measurementApi = OHIF.measurements.MeasurementApi.Instance; const measurements = measurementApi.tools[toolType].filter( m => m.measurementNumber === measurementNumber - ) + ); measurements.forEach(measurement => { - measurement.location = location - measurement.description = description + measurement.location = location; + measurement.description = description; - measurementApi.updateMeasurement(measurement.toolType, measurement) - }) + measurementApi.updateMeasurement(measurement.toolType, measurement); + }); - measurementApi.syncMeasurementsAndToolData() + measurementApi.syncMeasurementsAndToolData(); // Update images in all active viewports cornerstone.getEnabledElements().forEach(enabledElement => { - cornerstone.updateImage(enabledElement.element) - }) + cornerstone.updateImage(enabledElement.element); + }); } diff --git a/src/lib/utils/bounding.js b/src/lib/utils/bounding.js index 6784e5155..9b66d696f 100644 --- a/src/lib/utils/bounding.js +++ b/src/lib/utils/bounding.js @@ -1,46 +1,46 @@ export default function bounding(elementRef, currentPosition = {}) { if (!elementRef.current) { - return + return; } - const currentElement = elementRef.current + const currentElement = elementRef.current; const { offsetParent, offsetTop, offsetHeight, offsetLeft, offsetWidth, - } = currentElement - let top = currentPosition.top || offsetTop - let left = currentPosition.left || offsetLeft + } = currentElement; + let top = currentPosition.top || offsetTop; + let left = currentPosition.left || offsetLeft; if (!offsetParent) { - return + return; } - let maxHeight = `${offsetParent.offsetHeight}px` + let maxHeight = `${offsetParent.offsetHeight}px`; if (offsetHeight + top > offsetParent.offsetHeight) { - top = top - (offsetHeight + top - offsetParent.offsetHeight) + top = top - (offsetHeight + top - offsetParent.offsetHeight); if (top < 0) { - top = 0 + top = 0; } } if (left + offsetWidth > offsetParent.offsetWidth) { - left = offsetParent.offsetWidth - offsetWidth + left = offsetParent.offsetWidth - offsetWidth; if (left < 0) { - left = 0 + left = 0; } } if (maxHeight && currentElement.style.maxHeight !== maxHeight) { - currentElement.style.maxHeight = maxHeight + currentElement.style.maxHeight = maxHeight; } if (currentElement.style.top !== `${top}px`) { - currentElement.style.top = `${top}px` + currentElement.style.top = `${top}px`; } if (currentElement.style.left !== `${left}px`) { - currentElement.style.left = `${left}px` + currentElement.style.left = `${left}px`; } } diff --git a/src/redux/actions.js b/src/redux/actions.js index cd031e9d6..552e24a46 100644 --- a/src/redux/actions.js +++ b/src/redux/actions.js @@ -1,16 +1,16 @@ export const setLeftSidebarOpen = state => ({ type: 'SET_LEFT_SIDEBAR_OPEN', - state + state, }); export const setRightSidebarOpen = state => ({ type: 'SET_RIGHT_SIDEBAR_OPEN', - state + state, }); export const setUserPreferencesModalOpen = state => ({ type: 'SET_USER_PREFERENCES_MODAL_OPEN', - state + state, }); const actions = { diff --git a/src/redux/ui.js b/src/redux/ui.js index a58a596f5..586d8d5e1 100644 --- a/src/redux/ui.js +++ b/src/redux/ui.js @@ -4,39 +4,39 @@ const defaultState = { userPreferencesModalOpen: false, labelling: {}, contextMenu: {}, -} +}; const ui = (state = defaultState, action) => { switch (action.type) { case 'SET_LEFT_SIDEBAR_OPEN': - return Object.assign({}, state, { leftSidebarOpen: action.state }) + return Object.assign({}, state, { leftSidebarOpen: action.state }); case 'SET_RIGHT_SIDEBAR_OPEN': - return Object.assign({}, state, { rightSidebarOpen: action.state }) + return Object.assign({}, state, { rightSidebarOpen: action.state }); case 'SET_USER_PREFERENCES_MODAL_OPEN': return Object.assign({}, state, { userPreferencesModalOpen: action.state, - }) + }); case 'SET_LABELLING_FLOW_DATA': - const labelling = Object.assign({}, action.labellingFlowData) + const labelling = Object.assign({}, action.labellingFlowData); - return Object.assign({}, state, { labelling }) + return Object.assign({}, state, { labelling }); case 'SET_TOOL_CONTEXT_MENU_DATA': - const contextMenu = Object.assign({}, state.contextMenu) + const contextMenu = Object.assign({}, state.contextMenu); contextMenu[action.viewportIndex] = Object.assign( {}, action.toolContextMenuData - ) + ); - return Object.assign({}, state, { contextMenu }) + return Object.assign({}, state, { contextMenu }); case 'RESET_LABELLING_AND_CONTEXT_MENU': return Object.assign({}, state, { labelling: defaultState.labelling, contextMenu: defaultState.contextMenu, - }) + }); default: - return state + return state; } -} +}; -export default ui +export default ui; diff --git a/src/routes/IHEInvokeImageDisplay.js b/src/routes/IHEInvokeImageDisplay.js index e216cbfc7..450030157 100644 --- a/src/routes/IHEInvokeImageDisplay.js +++ b/src/routes/IHEInvokeImageDisplay.js @@ -1,45 +1,43 @@ -import React from "react"; -import PropTypes from "prop-types"; -import ViewerRetrieveStudyData from "../connectedComponents/ViewerRetrieveStudyData.js"; +import React from 'react'; +import PropTypes from 'prop-types'; +import ViewerRetrieveStudyData from '../connectedComponents/ViewerRetrieveStudyData.js'; function IHEInvokeImageDisplay({ match }) { - const requestType = match.params.query.requestType; - let studyInstanceUids; - //let patientUids; - let displayStudyList = false; + const requestType = match.params.query.requestType; + let studyInstanceUids; + //let patientUids; + let displayStudyList = false; - if (requestType === "STUDY") { - studyInstanceUids = match.params.query.studyUID.split(';'); - } else if (requestType === "STUDYBASE64") { - const uids = this.params.query.studyUID; - const decodedData = window.atob(uids); - studyInstanceUids = decodedData.split(';'); - } else if (requestType === "PATIENT") { - //patientUidspatientUids = this.params.query.patientID.split(';'); - displayStudyList = true - } else { - displayStudyList = true - } + if (requestType === 'STUDY') { + studyInstanceUids = match.params.query.studyUID.split(';'); + } else if (requestType === 'STUDYBASE64') { + const uids = this.params.query.studyUID; + const decodedData = window.atob(uids); + studyInstanceUids = decodedData.split(';'); + } else if (requestType === 'PATIENT') { + //patientUidspatientUids = this.params.query.patientID.split(';'); + displayStudyList = true; + } else { + displayStudyList = true; + } - if (displayStudyList) { - return ('')//); - } + if (displayStudyList) { + return ''; //); + } - return ( - - ); + return ; } IHEInvokeImageDisplay.propTypes = { - match: PropTypes.shape({ - params: PropTypes.shape({ - query: PropTypes.shape({ - requestType: PropTypes.string.isRequired, - studyUID: PropTypes.string, - patientID: PropTypes.string - }) - }) - }) + match: PropTypes.shape({ + params: PropTypes.shape({ + query: PropTypes.shape({ + requestType: PropTypes.string.isRequired, + studyUID: PropTypes.string, + patientID: PropTypes.string, + }), + }), + }), }; export default IHEInvokeImageDisplay; diff --git a/src/routes/StandaloneRouting.js b/src/routes/StandaloneRouting.js index 195d6feab..884261d78 100644 --- a/src/routes/StandaloneRouting.js +++ b/src/routes/StandaloneRouting.js @@ -9,12 +9,12 @@ const { createDisplaySets } = OHIF.utils; class StandaloneRouting extends Component { state = { studies: null, - error: null + error: null, }; static propTypes = { location: PropTypes.object, - store: PropTypes.object + store: PropTypes.object, }; static parseQueryAndFetchStudies(query) { diff --git a/src/routes/ViewerRouting.js b/src/routes/ViewerRouting.js index eebec2461..a01a8444c 100644 --- a/src/routes/ViewerRouting.js +++ b/src/routes/ViewerRouting.js @@ -1,32 +1,35 @@ -import React from "react"; -import PropTypes from "prop-types"; -import ConnectedViewerRetrieveStudyData from "../connectedComponents/ConnectedViewerRetrieveStudyData"; +import React from 'react'; +import PropTypes from 'prop-types'; +import ConnectedViewerRetrieveStudyData from '../connectedComponents/ConnectedViewerRetrieveStudyData'; function ViewerRouting({ match }) { - const { studyInstanceUids, seriesInstanceUids } = match.params; + const { studyInstanceUids, seriesInstanceUids } = match.params; - let studyUIDs; - let seriesUIDs; + let studyUIDs; + let seriesUIDs; - if (studyInstanceUids && !seriesInstanceUids) { - studyUIDs = studyInstanceUids.split(';'); - } else if (studyInstanceUids && seriesInstanceUids) { - studyUIDs = [match.params.studyInstanceUid]; - seriesUIDs = match.params.seriesInstanceUids.split(';'); - } + if (studyInstanceUids && !seriesInstanceUids) { + studyUIDs = studyInstanceUids.split(';'); + } else if (studyInstanceUids && seriesInstanceUids) { + studyUIDs = [match.params.studyInstanceUid]; + seriesUIDs = match.params.seriesInstanceUids.split(';'); + } - return ( - - ); + return ( + + ); } ViewerRouting.propTypes = { - match: PropTypes.shape({ - params: PropTypes.shape({ - studyInstanceUids: PropTypes.string.isRequired, - seriesInstanceUids: PropTypes.string - }) - }) + match: PropTypes.shape({ + params: PropTypes.shape({ + studyInstanceUids: PropTypes.string.isRequired, + seriesInstanceUids: PropTypes.string, + }), + }), }; export default ViewerRouting; diff --git a/src/sanity.test.js b/src/sanity.test.js index cab5162ae..6daeb0043 100644 --- a/src/sanity.test.js +++ b/src/sanity.test.js @@ -1,8 +1,8 @@ describe('Sanity Test', () => { test('how many marbles?', () => { - const expectedMarbles = 4 - const actualMarbles = 2 + 2 + const expectedMarbles = 4; + const actualMarbles = 2 + 2; - expect(actualMarbles).toEqual(expectedMarbles) - }) -}) + expect(actualMarbles).toEqual(expectedMarbles); + }); +}); diff --git a/src/setupTools.js b/src/setupTools.js index 6852d83c4..df77f1713 100644 --- a/src/setupTools.js +++ b/src/setupTools.js @@ -1,15 +1,15 @@ -import OHIF from 'ohif-core' -import updateTableWithNewMeasurementData from './lib/updateTableWithNewMeasurementData' +import OHIF from 'ohif-core'; +import updateTableWithNewMeasurementData from './lib/updateTableWithNewMeasurementData'; function getToolLabellingFlowCallback(store) { const setLabellingFlowDataAction = labellingFlowData => ({ type: 'SET_LABELLING_FLOW_DATA', labellingFlowData, - }) + }); const setLabellingFlowData = labellingFlowData => { - store.dispatch(setLabellingFlowDataAction(labellingFlowData)) - } + store.dispatch(setLabellingFlowDataAction(labellingFlowData)); + }; return function toolLabellingFlowCallback( measurementData, @@ -21,21 +21,21 @@ function getToolLabellingFlowCallback(store) { // Update the measurement data with the labelling parameters if (location) { - measurementData.location = location + measurementData.location = location; } if (description) { - measurementData.description = description + measurementData.description = description; } if (response) { - measurementData.response = response + measurementData.response = response; } - updateTableWithNewMeasurementData(measurementData) - } + updateTableWithNewMeasurementData(measurementData); + }; const labellingDoneCallback = () => { - setLabellingFlowData({ visible: false }) - } + setLabellingFlowData({ visible: false }); + }; const labellingFlowData = { visible: true, @@ -48,99 +48,99 @@ function getToolLabellingFlowCallback(store) { editDescriptionOnDialog: options.editDescriptionOnDialog, labellingDoneCallback, updateLabelling, - } + }; - setLabellingFlowData(labellingFlowData) - } + setLabellingFlowData(labellingFlowData); + }; } const resetLabellingAndContextMenuAction = state => ({ type: 'RESET_LABELLING_AND_CONTEXT_MENU', state, -}) +}); const setToolContextMenuDataAction = (viewportIndex, toolContextMenuData) => ({ type: 'SET_TOOL_CONTEXT_MENU_DATA', viewportIndex, toolContextMenuData, -}) +}); function getOnRightClickCallback(store) { const setToolContextMenuData = (viewportIndex, toolContextMenuData) => { - store.dispatch(resetLabellingAndContextMenuAction()) + store.dispatch(resetLabellingAndContextMenuAction()); store.dispatch( setToolContextMenuDataAction(viewportIndex, toolContextMenuData) - ) - } + ); + }; const getOnCloseCallback = viewportIndex => { return function onClose() { const toolContextMenuData = { visible: false, - } + }; store.dispatch( setToolContextMenuDataAction(viewportIndex, toolContextMenuData) - ) - } - } + ); + }; + }; return function onRightClick(event) { - const eventData = event.detail - const viewportIndex = parseInt(eventData.element.dataset.viewportIndex, 10) + const eventData = event.detail; + const viewportIndex = parseInt(eventData.element.dataset.viewportIndex, 10); const toolContextMenuData = { eventData, isTouchEvent: false, onClose: getOnCloseCallback(viewportIndex), - } + }; - setToolContextMenuData(viewportIndex, toolContextMenuData) - } + setToolContextMenuData(viewportIndex, toolContextMenuData); + }; } function getOnTouchPressCallback(store) { const setToolContextMenuData = (viewportIndex, toolContextMenuData) => { - store.dispatch(resetLabellingAndContextMenuAction()) + store.dispatch(resetLabellingAndContextMenuAction()); store.dispatch( setToolContextMenuDataAction(viewportIndex, toolContextMenuData) - ) - } + ); + }; const getOnCloseCallback = viewportIndex => { return function onClose() { const toolContextMenuData = { visible: false, - } + }; store.dispatch( setToolContextMenuDataAction(viewportIndex, toolContextMenuData) - ) - } - } + ); + }; + }; return function onTouchPress(event) { - const eventData = event.detail - const viewportIndex = parseInt(eventData.element.dataset.viewportIndex, 10) + const eventData = event.detail; + const viewportIndex = parseInt(eventData.element.dataset.viewportIndex, 10); const toolContextMenuData = { eventData, isTouchEvent: true, onClose: getOnCloseCallback(viewportIndex), - } + }; - setToolContextMenuData(viewportIndex, toolContextMenuData) - } + setToolContextMenuData(viewportIndex, toolContextMenuData); + }; } function getResetLabellingAndContextMenu(store) { return function resetLabellingAndContextMenu() { - store.dispatch(resetLabellingAndContextMenuAction()) - } + store.dispatch(resetLabellingAndContextMenuAction()); + }; } export default function setupTools(store) { - const toolLabellingFlowCallback = getToolLabellingFlowCallback(store) + const toolLabellingFlowCallback = getToolLabellingFlowCallback(store); const availableTools = [ { name: 'Pan', mouseButtonMasks: [1, 4] }, { name: 'Zoom', mouseButtonMasks: [1, 2] }, @@ -214,13 +214,13 @@ export default function setupTools(store) { { name: 'ZoomTouchPinch' }, { name: 'StackScrollMouseWheel' }, { name: 'StackScrollMultiTouch' }, - ] + ]; - const onRightClick = getOnRightClickCallback(store) - const onTouchPress = getOnTouchPressCallback(store) - const onNewImage = getResetLabellingAndContextMenu(store) - const onMouseClick = getResetLabellingAndContextMenu(store) - const onTouchStart = getResetLabellingAndContextMenu(store) + const onRightClick = getOnRightClickCallback(store); + const onTouchPress = getOnTouchPressCallback(store); + const onNewImage = getResetLabellingAndContextMenu(store); + const onMouseClick = getResetLabellingAndContextMenu(store); + const onTouchStart = getResetLabellingAndContextMenu(store); const toolAction = OHIF.redux.actions.setExtensionData('cornerstone', { availableTools, onNewImage, @@ -228,7 +228,7 @@ export default function setupTools(store) { onTouchPress, onTouchStart, onMouseClick, - }) + }); - store.dispatch(toolAction) + store.dispatch(toolAction); } diff --git a/src/studylist/ConnectedStudyList.js b/src/studylist/ConnectedStudyList.js index e7181441a..6dffbc6a9 100644 --- a/src/studylist/ConnectedStudyList.js +++ b/src/studylist/ConnectedStudyList.js @@ -1,21 +1,21 @@ -import { connect } from 'react-redux' +import { connect } from 'react-redux'; -import StudyListWithData from './StudyListWithData.js' +import StudyListWithData from './StudyListWithData.js'; -const isActive = a => a.active === true +const isActive = a => a.active === true; const mapStateToProps = state => { - const activeServer = state.servers.servers.find(isActive) + const activeServer = state.servers.servers.find(isActive); return { server: activeServer, user: state.oidc.user, - } -} + }; +}; const ConnectedStudyList = connect( mapStateToProps, null -)(StudyListWithData) +)(StudyListWithData); -export default ConnectedStudyList +export default ConnectedStudyList; diff --git a/src/studylist/StudyListRouting.js b/src/studylist/StudyListRouting.js index afdaeb8bf..357d1eb0f 100644 --- a/src/studylist/StudyListRouting.js +++ b/src/studylist/StudyListRouting.js @@ -1,24 +1,22 @@ -import React from "react"; -import PropTypes from "prop-types"; -import ConnectedStudyList from "./ConnectedStudyList"; +import React from 'react'; +import PropTypes from 'prop-types'; +import ConnectedStudyList from './ConnectedStudyList'; // TODO: Move to react-viewerbase function StudyListRouting({ match }) { - // TODO: Figure out which filters we want to pass in via a URL - //const { patientId } = match.params; + // TODO: Figure out which filters we want to pass in via a URL + //const { patientId } = match.params; - return ( - - ); + return ; } StudyListRouting.propTypes = { - match: PropTypes.shape({ - params: PropTypes.shape({ - patientIds: PropTypes.string, - }) - }) + match: PropTypes.shape({ + params: PropTypes.shape({ + patientIds: PropTypes.string, + }), + }), }; export default StudyListRouting; diff --git a/src/studylist/StudyListWithData.js b/src/studylist/StudyListWithData.js index dc0407f65..c8fd86d3f 100644 --- a/src/studylist/StudyListWithData.js +++ b/src/studylist/StudyListWithData.js @@ -10,14 +10,14 @@ class StudyListWithData extends Component { state = { searchData: {}, studies: null, - error: null + error: null, }; static propTypes = { patientId: PropTypes.string, server: PropTypes.object, user: PropTypes.object, - history: PropTypes.object + history: PropTypes.object, }; static rowsPerPage = 25; @@ -42,7 +42,7 @@ class StudyListWithData extends Component { rowsPerPage: StudyListWithData.rowsPerPage, studyDateFrom: StudyListWithData.defaultStudyDateFrom, studyDateTo: StudyListWithData.defaultStudyDateTo, - sortData: StudyListWithData.defaultSort + sortData: StudyListWithData.defaultSort, } ) => { const { server } = this.props; @@ -55,7 +55,7 @@ class StudyListWithData extends Component { studyDateFrom: searchData.studyDateFrom, studyDateTo: searchData.studyDateTo, limit: searchData.rowsPerPage, - offset: searchData.currentPage * searchData.rowsPerPage + offset: searchData.currentPage * searchData.rowsPerPage, }; // TODO: add sorting @@ -97,12 +97,12 @@ class StudyListWithData extends Component { }); this.setState({ - studies: sortedStudies + studies: sortedStudies, }); }) .catch(error => { this.setState({ - error: true + error: true, }); throw new Error(error); diff --git a/src/utils/getDefaultToolbarButtons.js b/src/utils/getDefaultToolbarButtons.js index 7c7d584fd..2ec95275e 100644 --- a/src/utils/getDefaultToolbarButtons.js +++ b/src/utils/getDefaultToolbarButtons.js @@ -3,15 +3,15 @@ * @param {String} [baseDirectory='/'] */ export default function(baseDirectory = '/') { - const iconsFileName = 'icons.svg' + const iconsFileName = 'icons.svg'; const sanitizedBaseDirectory = baseDirectory[baseDirectory.length - 1] === '/' ? baseDirectory - : `${baseDirectory}/` + : `${baseDirectory}/`; const relativePathToIcons = `${sanitizedBaseDirectory}${iconsFileName}`.replace( '//', '/' - ) + ); return [ { @@ -112,5 +112,5 @@ export default function(baseDirectory = '/') { svgUrl: `${relativePathToIcons}#icon-tools-reset`, active: false, }, - ] + ]; } diff --git a/src/utils/getDefaultToolbarButtons.test.js b/src/utils/getDefaultToolbarButtons.test.js index 2fa45839b..c98c2471f 100644 --- a/src/utils/getDefaultToolbarButtons.test.js +++ b/src/utils/getDefaultToolbarButtons.test.js @@ -1,26 +1,26 @@ -import getDefaultToolbarButtons from './getDefaultToolbarButtons.js' +import getDefaultToolbarButtons from './getDefaultToolbarButtons.js'; describe('getDefaultToolbarButtons.js', () => { it('returns a non-empty array', () => { - const basePath = '/' + const basePath = '/'; - const buttons = getDefaultToolbarButtons(basePath) + const buttons = getDefaultToolbarButtons(basePath); - expect(buttons.length).toBeGreaterThan(0) - }) + expect(buttons.length).toBeGreaterThan(0); + }); it('uses the provided basePath in buttons with an svgUrl property', () => { - const basePath = '/demo/' + const basePath = '/demo/'; - const buttons = getDefaultToolbarButtons(basePath) + const buttons = getDefaultToolbarButtons(basePath); const hasOneOrMoreButtonsWithSvgUrlProperty = buttons.some(btn => btn.hasOwnProperty('svgUrl') - ) + ); const usesBasePathInButtonSvgUrls = buttons.every( btn => !btn.hasOwnProperty('svgUrl') || btn.svgUrl.includes(basePath) - ) + ); - expect(hasOneOrMoreButtonsWithSvgUrlProperty).toBeTruthy() - expect(usesBasePathInButtonSvgUrls).toBeTruthy() - }) -}) + expect(hasOneOrMoreButtonsWithSvgUrlProperty).toBeTruthy(); + expect(usesBasePathInButtonSvgUrls).toBeTruthy(); + }); +}); diff --git a/src/utils/getUserManagerForOpenIdConnectClient.js b/src/utils/getUserManagerForOpenIdConnectClient.js index 72bca8ffa..bd3b3688d 100644 --- a/src/utils/getUserManagerForOpenIdConnectClient.js +++ b/src/utils/getUserManagerForOpenIdConnectClient.js @@ -1,5 +1,5 @@ // https://github.com/maxmantz/redux-oidc/blob/master/docs/API.md -import { loadUser, createUserManager } from 'redux-oidc' +import { loadUser, createUserManager } from 'redux-oidc'; /** * Creates a userManager from oidcSettings; @@ -17,7 +17,7 @@ import { loadUser, createUserManager } from 'redux-oidc' */ export default function(store, oidcSettings) { if (!store || !oidcSettings) { - return + return; } const settings = { @@ -27,11 +27,11 @@ export default function(store, oidcSettings) { revokeAccessTokenOnSignout: true, filterProtocolClaims: true, loadUserInfo: true, - } + }; - const userManager = createUserManager(settings) + const userManager = createUserManager(settings); - loadUser(store, userManager) + loadUser(store, userManager); - return userManager + return userManager; } diff --git a/src/utils/getUserManagerForOpenIdConnectClient.test.js b/src/utils/getUserManagerForOpenIdConnectClient.test.js index dd205d87c..b2ce38aa5 100644 --- a/src/utils/getUserManagerForOpenIdConnectClient.test.js +++ b/src/utils/getUserManagerForOpenIdConnectClient.test.js @@ -1,23 +1,23 @@ -import getUserManagerForOpenIdConnectClient from './getUserManagerForOpenIdConnectClient.js' +import getUserManagerForOpenIdConnectClient from './getUserManagerForOpenIdConnectClient.js'; describe('getUserManagerForOpenIdConnectClient', () => { it('returns undefined if store is not provided', () => { - const expectedReturnVal = undefined - const returnVal = getUserManagerForOpenIdConnectClient(undefined, {}) + const expectedReturnVal = undefined; + const returnVal = getUserManagerForOpenIdConnectClient(undefined, {}); - expect(returnVal).toEqual(expectedReturnVal) - }) + expect(returnVal).toEqual(expectedReturnVal); + }); it('returns undefined if oidcSettings are not provided', () => { - const expectedReturnVal = undefined - const returnVal = getUserManagerForOpenIdConnectClient({}, undefined) + const expectedReturnVal = undefined; + const returnVal = getUserManagerForOpenIdConnectClient({}, undefined); - expect(returnVal).toEqual(expectedReturnVal) - }) + expect(returnVal).toEqual(expectedReturnVal); + }); it('does not return undefined when store and oidcSettings are defined', () => { - const returnVal = getUserManagerForOpenIdConnectClient({}, {}) + const returnVal = getUserManagerForOpenIdConnectClient({}, {}); - expect(returnVal).not.toBe(undefined) - }) -}) + expect(returnVal).not.toBe(undefined); + }); +}); diff --git a/src/utils/index.js b/src/utils/index.js index 4c8522124..22478739a 100644 --- a/src/utils/index.js +++ b/src/utils/index.js @@ -1,9 +1,9 @@ -import getDefaultToolbarButtons from './getDefaultToolbarButtons.js' -import getUserManagerForOpenIdConnectClient from './getUserManagerForOpenIdConnectClient.js' -import initWebWorkers from './initWebWorkers.js' +import getDefaultToolbarButtons from './getDefaultToolbarButtons.js'; +import getUserManagerForOpenIdConnectClient from './getUserManagerForOpenIdConnectClient.js'; +import initWebWorkers from './initWebWorkers.js'; export { getDefaultToolbarButtons, getUserManagerForOpenIdConnectClient, initWebWorkers, -} +}; diff --git a/src/utils/index.test.js b/src/utils/index.test.js index 59b8f7394..c164ab30e 100644 --- a/src/utils/index.test.js +++ b/src/utils/index.test.js @@ -1,8 +1,8 @@ -import * as utils from './index.js' +import * as utils from './index.js'; describe('utils', () => { it('has the expected exports', () => { - const utilExports = Object.keys(utils).sort() + const utilExports = Object.keys(utils).sort(); expect(utilExports).toEqual( [ @@ -10,6 +10,6 @@ describe('utils', () => { 'getUserManagerForOpenIdConnectClient', 'initWebWorkers', ].sort() - ) - }) -}) + ); + }); +}); diff --git a/src/utils/initWebWorkers.js b/src/utils/initWebWorkers.js index 26ec6ca2b..462d065da 100644 --- a/src/utils/initWebWorkers.js +++ b/src/utils/initWebWorkers.js @@ -1,4 +1,4 @@ -import cornerstoneWADOImageLoader from 'cornerstone-wado-image-loader' +import cornerstoneWADOImageLoader from 'cornerstone-wado-image-loader'; /** * @@ -8,7 +8,7 @@ import cornerstoneWADOImageLoader from 'cornerstone-wado-image-loader' export default function(baseDirectory, webWorkScriptsPath) { const scriptsPath = `${window.location.protocol}//${ window.location.host - }${baseDirectory}/${webWorkScriptsPath}` + }${baseDirectory}/${webWorkScriptsPath}`; const config = { maxWebWorkers: Math.max(navigator.hardwareConcurrency - 1, 1), startWebWorkersOnDemand: true, @@ -22,7 +22,7 @@ export default function(baseDirectory, webWorkScriptsPath) { strict: false, }, }, - } + }; - cornerstoneWADOImageLoader.webWorkerManager.initialize(config) + cornerstoneWADOImageLoader.webWorkerManager.initialize(config); } diff --git a/src/utils/initWebWorkers.test.js b/src/utils/initWebWorkers.test.js index af1aacc00..1d1cd7169 100644 --- a/src/utils/initWebWorkers.test.js +++ b/src/utils/initWebWorkers.test.js @@ -1,15 +1,15 @@ -import initWebWorkers from './initWebWorkers.js' -import cornerstoneWADOImageLoader from 'cornerstone-wado-image-loader' +import initWebWorkers from './initWebWorkers.js'; +import cornerstoneWADOImageLoader from 'cornerstone-wado-image-loader'; describe('initWebWorkers', () => { it("initializes cornerstoneWADOImageLoader's web workers", () => { - const basePath = '/' - const relativeWebWorkerScriptsPath = '' + const basePath = '/'; + const relativeWebWorkerScriptsPath = ''; - initWebWorkers(basePath, relativeWebWorkerScriptsPath) + initWebWorkers(basePath, relativeWebWorkerScriptsPath); expect( cornerstoneWADOImageLoader.webWorkerManager.initialize - ).toHaveBeenCalled() - }) -}) + ).toHaveBeenCalled(); + }); +});