Ticket #36678: 36678.diff

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

@@ -3899 +3899 @@
                         var state = new api.Values(),
                                 saved = state.create( 'saved' ),
                                 activated = state.create( 'activated' ),
-                                processing = state.create( 'processing' );
+                                processing = state.create( 'processing' ),
+                                collapsed = state.create( 'collapsed' );
 
                         state.bind( 'change', function() {
                                 if ( ! activated() ) {
@@ -3920 +3921 @@
                         saved( true );
                         activated( api.settings.theme.active );
                         processing( 0 );
+                        collapsed( false );
 
                         api.bind( 'change', function() {
                                 state('saved').set( false );
@@ -3961 +3963 @@
                 });
 
                 $( '.collapse-sidebar' ).on( 'click', function() {
-                        if ( 'true' === $( this ).attr( 'aria-expanded' ) ) {
+
+                        if ( api.state( 'collapsed' )() === true ) {
+                                api.trigger( 'collapsed', false );
+                        } else {
+                                api.trigger( 'collapsed', true );
+                        }
+
+                });
+
+                api.bind( 'collapsed', function( collapsed ) {
+
+                        if ( collapsed === true ) {
                                 $( this ).attr({ 'aria-expanded': 'false', 'aria-label': api.l10n.expandSidebar });
+                                overlay.addClass( 'collapsed' ).removeClass( 'expanded' );
+                                api.state( 'collapsed' ).set(true);
                         } else {
                                 $( this ).attr({ 'aria-expanded': 'true', 'aria-label': api.l10n.collapseSidebar });
+                                overlay.removeClass( 'collapsed' ).addClass( 'expanded' );
+                                api.state( 'collapsed' ).set(false);
                         }
 
-                        overlay.toggleClass( 'collapsed' ).toggleClass( 'expanded' );
                 });
 
                 // Keyboard shortcuts - esc to exit section/panel.
@@ -4202 +4218 @@
                         if ( matchedControl ) {
                                 matchedControl.focus();
                         }
+                        api.trigger( 'collapsed', false );
                 } );
 
                 // Refresh the preview when it requests.