sergiotarxz/Wordpress
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Theme Customizer: Improve default background property handling. see #20600, #19910.

Browse Source 
If the custom background default wp-head-callback (_custom_background_cb) is used, we use postMessage for all custom background properties. Otherwise, we use full refreshes.

When using postMessage, the preview recalculates the custom background CSS block, allowing it to omit CSS values when they are not present and fall back on the original CSS.


git-svn-id: https://develop.svn.wordpress.org/trunk@20908 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Daryl Koopersmith 2012-05-25 18:41:22 +00:00
parent 11e40f1643
commit c88445c82d
3 changed files with 40 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
wp-includes/class-wp-customize-manager.php
View File

@ -649,7 +649,6 @@ final class WP_Customize_Manager {
'default' => get_theme_support( 'custom-background', 'default-color' ),
'sanitize_callback' => 'sanitize_hexcolor',
'theme_supports' => 'custom-background',
'transport' => 'postMessage',
) );
$this->add_control( new WP_Customize_Color_Control( $this, 'background_color', array(
@ -716,6 +715,14 @@ final class WP_Customize_Manager {
),
) );
// If the theme is using the default background callback, we can update
// the background CSS using postMessage.
if ( get_theme_support( 'custom-background', 'wp-head-callback' ) === '_custom_background_cb' ) {
foreach ( array( 'color', 'image', 'position_x', 'repeat', 'attachment' ) as $prop ) {
$this->get_setting( 'background_' . $prop )->transport = 'postMessage';
}
}
/* Nav Menus */
$locations = get_registered_nav_menus();

37
wp-includes/js/customize-preview.dev.js
View File

@ -61,7 +61,7 @@
if ( ! api.settings )
return;
var preview, body;
var preview, bg;
preview = new api.Preview( window.location.href );
@ -75,11 +75,36 @@
value.set.apply( value, args );
});
body = $(document.body);
// Auto update background color by default
api( 'background_color', function( value ) {
value.bind( function( to ) {
body.css( 'background-color', to ? '#' + to : '' );
/* Custom Backgrounds */
bg = $.map(['color', 'image', 'position_x', 'repeat', 'attachment'], function( prop ) {
return 'background_' + prop;
});
api.when.apply( api, bg ).done( function( color, image, position_x, repeat, attachment ) {
var style = $('#custom-background-css'),
update;
if ( ! style.length )
return;
update = function() {
var css = '';
if ( color() )
css += 'background-color: #' + color() + ';';
if ( image() ) {
css += 'background-image: url("' + image() + '");';
css += 'background-position: top ' + position_x() + ';';
css += 'background-repeat: ' + repeat() + ';';
css += 'background-position: top ' + attachment() + ';';
}
style.html( 'body.custom-background { ' + css + ' }' );
};
$.each( arguments, function() {
this.bind( update );
});
});
});

2
wp-includes/theme.php
View File

@ -1130,7 +1130,7 @@ function _custom_background_cb() {
$style .= $image . $repeat . $position . $attachment;
}
?>
<style type="text/css">
<style type="text/css" id="custom-background-css">
body.custom-background { <?php echo trim( $style ); ?> }
</style>
<?php