Make WordPress Core

Changeset 20743


Ignore:
Timestamp:
05/08/2012 11:37:05 PM (12 years ago)
Author:
koopersmith
Message:

Theme Customizer: Add basic loading indicator when loading the customizer inside an iframe. see #19910.

Location:
trunk
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • trunk/wp-admin/css/wp-admin.dev.css

    r20730 r20743  
    53255325}
    53265326
     5327.customize-loading #customize-container iframe {
     5328    opacity: 0;
     5329}
     5330
     5331.customize-loading #customize-container {
     5332    background: #fff url("../images/wpspin_light.gif") no-repeat fixed center center;
     5333}
     5334
    53275335#customize-container iframe,
    53285336#theme-installer iframe {
     
    53305338    width: 100%;
    53315339    z-index: 20;
     5340
     5341    -webkit-transition: opacity 0.3s;
     5342    -moz-transition:    opacity 0.3s;
     5343    -ms-transition:     opacity 0.3s;
     5344    -o-transition:      opacity 0.3s;
     5345    transition:         opacity 0.3s;
    53325346}
    53335347
  • trunk/wp-includes/js/customize-loader.dev.js

    r20517 r20743  
    5151                return;
    5252            this.active = true;
     53            this.body.addClass('customize-loading');
    5354
    5455            this.iframe = $( '<iframe />', { src: src }).appendTo( this.element );
     56            this.iframe.one( 'load', this.loaded );
    5557
    5658            // Create a postMessage connection with the iframe.
     
    9395                Loader.iframe    = null;
    9496                Loader.messenger = null;
    95                 Loader.body.removeClass( 'customize-active full-overlay-active' );
     97                Loader.body.removeClass( 'customize-active full-overlay-active' ).removeClass( 'customize-loading' );
    9698            });
     99        },
     100        loaded: function() {
     101            Loader.body.removeClass('customize-loading');
    97102        }
    98103    };
Note: See TracChangeset for help on using the changeset viewer.