From bf1f4513fd445c30df519d4d0dc8935e305ba628 Mon Sep 17 00:00:00 2001 From: Ricardo Hernandez-Montoya Date: Wed, 10 Jan 2018 13:58:25 +0100 Subject: [PATCH] notify if no topology model has been selected. --- src/components/widget-topology.js | 27 ++++++++++++++++++++++----- 1 file changed, 22 insertions(+), 5 deletions(-) diff --git a/src/components/widget-topology.js b/src/components/widget-topology.js index 796d18e..5181f83 100644 --- a/src/components/widget-topology.js +++ b/src/components/widget-topology.js @@ -49,7 +49,7 @@ const msgContainerStyle = Object.assign({ backgroundColor: '#ececec' },spinnerContainerStyle) -const failedMsgStyle = { +const msgStyle = { fontWeight: 'bold' } @@ -78,6 +78,11 @@ class WidgetTopology extends React.Component { } } + attachComponentEvents() { + window.onMouseOver = (e) => console.log(e); + window.onMouseLeave = (e) => console.log(e); + } + componentWillReceiveProps(nextProps) { const file = nextProps.files.find(file => file._id === nextProps.widget.file); // Ensure model is requested only once or a different was selected @@ -90,15 +95,27 @@ class WidgetTopology extends React.Component { this.setState({'visualizationState': 'ready' }); window.cimxml.clearXmlData() window.cimsvg.setFileCount(1); - response.text().then( contents => window.cimsvg.loadFile(contents)); + response.text().then( contents => { + window.cimsvg.loadFile(contents); + this.attachComponentEvents(); + }); } else { throw new Error('Request failed'); } }) .catch(error => { - this.setState({'visualizationState': 'failed' }); + this.setState({ + 'visualizationState': 'show_message', + 'message': 'Topology could not be loaded.'}); }); } + } else { + // No file has been selected + if (!nextProps.widget.file) { + this.setState({ + 'visualizationState': 'show_message', + 'message': 'Select a topology model first.'}); + } } } @@ -108,8 +125,8 @@ class WidgetTopology extends React.Component { switch(this.state.visualizationState) { case 'loading': markup =
; break; - case 'failed': - markup =
Topology could not be loaded
; break; + case 'show_message': + markup =
{ this.state.message }
; break; default: markup = (