From f7529e0cf52220759ec458f8328268d5dbc3cecb Mon Sep 17 00:00:00 2001
From: Bjarne Fyrstenborg <bjarne_fyrstenborg@hotmail.com>
Date: Tue, 27 Jul 2021 14:52:01 +0200
Subject: [PATCH] Inject windowResizeListener in Image Crop directive (#10745)

(cherry picked from commit 2eb554f1b46d50ae8445dcdedc2d759fcb9178da)
---
 .../components/imaging/umbimagecrop.directive.js     | 12 ++++++------
 .../common/services/windowresizelistener.service.js  |  8 ++++----
 2 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/imaging/umbimagecrop.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/imaging/umbimagecrop.directive.js
index 60ba71d7a5..1f5d506bdd 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/imaging/umbimagecrop.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/imaging/umbimagecrop.directive.js
@@ -6,7 +6,7 @@
 **/
 angular.module("umbraco.directives")
     .directive('umbImageCrop',
-        function ($timeout, $window, cropperHelper) {
+        function ($timeout, cropperHelper, windowResizeListener) {
 
             const MAX_SCALE = 4;
 
@@ -26,7 +26,7 @@ angular.module("umbraco.directives")
                     forceUpdate: '@?'
                 },
 
-                link: function (scope, element, attrs, windowResizeListener) {
+                link: function (scope, element, attrs) {
 
                     var unsubscribe = [];
                     let sliderRef = null;
@@ -72,7 +72,7 @@ angular.module("umbraco.directives")
                     };
 
                     function updateSlider() {
-                        if(sliderRef) {
+                        if (sliderRef) {
                             // Update slider range min/max
                             sliderRef.noUiSlider.updateOptions({
                                 "range": {
@@ -102,7 +102,7 @@ angular.module("umbraco.directives")
                         // cross-browser wheel delta
                         var delta = Math.max(-50, Math.min(50, (event.wheelDelta || -event.detail)));
 
-                        if(sliderRef) {
+                        if (sliderRef) {
                             var currentScale =sliderRef.noUiSlider.get();
 
                             var newScale = Math.min(Math.max(currentScale + delta*.001*scope.dimensions.image.ratio, scope.dimensions.scale.min), scope.dimensions.scale.max);
@@ -127,8 +127,8 @@ angular.module("umbraco.directives")
                             'left': (parseInt(scope.dimensions.margin.left, 10)) + 'px'
                         }
                     };
-                    updateStyles();
 
+                    updateStyles();
 
                     //elements
                     var $viewport = element.find(".viewport");
@@ -138,11 +138,11 @@ angular.module("umbraco.directives")
                     $overlay.bind("focus", function () {
                         $overlay.bind("DOMMouseScroll mousewheel onmousewheel", onScroll);
                     });
+
                     $overlay.bind("blur", function () {
                         $overlay.unbind("DOMMouseScroll mousewheel onmousewheel", onScroll);
                     });
 
-
                     //default constraints for drag n drop
                     var constraints = { left: { max: 0, min: 0 }, top: { max: 0, min: 0 } };
                     scope.constraints = constraints;
diff --git a/src/Umbraco.Web.UI.Client/src/common/services/windowresizelistener.service.js b/src/Umbraco.Web.UI.Client/src/common/services/windowresizelistener.service.js
index 68691b8629..3c13228a9b 100644
--- a/src/Umbraco.Web.UI.Client/src/common/services/windowresizelistener.service.js
+++ b/src/Umbraco.Web.UI.Client/src/common/services/windowresizelistener.service.js
@@ -11,7 +11,7 @@
  */
 function windowResizeListener($rootScope) {
 
-    var WinReszier = (function () {
+    var WinResizer = (function () {
         var registered = [];
         var inited = false;        
         var resize = _.debounce(function(ev) {
@@ -51,7 +51,7 @@ function windowResizeListener($rootScope) {
          * @param {Function} cb 
          */
         register: function (cb) {
-            WinReszier.register(cb);
+            WinResizer.register(cb);
         },
 
         /**
@@ -59,9 +59,9 @@ function windowResizeListener($rootScope) {
          * @param {Function} cb 
          */
         unregister: function(cb) {
-            WinReszier.unregister(cb);
+            WinResizer.unregister(cb);
         }
 
     };
 }
-angular.module('umbraco.services').factory('windowResizeListener', windowResizeListener);
\ No newline at end of file
+angular.module('umbraco.services').factory('windowResizeListener', windowResizeListener);