From 46850fb82d48f4e23714872156e2e98798f3fbd8 Mon Sep 17 00:00:00 2001
From: Laura Fuentes Grau <laurafuentesgrau@gmail.com>
Date: Fri, 27 Nov 2020 18:46:12 +0100
Subject: [PATCH] Image Widget: lockAspect now works #267 , image loads after
 changing between editing and normal mode

---
 src/dashboard/dashboard.js            | 11 +++++++++++
 src/widget/edit-widget/edit-widget.js | 14 ++++++--------
 2 files changed, 17 insertions(+), 8 deletions(-)

diff --git a/src/dashboard/dashboard.js b/src/dashboard/dashboard.js
index 27d4542..b5f1aba 100644
--- a/src/dashboard/dashboard.js
+++ b/src/dashboard/dashboard.js
@@ -352,11 +352,19 @@ class Dashboard extends Component {
           data: widget
         });
       }
+      else if (widget.type === 'Image'){
+        widget.customProperties.update = true;
+      }
     });
     this.setState({ editing: true, widgetOrigIDs: originalIDs });
   };
 
   saveEditing() {
+    this.state.widgets.forEach(widget => {
+      if (widget.type === 'Image'){
+        widget.customProperties.update = true;
+      }
+    });
     // Provide the callback so it can be called when state change is applied
     // TODO: Check if callback is needed
     AppDispatcher.dispatch({
@@ -391,6 +399,9 @@ class Dashboard extends Component {
   cancelEditing() {
     //raw widget has no id -> cannot be deleted in its original form
     this.state.widgets.forEach(widget => {
+      if (widget.type === 'Image'){
+        widget.customProperties.update = true;
+      }
       let tempID = this.state.widgetOrigIDs.find(element => element === widget.id);
       if (typeof tempID === 'undefined') {
         AppDispatcher.dispatch({
diff --git a/src/widget/edit-widget/edit-widget.js b/src/widget/edit-widget/edit-widget.js
index 7d7c311..0c1aad8 100644
--- a/src/widget/edit-widget/edit-widget.js
+++ b/src/widget/edit-widget/edit-widget.js
@@ -52,9 +52,9 @@ class EditWidgetDialog extends React.Component {
     const file = this.props.files.find(element => element.id === fileId);
 
     // scale width to match aspect
-    if(file.dimensions){
-    const aspectRatio = file.dimensions.width / file.dimensions.height;
-    changeObject.width = this.state.temporal.height * aspectRatio;
+    if(file.imageWidth && file.imageHeight){
+    const aspectRatio = file.imageWidth / file.imageHeight;
+    changeObject.width = parseInt(this.state.temporal.height * aspectRatio,10);
     }
 
     return changeObject;
@@ -119,14 +119,12 @@ class EditWidgetDialog extends React.Component {
       {
         customProperty ? changeObject[parts[0]][parts[1]] = -1 : changeObject[e.target.id] = -1;
       } else {
+        if(this.state.temporal.customProperties.lockAspect){
+          changeObject = this.assignAspectRatio(changeObject, e.target.value);
+        }
         customProperty ? changeObject[parts[0]][parts[1]] = e.target.value : changeObject[e.target.id] = e.target.value;
       }
 
-      // get file and update size (if it's an image)
-      /*if ((changeObject.customProperties.file !== -1)&&('lockAspect' in this.state.temporal && this.state.temporal.lockAspect)) {
-        // TODO this if condition requires changes to work!!!
-        changeObject = this.assignAspectRatio(changeObject, e.target.value);
-      }*/
     } else if (parts[1] === 'textSize'){
       changeObject[parts[0]][parts[1]] = Number(e.target.value);
       changeObject = this.setMaxWidth(changeObject);