Ticket #30155: 30155.4.diff

src/wp-admin/includes/image-edit.php

@@ -182 +182 @@
         <div class="imgedit-panel-content wp-clearfix">
                 <?php echo $note; ?>
                 <div class="imgedit-menu wp-clearfix">
-                        <button type="button" onclick="imageEdit.crop(<?php echo "$post_id, '$nonce'"; ?>, this)" class="imgedit-crop button disabled" disabled><span class="screen-reader-text"><?php esc_html_e( 'Crop' ); ?></span></button><?php
+                        <button type="button" onclick="imageEdit.handleCropToolClick( <?php echo "$post_id, '$nonce'"; ?>, this )" class="imgedit-crop button disabled" disabled><span class="screen-reader-text"><?php esc_html_e( 'Crop' ); ?></span></button><?php
 
                 // On some setups GD library does not provide imagerotate() - Ticket #11536
                 if ( wp_image_editor_supports( array( 'mime_type' => get_post_mime_type( $post_id ), 'methods' => array( 'rotate' ) ) ) ) {

src/wp-admin/js/image-edit.js

@@ -19 +19 @@
         _view : false,
 
         /**
+         * Handle crop tool clicks.
+         */
+        handleCropToolClick: function( postid, nonce, cropButton ) {
+                var img = $( '#image-preview-' + postid ),
+                        selection = this.iasapi.getSelection();
+
+                // Ensure selection is available, otherwise reset to full image.
+                if ( isNaN( selection.x1 ) ) {
+                        this.setCropSelection( postid, { 'x1': 0, 'y1': 0, 'x2': img.innerWidth(), 'y2': img.innerHeight(), 'width': img.innerWidth(), 'height': img.innerHeight() } );
+                        selection = this.iasapi.getSelection();
+                }
+
+                // If we don't already have a selection, select the entire image.
+                if ( 0 === selection.x1 && 0 === selection.y1 && 0 === selection.x2 && 0 === selection.y2 ) {
+                        this.iasapi.setSelection( 0, 0, img.innerWidth(), img.innerHeight(), true );
+                        this.iasapi.setOptions( { show: true } );
+                        this.iasapi.update();
+                } else {
+
+                        // Otherwise, perform the crop.
+                        imageEdit.crop( postid, nonce , cropButton );
+                }
+        },
+
+        /**
          * @summary Converts a value to an integer.
          *
          * @memberof imageEdit
@@ -351 +376 @@
                                 t.hold.sizer = max1 > max2 ? max2 / max1 : 1;
 
                                 t.initCrop(postid, img, parent);
-                                t.setCropSelection(postid, 0);
 
                                 if ( (typeof callback !== 'undefined') && callback !== null ) {
                                         callback();
@@ -579 +603 @@
                 }
 
                 this.initCrop(postid, img, parent);
-                this.setCropSelection(postid, 0);
+                this.setCropSelection( postid, { 'x1': 0, 'y1': 0, 'x2': 0, 'y2': 0, 'width': img.innerWidth(), 'height': img.innerHeight() } );
+
                 this.toggleEditor(postid, 0);
                 // Editor is ready, move focus to the first focusable element.
                 $( '.imgedit-wrap .imgedit-help-toggle' ).eq( 0 ).focus();
@@ -695 +720 @@
                 c = c || 0;
 
                 if ( !c || ( c.width < 3 && c.height < 3 ) ) {
-                        this.setDisabled($('.imgedit-crop', '#imgedit-panel-' + postid), 0);
-                        this.setDisabled($('#imgedit-crop-sel-' + postid), 0);
+                        this.setDisabled( $( '.imgedit-crop', '#imgedit-panel-' + postid ), 1 );
+                        this.setDisabled( $( '#imgedit-crop-sel-' + postid ), 1 );
                         $('#imgedit-sel-width-' + postid).val('');
                         $('#imgedit-sel-height-' + postid).val('');
                         $('#imgedit-selection-' + postid).val('');