Make WordPress Core

Ticket #33228: 33228.3.patch

File 33228.3.patch, 4.7 KB (added by afercia, 9 years ago)
  • src/wp-admin/css/themes.css

     
    12801280
    12811281body.full-overlay-active {
    12821282        overflow: hidden;
     1283        visibility: hidden; /* hide content and make it not focusable */
    12831284}
    12841285
    12851286.wp-full-overlay {
     
    15851586        height: 100%;
    15861587}
    15871588
    1588 .customize-active #customize-container {
    1589         display: block;
     1589/* Make the Customizer and Theme installer overlays the only focusable content */
     1590#customize-container,
     1591.theme-install-overlay {
     1592        visibility: visible;
    15901593}
    15911594
    15921595.customize-loading #customize-container iframe {
     
    16851688        border-bottom: 1px solid #ddd;
    16861689}
    16871690
    1688 .theme-install-overlay .wp-full-overlay-main {
     1691.theme-preview-loading .wp-full-overlay-main {
    16891692        background: #fff url(../images/spinner.gif) no-repeat center center;
    16901693        -webkit-background-size: 20px 20px;
    16911694        background-size: 20px 20px;
  • src/wp-admin/js/customize-controls.js

     
    30413041                        return;
    30423042                }
    30433043
    3044                 var parent, topFocus,
     3044                var parent,
    30453045                        body = $( document.body ),
    30463046                        overlay = body.children( '.wp-full-overlay' ),
    30473047                        title = $( '#customize-info .panel-title.site-title' ),
     
    35553555
    35563556                api.trigger( 'ready' );
    35573557
    3558                 // Make sure left column gets focus
    3559                 topFocus = closeBtn;
    3560                 topFocus.focus();
    3561                 setTimeout(function () {
    3562                         topFocus.focus();
    3563                 }, 200);
    3564 
    35653558        });
    35663559
    35673560})( wp, jQuery );
  • src/wp-admin/js/theme.js

     
    720720        nextTheme: function() {
    721721                var self = this;
    722722                self.trigger( 'theme:next', self.model.cid );
     723                $( document.body ).addClass( 'theme-preview-loading' )
    723724                return false;
    724725        },
    725726
     
    726727        previousTheme: function() {
    727728                var self = this;
    728729                self.trigger( 'theme:previous', self.model.cid );
     730                $( document.body ).addClass( 'theme-preview-loading' )
    729731                return false;
    730732        },
    731733
     
    764766        html: themes.template( 'theme-preview' ),
    765767
    766768        render: function() {
    767                 var data = this.model.toJSON();
     769                var data = this.model.toJSON(),
     770                        $body = $( document.body );
    768771
     772                $body.addClass( 'theme-preview-loading' ).attr( 'aria-busy', 'true' );
     773
    769774                this.$el.html( this.html( data ) );
    770775
     776                this.iframe = this.$el.find( '.wp-full-overlay-main iframe' );
     777                this.iframe.one( 'load', this.loaded );
     778
    771779                themes.router.navigate( themes.router.baseUrl( themes.router.themePath + this.model.get( 'id' ) ), { replace: true } );
    772780
    773781                this.$el.fadeIn( 200, function() {
    774                         $( 'body' ).addClass( 'theme-installer-active full-overlay-active' );
    775                         $( '.close-full-overlay' ).focus();
     782                        $body.addClass( 'theme-installer-active full-overlay-active' );
    776783                });
    777784        },
    778785
     786        /**
     787         * Callback for the `load` event on the Theme installer iframe.
     788         */
     789        loaded: function() {
     790                $( document.body ).removeClass( 'theme-preview-loading' ).attr( 'aria-busy', 'false' );
     791        },
     792
    779793        close: function() {
    780794                this.$el.fadeOut( 200, function() {
    781795                        $( 'body' ).removeClass( 'theme-installer-active full-overlay-active' );
  • src/wp-includes/js/customize-loader.js

     
    181181                 * Callback after the Customizer has been opened.
    182182                 */
    183183                opened: function() {
    184                         Loader.body.addClass( 'customize-active full-overlay-active' );
     184                        Loader.body.addClass( 'customize-active full-overlay-active' ).attr( 'aria-busy', 'true' );
    185185                },
    186186
    187187                /**
     
    207207                        if ( this.originalDocumentTitle ) {
    208208                                document.title = this.originalDocumentTitle;
    209209                        }
    210 
    211                         // Return focus to link that was originally clicked.
    212                         if ( this.link ) {
    213                                 this.link.focus();
    214                         }
    215210                },
    216211
    217212                /**
     
    225220                        Loader.saved     = null;
    226221                        Loader.body.removeClass( 'customize-active full-overlay-active' ).removeClass( 'customize-loading' );
    227222                        $( window ).off( 'beforeunload', Loader.beforeunload );
     223                        // Return focus to link that was originally clicked after visibility is restored.
     224                        if ( Loader.link ) {
     225                                Loader.link.focus();
     226                        }
    228227                },
    229228
    230229                /**
     
    231230                 * Callback for the `load` event on the Customizer iframe.
    232231                 */
    233232                loaded: function() {
    234                         Loader.body.removeClass('customize-loading');
     233                        Loader.body.removeClass( 'customize-loading' ).attr( 'aria-busy', 'false' );
    235234                },
    236235
    237236                /**