diff --git a/client/app/scripts/components/debug-toolbar.js b/client/app/scripts/components/debug-toolbar.js
index 97145ff7c..ae61fff59 100644
--- a/client/app/scripts/components/debug-toolbar.js
+++ b/client/app/scripts/components/debug-toolbar.js
@@ -9,6 +9,7 @@ import { fromJS } from 'immutable';
import debug from 'debug';
const log = debug('scope:debug-panel');
+import ActionTypes from '../constants/action-types';
import { receiveNodesDelta } from '../actions/app-actions';
import { getNodeColor, getNodeColorDark, text2degree } from '../utils/color-utils';
@@ -111,11 +112,13 @@ function stopPerf() {
Perf.printWasted(measurements);
}
+
function startPerf(delay) {
Perf.start();
setTimeout(stopPerf, delay * 1000);
}
+
export function showingDebugToolbar() {
return (('debugToolbar' in localStorage && JSON.parse(localStorage.debugToolbar))
|| location.pathname.indexOf('debug') > -1);
@@ -134,11 +137,23 @@ function enableLog(ns) {
window.location.reload();
}
+
function disableLog() {
debug.disable();
window.location.reload();
}
+
+function setAppState(fn) {
+ return (dispatch) => {
+ dispatch({
+ type: ActionTypes.DEBUG_TOOLBAR_INTERFERING,
+ fn
+ });
+ };
+}
+
+
class DebugToolbar extends React.Component {
constructor(props, context) {
@@ -162,6 +177,10 @@ class DebugToolbar extends React.Component {
});
}
+ setLoading(loading) {
+ this.props.setAppState(state => state.set('topologiesLoaded', !loading));
+ }
+
addNodes(n, prefix = 'zing') {
const ns = this.props.nodes;
const nodeNames = ns.keySeq().toJS();
@@ -243,6 +262,12 @@ class DebugToolbar extends React.Component {
))}
+
+
+
+
+
+
@@ -254,6 +279,7 @@ class DebugToolbar extends React.Component {
}
}
+
function mapStateToProps(state) {
return {
nodes: state.get('nodes'),
@@ -261,6 +287,8 @@ function mapStateToProps(state) {
};
}
+
export default connect(
- mapStateToProps
+ mapStateToProps,
+ {setAppState}
)(DebugToolbar);
diff --git a/client/app/scripts/components/nodes.js b/client/app/scripts/components/nodes.js
index d2ce010be..9da9992b6 100644
--- a/client/app/scripts/components/nodes.js
+++ b/client/app/scripts/components/nodes.js
@@ -62,15 +62,24 @@ class Nodes extends React.Component {
);
}
+ renderLoading(show) {
+ return (
+
+ Loading Topologies
+
+ );
+ }
+
render() {
- const { nodes, selectedNodeId, topologyEmpty } = this.props;
+ const { nodes, selectedNodeId, topologyEmpty, topologiesLoaded } = this.props;
const layoutPrecision = getLayoutPrecision(nodes.size);
const hasSelectedNode = selectedNodeId && nodes.has(selectedNodeId);
- const errorEmpty = this.renderEmptyTopologyError(topologyEmpty);
return (
- {topologyEmpty && errorEmpty}
+ {!topologiesLoaded ?
+ this.renderLoading(!topologiesLoaded) :
+ (topologyEmpty && this.renderEmptyTopologyError(topologyEmpty))}