Widget Customizer: Improve plugin compatibility.

ocean90 · ocean90 · commit b5780fa7b837 · 2014-04-02T17:03:14.000Z
Some plugins are using custom scripts and styles for there widgets. These are available on the Widgets screens, but not in the Customizer yet. Scripts and styles can be enqueued via: * `admin_enqueue_scripts` * `admin_print_scripts` and `admin_print_scripts-widgets.php` * `admin_print_styles` and `admin_print_styles-widgets.php` * `admin_print_footer_scripts` and `admin_footer-widgets.php` All this hooks are now called in the Customizer too. Previously we have add the `#widgets-right` ID to a container div via jQuery. Remember: `#widgets-right` exists on the Widgets screen and is used by many plugins to do event delegation from that element. But since our script files are loaded in the footer, the JavaScript way is a bit late for some plugins. We have decided to add a `div#widgets-right` container element to customizer. "Less hacky hack." props westonruter, ocean90. Thanks dpe415 for testing. fixes #27619. git-svn-id: https://develop.svn.wordpress.org/trunk@27907 602fd350-edb4-49c9-b593-d223f7449a82
diff --git a/src/wp-admin/customize.php b/src/wp-admin/customize.php
@@ -118,6 +118,7 @@
 			$cannot_expand = ! ( $screenshot || $wp_customize->theme()->get('Description') );
 		?>
 
+		<div id="widgets-right"><!-- For Widget Customizer, many widgets try to look for instances under div#widgets-right, so we have to add that ID to a container div in the customizer for compat -->
 		<div class="wp-full-overlay-sidebar-content accordion-container" tabindex="-1">
 			<div id="customize-info" class="accordion-section <?php if ( $cannot_expand ) echo ' cannot-expand'; ?>">
 				<div class="accordion-section-title" aria-label="<?php esc_attr_e( 'Theme Customizer Options' ); ?>" tabindex="0">
@@ -146,6 +147,7 @@
 				?>
 			</ul></div>
 		</div>
+		</div>
 
 		<div id="customize-footer-actions" class="wp-full-overlay-footer">
 			<a href="#" class="collapse-sidebar button-secondary" title="<?php esc_attr_e('Collapse Sidebar'); ?>">
diff --git a/src/wp-admin/js/customize-widgets.js b/src/wp-admin/js/customize-widgets.js
@@ -35,10 +35,6 @@ var WidgetCustomizer = ( function ($) {
 		window.ajaxurl = wp.ajax.settings.url;
 	}
 
-	// Unfortunately many widgets try to look for instances under div#widgets-right,
-	// so we have to add that ID to a container div in the customizer for compat
-	$( '#customize-theme-controls' ).closest( 'div:not([id])' ).attr( 'id', 'widgets-right' );
-
 	/**
 	 * Set up model
 	 */
diff --git a/src/wp-includes/class-wp-customize-widgets.php b/src/wp-includes/class-wp-customize-widgets.php
@@ -74,7 +74,10 @@ public function __construct( WP_Customize_Manager $manager ) {
 		add_action( 'after_setup_theme',                       array( $this, 'setup_widget_addition_previews' ) );
 		add_action( 'customize_controls_init',                 array( $this, 'customize_controls_init' ) );
 		add_action( 'customize_register',                      array( $this, 'schedule_customize_register' ), 1 );
-		add_action( 'customize_controls_enqueue_scripts',      array( $this, 'customize_controls_enqueue_deps' ) );
+		add_action( 'customize_controls_enqueue_scripts',      array( $this, 'enqueue_scripts' ) );
+		add_action( 'customize_controls_print_styles',         array( $this, 'print_styles' ) );
+		add_action( 'customize_controls_print_scripts',        array( $this, 'print_scripts' ) );
+		add_action( 'customize_controls_print_footer_scripts', array( $this, 'print_footer_scripts' ) );
 		add_action( 'customize_controls_print_footer_scripts', array( $this, 'output_widget_control_templates' ) );
 		add_action( 'customize_preview_init',                  array( $this, 'customize_preview_init' ) );
 
@@ -532,16 +535,49 @@ public function parse_widget_setting_id( $setting_id ) {
 		return compact( 'id_base', 'number' );
 	}
 
+	/**
+	 * Call admin_print_styles-widgets.php and admin_print_styles hooks to
+	 * allow custom styles from plugins.
+	 *
+	 * @since 3.9.0
+	 * @access public
+	 */
+	public function print_styles() {
+		/** This action is documented in wp-admin/admin-header.php */
+		do_action( 'admin_print_styles-widgets.php' );
+
+		/** This action is documented in wp-admin/admin-header.php */
+		do_action( 'admin_print_styles' );
+	}
+
+	/**
+	 * Call admin_print_scripts-widgets.php and admin_print_scripts hooks to
+	 * allow custom scripts from plugins.
+	 *
+	 * @since 3.9.0
+	 * @access public
+	 */
+	public function print_scripts() {
+		/** This action is documented in wp-admin/admin-header.php */
+		do_action( 'admin_print_scripts-widgets.php' );
+
+		/** This action is documented in wp-admin/admin-header.php */
+		do_action( 'admin_print_scripts' );
+	}
+
 	/**
 	 * Enqueue scripts and styles for customizer panel and export data to JavaScript.
 	 *
 	 * @since 3.9.0
 	 * @access public
 	 */
-	public function customize_controls_enqueue_deps() {
+	public function enqueue_scripts() {
 		wp_enqueue_style( 'customize-widgets' );
 		wp_enqueue_script( 'customize-widgets' );
 
+		/** This action is documented in wp-admin/admin-header.php */
+		do_action( 'admin_enqueue_scripts', 'widgets.php' );
+
 		/*
 		 * Export available widgets with control_tpl removed from model
 		 * since plugins need templates to be in the DOM.
@@ -641,6 +677,21 @@ public function output_widget_control_templates() {
 		<?php
 	}
 
+	/**
+	 * Call admin_print_footer_scripts and admin_print_scripts hooks to
+	 * allow custom scripts from plugins.
+	 *
+	 * @since 3.9.0
+	 * @access public
+	 */
+	public function print_footer_scripts() {
+		/** This action is documented in wp-admin/admin-footer.php */
+		do_action( 'admin_print_footer_scripts' );
+
+		/** This action is documented in wp-admin/admin-footer.php */
+		do_action( 'admin_footer-widgets.php' );
+	}
+
 	/**
 	 * Get common arguments to supply when constructing a Customizer setting.
 	 *
