Uploaded image for project: 'Magnolia UI'
  1. Magnolia UI
  2. MGNLUI-4129

Media Editor shows distorted image with incorrect aspect ratio when using the 'Crop image' functionality

XMLWordPrintable

    • Icon: Bug Bug
    • Resolution: Fixed
    • Icon: Neutral Neutral
    • 5.4.12, 5.5.3
    • 5.5.1
    • media editor
    • None
    • Basel 85
    • 8

      When using the crop functionality in the media editor (eg: Upload asset in Assets app), the image is set to automatically "scale to fit". However, this produces a distorted version of the image with incorrect aspect ratio.

      Furthermore, combining the operation "Zoom to fit" with "Crop Image" is inconsistent and produces different results depending on the state.

      The expected result is to have a scaled version that fits the screen while keeping the aspect ratio of the original image.

      See attached:

      • MediaEditor1 : Initial state of the media editor after opening a big portrait image (in the example, 2304x3072px)
      • MediaEditor2.StartCropping : after clicking on "Crop Image", the image is automatically scaled to fit, but the aspect ratio is lost. Note that the initial cropping area is actually a 200x200 square, and it looks like a rectangle.
      • MediaEditor3.ClickOnScaleToFit : after clicking on "ZoomToFit", the image remains distorted, but note that the displayed image changes slightly (now there are no scrollbars and there is a little bit of black margin)
      • MediaEditor4.ClickOnScaleToActual : after clicking on "Zoom to actual size", the image is displayed with the correct aspect ratio and size.
      • MediaEditor5.ClickOnScaleToFit : after clicking again on "Zoom to fit", yet another different dimension is displayed, much smaller than screen size and still with incorrect aspect ratio.
      • MediaEditor6.ClickOnScaleToFit : after clicking one more time on "Zoom to fit", the same result as MediaEditor3 screenshot is shown.

      This misbehaviour has been tested on both Chrome and Firefox on Mac and Windows. It works as expected on Safari.

      Tested on:

      • Chrome 56.0.2924.76 . Wrong aspect ratio
      • Firefox 51.0.1 . Wrong aspect ratio
      • IE Edge . Wrong aspect ratio
      • Safari 10.0.2 (11602.3.12.0.1) . Correct aspect ratio

        Acceptance criteria

              fgrilli Federico Grilli
              fnavarro Federico Navarro
              Votes:
              1 Vote for this issue
              Watchers:
              5 Start watching this issue

                Created:
                Updated:
                Resolved:

                  Bug DoR
                  Task DoD

                    Estimated:
                    Original Estimate - Not Specified
                    Not Specified
                    Remaining:
                    Remaining Estimate - 0d
                    0d
                    Logged:
                    Time Spent - 2d 3h
                    2d 3h