From 4dec1ad4771c4da04f1bedb48a0674ba5a350101 Mon Sep 17 00:00:00 2001
From: Sergey Biryukov <sergeybiryukov@git.wordpress.org>
Date: Wed, 24 Jan 2018 21:35:10 +0000
Subject: [PATCH] Media: Store and reuse image cropper ratio settings if
 available, instead of overwriting.

Props adamsilverstein.
Fixes #42646.

git-svn-id: https://develop.svn.wordpress.org/trunk@42595 602fd350-edb4-49c9-b593-d223f7449a82
---
 src/wp-includes/js/media-views.js         | 22 ++++++++++++++++------
 src/wp-includes/js/media/views/cropper.js | 22 ++++++++++++++++------
 2 files changed, 32 insertions(+), 12 deletions(-)

diff --git a/src/wp-includes/js/media-views.js b/src/wp-includes/js/media-views.js
index 60ad65ee48..82740218dc 100644
--- a/src/wp-includes/js/media-views.js
+++ b/src/wp-includes/js/media-views.js
@@ -9168,18 +9168,28 @@ Cropper = View.extend(/** @lends wp.media.view.Cropper.prototype */{
 		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, 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
+					} );
+				} );
 			}
 		} );
 		this.trigger('image-loaded');
diff --git a/src/wp-includes/js/media/views/cropper.js b/src/wp-includes/js/media/views/cropper.js
index 4220729072..74967cca26 100644
--- a/src/wp-includes/js/media/views/cropper.js
+++ b/src/wp-includes/js/media/views/cropper.js
@@ -55,18 +55,28 @@ Cropper = View.extend(/** @lends wp.media.view.Cropper.prototype */{
 		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, 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
+					} );
+				} );
 			}
 		} );
 		this.trigger('image-loaded');