WordPress.org

Make WordPress Core

Ticket #31196: 31196.8.diff

File 31196.8.diff, 4.1 KB (added by westonruter, 4 years ago)

Additional change: https://github.com/xwp/wordpress-develop/commit/bde0642eb06249dcc02121873252d0c9f79824c9

  • src/wp-admin/css/themes.css

    diff --git src/wp-admin/css/themes.css src/wp-admin/css/themes.css
    index 565f2fa..405051d 100644
    body.full-overlay-active { 
    13571357        height: 100%;
    13581358}
    13591359
     1360#customize-preview.wp-full-overlay-main {
     1361        background: url(../images/spinner.gif) no-repeat;
     1362        -webkit-background-size: 20px 20px;
     1363        background-size: 20px 20px;
     1364        background-position: center center;
     1365}
     1366#customize-preview.wp-full-overlay-main.iframe-ready {
     1367        background: none;
     1368}
     1369
    13601370.wp-full-overlay-sidebar .wp-full-overlay-header {
    13611371        position: absolute;
    13621372        left: 0;
  • src/wp-admin/js/customize-controls.js

    diff --git src/wp-admin/js/customize-controls.js src/wp-admin/js/customize-controls.js
    index 7c4a631..28589b3 100644
     
    14661466                        this.bind( 'ready', this._ready );
    14671467
    14681468                        this.bind( 'ready', function ( data ) {
     1469
     1470                                this.container.addClass( 'iframe-ready' );
     1471
    14691472                                if ( ! data ) {
    14701473                                        return;
    14711474                                }
     
    17691772                refresh: function() {
    17701773                        var self = this;
    17711774
     1775                        // Display loading indicator
     1776                        this.send( 'loading-initiated' );
     1777
    17721778                        this.abort();
    17731779
    17741780                        this.loading = new api.PreviewFrame({
     
    18011807                        });
    18021808
    18031809                        this.loading.fail( function( reason, location ) {
    1804                                 if ( 'redirect' === reason && location )
     1810                                self.send( 'loading-failed' );
     1811                                if ( 'redirect' === reason && location ) {
    18051812                                        self.previewUrl( location );
     1813                                }
    18061814
    18071815                                if ( 'logged out' === reason ) {
    18081816                                        if ( self.preview ) {
     
    18131821                                        self.login().done( self.refresh );
    18141822                                }
    18151823
    1816                                 if ( 'cheatin' === reason )
     1824                                if ( 'cheatin' === reason ) {
    18171825                                        self.cheatin();
     1826                                }
    18181827                        });
    18191828                },
    18201829
  • src/wp-includes/class-wp-customize-manager.php

    diff --git src/wp-includes/class-wp-customize-manager.php src/wp-includes/class-wp-customize-manager.php
    index b695271..b25b48a 100644
    final class WP_Customize_Manager { 
    432432                add_action( 'wp', array( $this, 'customize_preview_override_404_status' ) );
    433433                add_action( 'wp_head', array( $this, 'customize_preview_base' ) );
    434434                add_action( 'wp_head', array( $this, 'customize_preview_html5' ) );
     435                add_action( 'wp_head', array( $this, 'customize_preview_loading_style' ) );
    435436                add_action( 'wp_footer', array( $this, 'customize_preview_settings' ), 20 );
    436437                add_action( 'shutdown', array( $this, 'customize_preview_signature' ), 1000 );
    437438                add_filter( 'wp_die_handler', array( $this, 'remove_preview_signature' ) );
    final class WP_Customize_Manager { 
    491492                <![endif]--><?php
    492493        }
    493494
     495        public function customize_preview_loading_style() {
     496                ?><style>
     497                        body.wp-customizer-unloading {
     498                                opacity: 0.25;
     499                                cursor: progress !important;
     500                                -webkit-transition: opacity 0.5s;
     501                                transition: opacity 0.5s;
     502                        }
     503                        body.wp-customizer-unloading * {
     504                                pointer-events: none !important;
     505                        }
     506                </style><?php
     507        }
     508
    494509        /**
    495510         * Print JavaScript settings for preview frame.
    496511         *
    final class WP_Customize_Manager { 
    503518                        'activePanels' => array(),
    504519                        'activeSections' => array(),
    505520                        'activeControls' => array(),
     521                        'l10n' => array(
     522                                'loading'  => __( 'Loading ...' ),
     523                        ),
    506524                );
    507525
    508526                if ( 2 == $this->nonce_tick ) {
  • src/wp-includes/js/customize-preview.js

    diff --git src/wp-includes/js/customize-preview.js src/wp-includes/js/customize-preview.js
    index 82f7bb8..d02f8f9 100644
     
    115115                        activeControls: api.settings.activeControls
    116116                } );
    117117
     118                // Display a loading indicator when preview is reloading, and remove on failure
     119                api.preview.bind( 'loading-initiated', function () {
     120                        $( 'body' ).addClass( 'wp-customizer-unloading' );
     121                        $( 'html' ).prop( 'title', api.settings.l10n.loading );
     122                });
     123                api.preview.bind( 'loading-failed', function () {
     124                        $( 'body' ).removeClass( 'wp-customizer-unloading' );
     125                        $( 'html' ).prop( 'title', '' );
     126                });
     127
    118128                /* Custom Backgrounds */
    119129                bg = $.map(['color', 'image', 'position_x', 'repeat', 'attachment'], function( prop ) {
    120130                        return 'background_' + prop;