Ticket #27993: 27993.diff

src/wp-admin/js/customize-controls.js

@@ -37 +37 @@
                         this.id = id;
                         this.selector = '#customize-control-' + id.replace( /\]/g, '' ).replace( /\[/g, '-' );
                         this.container = $( this.selector );
+                        this.active = new api.Value( this.params.active );
 
                         settings = $.map( this.params.settings, function( value ) {
                                 return value;
@@ -79 +80 @@
                                         element.set( setting() );
                                 });
                         });
+
+                        control.active.bind( function ( active ) {
+                                control.toggle( active );
+                        } );
+                        control.toggle( control.active() );
                 },
 
                 ready: function() {},
 
+                /**
+                 * Callback for change to the control's active state.
+                 *
+                 * Override function for custom behavior for the control being active/inactive.
+                 *
+                 * @param {Boolean} active
+                 */
+                toggle: function ( active ) {
+                        if ( active ) {
+                                this.container.slideDown();
+                        } else {
+                                this.container.slideUp();
+                        }
+                },
+
                 dropdownInit: function() {
                         var control      = this,
                                 statuses     = this.container.find('.dropdown-status'),
@@ -563 +584 @@
 
                         this.bind( 'ready', this._ready );
 
+                        this.bind( 'ready', function ( data ) {
+                                if ( ! data || ! data.activeControls ) {
+                                        return;
+                                }
+
+                                // Any controls not even registered on the previewed URL are not active either
+                                api.control.each( function ( control ) {
+                                        if ( typeof data.activeControls[ control.id ] === 'undefined' ) {
+                                                data.activeControls[ control.id ] = false;
+                                        }
+                                } );
+
+                                $.each( data.activeControls, function ( id, active ) {
+                                        var control = api.control( id );
+                                        if ( control ) {
+                                                control.active( active );
+                                        }
+                                } );
+                        } );
+
                         this.request = $.ajax( this.previewUrl(), {
                                 type: 'POST',
                                 data: this.query,

src/wp-admin/js/customize-widgets.js

@@ -751 +751 @@
                                 }
                         } );
 
-                        // Update widget control to indicate whether it is currently rendered
-                        api.Widgets.Previewer.bind( 'rendered-widgets', function( renderedWidgets ) {
-                                var isRendered = !! renderedWidgets[self.params.widget_id];
-
-                                self.container.toggleClass( 'widget-rendered', isRendered );
-                        } );
-
                         formSyncHandler = api.Widgets.formSyncHandlers[ this.params.widget_id_base ];
                         if ( formSyncHandler ) {
                                 $( document ).on( 'widget-synced', function( e, widget ) {
@@ -769 +762 @@
                 },
 
                 /**
+                 * Update widget control to indicate whether it is currently rendered.
+                 *
+                 * Overrides api.Control.toggle()
+                 *
+                 * @param {Boolean} active
+                 */
+                toggle: function ( active ) {
+                        this.container.toggleClass( 'widget-rendered', active );
+                },
+
+                /**
                  * Set up event handlers for widget removal
                  */
                 _setupRemoveUI: function() {
@@ -1418 +1422 @@
                         } );
 
                         // Update the model with whether or not the sidebar is rendered
-                        api.Widgets.Previewer.bind( 'rendered-sidebars', function( renderedSidebars ) {
-                                var isRendered = !! renderedSidebars[self.params.sidebar_id];
-
-                                registeredSidebar.set( 'is_rendered', isRendered );
+                        self.active.bind( function ( active ) {
+                                registeredSidebar.set( 'is_rendered', active );
                         } );
+                },
 
-                        // Show the sidebar section when it becomes visible
-                        registeredSidebar.on( 'change:is_rendered', function( ) {
-                                var sectionSelector = '#accordion-section-sidebar-widgets-' + this.get( 'id' ), $section;
-
-                                $section = $( sectionSelector );
-                                if ( this.get( 'is_rendered' ) ) {
-                                        $section.stop().slideDown( function() {
-                                                $( this ).css( 'height', 'auto' ); // so that the .accordion-section-content won't overflow
-                                        } );
-
-                                } else {
-                                        // Make sure that hidden sections get closed first
-                                        if ( $section.hasClass( 'open' ) ) {
-                                                // it would be nice if accordionSwitch() in accordion.js was public
-                                                $section.find( '.accordion-section-title' ).trigger( 'click' );
-                                        }
+                /**
+                 * Show the sidebar section when it becomes visible.
+                 *
+                 * Overrides api.Control.toggle()
+                 *
+                 * @param {Boolean} active
+                 */
+                toggle: function ( active ) {
+                        var $section, sectionSelector;
+                        sectionSelector = '#accordion-section-sidebar-widgets-' + this.params.sidebar_id;
+                        $section = $( sectionSelector );
+
+                        if ( active ) {
+                                $section.stop().slideDown( function() {
+                                        $( this ).css( 'height', 'auto' ); // so that the .accordion-section-content won't overflow
+                                } );
 
-                                        $section.stop().slideUp();
+                        } else {
+                                // Make sure that hidden sections get closed first
+                                if ( $section.hasClass( 'open' ) ) {
+                                        // it would be nice if accordionSwitch() in accordion.js was public
+                                        $section.find( '.accordion-section-title' ).trigger( 'click' );
                                 }
-                        } );
+
+                                $section.stop().slideUp();
+                        }
                 },
 
                 /**

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

@@ -85 +85 @@
          */
         public $type = 'text';
 
+        /**
+         * Callback
+         *
+         * @since 4.0.0
+         *
+         * @access public
+         * @see WP_Customize_Control::active()
+         * @var callable  Callback is called with one argument, the instance of
+         *                WP_Customize_Control, and returns bool to indicate whether
+         *                the control is active (such as it relates to the URL
+         *                currently being previewed).
+         */
+        public $active_callback = '';
 
         /**
          * Constructor.
@@ -102 +115 @@
         public function __construct( $manager, $id, $args = array() ) {
                 $keys = array_keys( get_object_vars( $this ) );
                 foreach ( $keys as $key ) {
-                        if ( isset( $args[ $key ] ) )
+                        if ( isset( $args[ $key ] ) ) {
                                 $this->$key = $args[ $key ];
+                        }
                 }
 
                 $this->manager = $manager;
                 $this->id = $id;
+                if ( empty( $this->active_callback ) ) {
+                        $this->active_callback = array( $this, 'active_callback' );
+                }
 
                 // Process settings.
-                if ( empty( $this->settings ) )
+                if ( empty( $this->settings ) ) {
                         $this->settings = $id;
+                }
 
                 $settings = array();
                 if ( is_array( $this->settings ) ) {
@@ -132 +150 @@
          */
         public function enqueue() {}
 
+        /**
+         * Check whether control is active to current customizer preview.
+         *
+         * @since 4.0.0
+         *
+         * @return bool
+         */
+        public final function active() {
+                $control = $this;
+                $active = call_user_func( $this->active_callback, $this );
+
+                /**
+                 * Filter response of WP_Customize_Control::active().
+                 *
+                 * @since 4.0.0
+                 *
+                 * @param bool $active
+                 * @param WP_Customize_Control $control
+                 */
+                $active = apply_filters( 'customize_control_active', $active, $control );
+
+                return $active;
+        }
+
+        /**
+         * Default callback used when invoking WP_Customize_Control::active().
+         *
+         * Subclasses can override this with their specific logic, or they may
+         * provide an 'active_callback' argument to the constructor.
+         *
+         * @return bool
+         */
+        public function active_callback() {
+                return true;
+        }
 
         /**
          * Fetch a setting's value.
@@ -143 +196 @@
          * @return mixed The requested setting's value, if the setting exists.
          */
         public final function value( $setting_key = 'default' ) {
-                if ( isset( $this->settings[ $setting_key ] ) )
+                if ( isset( $this->settings[ $setting_key ] ) ) {
                         return $this->settings[ $setting_key ]->value();
+                }
         }
 
         /**
@@ -159 +213 @@
                 }
 
                 $this->json['type'] = $this->type;
+                $this->json['active'] = $this->active();
         }
 
         /**
@@ -256 +311 @@
                 echo $this->get_link( $setting_key );
         }
 
-        /**
+        /**
          * Render the custom attributes for the control's input element.
          *
          * @since 4.0.0
@@ -995 +1050 @@
                 </span>
                 <?php
         }
+
+        /**
+         * @return bool
+         */
+        function active_callback() {
+                return $this->manager->widgets->is_sidebar_rendered( $this->sidebar_id );
+        }
 }
 
 /**
@@ -1035 +1097 @@
                 $args = wp_list_widget_controls_dynamic_sidebar( array( 0 => $args, 1 => $widget['params'][0] ) );
                 echo $this->manager->widgets->get_widget_control( $args );
         }
+
+        /**
+         * @return bool
+         */
+        function active_callback() {
+                return $this->manager->widgets->is_widget_rendered( $this->widget_id );
+        }
 }
 

src/wp-includes/class-wp-customize-manager.php

@@ -462 +462 @@
         public function customize_preview_settings() {
                 $settings = array(
                         'values'  => array(),
-                        'channel' => esc_js( $_POST['customize_messenger_channel'] ),
+                        'channel' => wp_unslash( $_POST['customize_messenger_channel'] ),
+                        'activeControls' => array(),
                 );
 
                 if ( 2 == $this->nonce_tick ) {
@@ -475 +476 @@
                 foreach ( $this->settings as $id => $setting ) {
                         $settings['values'][ $id ] = $setting->js_value();
                 }
+                foreach ( $this->controls as $id => $control ) {
+                        $settings['activeControls'][ $id ] = $control->active();
+                }
 
                 ?>
                 <script type="text/javascript">

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

@@ -1068 +1068 @@
          * @param array $widget Rendered widget to tally.
          */
         public function tally_rendered_widgets( $widget ) {
-                $this->rendered_widgets[$widget['id']] = true;
+                $this->rendered_widgets[ $widget['id'] ] = true;
+        }
+
+        /**
+         * Determine if a widget is rendered on the page.
+         *
+         * @since 4.0.0
+         * @access public
+         *
+         * @param string $widget_id
+         * @return bool
+         */
+        public function is_widget_rendered( $widget_id ) {
+                return in_array( $widget_id, $this->rendered_widgets );
+        }
+
+        /**
+         * Determine if a sidebar is rendered on the page.
+         *
+         * @since 4.0.0
+         * @access public
+         *
+         * @param string $sidebar_id
+         * @return bool
+         */
+        public function is_sidebar_rendered( $sidebar_id ) {
+                return in_array( $sidebar_id, $this->rendered_sidebars );
         }
 
         /**

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

@@ -23 +23 @@
                         this.buildWidgetSelectors();
                         this.highlightControls();
 
-                        this.preview.bind( 'active', function() {
-                                self.preview.send( 'rendered-sidebars', self.renderedSidebars ); // @todo Only send array of IDs
-                                self.preview.send( 'rendered-widgets', self.renderedWidgets ); // @todo Only send array of IDs
-                        } );
-
                         this.preview.bind( 'highlight-widget', self.highlightWidget );
                 },
 

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

@@ -95 +95 @@
                 preview.send( 'nonce', api.settings.nonce );
         });
 
-                preview.send( 'ready' );
+                preview.send( 'ready', {
+                        activeControls: api.settings.activeControls
+                } );
 
                 /* Custom Backgrounds */
                 bg = $.map(['color', 'image', 'position_x', 'repeat', 'attachment'], function( prop ) {