Widget Customizer: Move WidgetCustomizer to wp.customize.Widgets. First pass.

see #27690.
Built from https://develop.svn.wordpress.org/trunk@27985


git-svn-id: http://core.svn.wordpress.org/trunk@27815 1a063a9b-81f0-0310-95a4-ce76da25c4cd

wp-admin/css/customize-controls-rtl.css

@@ -490,6 +490,7 @@ body {
 	overflow: hidden;
 	-webkit-border-radius: 2px;
 	border: 1px solid #eee;
+	-webkit-border-radius: 2px;
 	border-radius: 2px;
 }
 

wp-admin/css/customize-controls.css

@@ -490,6 +490,7 @@ body {
 	overflow: hidden;
 	-webkit-border-radius: 2px;
 	border: 1px solid #eee;
+	-webkit-border-radius: 2px;
 	border-radius: 2px;
 }
 

wp-admin/css/customize-widgets-rtl.css

@@ -108,13 +108,6 @@
 	display: none;
 }
 
-
-/* MP6-compat */
-#customize-theme-controls .accordion-section-content .widget {
-	color: black;
-}
-
-
 /**
 * Widget reordering styles
 **/
@@ -326,7 +319,7 @@
 
 body.adding-widget .add-new-widget,
 body.adding-widget .add-new-widget:hover {
-	background: #EEE;
+	background: #eee;
 	border-color: #999;
 	color: #333;
 	-webkit-box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.5);

wp-admin/css/customize-widgets.css

@@ -108,13 +108,6 @@
 	display: none;
 }
 
-
-/* MP6-compat */
-#customize-theme-controls .accordion-section-content .widget {
-	color: black;
-}
-
-
 /**
 * Widget reordering styles
 **/
@@ -326,7 +319,7 @@
 
 body.adding-widget .add-new-widget,
 body.adding-widget .add-new-widget:hover {
-	background: #EEE;
+	background: #eee;
 	border-color: #999;
 	color: #333;
 	-webkit-box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.5);

wp-includes/class-wp-customize-control.php

@@ -917,12 +917,12 @@ class WP_Widget_Area_Customize_Control extends WP_Customize_Control {
 	public function render_content() {
 		?>
 		<span class="button-secondary add-new-widget" tabindex="0">
-			<?php esc_html_e( 'Add a Widget' ); ?>
+			<?php _e( 'Add a Widget' ); ?>
 		</span>
 
 		<span class="reorder-toggle" tabindex="0">
-			<span class="reorder"><?php esc_html_e( 'Reorder' ); ?></span>
-			<span class="reorder-done"><?php esc_html_e( 'Done' ); ?></span>
+			<span class="reorder"><?php _ex( 'Reorder', 'Reorder widgets in Customizer' ); ?></span>
+			<span class="reorder-done"><?php _ex( 'Done', 'Cancel reordering widgets in Customizer'  ); ?></span>
 		</span>
 		<?php
 	}
@@ -940,11 +940,10 @@ class WP_Widget_Form_Customize_Control extends WP_Customize_Control {
 	public $width;
 	public $height;
 	public $is_wide = false;
-	public $is_live_previewable = false;
 
 	public function to_json() {
 		parent::to_json();
-		$exported_properties = array( 'widget_id', 'widget_id_base', 'sidebar_id', 'width', 'height', 'is_wide', 'is_live_previewable' );
+		$exported_properties = array( 'widget_id', 'widget_id_base', 'sidebar_id', 'width', 'height', 'is_wide' );
 		foreach ( $exported_properties as $key ) {
 			$this->json[ $key ] = $this->$key;
 		}

wp-includes/class-wp-customize-widgets.php

@@ -406,8 +406,6 @@ final class WP_Customize_Widgets {
 				$setting_id        = $this->get_setting_id( $widget_id );
 				$id_base           = $GLOBALS['wp_registered_widget_controls'][$widget_id]['id_base'];
 
-				assert( false !== is_active_widget( $registered_widget['callback'], $registered_widget['id'], false, false ) );
-
 				$control = new WP_Widget_Form_Customize_Control( $this->manager, $setting_id, array(
 					'label'          => $registered_widget['name'],
 					'section'        => $section_id,
@@ -599,8 +597,8 @@ final class WP_Customize_Widgets {
 		$move_widget_area_tpl = str_replace(
 			array( '{description}', '{btn}' ),
 			array(
-				( 'Select an area to move this widget into:' ), // @todo translate
-				esc_html_x( 'Move', 'move widget' ),
+				__( 'Select an area to move this widget into:' ),
+				_x( 'Move', 'Move widget' ),
 			),
 			'<div class="move-widget-area">
 				<p class="description">{description}</p>
@@ -615,39 +613,34 @@ final class WP_Customize_Widgets {
 			</div>'
 		);
 
-		/*
-		 * Why not wp_localize_script? Because we're not localizing,
-		 * and it forces values into strings.
-		 */
 		global $wp_scripts;
 
-		$exports = array(
-			'nonce'               => wp_create_nonce( 'update-widget' ),
-			'registered_sidebars' => array_values( $GLOBALS['wp_registered_sidebars'] ),
-			'registered_widgets'  => $GLOBALS['wp_registered_widgets'],
-			'available_widgets'   => $available_widgets, // @todo Merge this with registered_widgets
-			'i18n' => array(
-				'save_btn_label'     => __( 'Apply' ),
-				// @todo translate? do we want these tooltips?
-				'save_btn_tooltip'   => ( 'Save and preview changes before publishing them.' ),
-				'remove_btn_label'   => __( 'Remove' ),
-				'remove_btn_tooltip' => ( 'Trash widget by moving it to the inactive widgets sidebar.' ),
-				'error'              => __( 'An error has occurred. Please reload the page and try again.' ),
+		$settings = array(
+			'nonce'                => wp_create_nonce( 'update-widget' ),
+			'registeredSidebars'   => array_values( $GLOBALS['wp_registered_sidebars'] ),
+			'registeredWidgets'    => $GLOBALS['wp_registered_widgets'],
+			'availableWidgets'     => $available_widgets, // @todo Merge this with registered_widgets
+			'l10n' => array(
+				'saveBtnLabel'     => __( 'Apply' ),
+				'saveBtnTooltip'   => __( 'Save and preview changes before publishing them.' ),
+				'removeBtnLabel'   => __( 'Remove' ),
+				'removeBtnTooltip' => __( 'Trash widget by moving it to the inactive widgets sidebar.' ),
+				'error'            => __( 'An error has occurred. Please reload the page and try again.' ),
 			),
-			'tpl'                 => array(
-				'widget_reorder_nav' => $widget_reorder_nav_tpl,
-				'move_widget_area'   => $move_widget_area_tpl,
+			'tpl' => array(
+				'widgetReorderNav' => $widget_reorder_nav_tpl,
+				'moveWidgetArea'   => $move_widget_area_tpl,
 			),
 		);
 
-		foreach ( $exports['registered_widgets'] as &$registered_widget ) {
+		foreach ( $settings['registeredWidgets'] as &$registered_widget ) {
 			unset( $registered_widget['callback'] ); // may not be JSON-serializeable
 		}
 
 		$wp_scripts->add_data(
 			'customize-widgets',
 			'data',
-			sprintf( 'var WidgetCustomizer_exports = %s;', json_encode( $exports ) )
+			sprintf( 'var _wpCustomizeWidgetsSettings = %s;', json_encode( $settings ) )
 		);
 	}
 
@@ -662,12 +655,12 @@ final class WP_Customize_Widgets {
 		<div id="widgets-left"><!-- compatibility with JS which looks for widget templates here -->
 		<div id="available-widgets">
 			<div id="available-widgets-filter">
-				<label class="screen-reader-text" for="widgets-search"><?php _e( 'Find Widgets' ); ?></label>
-				<input type="search" id="widgets-search" placeholder="<?php esc_attr_e( 'Find widgets&hellip;' ) ?>" />
+				<label class="screen-reader-text" for="widgets-search"><?php _e( 'Search Widgets' ); ?></label>
+				<input type="search" id="widgets-search" placeholder="<?php esc_attr_e( 'Search widgets&hellip;' ) ?>" />
 			</div>
 			<?php foreach ( $this->get_available_widgets() as $available_widget ): ?>
 				<div id="widget-tpl-<?php echo esc_attr( $available_widget['id'] ) ?>" data-widget-id="<?php echo esc_attr( $available_widget['id'] ) ?>" class="widget-tpl <?php echo esc_attr( $available_widget['id'] ) ?>" tabindex="0">
-					<?php echo $available_widget['control_tpl']; // xss ok ?>
+					<?php echo $available_widget['control_tpl']; ?>
 				</div>
 			<?php endforeach; ?>
 		</div><!-- #available-widgets -->
@@ -826,6 +819,7 @@ final class WP_Customize_Widgets {
 
 			$available_widgets[] = $available_widget;
 		}
+
 		return $available_widgets;
 	}
 

wp-includes/js/customize-preview-widgets.js

@@ -1,4 +1,4 @@
-(function( $, wp ){
+(function( wp, $ ){
 
 	if ( ! wp || ! wp.customize ) { return; }
 
@@ -124,4 +124,4 @@
 		api.WidgetCustomizerPreview.init();
 	});
 
-})( jQuery, window.wp );
+})( window.wp, jQuery );

wp-includes/js/customize-preview-widgets.min.js

@@ -1 +1 @@
-!function(a,b){if(b&&b.customize){var c,d=b.customize;d.WidgetCustomizerPreview={renderedSidebars:{},renderedWidgets:{},registeredSidebars:[],registeredWidgets:{},widgetSelectors:[],preview:null,l10n:{},init:function(){var a=this;this.buildWidgetSelectors(),this.highlightControls(),this.preview.bind("active",function(){a.preview.send("rendered-sidebars",a.renderedSidebars),a.preview.send("rendered-widgets",a.renderedWidgets)}),this.preview.bind("highlight-widget",a.highlightWidget)},buildWidgetSelectors:function(){var b=this;a.each(this.registeredSidebars,function(c,d){var e,f,g,h=[d.before_widget.replace("%1$s","").replace("%2$s",""),d.before_title,d.after_title,d.after_widget].join("");e=a(h),f=e.prop("tagName"),g=e.prop("className").replace(/^\s+|\s+$/g,""),g&&(f+="."+g.split(/\s+/).join(".")),b.widgetSelectors.push(f)})},highlightWidget:function(b){var c=a(document.body),d=a("#"+b);c.find(".widget-customizer-highlighted-widget").removeClass("widget-customizer-highlighted-widget"),d.addClass("widget-customizer-highlighted-widget"),setTimeout(function(){d.removeClass("widget-customizer-highlighted-widget")},500)},highlightControls:function(){var b=this,c=this.widgetSelectors.join(",");a(c).attr("title",this.l10n.widgetTooltip),a(document).on("mouseenter",c,function(){b.preview.send("highlight-widget-control",a(this).prop("id"))}),a(document).on("click",c,function(c){c.shiftKey&&(c.preventDefault(),b.preview.send("focus-widget-control",a(this).prop("id")))})}},c=d.Preview,d.Preview=c.extend({initialize:function(a,b){d.WidgetCustomizerPreview.preview=this,c.prototype.initialize.call(this,a,b)}}),a(function(){var b=window._wpWidgetCustomizerPreviewSettings;b&&(a.extend(d.WidgetCustomizerPreview,b),d.WidgetCustomizerPreview.init())})}}(jQuery,window.wp);
+!function(a,b){if(a&&a.customize){var c,d=a.customize;d.WidgetCustomizerPreview={renderedSidebars:{},renderedWidgets:{},registeredSidebars:[],registeredWidgets:{},widgetSelectors:[],preview:null,l10n:{},init:function(){var a=this;this.buildWidgetSelectors(),this.highlightControls(),this.preview.bind("active",function(){a.preview.send("rendered-sidebars",a.renderedSidebars),a.preview.send("rendered-widgets",a.renderedWidgets)}),this.preview.bind("highlight-widget",a.highlightWidget)},buildWidgetSelectors:function(){var a=this;b.each(this.registeredSidebars,function(c,d){var e,f,g,h=[d.before_widget.replace("%1$s","").replace("%2$s",""),d.before_title,d.after_title,d.after_widget].join("");e=b(h),f=e.prop("tagName"),g=e.prop("className").replace(/^\s+|\s+$/g,""),g&&(f+="."+g.split(/\s+/).join(".")),a.widgetSelectors.push(f)})},highlightWidget:function(a){var c=b(document.body),d=b("#"+a);c.find(".widget-customizer-highlighted-widget").removeClass("widget-customizer-highlighted-widget"),d.addClass("widget-customizer-highlighted-widget"),setTimeout(function(){d.removeClass("widget-customizer-highlighted-widget")},500)},highlightControls:function(){var a=this,c=this.widgetSelectors.join(",");b(c).attr("title",this.l10n.widgetTooltip),b(document).on("mouseenter",c,function(){a.preview.send("highlight-widget-control",b(this).prop("id"))}),b(document).on("click",c,function(c){c.shiftKey&&(c.preventDefault(),a.preview.send("focus-widget-control",b(this).prop("id")))})}},c=d.Preview,d.Preview=c.extend({initialize:function(a,b){d.WidgetCustomizerPreview.preview=this,c.prototype.initialize.call(this,a,b)}}),b(function(){var a=window._wpWidgetCustomizerPreviewSettings;a&&(b.extend(d.WidgetCustomizerPreview,a),d.WidgetCustomizerPreview.init())})}}(window.wp,jQuery);