Ticket #22659: 22659.diff

wp-includes/js/media-views.js

@@ -2532 +2532 @@
 
                 events: {
                         'click .attachment-preview':      'toggleSelection',
+                        'keydown':                                                'keydown',
                         'change [data-setting]':          'updateSetting',
                         'change [data-setting] input':    'updateSetting',
                         'change [data-setting] select':   'updateSetting',
@@ -2615 +2616 @@
                         this.updateSave();
 
                         this.views.render();
+
+                        // If tab is saved, focus it
+                        if (this.tabNext) {
+                                this.$(this.tabNext).find(':tabbable').first().focus();
+                                this.tabNext = null;
+                        }
+
                         return this;
                 },
 
@@ -2707 +2715 @@
                         }
                 },
 
+                keydown: function( event ) {
+                        if ( 9 !== event.keyCode )
+                                return;
+
+                        var allInputs = this.$(':tabbable');
+
+                        var direction = ( event.shiftKey ) ? -1 : 1;
+
+                        for ( i=0; i<allInputs.length; i++ ) {
+                                if ( event.target === allInputs[i] ) {
+                                        tabNew = allInputs.eq( i + direction ),
+                                        dataSetting = tabNew.closest('[data-setting]').data('setting');
+
+                                        if ( dataSetting )
+                                                this.tabNext = '[data-setting="' + dataSetting + '"]';
+                                        else
+                                                this.tabNext = '.' + tabNew.parent().prop('class');
+                                }
+                        }
+                },
+
                 updateSetting: function( event ) {
                         var $setting = $( event.target ).closest('[data-setting]'),
                                 setting, value;
@@ -3699 +3728 @@
                 template:  media.template('attachment-details'),
 
                 events: {
+                        'keydown':                                'keydown',
                         'change [data-setting]':          'updateSetting',
                         'change [data-setting] input':    'updateSetting',
                         'change [data-setting] select':   'updateSetting',