Changeset 42596

Timestamp:

01/24/2018 09:40:09 PM (9 years ago)

Author:

SergeyBiryukov

Message:

Media: Store and reuse image cropper ratio settings if available, instead of overwriting.

Props adamsilverstein.
Merges [42595] to the 4.9 branch.
Fixes #42646.

Location:

branches/4.9

Files:

• . (modified) (1 prop)
• src/wp-includes/js/media-views.js (modified) (1 diff)
• src/wp-includes/js/media/views/cropper.js (modified) (1 diff)

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

@@ -8958 +8958 @@
                         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, use a 1:1 ratio.
+                                this.parent.children().on( 'mousedown touchstart', function( e ) {
+
+                                        // If no ratio is set and the shift key is down, use 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
+                                        } );
                                 } );
                         }

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

@@ -56 +56 @@
                         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, use a 1:1 ratio.
+                                this.parent.children().on( 'mousedown touchstart', function( e ) {
+
+                                        // If no ratio is set and the shift key is down, use 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
+                                        } );
                                 } );
                         }