Changeset 30307

Timestamp:

11/11/2014 10:36:51 PM (10 years ago)

Author:

ocean90

Message:

Customizer: Use jQuery.fn.toggle() instead of slideUp/slideDown if panel/section/control is not inserted into DOM yet.

jQuery does nothing when calling slideUp on elements that are not inserted into the DOM yet, which can now be the case now when first loading the Customizer as the panels, sections and controls get dynamically inserted, see #28709.

props westonruter.
fixes #30251.

Location:

trunk/src/wp-admin/js

Files:

• customize-controls.js (modified) (4 diffs)
• customize-widgets.js (modified) (1 diff)

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

@@ -132 +132 @@
      */
     Container = api.Class.extend({
-        defaultActiveArguments: { duration: 'fast' },
-        defaultExpandedArguments: { duration: 'fast' },
+        defaultActiveArguments: { duration: 'fast', completeCallback: $.noop },
+        defaultExpandedArguments: { duration: 'fast', completeCallback: $.noop },
 
         initialize: function ( id, options ) {
@@ -218 +218 @@
         onChangeActive: function ( active, args ) {
             var duration = ( 'resolved' === api.previewer.deferred.active.state() ? args.duration : 0 );
-            if ( active ) {
+            if ( ! $.contains( document, this.container ) ) {
+                // jQuery.fn.slideUp is not hiding an element if it is not in the DOM
+                this.container.toggle( active );
+                args.completeCallback();
+            } else if ( active ) {
                 this.container.stop( true, true ).slideDown( duration, args.completeCallback );
             } else {
@@ -641 +645 @@
      */
     api.Control = api.Class.extend({
-        defaultActiveArguments: { duration: 'fast' },
+        defaultActiveArguments: { duration: 'fast', completeCallback: $.noop },
 
         initialize: function( id, options ) {
@@ -782 +786 @@
          */
         onChangeActive: function ( active, args ) {
-            if ( active ) {
+            if ( ! $.contains( document, this.container ) ) {
+                // jQuery.fn.slideUp is not hiding an element if it is not in the DOM
+                this.container.toggle( active );
+                args.completeCallback();
+            } else if ( active ) {
                 this.container.slideDown( args.duration, args.completeCallback );
             } else {

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

@@ -406 +406 @@
     api.Widgets.WidgetControl = api.Control.extend({
         defaultExpandedArguments: {
-            duration: 'fast'
+            duration: 'fast',
+            completeCallback: $.noop
         },