WordPress.org

Make WordPress Core

#22011 closed defect (bug) (fixed)

Janky behavior with imageEdit.scaleChanged() in inline image editor

Reported by: DrewAPicture Owned by: nacin
Milestone: 3.5 Priority: normal
Severity: normal Version: 3.4.2
Component: Media Keywords: dev-feedback has-patch
Focuses: Cc:

Description

As noted in ticket:21391:39, there's some janky behavior when tabbing between the width and height scaling values in the inline image editor. Tabbing between values appears to increment the values down 1 unit at a time. Short screencast to illustrate: http://screencast.com/t/tPiq9KlYVzzj

My best guess is something with the imageEdit logic in image-edit.js. Javascript is not my forte.

I reproduced in FF15 on trunk and @ocean90 in Chrome on 3.4.2.

Attachments (1)

22011.patch (669 bytes) - added by SergeyBiryukov 17 months ago.

Download all attachments as: .zip

Change History (9)

comment:1 nacin19 months ago

  • Milestone changed from Awaiting Review to 3.5

comment:2 DrewAPicture18 months ago

  • Keywords punt added

The scaling ratio works, there's just some weirdness with moving between the values. I propose we look at this in the next cycle.

comment:3 helenyhou18 months ago

You know... I bet it's a problem with rounding. Looks like it's probably floor-ing, which will keep ticking numbers down if it doesn't divide evenly. Just tried it on a square image and it didn't do that, but can reproduce on others. Not sure about a punt - does feel kind of buggy.

comment:4 helenyhou18 months ago

  • Keywords punt removed

SergeyBiryukov17 months ago

comment:5 SergeyBiryukov17 months ago

  • Keywords has-patch added

comment:6 SergeyBiryukov17 months ago

this.intval() removes the fractional part, which leads to unwanted decrementing.

Math.round() gives more accurate results and doesn't trigger unwanted incrementing in my testing.

comment:7 SergeyBiryukov17 months ago

To reproduce:

  1. Click "Edit Image" on a non-square image (e.g. 1000 × 662).
  2. If the width is 1000px, change that to a non-round number (e.g. 999 × 661).
  3. Keep tabbing between the width and height values. You'll see 998 × 661, 996 × 660, 995 × 659, 993 × 658, etc.
Version 0, edited 17 months ago by SergeyBiryukov (next)

comment:8 nacin17 months ago

  • Owner set to nacin
  • Resolution set to fixed
  • Status changed from new to closed

In 22592:

Round rather than floor values in image editing JS to avoid decrementing values on each run. props SergeyBiryukov. fixes #22011.

Note: See TracTickets for help on using tickets.