Media: Fix viewport scrolling and code style in image rotation.
Change `browsePopup` to use `onkeydown`, pass the `event` parameter from the calling control, and adjust variable naming style. The `browsePopup` method used for the image rotation menu used `onkeyup` to trigger events, which prevented capturing browser scroll actions with arrows occurring on `onkeydown`. Props afercia, deepakvijayan, nirajgirixd, joedolson, antpb. Fixes #60548. Built from https://develop.svn.wordpress.org/trunk@58946 git-svn-id: http://core.svn.wordpress.org/trunk@58342 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
parent
05541b406c
commit
e57bee933a
|
@ -75,9 +75,9 @@ function wp_image_editor( $post_id, $msg = false ) {
|
|||
) ) {
|
||||
$note_no_rotate = '';
|
||||
?>
|
||||
<button type="button" class="imgedit-rleft button" onkeyup="imageEdit.browsePopup(this)" onclick="imageEdit.rotate( 90, <?php echo "$post_id, '$nonce'"; ?>, this)" onblur="imageEdit.monitorPopup()"><?php esc_html_e( 'Rotate 90° left' ); ?></button>
|
||||
<button type="button" class="imgedit-rright button" onkeyup="imageEdit.browsePopup(this)" onclick="imageEdit.rotate(-90, <?php echo "$post_id, '$nonce'"; ?>, this)" onblur="imageEdit.monitorPopup()"><?php esc_html_e( 'Rotate 90° right' ); ?></button>
|
||||
<button type="button" class="imgedit-rfull button" onkeyup="imageEdit.browsePopup(this)" onclick="imageEdit.rotate(180, <?php echo "$post_id, '$nonce'"; ?>, this)" onblur="imageEdit.monitorPopup()"><?php esc_html_e( 'Rotate 180°' ); ?></button>
|
||||
<button type="button" class="imgedit-rleft button" onkeydown="imageEdit.browsePopup(event, this)" onclick="imageEdit.rotate( 90, <?php echo "$post_id, '$nonce'"; ?>, this)" onblur="imageEdit.monitorPopup()"><?php esc_html_e( 'Rotate 90° left' ); ?></button>
|
||||
<button type="button" class="imgedit-rright button" onkeydown="imageEdit.browsePopup(event, this)" onclick="imageEdit.rotate(-90, <?php echo "$post_id, '$nonce'"; ?>, this)" onblur="imageEdit.monitorPopup()"><?php esc_html_e( 'Rotate 90° right' ); ?></button>
|
||||
<button type="button" class="imgedit-rfull button" onkeydown="imageEdit.browsePopup(event, this)" onclick="imageEdit.rotate(180, <?php echo "$post_id, '$nonce'"; ?>, this)" onblur="imageEdit.monitorPopup()"><?php esc_html_e( 'Rotate 180°' ); ?></button>
|
||||
<?php
|
||||
} else {
|
||||
$note_no_rotate = '<p class="note-no-rotate"><em>' . __( 'Image rotation is not supported by your web host.' ) . '</em></p>';
|
||||
|
@ -88,8 +88,8 @@ function wp_image_editor( $post_id, $msg = false ) {
|
|||
}
|
||||
?>
|
||||
<hr />
|
||||
<button type="button" onkeyup="imageEdit.browsePopup(this)" onclick="imageEdit.flip(1, <?php echo "$post_id, '$nonce'"; ?>, this)" onblur="imageEdit.monitorPopup()" class="imgedit-flipv button"><?php esc_html_e( 'Flip vertical' ); ?></button>
|
||||
<button type="button" onkeyup="imageEdit.browsePopup(this)" onclick="imageEdit.flip(2, <?php echo "$post_id, '$nonce'"; ?>, this)" onblur="imageEdit.monitorPopup()" class="imgedit-fliph button"><?php esc_html_e( 'Flip horizontal' ); ?></button>
|
||||
<button type="button" onkeydown="imageEdit.browsePopup(event, this)" onclick="imageEdit.flip(1, <?php echo "$post_id, '$nonce'"; ?>, this)" onblur="imageEdit.monitorPopup()" class="imgedit-flipv button"><?php esc_html_e( 'Flip vertical' ); ?></button>
|
||||
<button type="button" onkeydown="imageEdit.browsePopup(event, this)" onclick="imageEdit.flip(2, <?php echo "$post_id, '$nonce'"; ?>, this)" onblur="imageEdit.monitorPopup()" class="imgedit-fliph button"><?php esc_html_e( 'Flip horizontal' ); ?></button>
|
||||
<?php echo $note_no_rotate; ?>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -296,14 +296,16 @@
|
|||
* Navigate popup menu by arrow keys.
|
||||
*
|
||||
* @since 6.3.0
|
||||
* @since 6.7.0 Added the event parameter.
|
||||
*
|
||||
* @memberof imageEdit
|
||||
*
|
||||
* @param {Event} event The key or click event.
|
||||
* @param {HTMLElement} el The current element.
|
||||
*
|
||||
* @return {boolean} Always returns false.
|
||||
*/
|
||||
browsePopup : function(el) {
|
||||
browsePopup : function(event, el) {
|
||||
var $el = $( el );
|
||||
var $collection = $( el ).parent( '.imgedit-popup-menu' ).find( 'button' );
|
||||
var $index = $collection.index( $el );
|
||||
|
@ -316,14 +318,14 @@
|
|||
if ( $next === $last ) {
|
||||
$next = 0;
|
||||
}
|
||||
var $target = false;
|
||||
var target = false;
|
||||
if ( event.keyCode === 40 ) {
|
||||
$target = $collection.get( $next );
|
||||
target = $collection.get( $next );
|
||||
} else if ( event.keyCode === 38 ) {
|
||||
$target = $collection.get( $prev );
|
||||
target = $collection.get( $prev );
|
||||
}
|
||||
if ( $target ) {
|
||||
$target.focus();
|
||||
if ( target ) {
|
||||
target.focus();
|
||||
event.preventDefault();
|
||||
}
|
||||
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -16,7 +16,7 @@
|
|||
*
|
||||
* @global string $wp_version
|
||||
*/
|
||||
$wp_version = '6.7-alpha-58945';
|
||||
$wp_version = '6.7-alpha-58946';
|
||||
|
||||
/**
|
||||
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.
|
||||
|
|
Loading…
Reference in New Issue