WordPress.org

Make WordPress Core

Ticket #22502: 22502.2.diff

File 22502.2.diff, 4.4 KB (added by lessbloat, 17 months ago)
  • wp-includes/js/media-editor.js

     
    533533                                workflow.open(); 
    534534                        else 
    535535                                workflow = wp.media.editor.add( id ); 
    536  
     536                         
     537                        // Add focus to modal 
     538                        $( '.media-menu .active' ).focus(); 
     539                         
    537540                        return workflow; 
    538541                } 
    539542        }; 
  • wp-includes/js/media-views.js

     
    550550                        this.frame.content.on( 'activate:browse', this.gallerySettings, this ); 
    551551 
    552552                        media.controller.Library.prototype.activate.apply( this, arguments ); 
     553                         
     554                        // Make sure focus stays on modal 
     555                        $( '.media-menu .active' ).focus(); 
    553556                }, 
    554557 
    555558                deactivate: function() { 
     
    14911494                                                text:     l10n.cancelGalleryTitle, 
    14921495                                                priority: 20, 
    14931496                                                click:    function() { 
    1494                                                         if ( previous ) 
     1497                                                        if ( previous ) { 
    14951498                                                                frame.state( previous ); 
    1496                                                         else 
     1499                                                                $( '.media-menu .active' ).focus(); 
     1500                                                        } else { 
    14971501                                                                frame.close(); 
     1502                                                        } 
    14981503                                                } 
    14991504                                        }, 
    15001505                                        separateCancel: new media.View({ 
     
    16491654                template: media.template('media-modal'), 
    16501655 
    16511656                events: { 
    1652                         'click .media-modal-backdrop, .media-modal-close' : 'closeHandler' 
     1657                        'click .media-modal-backdrop, .media-modal-close' : 'closeHandler', 
     1658                        'keyup' : 'keyboard' 
    16531659                }, 
    16541660 
    16551661                initialize: function() { 
     
    17151721                        // Set and render the content. 
    17161722                        this.options.$content = ( $content instanceof Backbone.View ) ? $content.$el : $content; 
    17171723                        return this.render(); 
     1724                }, 
     1725 
     1726                keyboard: function( event ) { 
     1727 
     1728                        if ( 27 !== event.which ) // Esc 
     1729                                return; 
     1730 
     1731                        this.close(); 
     1732 
     1733                        event.preventDefault(); 
    17181734                } 
    17191735        }); 
    17201736 
     
    23762392                className: 'media-menu-item', 
    23772393 
    23782394                events: { 
    2379                         'click': 'click' 
     2395                        'click': 'click', 
     2396                        'keyup': 'keyboard' 
    23802397                }, 
    23812398 
    23822399                click: function() { 
     
    23882405                                this.controller.state( options.state ); 
    23892406                }, 
    23902407 
     2408                keyboard: function( event ) { 
     2409                        if ( 13 !== event.which ) // Enter 
     2410                                return; 
     2411 
     2412                        this.click(); 
     2413 
     2414                        event.preventDefault(); 
     2415                }, 
     2416 
    23912417                render: function() { 
     2418                         
     2419                        this.$el.attr('tabIndex', '0'); 
     2420                         
    23922421                        var options = this.options; 
    23932422 
    23942423                        if ( options.text ) 
     
    24172446 
    24182447                events: { 
    24192448                        'click .attachment-preview':      'toggleSelection', 
     2449                        'keyup .attachment-preview':      'toggleSelection', 
    24202450                        'change [data-setting]':          'updateSetting', 
    24212451                        'change [data-setting] input':    'updateSetting', 
    24222452                        'change [data-setting] select':   'updateSetting', 
     
    24942524                }, 
    24952525 
    24962526                toggleSelection: function( event ) { 
     2527                         
     2528                        if ( event.type === 'keyup' && 13 !== event.which ) // Enter  
     2529                                return; 
     2530                         
    24972531                        var selection = this.options.selection, 
    24982532                                model = this.model; 
    24992533 
  • wp-includes/media.php

     
    16031603        </script> 
    16041604 
    16051605        <script type="text/html" id="tmpl-attachment"> 
    1606                 <div class="attachment-preview type-{{ data.type }} subtype-{{ data.subtype }} {{ data.orientation }}"> 
     1606                <div class="attachment-preview type-{{ data.type }} subtype-{{ data.subtype }} {{ data.orientation }}" tabindex="0"> 
    16071607                        <# if ( data.uploading ) { #> 
    16081608                                <div class="media-progress-bar"><div></div></div> 
    16091609                        <# } else if ( 'image' === data.type ) { #> 
     
    16241624                        <# } #> 
    16251625 
    16261626                        <# if ( data.buttons.check ) { #> 
    1627                                 <a class="check" href="#"><span>&#10003;</span><span class="dash">&ndash;</span></a> 
     1627                                <a class="check" href="#" tabindex="-1"><span>&#10003;</span><span class="dash">&ndash;</span></a> 
    16281628                        <# } #> 
    16291629                </div> 
    16301630                <# if ( data.describe ) { #> 
  • wp-includes/css/media-views.css

     
    386386        cursor: pointer; 
    387387} 
    388388 
    389 .media-menu li:hover { 
     389.media-menu li:hover, 
     390.media-menu li:focus { 
    390391        background: rgba( 0, 0, 0, 0.04 ); 
     392        outline: none; 
    391393} 
    392394 
    393395.media-menu .active, 
     
    523525        cursor: pointer; 
    524526} 
    525527 
     528.attachment-preview:focus { 
     529        outline: thin dotted; 
     530} 
     531 
    526532.attachment .icon { 
    527533        margin: 0 auto; 
    528534        overflow: hidden;