Ticket #42646: 42646.diff

src/wp-includes/js/media-views.js

@@ -9007 +9007 @@
                 imgOptions = _.extend(imgOptions, {
                         parent: this.$el,
                         onInit: function() {
-                                this.parent.children().on( 'mousedown touchstart', function( e ){
 
-                                        if ( e.shiftKey ) {
+                                // Store the set ratio.
+                                var setRatio = imgSelect.getOptions().aspectRatio;
+
+                                // On mousedown, If no ratio is set and the shift key is down, used a 1:1 ratio.
+                                this.parent.children().on( 'mousedown touchstart', function( e ) {
+
+                                        // If no ratio is set and the shift key is down, used a 1:1 ratio.
+                                        if ( ! setRatio && e.shiftKey ) {
                                                 imgSelect.setOptions( {
                                                         aspectRatio: '1:1'
                                                 } );
-                                        } else {
-                                                imgSelect.setOptions( {
-                                                        aspectRatio: false
-                                                } );
                                         }
                                 } );
+
+                                this.parent.children().on( 'mouseup touchend', function( e ) {
+
+                                        // Restore the set ratio.
+                                        imgSelect.setOptions( {
+                                                aspectRatio: setRatio ? setRatio : false
+                                        } );
+                                } );
                         }
                 } );
                 this.trigger('image-loaded');

src/wp-includes/js/media/views/cropper.js

@@ -55 +55 @@
                 imgOptions = _.extend(imgOptions, {
                         parent: this.$el,
                         onInit: function() {
-                                this.parent.children().on( 'mousedown touchstart', function( e ){
 
-                                        if ( e.shiftKey ) {
+                                // Store the set ratio.
+                                var setRatio = imgSelect.getOptions().aspectRatio;
+
+                                // On mousedown, If no ratio is set and the shift key is down, used a 1:1 ratio.
+                                this.parent.children().on( 'mousedown touchstart', function( e ) {
+
+                                        // If no ratio is set and the shift key is down, used a 1:1 ratio.
+                                        if ( ! setRatio && e.shiftKey ) {
                                                 imgSelect.setOptions( {
                                                         aspectRatio: '1:1'
                                                 } );
-                                        } else {
-                                                imgSelect.setOptions( {
-                                                        aspectRatio: false
-                                                } );
                                         }
                                 } );
+
+                                this.parent.children().on( 'mouseup touchend', function( e ) {
+
+                                        // Restore the set ratio.
+                                        imgSelect.setOptions( {
+                                                aspectRatio: setRatio ? setRatio : false
+                                        } );
+                                } );
                         }
                 } );
                 this.trigger('image-loaded');