From b07a804bf3a15d6dcd047a8ab9d86b4dbb6af983 Mon Sep 17 00:00:00 2001
From: Sonja Happ <sonja.happ@eonerc.rwth-aachen.de>
Date: Fri, 19 Jun 2020 09:51:25 +0200
Subject: [PATCH] Consider signal direction when connecting signals with
 widgets (out signals only for display widgets and in signals only for
 manipulation widgets) #218

---
 .../edit-widget/edit-widget-control-creator.js | 18 +++++++++---------
 .../edit-widget/edit-widget-signal-control.js  | 10 ++++++----
 .../edit-widget/edit-widget-signals-control.js | 16 +++++++++++++---
 3 files changed, 28 insertions(+), 16 deletions(-)

diff --git a/src/widget/edit-widget/edit-widget-control-creator.js b/src/widget/edit-widget/edit-widget-control-creator.js
index 90ded85..1b2f996 100644
--- a/src/widget/edit-widget/edit-widget-control-creator.js
+++ b/src/widget/edit-widget/edit-widget-control-creator.js
@@ -47,20 +47,20 @@ export default function CreateControls(widgetType = null, widget = null, session
             break;
         case 'Action':
             DialogControls.push(
-              <EditWidgetSignalControl key={0} widget={widget} controlId={'signalIDs'} signals={signals} handleChange={(e) => handleChange(e)} />,
+              <EditWidgetSignalControl key={0} widget={widget} controlId={'signalIDs'} signals={signals} handleChange={(e) => handleChange(e)} direction={'in'} />,
             );
             break;
         case 'Value':
             DialogControls.push(
                 <EditWidgetTextControl key={0} widget={widget} controlId={'name'} label={'Signal name'} placeholder={'Enter text'} handleChange={e => handleChange(e)} />,
-                <EditWidgetSignalControl key={1} widget={widget} controlId={'signalIDs'} signals={signals} handleChange={(e) => handleChange(e)} />,
+                <EditWidgetSignalControl key={1} widget={widget} controlId={'signalIDs'} signals={signals} handleChange={(e) => handleChange(e)} direction={'out'}/>,
                 <EditWidgetTextSizeControl key={2} widget={widget} handleChange={e => handleChange(e)} />,
                 <EditWidgetCheckboxControl key={3} widget={widget} controlId={'customProperties.showUnit'} input text="Show unit" handleChange={e => handleChange(e)} />
             );
             break;
         case 'Lamp':
               DialogControls.push(
-                <EditWidgetSignalControl key={0} widget={widget} controlId={'signalIDs'} signals={signals} handleChange={(e) => handleChange(e)} />,
+                <EditWidgetSignalControl key={0} widget={widget} controlId={'signalIDs'} signals={signals} handleChange={(e) => handleChange(e)} direction={'out'}/>,
                 <EditWidgetTextControl key={1} widget={widget} controlId={'customProperties.threshold'} label={'Threshold'} placeholder={'0.5'} handleChange={e => handleChange(e)} />,
                 <EditWidgetColorControl key={2} widget={widget} controlId={'customProperties.on_color'} label={'Color On'} handleChange={(e) => handleChange(e)} />,
                 <EditWidgetColorControl key={3} widget={widget} controlId={'customProperties.off_color'} label={'Color Off'} handleChange={(e) => handleChange(e)} />,
@@ -69,14 +69,14 @@ export default function CreateControls(widgetType = null, widget = null, session
         case 'Plot':
             DialogControls.push(
                 <EditWidgetTimeControl key={0} widget={widget} controlId={'customProperties.time'} handleChange={(e) => handleChange(e)} />,
-                <EditWidgetSignalsControl key={1} widget={widget} controlId={'signalIDs'}  signals={signals} handleChange={(e) => handleChange(e)} />,
+                <EditWidgetSignalsControl key={1} widget={widget} controlId={'signalIDs'}  signals={signals} handleChange={(e) => handleChange(e)} direction={'out'}/>,
                 <EditWidgetTextControl key={2} widget={widget} controlId={'customProperties.ylabel'} label={'Y-Axis name'} placeholder={'Enter a name for the y-axis'}  handleChange={(e) => handleChange(e)} />,
                 <EditWidgetMinMaxControl key={3} widget={widget} controlId="customProperties.y" handleChange={e => handleChange(e)} />
             );
             break;
         case 'Table':
             DialogControls.push(
-                <EditWidgetSignalsControl key={0} widget={widget} controlId={'signalIDs'}  signals={signals} handleChange={(e) => handleChange(e)} />,
+                <EditWidgetSignalsControl key={0} widget={widget} controlId={'signalIDs'}  signals={signals} handleChange={(e) => handleChange(e)} direction={'out'}/>,
                 <EditWidgetCheckboxControl key={1} widget={widget} controlId={'customProperties.showUnit'} input text="Show unit" handleChange={e => handleChange(e)} />
             );
             break;
@@ -91,7 +91,7 @@ export default function CreateControls(widgetType = null, widget = null, session
         case 'Gauge':
             DialogControls.push(
                 <EditWidgetTextControl key={0} widget={widget} controlId={'name'} label={'Text'} placeholder={'Enter text'} handleChange={e => handleChange(e)} />,
-                <EditWidgetSignalControl key={1} widget={widget} controlId={'signalIDs'} signals={signals} handleChange={(e) => handleChange(e)} />,
+                <EditWidgetSignalControl key={1} widget={widget} controlId={'signalIDs'} signals={signals} handleChange={(e) => handleChange(e)} direction={'out'}/>,
                 <EditWidgetCheckboxControl key={2} widget={widget} controlId="customProperties.colorZones" input text="Show color zones" handleChange={e => handleChange(e)} />,
                 <EditWidgetColorZonesControl key={3} widget={widget} handleChange={e => handleChange(e)} />,
                 <EditWidgetMinMaxControl key={4} widget={widget} controlId="customProperties.value" handleChange={e => handleChange(e)} />
@@ -101,7 +101,7 @@ export default function CreateControls(widgetType = null, widget = null, session
             DialogControls.push(
                 <EditWidgetTextControl key={0} widget={widget} controlId={'name'} label={'Text'} placeholder={'Enter text'} handleChange={e => handleChange(e)} />,
                 <EditWidgetOrientation key={1} widget={widget} handleChange={(e) => handleChange(e)} />,
-                <EditWidgetSignalControl key={2} widget={widget} controlId={'signalIDs'} input signals={signals} handleChange={(e) => handleChange(e)} />,
+                <EditWidgetSignalControl key={2} widget={widget} controlId={'signalIDs'} input signals={signals} handleChange={(e) => handleChange(e)} direction={'in'}/>,
                 <EditWidgetCheckboxControl key={3} widget={widget} controlId={'customProperties.continous_update'} input text={'Continous Update'} handleChange={(e) => handleChange(e)} />,
                 <EditWidgetCheckboxControl key={4} widget={widget} controlId={'customProperties.showUnit'} input text="Show unit" handleChange={e => handleChange(e)} />,
                 <EditWidgetMinMaxControl key={5} widget={widget} controlId={'customProperties.range'} handleChange={e => handleChange(e)} />,
@@ -112,7 +112,7 @@ export default function CreateControls(widgetType = null, widget = null, session
         case 'Button':
             DialogControls.push(
                 <EditWidgetTextControl key={0} widget={widget} controlId={'name'} label={'Text'} placeholder={'Enter text'} handleChange={e => handleChange(e)} />,
-                <EditWidgetSignalControl key={1} widget={widget} controlId={'signalIDs'} input signals={signals} handleChange={(e) => handleChange(e)} />,
+                <EditWidgetSignalControl key={1} widget={widget} controlId={'signalIDs'} input signals={signals} handleChange={(e) => handleChange(e)} direction={'in'}/>,
                 <EditWidgetCheckboxControl key={2} widget={widget} controlId={'customProperties.toggle'} input text="Toggle" handleChange={e => handleChange(e)} />,
                 <EditWidgetNumberControl key={3} widget={widget} controlId={'customProperties.on_value'} label={'On Value'} defaultValue={1} handleChange={(e) => handleChange(e)} />,
                 <EditWidgetNumberControl key={4} widget={widget} controlId={'customProperties.off_value'} label={'Off Value'} defaultValue={0} handleChange={(e) => handleChange(e)} />
@@ -148,7 +148,7 @@ export default function CreateControls(widgetType = null, widget = null, session
         case 'NumberInput':
             DialogControls.push(
                 <EditWidgetTextControl key={0} widget={widget} controlId={'name'} label={'Text'} placeholder={'Enter text'} handleChange={e => handleChange(e)} />,
-                <EditWidgetSignalControl key={2} widget={widget} controlId={'signalIDs'} input  signals={signals} handleChange={(e) => handleChange(e)} />,
+                <EditWidgetSignalControl key={2} widget={widget} controlId={'signalIDs'} input  signals={signals} handleChange={(e) => handleChange(e)} direction={'in'}/>,
                 <EditWidgetCheckboxControl key={1} widget={widget} controlId={'customProperties.showUnit'} input text="Show unit" handleChange={e => handleChange(e)} />
             );
             break;
diff --git a/src/widget/edit-widget/edit-widget-signal-control.js b/src/widget/edit-widget/edit-widget-signal-control.js
index aaa9c24..cc9135d 100644
--- a/src/widget/edit-widget/edit-widget-signal-control.js
+++ b/src/widget/edit-widget/edit-widget-signal-control.js
@@ -23,13 +23,15 @@ class EditWidgetSignalControl extends Component {
     super(props);
 
     this.state = {
-      widget: {}
+      widget: {},
+      signals: []
     };
   }
 
   static getDerivedStateFromProps(props, state){
     return {
-      widget: props.widget
+      widget: props.widget,
+      signals: props.signals.filter(s => s.direction === props.direction)
     };
   }
 
@@ -51,10 +53,10 @@ class EditWidgetSignalControl extends Component {
           <FormControl as="select" value={this.props.widget.signalIDs[0] || ""} onChange={(e) => this.handleSignalChange(e)}>
           <option default>Select signal</option>
             {
-              this.props.signals.length === 0 ? (
+              this.state.signals.length === 0 ? (
                 <option disabled value style={{ display: 'none' }}>No signals available.</option>
               ) : (
-                this.props.signals.map((signal, index) => (
+                this.state.signals.map((signal, index) => (
                   <option key={index} value={signal.id}>{signal.name}</option>
                 ))
               )
diff --git a/src/widget/edit-widget/edit-widget-signals-control.js b/src/widget/edit-widget/edit-widget-signals-control.js
index 109df2e..ad4658b 100644
--- a/src/widget/edit-widget/edit-widget-signals-control.js
+++ b/src/widget/edit-widget/edit-widget-signals-control.js
@@ -23,7 +23,17 @@ class EditWidgetSignalsControl extends Component {
     super(props);
 
     this.state = {
+      widget: {},
+      signals: [],
+      checkedSignals: props.widget[props.controlId]
+    };
+  }
+
+
+  static getDerivedStateFromProps(props, state){
+    return {
       widget: props.widget,
+      signals: props.signals.filter(s => s.direction === props.direction),
       checkedSignals: props.widget[props.controlId]
     };
   }
@@ -48,10 +58,10 @@ class EditWidgetSignalsControl extends Component {
         <FormGroup>
           <FormLabel>Signals</FormLabel>
           {
-            this.props.signals === 0 || !this.state.widget.hasOwnProperty(this.props.controlId)? (
+            this.state.signals === 0 || !this.state.widget.hasOwnProperty(this.props.controlId)? (
               <FormLabel>No signals available</FormLabel>
             ) : (
-              this.props.signals.map((signal, index) => (
+              this.state.signals.map((signal, index) => (
                 <FormCheck
                   type={'checkbox'}
                   label={signal.name}
@@ -61,7 +71,7 @@ class EditWidgetSignalsControl extends Component {
                   onChange={(e) => this.handleSignalChange(e.target.checked, signal.id)}>
                 </FormCheck>
                 ))
-            )
+              )
           }
         </FormGroup>
     );