Changeset 33189

Timestamp:

07/13/2015 08:39:17 AM (9 years ago)

Author:

westonruter

Message:

Customizer: Disambiguate a menu's auto-add pages option from preceding menu location checkboxes.

Creates a separate nav_menu_auto_add control type following the pattern of the nav_menu_name control type.

Props valendesigns.
Fixes #32820.

Location:

trunk/src

Files:

• wp-admin/js/customize-nav-menus.js (modified) (7 diffs)
• wp-includes/class-wp-customize-control.php (modified) (2 diffs)
• wp-includes/class-wp-customize-nav-menus.php (modified) (1 diff)

trunk/src/wp-admin/js/customize-nav-menus.js

@@ -677 +677 @@
 
         populateControls: function() {
-            var section = this, menuNameControlId, menuControl, menuNameControl;
+            var section = this, menuNameControlId, menuAutoAddControlId, menuControl, menuNameControl, menuAutoAddControl;
 
             // Add the control for managing the menu name.
@@ -686 +686 @@
                     params: {
                         type: 'nav_menu_name',
-                        content: '<li id="customize-control-' + section.id.replace( '[', '-' ).replace( ']', '' ) + '-name" class="customize-control customize-control-nav_menu_name"></li>', // @todo core should do this for us
+                        content: '<li id="customize-control-' + section.id.replace( '[', '-' ).replace( ']', '' ) + '-name" class="customize-control customize-control-nav_menu_name"></li>', // @todo core should do this for us; see #30741
                         label: '',
                         active: true,
@@ -706 +706 @@
                     params: {
                         type: 'nav_menu',
-                        content: '<li id="customize-control-' + section.id.replace( '[', '-' ).replace( ']', '' ) + '" class="customize-control customize-control-nav_menu"></li>', // @todo core should do this for us
+                        content: '<li id="customize-control-' + section.id.replace( '[', '-' ).replace( ']', '' ) + '" class="customize-control customize-control-nav_menu"></li>', // @todo core should do this for us; see #30741
                         section: section.id,
-                        priority: 999,
+                        priority: 998,
                         active: true,
                         settings: {
@@ -718 +718 @@
                 api.control.add( menuControl.id, menuControl );
                 menuControl.active.set( true );
+            }
+
+            // Add the control for managing the menu auto_add.
+            menuAutoAddControlId = section.id + '[auto_add]';
+            menuAutoAddControl = api.control( menuAutoAddControlId );
+            if ( ! menuAutoAddControl ) {
+                menuAutoAddControl = new api.controlConstructor.nav_menu_auto_add( menuAutoAddControlId, {
+                    params: {
+                        type: 'nav_menu_auto_add',
+                        content: '<li id="customize-control-' + section.id.replace( '[', '-' ).replace( ']', '' ) + '-auto-add" class="customize-control customize-control-nav_menu_auto_add"></li>', // @todo core should do this for us
+                        label: '',
+                        active: true,
+                        section: section.id,
+                        priority: 999,
+                        settings: {
+                            'default': section.id
+                        }
+                    }
+                } );
+                api.control.add( menuAutoAddControl.id, menuAutoAddControl );
+                menuAutoAddControl.active.set( true );
             }
 
@@ -1593 +1614 @@
 
     /**
+     * wp.customize.Menus.MenuAutoAddControl
+     *
+     * Customizer control for a nav menu's auto add.
+     *
+     * @constructor
+     * @augments wp.customize.Control
+     */
+    api.Menus.MenuAutoAddControl = api.Control.extend({
+
+        ready: function() {
+            var control = this,
+                settingValue = control.setting();
+
+            /*
+             * Since the control is not registered in PHP, we need to prevent the
+             * preview's sending of the activeControls to result in this control
+             * being deactivated.
+             */
+            control.active.validate = function() {
+                return api.section( control.section() ).active();
+            };
+
+            control.autoAddElement = new api.Element( control.container.find( 'input[type=checkbox].auto_add' ) );
+
+            control.autoAddElement.bind(function( value ) {
+                var settingValue = control.setting();
+                if ( settingValue && settingValue.name !== value ) {
+                    settingValue = _.clone( settingValue );
+                    settingValue.auto_add = value;
+                    control.setting.set( settingValue );
+                }
+            });
+            if ( settingValue ) {
+                control.autoAddElement.set( settingValue.auto_add );
+            }
+
+            control.setting.bind(function( object ) {
+                if ( object ) {
+                    control.autoAddElement.set( object.auto_add );
+                }
+            });
+        }
+
+    });
+
+    /**
      * wp.customize.Menus.MenuControl
      *
@@ -1662 +1729 @@
             var control = this,
                 menuId = control.params.menu_id;
-
-            control.elements = {};
-            control.elements.auto_add = new api.Element( control.container.find( 'input[type=checkbox].auto_add' ) );
-
-            control.elements.auto_add.bind(function( auto_add ) {
-                var settingValue = control.setting();
-                if ( settingValue && settingValue.auto_add !== auto_add ) {
-                    settingValue = _.clone( settingValue );
-                    settingValue.auto_add = auto_add;
-                    control.setting.set( settingValue );
-                }
-            });
-            control.elements.auto_add.set( control.setting().auto_add );
-            control.setting.bind(function( object ) {
-                if ( ! object ) {
-                    return;
-                }
-                control.elements.auto_add.set( object.auto_add );
-            });
 
             control.setting.bind( function( to ) {
@@ -2245 +2293 @@
         nav_menu: api.Menus.MenuControl,
         nav_menu_name: api.Menus.MenuNameControl,
+        nav_menu_auto_add: api.Menus.MenuAutoAddControl,
         new_menu: api.Menus.NewMenuControl
     });

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

@@ -1604 +1604 @@
 
         </ul>
-        <?php endif; ?>
-        <p>
-            <label>
-                <input type="checkbox" class="auto_add">
-                <?php _e( 'Automatically add new top-level pages to this menu' ) ?>
-            </label>
-        </p>
-        <?php
+        <?php endif;
     }
 
@@ -1887 +1880 @@
 
 /**
+ * Customize control to represent the auto_add field for a given menu.
+ *
+ * @since 4.3.0
+ */
+class WP_Customize_Nav_Menu_Auto_Add_Control extends WP_Customize_Control {
+
+    /**
+     * Type of control, used by JS.
+     *
+     * @since 4.3.0
+     *
+     * @var string
+     */
+    public $type = 'nav_menu_auto_add';
+
+    /**
+     * No-op since we're using JS template.
+     *
+     * @since 4.3.0
+     */
+    protected function render_content() {}
+
+    /**
+     * Render the Underscore template for this control.
+     *
+     * @since 4.3.0
+     */
+    protected function content_template() {
+        ?>
+        <label>
+            <span class="customize-control-title"><?php _e( 'Menu Options' ); ?></span>
+            <input type="checkbox" class="auto_add" />
+            <?php _e( 'Automatically add new top-level pages to this menu' ); ?>
+        </label>
+        <?php
+    }
+}
+
+/**
  * Customize control class for new menus.
  *

trunk/src/wp-includes/class-wp-customize-nav-menus.php

@@ -406 +406 @@
         $this->manager->register_control_type( 'WP_Customize_Nav_Menu_Control' );
         $this->manager->register_control_type( 'WP_Customize_Nav_Menu_Name_Control' );
+        $this->manager->register_control_type( 'WP_Customize_Nav_Menu_Auto_Add_Control' );
         $this->manager->register_control_type( 'WP_Customize_Nav_Menu_Item_Control' );