101 lines
2.6 KiB
JavaScript
101 lines
2.6 KiB
JavaScript
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`
|
|
|
|
class ToolbarRow extends Component {
|
|
static propTypes = {
|
|
leftSidebarOpen: PropTypes.bool.isRequired,
|
|
rightSidebarOpen: PropTypes.bool.isRequired,
|
|
setLeftSidebarOpen: PropTypes.func,
|
|
setRightSidebarOpen: PropTypes.func,
|
|
pluginId: PropTypes.string,
|
|
}
|
|
|
|
static defaultProps = {
|
|
leftSidebarOpen: false,
|
|
rightSidebarOpen: false,
|
|
}
|
|
|
|
onLeftSidebarValueChanged = value => {
|
|
this.props.setLeftSidebarOpen(!!value)
|
|
}
|
|
|
|
onRightSidebarValueChanged = value => {
|
|
this.props.setRightSidebarOpen(!!value)
|
|
}
|
|
|
|
render() {
|
|
const leftSidebarToggle = [
|
|
{
|
|
value: 'studies',
|
|
svgLink: `${Icons}#icon-studies`,
|
|
svgWidth: 15,
|
|
svgHeight: 13,
|
|
bottomLabel: 'Series',
|
|
},
|
|
]
|
|
|
|
const rightSidebarToggle = [
|
|
{
|
|
value: 'measurements',
|
|
svgLink: `${Icons}#icon-measurements-lesions`,
|
|
svgWidth: 15,
|
|
svgHeight: 13,
|
|
bottomLabel: 'Measurements',
|
|
},
|
|
]
|
|
|
|
const leftSidebarValue = this.props.leftSidebarOpen
|
|
? leftSidebarToggle[0].value
|
|
: null
|
|
|
|
const rightSidebarValue = this.props.rightSidebarOpen
|
|
? rightSidebarToggle[0].value
|
|
: null
|
|
|
|
const currentPluginId = this.props.pluginId
|
|
|
|
const { PLUGIN_TYPES, availablePlugins } = OHIF.plugins
|
|
const plugin = availablePlugins.find(entry => {
|
|
return entry.type === PLUGIN_TYPES.TOOLBAR && entry.id === currentPluginId
|
|
})
|
|
|
|
let pluginComp
|
|
if (plugin) {
|
|
const PluginComponent = plugin.component
|
|
|
|
pluginComp = <PluginComponent />
|
|
}
|
|
|
|
return (
|
|
<div className="ToolbarRow">
|
|
<div className="pull-left m-t-1 p-y-1" style={{ padding: '10px' }}>
|
|
<RoundedButtonGroup
|
|
options={leftSidebarToggle}
|
|
value={leftSidebarValue}
|
|
onValueChanged={this.onLeftSidebarValueChanged}
|
|
/>
|
|
</div>
|
|
{pluginComp}
|
|
<ConnectedLayoutButton />
|
|
<ConnectedPluginSwitch />
|
|
<div className="pull-right m-t-1 rm-x-1" style={{ marginLeft: 'auto' }}>
|
|
<RoundedButtonGroup
|
|
options={rightSidebarToggle}
|
|
value={rightSidebarValue}
|
|
onValueChanged={this.onRightSidebarValueChanged}
|
|
/>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
}
|
|
|
|
export default ToolbarRow
|