The admin image editor crop function introduced rounding errors by using a scaled image to calculate values. Fix uses the image at 100% scale for calculations. Also avoid recalculating selection when the selection position is changed, and prevent incorrect values after scaling or restoration.
Props Jossnaz, johnillo, shailu25, rachelbaker, sudipatel007, joedolson.
Fixes#32282.
Built from https://develop.svn.wordpress.org/trunk@58456
git-svn-id: http://core.svn.wordpress.org/trunk@57905 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Implement a focus monitor so that if user focus moves away from the image rotation menu, it closes and doesn't block the image editing canvas. Follow up to [56239], [55919].
Props nithi22, deepakvijayan, dharm1025, faisal03.
Fixes#58756.
Built from https://develop.svn.wordpress.org/trunk@56652
git-svn-id: http://core.svn.wordpress.org/trunk@56164 1a063a9b-81f0-0310-95a4-ce76da25c4cd
In a handful of admin notices, a `tabindex` attribute is set so that JS can move focus to the notice `div`. Rather than adding `tabindex` to globally accepted attributes for `wp_kses_post()`, move the assignment of `tabindex` into the JS handlers that display those notices. The attribute is only relevant if JS is running, so there is no reason to add it in the original HTML notice.
Follow up to [56408], [56409], [56410], [56518], [56570], [56571], [56572], [56573], [56576], [56589], [56590], [56597], [56599], [56600], [56601].
Props costdev, joedolson.
See #57791.
Built from https://develop.svn.wordpress.org/trunk@56602
git-svn-id: http://core.svn.wordpress.org/trunk@56114 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Significant restructure of the admin image editor interface, but no new functionality. Reorganize editing buttons into a common region at the top of the editor. Move image rotation tools into a pop-out menu. Add 180 degree rotation option. Add scale button to control group. Move sidebar tools next to the editing canvas to improve visual proximity between action and result. Enlarge editing canvas and crop handles. Separate activating crop functions from applying crop. Add numeric inputs for crop & scale values.
A long term goal is to move undo/redo and cancel/save into the modal title bar, but that is not feasible without significant updates to the modal framework.
Props afercia, karmatosed, nrqsnchz, antpb, chaion07, costdev, peterwilsoncc, antpb, sabernhardt, prashantbhivsane, joedolson.
Fixes#50523.
Built from https://develop.svn.wordpress.org/trunk@55919
git-svn-id: http://core.svn.wordpress.org/trunk@55431 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Previously, when scaling an image larger than the source size in the image edit states the image would silently fail the scaling action. This patch provides an error when someone attempts to scale an image larger than the source size while also disabling the button to initiate the action.
Props brookedot, joedolson, markoheijnen, mikeschroder, desrosj, Mista-Flo, costdev.
Fixes#26381.
Built from https://develop.svn.wordpress.org/trunk@55859
git-svn-id: http://core.svn.wordpress.org/trunk@55371 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This includes many minor adjustments to a wide array of core files to replace shorthands with full declarations.
Follow-up to [50001], [50270], [50367].
Props Clorith, hellofromTonya, peterwilsoncc, adamsilverstein, aristath.
See #51812.
Built from https://develop.svn.wordpress.org/trunk@50420
git-svn-id: http://core.svn.wordpress.org/trunk@50031 1a063a9b-81f0-0310-95a4-ce76da25c4cd
- improves focus management by moving focus to the notices, if any, or to the first "tabbable" element
- this avoids a focus loss and helps Braille-only and screen magnification users to be aware of the messages
- adds an ARIA role `alert` to all the notices
- uses `wp.a11y.speak()` to announce messages to assistive technology
- this way, all visual users will see the messages while assistive technology users will get an audible message
- uses `wp.i18n` for translatable strings in `wp-admin/js/image-edit.js`
Props anevins, ryanshoover, antpb, SergeyBiryukov, afercia.
See #20491.
Fixes#47147.
Built from https://develop.svn.wordpress.org/trunk@48375
git-svn-id: http://core.svn.wordpress.org/trunk@48144 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Swaps the DOM order of the two main columns within the admin Image Editor.
When the sequence in which content is presented affects its meaning and the navigation sequences affect meaning or operation, visual order and DOM order must match. See WCAG 2.1 Success Criterion 1.3.2 Meaningful Sequence and Success Criterion 2.4.3 Focus Order.
Props sabernhardt, anevins, audrasjb, afercia.
Fixes#47136.
Built from https://develop.svn.wordpress.org/trunk@48265
git-svn-id: http://core.svn.wordpress.org/trunk@48034 1a063a9b-81f0-0310-95a4-ce76da25c4cd
These annotations make it clear to the reader of a JavaScript source
where the build process outputs to. These annotations can later be
integrated in a webpack configuration. This way there is one source of
truth.
The `build` folder is omitted from the paths, because a single JS file
shouldn't not be responsible of knowing where outputs in general will
end up at. A file only knows its output location relative to the
project.
Props adamsilverstein, herregroen, omarreiss, pento.
Fixes#44361.
Built from https://develop.svn.wordpress.org/trunk@43347
git-svn-id: http://core.svn.wordpress.org/trunk@43175 1a063a9b-81f0-0310-95a4-ce76da25c4cd
As decided in the JavaScript core chat. With a few reasons:
* It is visually cleaner when reading the source.
* This bring the JavaScript documentation closer to the PHP documentation.
The only disadvantage is that the JSDoc parser doesn't split out the summary and the description in the new format. We've decided to solve this when building the JavaScript documentation parser.
Props herregroen.
Fixes#42901.
Built from https://develop.svn.wordpress.org/trunk@42411
git-svn-id: http://core.svn.wordpress.org/trunk@42240 1a063a9b-81f0-0310-95a4-ce76da25c4cd
On the "Attachment Details" screen:
* The crop button is always 'enabled'.
* Clicking the crop button with no selection selects the entire image.
* Clicking the crop button with the entire image selected doesn't do anything.
* Clicking the crop button with a selection crops as expected.
Props sonjanyc, afercia, mikeschroder.
Fixes#30155.
Built from https://develop.svn.wordpress.org/trunk@42404
git-svn-id: http://core.svn.wordpress.org/trunk@42233 1a063a9b-81f0-0310-95a4-ce76da25c4cd
JSDoc takes it structural data from `@namespace`, `@lends` and `@memberOf`. This change fixes these tags for all JavaScript files in the wp-admin folder.
* Add jsdoc configuration to parse wp-admin/js files. Use `jsdoc -c jsdoc.conf.json` to generate JSDoc.
* Define all used namespaces using `@namespace`.
* Define each usage of the extend function as a prototype assignment using `@lends`.
* Add `@alias` if JSDoc cannot detect the correct name automatically.
This has previously been corrected for all `wp-includes` JavaScript files: [41351].
Props herregroen.
Fixes#42485.
Built from https://develop.svn.wordpress.org/trunk@42403
git-svn-id: http://core.svn.wordpress.org/trunk@42232 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Fix a JavaScript error when the media edit screen is loaded directly via a url such as `/wp-admin/post.php?post={post_id}&action=edit&image-editor`. Add a check in `imgLoaded` for `this.hold.sizer` which is set up during initialization and required for the cropping tool. Call `init` if this is undefined.
Props NoseGraze.
Fixes#38138.
Built from https://develop.svn.wordpress.org/trunk@40020
git-svn-id: http://core.svn.wordpress.org/trunk@39957 1a063a9b-81f0-0310-95a4-ce76da25c4cd
* Use the same check for a numeric value used on the crop fields on all the other fields: don't display "NaN", just empty the field.
* Remove the inline script that runs the initialization of the image editor and call it after the editor UI is fully ready.
Props afercia.
Fixes#36316.
Built from https://develop.svn.wordpress.org/trunk@37966
git-svn-id: http://core.svn.wordpress.org/trunk@37907 1a063a9b-81f0-0310-95a4-ce76da25c4cd
* Add focus to arrows on Next/Previous in the grid's modal on left/right keypress, and add the necessary CSS for `:focus`
* When in a disabled input in the grid modal, allow the left/right keys to work
* Make the image editor return a `$.Deferred` so that there isn't a race condition with UI loading.
* Assign focus when the edit image mode is rendered so that the modal can be closed on Esc press
Props wonderboymusic, adamsilverstein (for the initial patch).
See #23560.
Built from https://develop.svn.wordpress.org/trunk@29560
git-svn-id: http://core.svn.wordpress.org/trunk@29335 1a063a9b-81f0-0310-95a4-ce76da25c4cd
