From 4e44fb3d813ccb934dcfdf70cc1396b064eb93e0 Mon Sep 17 00:00:00 2001
From: Nathan Woulfe <nathan@nathanw.com.au>
Date: Wed, 17 Mar 2021 07:17:24 +1000
Subject: [PATCH 1/2] Update media.controller.js

access control values after reassigning
---
 .../views/propertyeditors/grid/editors/media.controller.js | 7 ++-----
 1 file changed, 2 insertions(+), 5 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/editors/media.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/editors/media.controller.js
index 716ca405c12e..b307fcd13438 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/editors/media.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/editors/media.controller.js
@@ -104,9 +104,6 @@ angular.module("umbraco")
          */
         function updateControlValue(selectedImage) {
 
-            const doGetThumbnail = $scope.control.value.focalPoint !== selectedImage.focalPoint 
-                || $scope.control.value.image !== selectedImage.image;
-
             // we could apply selectedImage directly to $scope.control.value,
             // but this allows excluding fields in future if needed
             $scope.control.value = {
@@ -119,8 +116,8 @@ angular.module("umbraco")
                 altText: selectedImage.altText
             };
 
-
-            if (doGetThumbnail) {
+            // only update the thumbnail if the image or focal point have changed
+            if ($scope.control.value.focalPoint !== selectedImage.focalPoint || $scope.control.value.image !== selectedImage.image) {
                 $scope.thumbnailUrl = getThumbnailUrl();
             }
         }       

From b391a84159acc76f7ef610e4505a5d45f6b86217 Mon Sep 17 00:00:00 2001
From: Sebastiaan Janssen <sebastiaan@umbraco.com>
Date: Wed, 17 Mar 2021 12:52:36 +0100
Subject: [PATCH 2/2] Always recalculate the thumbnail URL

---
 .../grid/editors/media.controller.js          | 37 ++++++++-----------
 1 file changed, 16 insertions(+), 21 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/editors/media.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/editors/media.controller.js
index b307fcd13438..94ea4b8604ab 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/editors/media.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/editors/media.controller.js
@@ -1,9 +1,9 @@
 angular.module("umbraco")
     .controller("Umbraco.PropertyEditors.Grid.MediaController",
-    function ($scope, userService, editorService, localizationService) {        
-        
-        $scope.thumbnailUrl = getThumbnailUrl();        
-        
+    function ($scope, userService, editorService, localizationService) {
+
+        $scope.thumbnailUrl = getThumbnailUrl();
+
         if (!$scope.model.config.startNodeId) {
             if ($scope.model.config.ignoreUserStartNodes === true) {
                 $scope.model.config.startNodeId = -1;
@@ -29,16 +29,16 @@ angular.module("umbraco")
                 onlyImages: true,
                 dataTypeKey: $scope.model.dataTypeKey,
                 submit: model => {
-                    updateControlValue(model.selection[0]);                    
+                    updateControlValue(model.selection[0]);
                     editorService.close();
                 },
-                close: () => editorService.close()                
+                close: () => editorService.close()
             };
 
             editorService.mediaPicker(mediaPicker);
         };
 
-        $scope.editImage = function() {               
+        $scope.editImage = function() {
 
             const mediaCropDetailsConfig = {
                 size: 'small',
@@ -47,17 +47,17 @@ angular.module("umbraco")
                     updateControlValue(model.target);
                     editorService.close();
                 },
-                close: () => editorService.close()                
+                close: () => editorService.close()
             };
 
             localizationService.localize('defaultdialogs_editSelectedMedia').then(value => {
                 mediaCropDetailsConfig.title = value;
                 editorService.mediaCropDetails(mediaCropDetailsConfig);
-            });        
+            });
         }
-        
+
         /**
-         * 
+         *
          */
         function getThumbnailUrl() {
 
@@ -94,16 +94,15 @@ angular.module("umbraco")
 
                 return url;
             }
-            
+
             return null;
         }
 
         /**
-         * 
-         * @param {object} selectedImage 
+         *
+         * @param {object} selectedImage
          */
         function updateControlValue(selectedImage) {
-
             // we could apply selectedImage directly to $scope.control.value,
             // but this allows excluding fields in future if needed
             $scope.control.value = {
@@ -115,10 +114,6 @@ angular.module("umbraco")
                 caption: selectedImage.caption,
                 altText: selectedImage.altText
             };
-
-            // only update the thumbnail if the image or focal point have changed
-            if ($scope.control.value.focalPoint !== selectedImage.focalPoint || $scope.control.value.image !== selectedImage.image) {
-                $scope.thumbnailUrl = getThumbnailUrl();
-            }
-        }       
+            $scope.thumbnailUrl = getThumbnailUrl();
+        }
     });