WordPress.org

Make WordPress Core

Ticket #23560: 23560-arrow-keys.diff

File 23560-arrow-keys.diff, 2.1 KB (added by lessbloat, 5 years ago)
  • wp-includes/js/media-views.js

     
    46674667                 */
    46684668                toggleSelectionHandler: function( event ) {
    46694669                        var method;
     4670                       
     4671                        // Catch arrow events
     4672                        if ( 37 === event.keyCode || 38 === event.keyCode || 39 === event.keyCode || 40 === event.keyCode ) {
     4673                                this.arrowEvent(event);
     4674                                return;
     4675                        }
     4676                       
    46704677                        // Catch enter and space events
    46714678                        if ( 'keydown' === event.type && 13 !== event.keyCode && 32 !== event.keyCode ) {
    46724679                                return;
     
    46884695                                method: method
    46894696                        });
    46904697                },
     4698                                /**
     4699                 * @param {Object} event
     4700                 */
     4701                arrowEvent: function( event ) {
     4702                        var attachment = $('.attachments-browser .attachment'),
     4703                                attachmentsWidth = $('.attachments-browser .attachments').width(),
     4704                                thumbnailWidth = attachment.first().innerWidth() + 16,
     4705                                thumbnailsPerRow = Math.floor(attachmentsWidth/thumbnailWidth),
     4706                                totalThumnails = attachment.length,
     4707                                totalRows = Math.ceil(totalThumnails/thumbnailsPerRow),
     4708                                thisIndex = attachment.filter( ':focus' ).index(),
     4709                                thisIndexAdjusted = thisIndex + 1,
     4710                                thisRow = thisIndexAdjusted <= thumbnailsPerRow ? 1 : Math.ceil(thisIndexAdjusted/thumbnailsPerRow);
     4711                               
     4712                                // Left arrow
     4713                                if ( 37 === event.keyCode ) {
     4714                                        if ( 0 === thisIndex ) {
     4715                                                return;
     4716                                        }
     4717                                        attachment.eq( thisIndex - 1 ).focus();
     4718                                }
     4719                               
     4720                                // Up arrow
     4721                                if ( 38 === event.keyCode ) {
     4722                                        if ( 1 === thisRow ) {
     4723                                                return;
     4724                                        }
     4725                                        attachment.eq( thisIndex - thumbnailsPerRow ).focus();
     4726                                }
     4727                               
     4728                                // Right arrow
     4729                                if ( 39 === event.keyCode ) {
     4730                                        if ( totalThumnails === thisIndex ) {
     4731                                                return;
     4732                                        }
     4733                                        attachment.eq( thisIndex + 1 ).focus();
     4734                                }
     4735                               
     4736                                // Down arrow
     4737                                if ( 40 === event.keyCode ) {
     4738                                        if ( totalRows === thisRow ) {
     4739                                                return;
     4740                                        }
     4741                                        attachment.eq( thisIndex + thumbnailsPerRow ).focus();
     4742                                }
     4743                               
     4744                                return false;
     4745                },
    46914746                /**
    46924747                 * @param {Object} options
    46934748                 */