Make WordPress Core

Changeset 37113


Ignore:
Timestamp:
03/30/2016 03:13:34 PM (8 years ago)
Author:
obenland
Message:

Customize: Respect aspect ratio on cropped images.

Takes into account whether the control supports flex_width and/or
flex_height and adjusts destination measurements accordingly.

Fixes #36318.

Location:
trunk/src/wp-includes/js
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-includes/js/media-views.js

    r37042 r37113  
    401401    doCrop: function( attachment ) {
    402402        var cropDetails = attachment.get( 'cropDetails' ),
    403             control = this.get( 'control' );
    404 
    405         if ( ! control.params.flex_width ) {
    406             cropDetails.dst_width = control.params.width;
    407         }
    408         if ( ! control.params.flex_height ) {
    409             cropDetails.dst_height = control.params.height;
     403            control = this.get( 'control' ),
     404            ratio = cropDetails.width / cropDetails.height;
     405
     406        // Use crop measurements when flexible in both directions.
     407        if ( control.params.flex_width && control.params.flex_height ) {
     408            cropDetails.dst_width  = cropDetails.width;
     409            cropDetails.dst_height = cropDetails.height;
     410
     411        // Constrain flexible side based on image ratio and size of the fixed side.
     412        } else {
     413            cropDetails.dst_width  = control.params.flex_width  ? control.params.height * ratio : control.params.width;
     414            cropDetails.dst_height = control.params.flex_height ? control.params.width  / ratio : control.params.height;
    410415        }
    411416
  • trunk/src/wp-includes/js/media/controllers/customize-image-cropper.js

    r37042 r37113  
    1515    doCrop: function( attachment ) {
    1616        var cropDetails = attachment.get( 'cropDetails' ),
    17             control = this.get( 'control' );
     17            control = this.get( 'control' ),
     18            ratio = cropDetails.width / cropDetails.height;
    1819
    19         if ( ! control.params.flex_width ) {
    20             cropDetails.dst_width = control.params.width;
    21         }
    22         if ( ! control.params.flex_height ) {
    23             cropDetails.dst_height = control.params.height;
     20        // Use crop measurements when flexible in both directions.
     21        if ( control.params.flex_width && control.params.flex_height ) {
     22            cropDetails.dst_width  = cropDetails.width;
     23            cropDetails.dst_height = cropDetails.height;
     24
     25        // Constrain flexible side based on image ratio and size of the fixed side.
     26        } else {
     27            cropDetails.dst_width  = control.params.flex_width  ? control.params.height * ratio : control.params.width;
     28            cropDetails.dst_height = control.params.flex_height ? control.params.width  / ratio : control.params.height;
    2429        }
    2530
Note: See TracChangeset for help on using the changeset viewer.