WordPress.org
Get WordPress

Make WordPress Core

Ticket #32282: 32282.patch

File 32282.patch, 7.3 KB (added by shailu25, 18 months ago)

Patch Refreshed.

  • src/js/_enqueues/lib/image-edit.js 

    diff --git a/src/js/_enqueues/lib/image-edit.js b/src/js/_enqueues/lib/image-edit.js
index b41e93f55d..8f86aef246 100644
    a b  
    143143         * @return {void}
    144144         */
    145145        init : function(postid) {
    146                 var t = this, old = $('#image-editor-' + t.postid),
    147                         x = t.intval( $('#imgedit-x-' + postid).val() ),
    148                         y = t.intval( $('#imgedit-y-' + postid).val() );
     146                var t = this, old = $('#image-editor-' + t.postid);
    149147
    150148                if ( t.postid !== postid && old.length ) {
    151149                        t.close(t.postid);
    152150                }
    153151
    154                 t.hold.w = t.hold.ow = x;
    155                 t.hold.h = t.hold.oh = y;
    156                 t.hold.xy_ratio = x / y;
    157152                t.hold.sizer = parseFloat( $('#imgedit-sizer-' + postid).val() );
    158153                t.postid = postid;
    159154                $('#imgedit-response-' + postid).empty();
    … …  
    188183                $( document ).on( 'image-editor-ui-ready', this.focusManager );
    189184        },
    190185
     186        /**
     187         * Calculate the image size and save it to memory.
     188         *
     189         * @since 6.6.0
     190         *
     191         * @memberof imageEdit
     192         *
     193         * @param {number} postid The post ID.
     194         *
     195         * @return {void}
     196         */
     197        calculateImgSize: function (postid) {
     198                var t = this,
     199                x = t.intval( $('#imgedit-x-' + postid).val() ),
     200                y = t.intval( $('#imgedit-y-' + postid).val() );
     201                t.hold.w = t.hold.ow = x;
     202                t.hold.h = t.hold.oh = y;
     203                t.hold.xy_ratio = x / y;
     204                t.hold.sizer = parseFloat( $('#imgedit-sizer-' + postid).val() );
     205                t.currentCropSelection = null;
     206        },
     207
    191208        /**
    192209         * Toggles the wait/load icon in the editor.
    193210         *
    … …  
    525542                        for ( n in history ) {
    526543                                i = history[n];
    527544                                if ( i.hasOwnProperty('c') ) {
    528                                         op[n] = { 'c': { 'x': i.c.x, 'y': i.c.y, 'w': i.c.w, 'h': i.c.h } };
     545                                        op[n] = { 'c': { 'x': i.c.x, 'y': i.c.y, 'w': i.c.w, 'h': i.c.h, 'r': i.c.r } };
    529546                                } else if ( i.hasOwnProperty('r') ) {
    530547                                        op[n] = { 'r': i.r.r };
    531548                                } else if ( i.hasOwnProperty('f') ) {
    … …  
    860877                if ( 'undefined' === typeof this.hold.sizer ) {
    861878                        this.init( postid );
    862879                }
     880                this.calculateImgSize( postid );
    863881
    864882                this.initCrop(postid, img, parent);
    865883                this.setCropSelection( postid, { 'x1': 0, 'y1': 0, 'x2': 0, 'y2': 0, 'width': img.innerWidth(), 'height': img.innerHeight() } );
    … …  
    945963                                 *
    946964                                 * @return {void}
    947965                                 */
    948                                 parent.children().on( 'mousedown, touchstart', function(e){
    949                                         var ratio = false, sel, defRatio;
    950 
    951                                         if ( e.shiftKey ) {
    952                                                 sel = t.iasapi.getSelection();
    953                                                 defRatio = t.getSelRatio(postid);
    954                                                 ratio = ( sel && sel.width && sel.height ) ? sel.width + ':' + sel.height : defRatio;
     966                                parent.children().on( 'mousedown touchstart', function(e) {
     967                                        var ratio = false,
     968                                                sel = t.iasapi.getSelection(),
     969                                                cx = t.intval($('#imgedit-crop-width-' + postid).val()),
     970                                                cy = t.intval($('#imgedit-crop-height-' + postid).val());
     971
     972                                        if ( cx && cy ) {
     973                                                ratio = t.getSelRatio(postid);
     974                                        } else if ( e.shiftKey && sel && sel.width && sel.height ) {
     975                                                ratio = sel.width + ':' + sel.height;
    955976                                        }
    956977
    957978                                        t.iasapi.setOptions({
    … …  
    10011022                         */
    10021023                        onSelectChange: function(img, c) {
    10031024                                var sizer = imageEdit.hold.sizer;
    1004                                 selW.val( imageEdit.round(c.width / sizer) );
    1005                                 selH.val( imageEdit.round(c.height / sizer) );
    1006                                 selX.val( imageEdit.round(c.x1 / sizer) );
    1007                                 selY.val( imageEdit.round(c.y1 / sizer) );
     1025                                var oldSel = imageEdit.currentCropSelection;
     1026
     1027                                if (oldSel != null && oldSel.width == c.width && oldSel.height == c.height) {
     1028                                        return;
     1029                                }
     1030
     1031                                selW.val( Math.min(imageEdit.hold.w, imageEdit.round(c.width / sizer)) );
     1032                                selH.val( Math.min(imageEdit.hold.h, imageEdit.round(c.height / sizer)) );
     1033
     1034                                t.currentCropSelection = c;
    10081035                        }
    10091036                });
    10101037        },
    … …  
    10231050         */
    10241051        setCropSelection : function(postid, c) {
    10251052                var sel;
     1053                        selW = $('#imgedit-sel-width-' + postid),
     1054                        selH = $('#imgedit-sel-height-' + postid),
     1055                        sizer = this.hold.sizer,
     1056                        hold = this.hold;
    10261057
    10271058                c = c || 0;
    10281059
    … …  
    10371068                        return false;
    10381069                }
    10391070
    1040                 sel = { 'x': c.x1, 'y': c.y1, 'w': c.width, 'h': c.height };
     1071                // adjust the selection within the bounds of the image on 100% scale
     1072                var excessW = hold.w - ( Math.round(c.x1 / sizer) + parseInt(selW.val()) );
     1073                var excessH = hold.h - ( Math.round(c.y1 / sizer) + parseInt(selH.val()) );
     1074                var x = Math.round( c.x1 / sizer ) + Math.min( 0, excessW );
     1075                var y = Math.round( c.y1 / sizer ) + Math.min( 0, excessH );
     1076
     1077                // use 100% scaling to prevent rounding errors
     1078                sel = { 'r': 1, 'x': x, 'y': y, 'w': selW.val(), 'h': selH.val() };
     1079
    10411080                this.setDisabled($('.imgedit-crop', '#imgedit-panel-' + postid), 1);
    10421081                $('#imgedit-selection-' + postid).val( JSON.stringify(sel) );
    10431082        },
    … …  
    11651204                }
    11661205                this.closePopup(t);
    11671206                this.addStep({ 'r': { 'r': angle, 'fw': this.hold.h, 'fh': this.hold.w }}, postid, nonce);
     1207
     1208                // Clear the selection fields after rotating.
     1209                $('#imgedit-sel-width-' + postid).val('');
     1210                $('#imgedit-sel-height-' + postid).val('');
     1211                this.currentCropSelection = null;
    11681212        },
    11691213
    11701214        /**
    … …  
    11871231                }
    11881232                this.closePopup(t);
    11891233                this.addStep({ 'f': { 'f': axis, 'fw': this.hold.w, 'fh': this.hold.h }}, postid, nonce);
     1234
     1235                // Clear the selection fields after flipping.
     1236                $('#imgedit-sel-width-' + postid).val('');
     1237                $('#imgedit-sel-height-' + postid).val('');
     1238                this.currentCropSelection = null;
    11901239        },
    11911240
    11921241        /**
    … …  
    12231272                $('#imgedit-sel-height-' + postid).val('');
    12241273                $('#imgedit-start-x-' + postid).val('0');
    12251274                $('#imgedit-start-y-' + postid).val('0');
     1275                this.currentCropSelection = null;
    12261276        },
    12271277
    12281278        /**
    … …  
    13121362                        img = $('#image-preview-' + postid), imgh = img.height(), imgw = img.width(),
    13131363                        sizer = this.hold.sizer, x1, y1, x2, y2, ias = this.iasapi;
    13141364
     1365                this.currentCropSelection = null;
     1366
    13151367                if ( false === this.validateNumeric( el ) ) {
    13161368                        return;
    13171369                }
    … …  
    13351387                        if ( x2 > imgw ) {
    13361388                                x1 = 0;
    13371389                                x2 = imgw;
    1338                                 elX.val( Math.round( x2 / sizer ) );
     1390                                elX.val( Math.min( this.hold.w, Math.round( x2 / sizer ) ) );
    13391391                        }
    13401392
    13411393                        if ( y2 > imgh ) {
    13421394                                y1 = 0;
    13431395                                y2 = imgh;
    1344                                 elY.val( Math.round( y2 / sizer ) );
     1396                                elY.val( Math.min( this.hold.h, Math.round( y2 / sizer ) ) );
    13451397                        }
    13461398
    13471399                        ias.setSelection( x1, y1, x2, y2 );
    13481400                        ias.update();
    13491401                        this.setCropSelection(postid, ias.getSelection());
     1402                        this.currentCropSelection = ias.getSelection();
    13501403                }
    13511404        },
    13521405

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

    diff --git a/src/wp-admin/includes/image-edit.php b/src/wp-admin/includes/image-edit.php
index b8ea443cd4..fec5220be9 100644
    a b function image_edit_apply_changes( $image, $changes ) { 
    735735                                        $w    = $size['width'];
    736736                                        $h    = $size['height'];
    737737
    738                                         $scale = 1 / _image_get_preview_ratio( $w, $h ); // Discard preview scaling.
     738                                        $scale = isset($sel->r) ? $sel->r : 1 / _image_get_preview_ratio( $w, $h ); // Discard preview scaling.
    739739                                        $image->crop( $sel->x * $scale, $sel->y * $scale, $sel->w * $scale, $sel->h * $scale );
    740740                                } else {
    741                                         $scale = 1 / _image_get_preview_ratio( imagesx( $image ), imagesy( $image ) ); // Discard preview scaling.
     741                                        $scale = isset($sel->r) ? $sel->r : 1 / _image_get_preview_ratio( imagesx( $image ), imagesy( $image ) ); // Discard preview scaling.
    742742                                        $image = _crop_image_resource( $image, $sel->x * $scale, $sel->y * $scale, $sel->w * $scale, $sel->h * $scale );
    743743                                }
    744744                                break;