Customize: Eliminate unnecessary `WP_Customize_Site_Logo_Control` in favor of re-using `WP_Customize_Image_Control`.

* Removes double `margin-bottom` from all the media controls.
* All media controls now send `{settingId}-attachment-data` messages to the preview when a media setting is updated so that the preview has access to the attachment data.
* Fixes receiving of `attachment-data` message for `custom_logo` which resulted in instant JS-applied preview not working. See #36096.

See #33755.
Fixes #35941.

Built from https://develop.svn.wordpress.org/trunk@36851


git-svn-id: http://core.svn.wordpress.org/trunk@36818 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Weston Ruter 2016-03-04 23:47:26 +00:00
parent f11d47d9ba
commit a8ca958d43
11 changed files with 28 additions and 147 deletions

View File

@ -721,7 +721,6 @@ p.customize-section-description {
.customize-control-background .current,
.customize-control-cropped_image .current,
.customize-control-site_icon .current,
.customize-control-custom_logo .current,
.customize-control-header .current {
margin-bottom: 8px;
}
@ -763,9 +762,6 @@ p.customize-section-description {
.customize-control-site_icon .remove-button,
.customize-control-site_icon .default-button,
.customize-control-site_icon .upload-button,
.customize-control-custom_logo .remove-button,
.customize-control-custom_logo .default-button,
.customize-control-custom_logo .upload-button,
.customize-control-header button.new,
.customize-control-header button.remove {
white-space: normal;
@ -779,7 +775,6 @@ p.customize-section-description {
.customize-control-background .current .container,
.customize-control-cropped_image .current .container,
.customize-control-site_icon .current .container,
.customize-control-custom_logo .current .container,
.customize-control-header .current .container {
overflow: hidden;
-webkit-border-radius: 2px;
@ -793,7 +788,6 @@ p.customize-section-description {
.customize-control-background .current .container,
.customize-control-cropped_image .current .container,
.customize-control-site_icon .current .container,
.customize-control-custom_logo .current .container,
.customize-control-image .current .container {
min-height: 40px;
}
@ -822,7 +816,6 @@ p.customize-section-description {
.customize-control-background .inner,
.customize-control-cropped_image .inner,
.customize-control-site_icon .inner,
.customize-control-custom_logo .inner,
.customize-control-header .inner {
display: none;
position: absolute;
@ -838,7 +831,6 @@ p.customize-section-description {
.customize-control-background .inner,
.customize-control-cropped_image .inner,
.customize-control-site_icon .inner,
.customize-control-custom_logo .inner,
.customize-control-image .inner {
display: block;
min-height: 40px;
@ -850,7 +842,6 @@ p.customize-section-description {
.customize-control-background .inner,
.customize-control-cropped_image .inner,
.customize-control-site_icon .inner,
.customize-control-custom_logo.inner,
.customize-control-header .inner,
.customize-control-header .inner .dashicons {
line-height: 20px;
@ -950,16 +941,6 @@ p.customize-section-description {
100% { color: #d4b146; }
}
.customize-control-media .actions,
.customize-control-upload .actions,
.customize-control-image .actions,
.customize-control-background .actions,
.customize-control-cropped_image .actions,
.customize-control-site_icon .actions,
.customize-control-header .actions {
margin-bottom: 32px;
}
.customize-control-header .choice {
position: relative;
display: block;
@ -994,8 +975,6 @@ p.customize-section-description {
.customize-control-cropped_image .default-button,
.customize-control-site_icon .remove-button,
.customize-control-site_icon .default-button,
.customize-control-custom_logo .remove-button,
.customize-control-custom_logo .default-button,
.customize-control-header .remove {
float: right;
margin-left: 3px;
@ -1007,7 +986,6 @@ p.customize-section-description {
.customize-control-background .upload-button,
.customize-control-cropped_image .upload-button,
.customize-control-site_icon .upload-button,
.customize-control-custom_logo .upload-button,
.customize-control-header .new {
float: left;
}

File diff suppressed because one or more lines are too long

View File

@ -721,7 +721,6 @@ p.customize-section-description {
.customize-control-background .current,
.customize-control-cropped_image .current,
.customize-control-site_icon .current,
.customize-control-custom_logo .current,
.customize-control-header .current {
margin-bottom: 8px;
}
@ -763,9 +762,6 @@ p.customize-section-description {
.customize-control-site_icon .remove-button,
.customize-control-site_icon .default-button,
.customize-control-site_icon .upload-button,
.customize-control-custom_logo .remove-button,
.customize-control-custom_logo .default-button,
.customize-control-custom_logo .upload-button,
.customize-control-header button.new,
.customize-control-header button.remove {
white-space: normal;
@ -779,7 +775,6 @@ p.customize-section-description {
.customize-control-background .current .container,
.customize-control-cropped_image .current .container,
.customize-control-site_icon .current .container,
.customize-control-custom_logo .current .container,
.customize-control-header .current .container {
overflow: hidden;
-webkit-border-radius: 2px;
@ -793,7 +788,6 @@ p.customize-section-description {
.customize-control-background .current .container,
.customize-control-cropped_image .current .container,
.customize-control-site_icon .current .container,
.customize-control-custom_logo .current .container,
.customize-control-image .current .container {
min-height: 40px;
}
@ -822,7 +816,6 @@ p.customize-section-description {
.customize-control-background .inner,
.customize-control-cropped_image .inner,
.customize-control-site_icon .inner,
.customize-control-custom_logo .inner,
.customize-control-header .inner {
display: none;
position: absolute;
@ -838,7 +831,6 @@ p.customize-section-description {
.customize-control-background .inner,
.customize-control-cropped_image .inner,
.customize-control-site_icon .inner,
.customize-control-custom_logo .inner,
.customize-control-image .inner {
display: block;
min-height: 40px;
@ -850,7 +842,6 @@ p.customize-section-description {
.customize-control-background .inner,
.customize-control-cropped_image .inner,
.customize-control-site_icon .inner,
.customize-control-custom_logo.inner,
.customize-control-header .inner,
.customize-control-header .inner .dashicons {
line-height: 20px;
@ -950,16 +941,6 @@ p.customize-section-description {
100% { color: #d4b146; }
}
.customize-control-media .actions,
.customize-control-upload .actions,
.customize-control-image .actions,
.customize-control-background .actions,
.customize-control-cropped_image .actions,
.customize-control-site_icon .actions,
.customize-control-header .actions {
margin-bottom: 32px;
}
.customize-control-header .choice {
position: relative;
display: block;
@ -994,8 +975,6 @@ p.customize-section-description {
.customize-control-cropped_image .default-button,
.customize-control-site_icon .remove-button,
.customize-control-site_icon .default-button,
.customize-control-custom_logo .remove-button,
.customize-control-custom_logo .default-button,
.customize-control-header .remove {
float: left;
margin-right: 3px;
@ -1007,7 +986,6 @@ p.customize-section-description {
.customize-control-background .upload-button,
.customize-control-cropped_image .upload-button,
.customize-control-site_icon .upload-button,
.customize-control-custom_logo .upload-button,
.customize-control-header .new {
float: right;
}

File diff suppressed because one or more lines are too long

View File

@ -1790,8 +1790,16 @@
control.pausePlayer();
});
control.setting.bind( function( value ) {
// Send attachment information to the preview for possible use in `postMessage` transport.
wp.media.attachment( value ).fetch().done( function() {
wp.customize.previewer.send( control.setting.id + '-attachment-data', this.attributes );
} );
// Re-render whenever the control's setting changes.
control.setting.bind( function () { control.renderContent(); } );
control.renderContent();
} );
},
pausePlayer: function () {
@ -2302,43 +2310,6 @@
}
});
/**
* A control for selecting custom logos.
*
* @class
* @augments wp.customize.MediaControl
* @augments wp.customize.Control
* @augments wp.customize.Class
*/
api.CustomLogoControl = api.MediaControl.extend({
/**
* When the control's DOM structure is ready,
* set up internal event bindings.
*/
ready: function() {
var control = this;
// Shortcut so that we don't have to use _.bind every time we add a callback.
_.bindAll( control, 'restoreDefault', 'removeFile', 'openFrame', 'select' );
// Bind events, with delegation to facilitate re-rendering.
control.container.on( 'click keydown', '.upload-button', control.openFrame );
control.container.on( 'click keydown', '.thumbnail-image img', control.openFrame );
control.container.on( 'click keydown', '.default-button', control.restoreDefault );
control.container.on( 'click keydown', '.remove-button', control.removeFile );
control.setting.bind( function( attachmentId ) {
wp.media.attachment( attachmentId ).fetch().done( function() {
wp.customize.previewer.send( 'custom-logo-attachment-data', this.attributes );
} );
// Re-render whenever the control's setting changes.
control.renderContent();
} );
}
});
/**
* @class
* @augments wp.customize.Control
@ -3245,7 +3216,6 @@
image: api.ImageControl,
cropped_image: api.CroppedImageControl,
site_icon: api.SiteIconControl,
custom_logo: api.CustomLogoControl,
header: api.HeaderControl,
background: api.BackgroundControl,
theme: api.ThemeControl

File diff suppressed because one or more lines are too long

View File

@ -217,7 +217,6 @@ final class WP_Customize_Manager {
require_once( ABSPATH . WPINC . '/customize/class-wp-customize-background-image-control.php' );
require_once( ABSPATH . WPINC . '/customize/class-wp-customize-cropped-image-control.php' );
require_once( ABSPATH . WPINC . '/customize/class-wp-customize-site-icon-control.php' );
require_once( ABSPATH . WPINC . '/customize/class-wp-customize-custom-logo-control.php' );
require_once( ABSPATH . WPINC . '/customize/class-wp-customize-header-image-control.php' );
require_once( ABSPATH . WPINC . '/customize/class-wp-customize-theme-control.php' );
require_once( ABSPATH . WPINC . '/customize/class-wp-widget-area-customize-control.php' );
@ -1848,7 +1847,6 @@ final class WP_Customize_Manager {
$this->register_control_type( 'WP_Customize_Background_Image_Control' );
$this->register_control_type( 'WP_Customize_Cropped_Image_Control' );
$this->register_control_type( 'WP_Customize_Site_Icon_Control' );
$this->register_control_type( 'WP_Customize_Custom_Logo_Control' );
$this->register_control_type( 'WP_Customize_Theme_Control' );
/* Themes */
@ -1965,10 +1963,20 @@ final class WP_Customize_Manager {
'transport' => 'postMessage',
) );
$this->add_control( new WP_Customize_Custom_Logo_Control( $this, 'custom_logo', array(
$this->add_control( new WP_Customize_Media_Control( $this, 'custom_logo', array(
'label' => __( 'Logo' ),
'section' => 'title_tagline',
'priority' => 0,
'mime_type' => 'image',
'button_labels' => array(
'select' => __( 'Select logo' ),
'change' => __( 'Change logo' ),
'remove' => __( 'Remove' ),
'default' => __( 'Default' ),
'placeholder' => __( 'No logo selected' ),
'frame_title' => __( 'Select logo' ),
'frame_button' => __( 'Choose logo' ),
),
) ) );
if ( isset( $this->selective_refresh ) ) {

View File

@ -1,53 +0,0 @@
<?php
/**
* Customize API: WP_Customize_Custom_Logo_Control class
*
* @package WordPress
* @subpackage Customize
* @since 4.5.0
*/
/**
* Customize custom logo control class.
*
* Used only for custom functionality in JavaScript.
*
* @since 4.5.0
*
* @see WP_Customize_Image_Control
*/
class WP_Customize_Custom_Logo_Control extends WP_Customize_Image_Control {
/**
* Control type.
*
* @since 4.5.0
* @access public
* @var string
*/
public $type = 'custom_logo';
/**
* Constructor.
*
* @since 4.5.0
* @access public
*
* @param WP_Customize_Manager $manager Customizer bootstrap instance.
* @param string $id Control ID.
* @param array $args Optional. Arguments to override class property defaults.
*/
public function __construct( $manager, $id, $args = array() ) {
parent::__construct( $manager, $id, $args );
$this->button_labels = array(
'select' => __( 'Select logo' ),
'change' => __( 'Change logo' ),
'remove' => __( 'Remove' ),
'default' => __( 'Default' ),
'placeholder' => __( 'No logo selected' ),
'frame_title' => __( 'Select logo' ),
'frame_button' => __( 'Choose logo' ),
);
}
}

View File

@ -234,7 +234,7 @@
*
* @since 4.5.0
*/
api.preview.bind( 'custom-logo-attachment-data', function( attachment ) {
api.preview.bind( 'custom_logo-attachment-data', function( attachment ) {
var $logo = $( '.custom-logo' ),
size = $logo.data( 'size' ),
srcset = [];

View File

@ -1 +1 @@
!function(a,b){var c,d=wp.customize;c=function(a,b,c){var d;return function(){var e=arguments;c=c||this,clearTimeout(d),d=setTimeout(function(){d=null,a.apply(c,e)},b)}},d.Preview=d.Messenger.extend({initialize:function(a,e){var f=this;d.Messenger.prototype.initialize.call(this,a,e),this.body=b(document.body),this.body.on("click.preview","a",function(a){var c,d;c=b(this),d="#"===c.attr("href").substr(0,1),a.preventDefault(),d&&"#"!==c.attr("href")&&b(c.attr("href")).each(function(){this.scrollIntoView()}),a.shiftKey||d||(f.send("scroll",0),f.send("url",c.prop("href")))}),this.body.on("submit.preview","form",function(a){a.preventDefault()}),this.window=b(window),this.window.on("scroll.preview",c(function(){f.send("scroll",f.window.scrollTop())},200)),this.bind("scroll",function(a){f.window.scrollTop(a)})}}),b(function(){var a,c;d.settings=window._wpCustomizeSettings,d.settings&&(d.preview=new d.Preview({url:window.location.href,channel:d.settings.channel}),c=function(a,b,c){var e=d(a);e?e.set(b):(c=c||!1,e=d.create(a,b,{id:a}),c&&(e._dirty=!0))},d.preview.bind("settings",function(a){b.each(a,c)}),d.preview.trigger("settings",d.settings.values),b.each(d.settings._dirty,function(a,b){var c=d(b);c&&(c._dirty=!0)}),d.preview.bind("setting",function(a){var b=!0;c.apply(null,a.concat(b))}),d.preview.bind("sync",function(a){b.each(a,function(a,b){d.preview.trigger(a,b)}),d.preview.send("synced")}),d.preview.bind("active",function(){d.preview.send("nonce",d.settings.nonce),d.preview.send("documentTitle",document.title)}),d.preview.bind("saved",function(a){d.trigger("saved",a)}),d.bind("saved",function(){d.each(function(a){a._dirty=!1})}),d.preview.bind("nonce-refresh",function(a){b.extend(d.settings.nonce,a)}),d.preview.send("ready",{activePanels:d.settings.activePanels,activeSections:d.settings.activeSections,activeControls:d.settings.activeControls}),d.preview.bind("loading-initiated",function(){b("body").addClass("wp-customizer-unloading")}),d.preview.bind("loading-failed",function(){b("body").removeClass("wp-customizer-unloading")}),a=b.map(["color","image","position_x","repeat","attachment"],function(a){return"background_"+a}),d.when.apply(d,a).done(function(a,c,d,e,f){var g,h=b(document.body),i=b("head"),j=b("#custom-background-css");g=function(){var g="";h.toggleClass("custom-background",!(!a()&&!c())),a()&&(g+="background-color: "+a()+";"),c()&&(g+='background-image: url("'+c()+'");',g+="background-position: top "+d()+";",g+="background-repeat: "+e()+";",g+="background-attachment: "+f()+";"),j.remove(),j=b('<style type="text/css" id="custom-background-css">body.custom-background { '+g+" }</style>").appendTo(i)},b.each(arguments,function(){this.bind(g)})}),d.preview.bind("custom-logo-attachment-data",function(a){var c=b(".custom-logo"),d=c.data("size"),e=[];a.sizes[d]||(d="full"),_.each(a.sizes,function(a){e.push(a.url+" "+a.width+"w")}),c.attr({height:a.sizes[d].height,width:a.sizes[d].width,src:a.sizes[d].url,srcset:e}),b(".custom-logo-link").show()}),d("custom_logo",function(a){a.bind(function(a){a||b(".custom-logo-link").hide()}),d.selectiveRefresh&&d.selectiveRefresh.partial.has("custom_logo")||(b(document.body).on("click",".custom-logo-link",function(a){a.shiftKey&&d.preview.send("focus-control-for-setting","custom_logo")}),b(".custom-logo-link").attr("title",d.settings.l10n.shiftClickToEdit))}),d.trigger("preview-ready"))})}(wp,jQuery);
!function(a,b){var c,d=wp.customize;c=function(a,b,c){var d;return function(){var e=arguments;c=c||this,clearTimeout(d),d=setTimeout(function(){d=null,a.apply(c,e)},b)}},d.Preview=d.Messenger.extend({initialize:function(a,e){var f=this;d.Messenger.prototype.initialize.call(this,a,e),this.body=b(document.body),this.body.on("click.preview","a",function(a){var c,d;c=b(this),d="#"===c.attr("href").substr(0,1),a.preventDefault(),d&&"#"!==c.attr("href")&&b(c.attr("href")).each(function(){this.scrollIntoView()}),a.shiftKey||d||(f.send("scroll",0),f.send("url",c.prop("href")))}),this.body.on("submit.preview","form",function(a){a.preventDefault()}),this.window=b(window),this.window.on("scroll.preview",c(function(){f.send("scroll",f.window.scrollTop())},200)),this.bind("scroll",function(a){f.window.scrollTop(a)})}}),b(function(){var a,c;d.settings=window._wpCustomizeSettings,d.settings&&(d.preview=new d.Preview({url:window.location.href,channel:d.settings.channel}),c=function(a,b,c){var e=d(a);e?e.set(b):(c=c||!1,e=d.create(a,b,{id:a}),c&&(e._dirty=!0))},d.preview.bind("settings",function(a){b.each(a,c)}),d.preview.trigger("settings",d.settings.values),b.each(d.settings._dirty,function(a,b){var c=d(b);c&&(c._dirty=!0)}),d.preview.bind("setting",function(a){var b=!0;c.apply(null,a.concat(b))}),d.preview.bind("sync",function(a){b.each(a,function(a,b){d.preview.trigger(a,b)}),d.preview.send("synced")}),d.preview.bind("active",function(){d.preview.send("nonce",d.settings.nonce),d.preview.send("documentTitle",document.title)}),d.preview.bind("saved",function(a){d.trigger("saved",a)}),d.bind("saved",function(){d.each(function(a){a._dirty=!1})}),d.preview.bind("nonce-refresh",function(a){b.extend(d.settings.nonce,a)}),d.preview.send("ready",{activePanels:d.settings.activePanels,activeSections:d.settings.activeSections,activeControls:d.settings.activeControls}),d.preview.bind("loading-initiated",function(){b("body").addClass("wp-customizer-unloading")}),d.preview.bind("loading-failed",function(){b("body").removeClass("wp-customizer-unloading")}),a=b.map(["color","image","position_x","repeat","attachment"],function(a){return"background_"+a}),d.when.apply(d,a).done(function(a,c,d,e,f){var g,h=b(document.body),i=b("head"),j=b("#custom-background-css");g=function(){var g="";h.toggleClass("custom-background",!(!a()&&!c())),a()&&(g+="background-color: "+a()+";"),c()&&(g+='background-image: url("'+c()+'");',g+="background-position: top "+d()+";",g+="background-repeat: "+e()+";",g+="background-attachment: "+f()+";"),j.remove(),j=b('<style type="text/css" id="custom-background-css">body.custom-background { '+g+" }</style>").appendTo(i)},b.each(arguments,function(){this.bind(g)})}),d.preview.bind("custom_logo-attachment-data",function(a){var c=b(".custom-logo"),d=c.data("size"),e=[];a.sizes[d]||(d="full"),_.each(a.sizes,function(a){e.push(a.url+" "+a.width+"w")}),c.attr({height:a.sizes[d].height,width:a.sizes[d].width,src:a.sizes[d].url,srcset:e}),b(".custom-logo-link").show()}),d("custom_logo",function(a){a.bind(function(a){a||b(".custom-logo-link").hide()}),d.selectiveRefresh&&d.selectiveRefresh.partial.has("custom_logo")||(b(document.body).on("click",".custom-logo-link",function(a){a.shiftKey&&d.preview.send("focus-control-for-setting","custom_logo")}),b(".custom-logo-link").attr("title",d.settings.l10n.shiftClickToEdit))}),d.trigger("preview-ready"))})}(wp,jQuery);

View File

@ -4,7 +4,7 @@
*
* @global string $wp_version
*/
$wp_version = '4.5-beta2-36850';
$wp_version = '4.5-beta2-36851';
/**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.