Theme Customizer: Improve activate and publish flow, make customizer states easier to track. fixes #20743, see #19910.
git-svn-id: https://develop.svn.wordpress.org/trunk@20899 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
parent
53d8ab60ec
commit
d49df83c8c
|
@ -130,6 +130,7 @@ do_action( 'customize_controls_print_scripts' );
|
||||||
'url' => array(
|
'url' => array(
|
||||||
'preview' => esc_url( home_url( '/' ) ),
|
'preview' => esc_url( home_url( '/' ) ),
|
||||||
'parent' => esc_url( admin_url() ),
|
'parent' => esc_url( admin_url() ),
|
||||||
|
'activated' => esc_url( admin_url( 'themes.php?activated=true' ) ),
|
||||||
'ajax' => esc_url( admin_url( 'admin-ajax.php', 'relative' ) ),
|
'ajax' => esc_url( admin_url( 'admin-ajax.php', 'relative' ) ),
|
||||||
'allowed' => array_map( 'esc_url', $allowed_urls ),
|
'allowed' => array_map( 'esc_url', $allowed_urls ),
|
||||||
'isCrossDomain' => $cross_domain,
|
'isCrossDomain' => $cross_domain,
|
||||||
|
|
|
@ -18,35 +18,6 @@ jQuery( function($) {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
/**
|
|
||||||
* Theme Customizer
|
|
||||||
*
|
|
||||||
* Ensures the themes page is refreshed if the customizer switches the theme.
|
|
||||||
*/
|
|
||||||
jQuery( function($) {
|
|
||||||
var Loader, activated;
|
|
||||||
|
|
||||||
if ( typeof wp === 'undefined' || ! wp.customize || ! ( Loader = wp.customize.Loader ) )
|
|
||||||
return;
|
|
||||||
|
|
||||||
// Strip the current URL of its query string and hash, add activated query string.
|
|
||||||
activated = window.location.href.replace(/[#?].*$/, '') + '?activated=true';
|
|
||||||
|
|
||||||
// When an instance of the customizer is loaded...
|
|
||||||
Loader.bind( 'open', function() {
|
|
||||||
|
|
||||||
// If the customizer triggers a theme switched event,
|
|
||||||
// load the activated page when the customizer is closed.
|
|
||||||
Loader.messenger.bind( 'switched', function() {
|
|
||||||
|
|
||||||
Loader.unbind( 'close', Loader.overlay.hide );
|
|
||||||
Loader.bind( 'close', function() {
|
|
||||||
window.location = activated;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Theme Install
|
* Theme Install
|
||||||
*
|
*
|
||||||
|
|
|
@ -439,13 +439,14 @@
|
||||||
api.settings = window._wpCustomizeSettings;
|
api.settings = window._wpCustomizeSettings;
|
||||||
api.l10n = window._wpCustomizeControlsL10n;
|
api.l10n = window._wpCustomizeControlsL10n;
|
||||||
|
|
||||||
|
// Check if we can run the customizer.
|
||||||
if ( ! api.settings )
|
if ( ! api.settings )
|
||||||
return;
|
return;
|
||||||
|
|
||||||
|
// Redirect to the fallback preview if any incompatibilities are found.
|
||||||
if ( ! $.support.postMessage || ( ! $.support.cors && api.settings.isCrossDomain ) )
|
if ( ! $.support.postMessage || ( ! $.support.cors && api.settings.isCrossDomain ) )
|
||||||
return window.location = api.settings.url.fallback;
|
return window.location = api.settings.url.fallback;
|
||||||
|
|
||||||
// Initialize Previewer
|
|
||||||
var body = $( document.body ),
|
var body = $( document.body ),
|
||||||
query, previewer, parent;
|
query, previewer, parent;
|
||||||
|
|
||||||
|
@ -455,6 +456,7 @@
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Initialize Previewer
|
||||||
previewer = new api.Previewer({
|
previewer = new api.Previewer({
|
||||||
container: '#customize-preview',
|
container: '#customize-preview',
|
||||||
form: '#customize-controls',
|
form: '#customize-controls',
|
||||||
|
@ -481,9 +483,14 @@
|
||||||
api.trigger( 'save', request );
|
api.trigger( 'save', request );
|
||||||
|
|
||||||
body.addClass('saving');
|
body.addClass('saving');
|
||||||
|
|
||||||
request.always( function() {
|
request.always( function() {
|
||||||
body.removeClass('saving');
|
body.removeClass('saving');
|
||||||
});
|
});
|
||||||
|
|
||||||
|
request.done( function() {
|
||||||
|
api.trigger( 'saved' );
|
||||||
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -507,6 +514,57 @@
|
||||||
// Load the preview frame.
|
// Load the preview frame.
|
||||||
previewer.refresh();
|
previewer.refresh();
|
||||||
|
|
||||||
|
// Save and activated states
|
||||||
|
(function() {
|
||||||
|
var state = new api.Values(),
|
||||||
|
saved = state.create('saved'),
|
||||||
|
activated = state.create('activated');
|
||||||
|
|
||||||
|
state.bind( 'change', function() {
|
||||||
|
var save = $('#save'),
|
||||||
|
back = $('.back');
|
||||||
|
|
||||||
|
if ( ! activated() ) {
|
||||||
|
save.val( api.l10n.activate ).prop( 'disabled', false );
|
||||||
|
back.text( api.l10n.cancel );
|
||||||
|
|
||||||
|
} else if ( saved() ) {
|
||||||
|
save.val( api.l10n.saved ).prop( 'disabled', true );
|
||||||
|
back.text( api.l10n.close );
|
||||||
|
|
||||||
|
} else {
|
||||||
|
save.val( api.l10n.save ).prop( 'disabled', false );
|
||||||
|
back.text( api.l10n.cancel );
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Set default states.
|
||||||
|
saved( true );
|
||||||
|
activated( api.settings.theme.active );
|
||||||
|
|
||||||
|
api.bind( 'change', function() {
|
||||||
|
state('saved').set( false );
|
||||||
|
});
|
||||||
|
|
||||||
|
api.bind( 'saved', function() {
|
||||||
|
state('saved').set( true );
|
||||||
|
state('activated').set( true );
|
||||||
|
});
|
||||||
|
|
||||||
|
activated.bind( function( to ) {
|
||||||
|
if ( to )
|
||||||
|
api.trigger( 'activated' );
|
||||||
|
});
|
||||||
|
|
||||||
|
// Expose states to the API.
|
||||||
|
api.state = state;
|
||||||
|
}());
|
||||||
|
|
||||||
|
api.bind( 'activated', function() {
|
||||||
|
if ( api.settings.url.activated )
|
||||||
|
window.location = api.settings.url.activated;
|
||||||
|
});
|
||||||
|
|
||||||
// Temporary accordion code.
|
// Temporary accordion code.
|
||||||
$('.customize-section-title').click( function() {
|
$('.customize-section-title').click( function() {
|
||||||
var clicked = $( this ).parents( '.customize-section' );
|
var clicked = $( this ).parents( '.customize-section' );
|
||||||
|
@ -538,18 +596,10 @@
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
// If the current theme isn't active, it will be activated on save,
|
// Pass events through to the parent.
|
||||||
// rendering the previous page
|
$.each([ 'saved', 'activated' ], function( i, id ) {
|
||||||
api.bind( 'save', function( request ) {
|
api.bind( id, function() {
|
||||||
request.done( function() {
|
parent.send( id );
|
||||||
parent.send( 'saved' );
|
|
||||||
|
|
||||||
if ( ! api.settings.theme.active ) {
|
|
||||||
parent.send( 'switched' );
|
|
||||||
$('#save').val( api.l10n.save );
|
|
||||||
}
|
|
||||||
|
|
||||||
api.settings.theme.active = true;
|
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -302,7 +302,11 @@ function wp_default_scripts( &$scripts ) {
|
||||||
$scripts->add( 'customize-preview', "/wp-includes/js/customize-preview$suffix.js", array( 'customize-base' ), false, 1 );
|
$scripts->add( 'customize-preview', "/wp-includes/js/customize-preview$suffix.js", array( 'customize-base' ), false, 1 );
|
||||||
$scripts->add( 'customize-controls', "/wp-includes/js/customize-controls$suffix.js", array( 'customize-base' ), false, 1 );
|
$scripts->add( 'customize-controls', "/wp-includes/js/customize-controls$suffix.js", array( 'customize-base' ), false, 1 );
|
||||||
$scripts->localize( 'customize-controls', '_wpCustomizeControlsL10n', array(
|
$scripts->localize( 'customize-controls', '_wpCustomizeControlsL10n', array(
|
||||||
|
'activate' => __( 'Save & Activate' ),
|
||||||
'save' => __( 'Save & Publish' ),
|
'save' => __( 'Save & Publish' ),
|
||||||
|
'saved' => __( 'Saved' ),
|
||||||
|
'cancel' => __( 'Cancel' ),
|
||||||
|
'close' => __( 'Close' ),
|
||||||
) );
|
) );
|
||||||
|
|
||||||
if ( is_admin() ) {
|
if ( is_admin() ) {
|
||||||
|
|
Loading…
Reference in New Issue