diff --git a/client/app/scripts/charts/edge.js b/client/app/scripts/charts/edge.js index 44d7e6a06..665bee48f 100644 --- a/client/app/scripts/charts/edge.js +++ b/client/app/scripts/charts/edge.js @@ -84,11 +84,11 @@ export default class Edge extends React.Component { } ensureSameLength(points) { - // Spring needs constant list length, hoping that dagre will insert never more than 10 - const length = 10; + // Spring needs constant list length, hoping that dagre will insert never more than 30 + const length = 30; let missing = length - points.length; - while (missing) { + while (missing > 0) { points.unshift(points[0]); missing = length - points.length; } diff --git a/client/app/scripts/charts/nodes-layout.js b/client/app/scripts/charts/nodes-layout.js index c4db147ad..8504236b2 100644 --- a/client/app/scripts/charts/nodes-layout.js +++ b/client/app/scripts/charts/nodes-layout.js @@ -359,6 +359,9 @@ export function doLayout(immNodes, immEdges, opts) { const graph = cache.graph; const nodesWithDegrees = updateNodeDegrees(immNodes, immEdges); layout = runLayoutEngine(graph, nodesWithDegrees, immEdges, opts); + if (!layout) { + return layout; + } layout = layoutSingleNodes(layout, opts); layout = shiftLayoutToCenter(layout, opts); } diff --git a/client/app/scripts/components/app.js b/client/app/scripts/components/app.js index 032079b0e..c495a8b22 100644 --- a/client/app/scripts/components/app.js +++ b/client/app/scripts/components/app.js @@ -12,6 +12,7 @@ import Details from './details'; import Nodes from './nodes'; import EmbeddedTerminal from './embedded-terminal'; import { getRouter } from '../utils/router-utils'; +import { showingDebugToolbar, DebugToolbar } from './debug-toolbar.js'; const ESC_KEY_CODE = 27; @@ -79,6 +80,7 @@ export default class App extends React.Component { return (
+ {showingDebugToolbar() && } {showingDetails &&
_.sample(collection)); +}; + +const deltaAdd = function(name, adjacency = []) { + return { + 'adjacency': adjacency, + 'controls': {}, + 'id': name, + 'label_major': name, + 'label_minor': 'weave-1', + 'latest': {}, + 'metadata': {}, + 'origins': [], + 'rank': 'alpine' + }; +}; + +function addNodes(n) { + const ns = AppStore.getNodes(); + const nodeNames = ns.keySeq().toJS(); + const newNodeNames = _.range(ns.size, ns.size + n).map((i) => 'zing' + i); + const allNodes = _(nodeNames).concat(newNodeNames).value(); + + receiveNodesDelta({ + add: newNodeNames.map((name) => deltaAdd(name, sample(allNodes))) + }); +} + +export function showingDebugToolbar() { + return Boolean(localStorage.debugToolbar); +} + +export class DebugToolbar extends React.Component { + + constructor(props, context) { + super(props, context); + this.onChange = this.onChange.bind(this); + this.state = { + nodesToAdd: 30 + }; + } + + onChange(ev) { + this.setState({nodesToAdd: parseInt(ev.target.value, 10)}); + } + + render() { + log('rending debug panel'); + + return ( +
+ + + + + +
+ ); + } +} diff --git a/client/app/styles/main.less b/client/app/styles/main.less index a4d965c70..ecd0178d2 100644 --- a/client/app/styles/main.less +++ b/client/app/styles/main.less @@ -715,3 +715,17 @@ h2 { color: @text-color; } } + +// +// Debug panel! +// + +.debug-panel { + .shadow-2; + background-color: #fff; + top: 10px; + position: absolute; + padding: 10px; + left: 10px; + z-index: 10000; +}