Commit 4d6c1859 authored by Patrik Meijer's avatar Patrik Meijer
Browse files

Fix some styling

parent e0f7d8ae
...@@ -545,9 +545,7 @@ ${activeSelection.includes(edgeId) ? ' in-active-selection' : ''}`, ...@@ -545,9 +545,7 @@ ${activeSelection.includes(edgeId) ? ' in-active-selection' : ''}`,
y: orgEvent.clientY, y: orgEvent.clientY,
}, },
}, },
}); }, () => {
setTimeout(() => {
setActiveSelection([nodeId]); setActiveSelection([nodeId]);
}); });
} }
......
...@@ -38,23 +38,31 @@ export default class ReactCytoscape extends Component { ...@@ -38,23 +38,31 @@ export default class ReactCytoscape extends Component {
}; };
componentDidMount() { componentDidMount() {
const {
style,
layout,
elements,
hyperEdges,
cytoscapeOptions,
cyRef,
} = this.props;
const opts = Object.assign({ const opts = Object.assign({
container: this.container, container: this.container,
boxSelectionEnabled: false, boxSelectionEnabled: false,
autounselectify: true, autounselectify: true,
style: this.props.style, style,
layout: this.props.layout, layout,
}, this.props.cytoscapeOptions); }, cytoscapeOptions);
this.cy = cytoscape(opts); this.cy = cytoscape(opts);
this.edgeConnHandler = this.cy.edgeConnections(); this.edgeConnHandler = this.cy.edgeConnections();
this.cy.json({elements: this.props.elements}); this.cy.json({elements});
this.edgeConnHandler.addEdges(this.props.hyperEdges); this.edgeConnHandler.addEdges(hyperEdges);
if (this.props.cyRef) { if (cyRef) {
this.props.cyRef(this.cy, this.container); cyRef(this.cy, this.container);
} }
return this.cy; return this.cy;
...@@ -97,17 +105,18 @@ export default class ReactCytoscape extends Component { ...@@ -97,17 +105,18 @@ export default class ReactCytoscape extends Component {
} }
render() { render() {
const {style, containerID} = this.props;
const styleContainer = Object.assign({ const styleContainer = Object.assign({
height: '100%', height: '100%',
width: '100%', width: '100%',
display: 'block', display: 'block',
position: 'relative', position: 'relative',
top: -40, // Magic: this is to float under the action buttons top: -40, // Magic: this is to float under the action buttons
}, ...this.props.style); }, ...style);
return ( return (
<div <div
className="graph" className="graph"
id={this.props.containerID} id={containerID}
ref={(elt) => { ref={(elt) => {
this.container = elt; this.container = elt;
}} }}
......
...@@ -80,12 +80,13 @@ export default class SubTreeWatcher extends Component { ...@@ -80,12 +80,13 @@ export default class SubTreeWatcher extends Component {
componentWillReceiveProps(newProps) { componentWillReceiveProps(newProps) {
const {activeNode} = newProps; const {activeNode} = newProps;
const {options: currOptions, activeNode: currActiveNode} = this.props;
if (newProps.options !== this.props.options) { if (newProps.options !== currOptions) {
this.options = Object.assign(DEFAULT_OPTIONS, newProps.options); this.options = Object.assign(DEFAULT_OPTIONS, newProps.options);
} }
if (activeNode !== this.props.activeNode) { if (activeNode !== currActiveNode) {
this.setState({ this.setState({
territory: { territory: {
[activeNode]: {children: this.options.depth}, [activeNode]: {children: this.options.depth},
...@@ -212,7 +213,7 @@ export default class SubTreeWatcher extends Component { ...@@ -212,7 +213,7 @@ export default class SubTreeWatcher extends Component {
render() { render() {
const {territory, children} = this.state; const {territory, children} = this.state;
const {gmeClient} = this.props; const {gmeClient, children: childElements} = this.props;
return ( return (
<div style={{width: '100%', height: '100%'}}> <div style={{width: '100%', height: '100%'}}>
...@@ -224,7 +225,7 @@ export default class SubTreeWatcher extends Component { ...@@ -224,7 +225,7 @@ export default class SubTreeWatcher extends Component {
reuseTerritory={false} reuseTerritory={false}
/> />
{React.cloneElement( {React.cloneElement(
React.Children.only(this.props.children), React.Children.only(childElements),
Object.assign({}, this.props, {nodes: children}), Object.assign({}, this.props, {nodes: children}),
)} )}
</div>); </div>);
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment