Skip to content
Snippets Groups Projects
Commit b8a6f60a authored by Matthias Konitzny's avatar Matthias Konitzny :fire:
Browse files

Fixed editor graph loading.

parent c9f3cee1
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
src/editor/editor.tsx
+ 88
− 83
View file @ b8a6f60a
......@@ -657,94 +657,99 @@ export class Editor extends React.PureComponent<propTypes, stateTypes> {
) : undefined}
</SelectLayer>
</div>
<div id="sidepanel">
<HistoryNavigator
spaceId="space"
history={this.state.graph.history}
onChange={this.onGraphDataChange}
/>
<hr />
<NodeDetails
selectedNodes={this.state.selectedNodes}
allTypes={
this.state.graph
? this.state.graph.objectGroups
: []
}
onChange={this.forceUpdate}
/>
<hr />
<h3>Node types</h3>
<NodeTypesEditor
onChange={this.forceUpdate}
graph={this.state.graph}
onSelectAll={this.handleNodeTypeSelect}
/>
<hr />
<h3>Settings</h3>
<input
id="node-labe-visibility"
type={"checkbox"}
checked={this.state.visibleLabels}
onChange={(event) => {
const newValue = event.target.checked;
if (newValue == this.state.visibleLabels) {
return;
{this.state.graph && (
<div id="sidepanel">
<HistoryNavigator
spaceId="space"
history={this.state.graph.history}
onChange={this.onGraphDataChange}
/>
<hr />
<NodeDetails
selectedNodes={this.state.selectedNodes}
allTypes={
this.state.graph
? this.state.graph.objectGroups
: []
}
onChange={this.forceUpdate}
/>
<hr />
<h3>Node types</h3>
<NodeTypesEditor
onChange={this.forceUpdate}
graph={this.state.graph}
onSelectAll={this.handleNodeTypeSelect}
/>
<hr />
<h3>Settings</h3>
<input
id="node-labe-visibility"
type={"checkbox"}
checked={this.state.visibleLabels}
onChange={(event) => {
const newValue = event.target.checked;
if (newValue == this.state.visibleLabels) {
return;
}
this.setState({
visibleLabels: newValue,
});
}}
/>
<label htmlFor="node-labe-visibility">
Node labels
</label>
<br />
<input
id="connect-on-drag"
type={"checkbox"}
checked={this.state.connectOnDrag}
onChange={(event) => {
const newValue = event.target.checked;
if (newValue == this.state.connectOnDrag) {
return;
}
this.setState({
visibleLabels: newValue,
});
}}
/>
<label htmlFor="node-labe-visibility">
Node labels
</label>
<br />
<input
id="connect-on-drag"
type={"checkbox"}
checked={this.state.connectOnDrag}
onChange={(event) => {
const newValue = event.target.checked;
if (newValue == this.state.connectOnDrag) {
return;
}
this.setState({
connectOnDrag: newValue,
});
}}
/>
<label htmlFor="connect-on-drag">
Connect nodes when dragged
</label>
<hr />
<ul className="instructions">
<li>Click background to create node</li>
<li>
SHIFT+Click and drag on background to add nodes
to selection
</li>
<li>CTRL+Click background to clear selection</li>
<li>Click node to select and edit</li>
<li>
SHIFT+Click node to add or remove from selection
</li>
<li>CTRL+Click another node to connect</li>
<li>Right-Click node to delete</li>
<li>Right-Click link to delete</li>
{this.state.connectOnDrag ? (
this.setState({
connectOnDrag: newValue,
});
}}
/>
<label htmlFor="connect-on-drag">
Connect nodes when dragged
</label>
<hr />
<ul className="instructions">
<li>Click background to create node</li>
<li>
Drag node close to other node to connect
SHIFT+Click and drag on background to add
nodes to selection
</li>
) : (
""
)}
<li>DELETE to delete selected nodes</li>
<li>ESCAPE to clear selection</li>
</ul>
</div>
<li>
CTRL+Click background to clear selection
</li>
<li>Click node to select and edit</li>
<li>
SHIFT+Click node to add or remove from
selection
</li>
<li>CTRL+Click another node to connect</li>
<li>Right-Click node to delete</li>
<li>Right-Click link to delete</li>
{this.state.connectOnDrag ? (
<li>
Drag node close to other node to connect
</li>
) : (
""
)}
<li>DELETE to delete selected nodes</li>
<li>ESCAPE to clear selection</li>
</ul>
</div>
)}
</div>
</div>
);
......
src/editor/graph.ts
+ 15
− 1
View file @ b8a6f60a
......@@ -3,7 +3,7 @@ import { NodeType } from "../common/graph/nodetype";
import { Node, NodeData, SimNodeData } from "../common/graph/node";
import * as Common from "../common/graph/graph";
import { History } from "../common/history";
import { GraphContent, SimGraphData } from "../common/graph/graph";
import { GraphContent, GraphData, SimGraphData } from "../common/graph/graph";
export class DynamicGraph extends Common.Graph {
public history: History<SimGraphData>;
......@@ -14,11 +14,25 @@ export class DynamicGraph extends Common.Graph {
constructor(data?: GraphContent) {
super(data);
this.onChangeCallbacks = [];
if (data != undefined) {
this.history = new History<SimGraphData>(
this,
20,
"Created new graph."
);
}
}
public fromSerializedObject(data: GraphData | SimGraphData): DynamicGraph {
super.fromSerializedObject(data);
this.history = new History<SimGraphData>(
this,
20,
"Created new graph."
);
return this;
}
/**
......
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