From f3d0576dd6166b1d05b4a8898595724891ad2c2a Mon Sep 17 00:00:00 2001
From: Laura Fuentes Grau <laurafuentesgrau@gmail.com>
Date: Thu, 2 Apr 2020 15:55:05 +0200
Subject: [PATCH 1/2] HTML content: pressing enter doesn't reload page anymore,
 Orientation: type can now be changed

---
 src/widget/edit-widget/edit-widget-html-content.js | 8 ++++----
 src/widget/edit-widget/edit-widget-orientation.js  | 5 ++++-
 2 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/widget/edit-widget/edit-widget-html-content.js b/src/widget/edit-widget/edit-widget-html-content.js
index 07f89fb..1df71d5 100644
--- a/src/widget/edit-widget/edit-widget-html-content.js
+++ b/src/widget/edit-widget/edit-widget-html-content.js
@@ -60,15 +60,15 @@ class EditWidgetHTMLContent extends React.Component {
 
   handleKeyIgnore(event){
     // This function prevents a keystroke from beeing handled by dialog.js
-    event.stopPropagation();
-  }
-
+    event.stopPropagation();    
+    }
+    
 
   render() {
     return (
         <FormGroup controlId={this.props.controlId}>
           <FormLabel>HTML Content</FormLabel>
-          <FormControl type="text" onKeyPress={this.handleKeyIgnore} componentclass="textarea" style={{ height: 200 }} placeholder={this.props.placeholder} value={this.state.value} onChange={e => this.props.handleChange(e)} />
+          <FormControl  onKeyDown={this.handleKeyIgnore} componentclass="textarea" style={{ height: 200 }} placeholder={this.props.placeholder} value={this.state.value} onChange={e => this.props.handleChange(e)} />
           <FormControl.Feedback />
         </FormGroup>
     );
diff --git a/src/widget/edit-widget/edit-widget-orientation.js b/src/widget/edit-widget/edit-widget-orientation.js
index aee9c14..320d476 100644
--- a/src/widget/edit-widget/edit-widget-orientation.js
+++ b/src/widget/edit-widget/edit-widget-orientation.js
@@ -38,7 +38,9 @@ class EditWidgetOrientation extends Component {
   }
 
   handleOrientationChange(orientation) {
-    this.props.handleChange({ target: { id: 'orientation', value: orientation } });
+    console.log("handle OrinetationChange was called. the orientation: " + orientation);
+
+    this.props.handleChange({ target: { id: 'customProperties.orientation', value: orientation } });
   }
 
   render() {
@@ -55,6 +57,7 @@ class EditWidgetOrientation extends Component {
                 Object.keys(WidgetSlider.OrientationTypes).map( (type) => {
                   let value = WidgetSlider.OrientationTypes[type].value;
                   let name = WidgetSlider.OrientationTypes[type].name;
+                  console.log("value: " + value + " name: " + name)
 
                   return (
                     <FormCheck inline label={name} key={value} id={value} type='radio' title='orientation' checked={ value === this.state.widget.customProperties.orientation } onChange={(e) => this.handleOrientationChange(value)}>

From 834efecb8a56b822e8c48f17861a10ddb0d61bee Mon Sep 17 00:00:00 2001
From: Laura Fuentes Grau <laurafuentesgrau@gmail.com>
Date: Thu, 2 Apr 2020 19:35:40 +0200
Subject: [PATCH 2/2] Slider Widget now works in vertical mode

---
 .../edit-widget/edit-widget-orientation.js    | 11 +++++---
 src/widget/widgets/slider.js                  | 26 +++----------------
 2 files changed, 12 insertions(+), 25 deletions(-)

diff --git a/src/widget/edit-widget/edit-widget-orientation.js b/src/widget/edit-widget/edit-widget-orientation.js
index 320d476..5ac835f 100644
--- a/src/widget/edit-widget/edit-widget-orientation.js
+++ b/src/widget/edit-widget/edit-widget-orientation.js
@@ -38,9 +38,15 @@ class EditWidgetOrientation extends Component {
   }
 
   handleOrientationChange(orientation) {
-    console.log("handle OrinetationChange was called. the orientation: " + orientation);
-
     this.props.handleChange({ target: { id: 'customProperties.orientation', value: orientation } });
+    this.handleNewDimensions(this.state.widget.width,this.state.widget.height,this.state.widget.minWidth,this.state.widget.minHeight);
+  }
+
+  handleNewDimensions(width,height,minWidth,minHeight){
+    this.props.handleChange({ target: { id: 'height', value: width } });
+    this.props.handleChange({ target: { id: 'width', value: height } });
+    this.props.handleChange({ target: { id: 'minHeight', value: minWidth } });
+    this.props.handleChange({ target: { id: 'minWidth', value: minHeight } });
   }
 
   render() {
@@ -57,7 +63,6 @@ class EditWidgetOrientation extends Component {
                 Object.keys(WidgetSlider.OrientationTypes).map( (type) => {
                   let value = WidgetSlider.OrientationTypes[type].value;
                   let name = WidgetSlider.OrientationTypes[type].name;
-                  console.log("value: " + value + " name: " + name)
 
                   return (
                     <FormCheck inline label={name} key={value} id={value} type='radio' title='orientation' checked={ value === this.state.widget.customProperties.orientation } onChange={(e) => this.handleOrientationChange(value)}>
diff --git a/src/widget/widgets/slider.js b/src/widget/widgets/slider.js
index bd4a6fe..4b9bba5 100644
--- a/src/widget/widgets/slider.js
+++ b/src/widget/widgets/slider.js
@@ -57,7 +57,7 @@ class WidgetSlider extends Component {
     if (props.widget.customProperties.default_value && state.value === undefined) {
       returnState["value"] = props.widget.customProperties.default_value;
     }
-
+  
     // Update unit (assuming there is exactly one signal for this widget)
     let signalID = props.widget.signalIDs[0];
     let signal = props.signals.find(sig => sig.id === signalID);
@@ -76,6 +76,7 @@ class WidgetSlider extends Component {
 
   componentDidUpdate(prevProps: Readonly<P>, prevState: Readonly<S>, snapshot: SS): void {
     // Check if the orientation changed, update the size if it did
+    // this part didn't work -> dimensions and constraints are now handled by the edit orientation component
     if (this.props.widget.customProperties.orientation !== prevProps.widget.customProperties.orientation) {
       let baseWidget = this.props.widget;
 
@@ -125,33 +126,14 @@ class WidgetSlider extends Component {
                   });
 
     return (
-       !isVertical? (
         <div className={widgetClasses}>
           <label>{ fields.name }</label>
-          <div className='slider'>{ fields.control }</div>
+          { fields.control }
           <span>{ fields.value }</span>
+          {this.props.widget.customProperties.showUnit && fields.unit}
         </div>
-      ) : (
-        <div className={widgetClasses}>
-          <Slider vertical min={ this.props.widget.customProperties.rangeMin } max={ this.props.widget.customProperties.rangeMax } step={ this.props.widget.customProperties.step } value={ this.state.value } disabled={ this.props.editing } onChange={ (v) => this.valueIsChanging(v) } onAfterChange={ (v) => this.valueChanged(v) }/>,
-        </div>
-      )
     );
   }
 }
 
 export default WidgetSlider;
-/*!isVertical? (
-  <div className={widgetClasses}>
-    <label>{ fields.name }</label>
-    <div className='slider'>{ fields.control }</div>
-    <span>{ fields.value }</span>
-  </div>
-) : (
-  <div className={widgetClasses}>
-    <label>{ fields.name }</label>
-    { fields.control }
-    { fields.value }
-    { this.props.widget.customProperties.showUnit && fields.unit }
-  </div>
-)*/