Make WordPress Core

Ticket #37471: 37471.2.diff

File 37471.2.diff, 6.5 KB (added by delawski, 7 years ago)
  • src/wp-admin/css/customize-controls.css

    diff --git a/src/wp-admin/css/customize-controls.css b/src/wp-admin/css/customize-controls.css
    index 039477a..fbcfe64 100644
    a b body { 
    303303        transition: 0.18s transform cubic-bezier(0.645, 0.045, 0.355, 1), 0.18s -webkit-transform cubic-bezier(0.645, 0.045, 0.355, 1); /* easeInOutCubic */
    304304}
    305305
     306#customize-theme-controls .customize-pane-child.skip-transition {
     307        -webkit-transition: none;
     308        transition: none;
     309}
     310
    306311#customize-info,
    307312#customize-theme-controls .customize-pane-parent {
    308313        position: relative;
  • src/wp-admin/js/customize-controls.js

    diff --git a/src/wp-admin/js/customize-controls.js b/src/wp-admin/js/customize-controls.js
    index e8f19dd..c5d5be4 100644
    a b  
    711711                        var construct = this,
    712712                                content = construct.contentContainer,
    713713                                overlay = content.closest( '.wp-full-overlay' ),
    714                                 elements, transitionEndCallback;
     714                                elements, transitionEndCallback, transitionParentPane;
    715715
    716716                        // Determine set of elements that are affected by the animation.
    717717                        elements = overlay.add( content );
    718                         if ( _.isUndefined( construct.panel ) || '' === construct.panel() ) {
     718
     719                        if ( ! construct.panel || '' === construct.panel() ) {
     720                                transitionParentPane = true;
     721                        } else if ( api.panel( construct.panel() ).contentContainer.hasClass( 'skip-transition' ) ) {
     722                                transitionParentPane = true;
     723                        } else {
     724                                transitionParentPane = false;
     725                        }
     726                        if ( transitionParentPane ) {
    719727                                elements = elements.add( '#customize-info, .customize-pane-parent' );
    720728                        }
    721729
     
    9961004                                overlay = section.headContainer.closest( '.wp-full-overlay' ),
    9971005                                backBtn = content.find( '.customize-section-back' ),
    9981006                                sectionTitle = section.headContainer.find( '.accordion-section-title' ).first(),
    999                                 expand;
     1007                                expand, panel;
    10001008
    10011009                        if ( expanded && ! content.hasClass( 'open' ) ) {
    10021010
     
    10441052                                }
    10451053
    10461054                        } else if ( ! expanded && content.hasClass( 'open' ) ) {
     1055                                if ( section.panel() ) {
     1056                                        panel = api.panel( section.panel() );
     1057                                        if ( panel.contentContainer.hasClass( 'skip-transition' ) ) {
     1058                                                panel.collapse();
     1059                                        }
     1060                                }
    10471061                                section._animateChangeExpanded( function() {
    10481062                                        backBtn.attr( 'tabindex', '-1' );
    10491063                                        sectionTitle.attr( 'tabindex', '0' );
     
    17221736                                overlay = accordionSection.closest( '.wp-full-overlay' ),
    17231737                                container = accordionSection.closest( '.wp-full-overlay-sidebar-content' ),
    17241738                                topPanel = panel.headContainer.find( '.accordion-section-title' ),
    1725                                 backBtn = accordionSection.find( '.customize-panel-back' );
     1739                                backBtn = accordionSection.find( '.customize-panel-back' ),
     1740                                childSections = panel.sections(),
     1741                                skipTransition;
    17261742
    17271743                        if ( expanded && ! accordionSection.hasClass( 'current-panel' ) ) {
    17281744                                // Collapse any sibling sections/panels
     
    17371753                                        }
    17381754                                });
    17391755
    1740                                 panel._animateChangeExpanded( function() {
    1741                                         topPanel.attr( 'tabindex', '-1' );
    1742                                         backBtn.attr( 'tabindex', '0' );
     1756                                if ( panel.params.autoExpandSoleSection && 1 === childSections.length && childSections[0].active.get() ) {
     1757                                        accordionSection.addClass( 'current-panel skip-transition' );
     1758                                        overlay.addClass( 'in-sub-panel' );
    17431759
    1744                                         backBtn.focus();
    1745                                         accordionSection.css( 'top', '' );
    1746                                         container.scrollTop( 0 );
     1760                                        childSections[0].expand( {
     1761                                                completeCallback: args.completeCallback
     1762                                        } );
     1763                                } else {
     1764                                        panel._animateChangeExpanded( function() {
     1765                                                topPanel.attr( 'tabindex', '-1' );
     1766                                                backBtn.attr( 'tabindex', '0' );
    17471767
    1748                                         if ( args.completeCallback ) {
    1749                                                 args.completeCallback();
    1750                                         }
    1751                                 } );
     1768                                                backBtn.focus();
     1769                                                accordionSection.css( 'top', '' );
     1770                                                container.scrollTop( 0 );
     1771
     1772                                                if ( args.completeCallback ) {
     1773                                                        args.completeCallback();
     1774                                                }
     1775                                        } );
     1776
     1777                                        accordionSection.addClass( 'current-panel' );
     1778                                        overlay.addClass( 'in-sub-panel' );
     1779                                }
    17521780
    1753                                 overlay.addClass( 'in-sub-panel' );
    1754                                 accordionSection.addClass( 'current-panel' );
    17551781                                api.state( 'expandedPanel' ).set( panel );
    17561782
    17571783                        } else if ( ! expanded && accordionSection.hasClass( 'current-panel' ) ) {
    1758                                 panel._animateChangeExpanded( function() {
    1759                                         topPanel.attr( 'tabindex', '0' );
    1760                                         backBtn.attr( 'tabindex', '-1' );
     1784                                skipTransition = accordionSection.hasClass( 'skip-transition' );
     1785                                if ( ! skipTransition ) {
     1786                                        panel._animateChangeExpanded( function() {
     1787                                                topPanel.attr( 'tabindex', '0' );
     1788                                                backBtn.attr( 'tabindex', '-1' );
    17611789
    1762                                         topPanel.focus();
    1763                                         accordionSection.css( 'top', '' );
     1790                                                topPanel.focus();
     1791                                                accordionSection.css( 'top', '' );
    17641792
    1765                                         if ( args.completeCallback ) {
    1766                                                 args.completeCallback();
    1767                                         }
    1768                                 } );
     1793                                                if ( args.completeCallback ) {
     1794                                                        args.completeCallback();
     1795                                                }
     1796                                        } );
     1797                                } else {
     1798                                        accordionSection.removeClass( 'skip-transition' );
     1799                                }
    17691800
    17701801                                overlay.removeClass( 'in-sub-panel' );
    17711802                                accordionSection.removeClass( 'current-panel' );
  • src/wp-includes/class-wp-customize-panel.php

    diff --git a/src/wp-includes/class-wp-customize-panel.php b/src/wp-includes/class-wp-customize-panel.php
    index 46e604a..87ae392 100644
    a b class WP_Customize_Panel { 
    104104        public $description = '';
    105105
    106106        /**
     107         * Auto-expand a section in a panel when the panel is expanded when the panel only has the one section.
     108         *
     109         * @since 4.7.4
     110         * @access public
     111         * @var bool
     112         */
     113        public $auto_expand_sole_section = false;
     114
     115        /**
    107116         * Customizer sections for this panel.
    108117         *
    109118         * @since 4.0.0
    public function json() { 
    219228                $array['content'] = $this->get_content();
    220229                $array['active'] = $this->active();
    221230                $array['instanceNumber'] = $this->instance_number;
     231                $array['autoExpandSoleSection'] = $this->auto_expand_sole_section;
    222232                return $array;
    223233        }
    224234
  • src/wp-includes/class-wp-customize-widgets.php

    diff --git a/src/wp-includes/class-wp-customize-widgets.php b/src/wp-includes/class-wp-customize-widgets.php
    index 2522ac8..40590f0 100644
    a b public function customize_register() { 
    422422                        'description'     => __( 'Widgets are independent sections of content that can be placed into widgetized areas provided by your theme (commonly called sidebars).' ),
    423423                        'priority'        => 110,
    424424                        'active_callback' => array( $this, 'is_panel_active' ),
     425                        'auto_expand_sole_section' => true,
    425426                ) );
    426427
    427428                foreach ( $sidebars_widgets as $sidebar_id => $sidebar_widget_ids ) {