WordPress.org

Make WordPress Core

Ticket #27406: 27406.3.pages.diff

File 27406.3.pages.diff, 13.6 KB (added by celloexpressions, 3 years ago)

Minor CSS fix, remove debug, for "Pages" version.

  • src/wp-admin/css/customize-controls.css

     
    3232        display: block; 
    3333} 
    3434 
     35#customize-controls .wp-full-overlay-sidebar-content { 
     36        overflow-y: auto; 
     37        overflow-x: hidden; 
     38} 
     39 
    3540#customize-info { 
    3641        border: none; 
    3742        border-top: 1px solid #ddd; 
     
    103108        background: white; 
    104109} 
    105110 
    106 #customize-theme-controls .control-section:hover .accordion-section-title, 
     111#customize-theme-controls .control-section:hover > .accordion-section-title, 
    107112#customize-theme-controls .control-section .accordion-section-title:hover, 
    108113#customize-theme-controls .control-section.open .accordion-section-title, 
    109114#customize-theme-controls .control-section .accordion-section-title:focus { 
     
    118123        background: #f5f5f5; 
    119124} 
    120125 
    121 #customize-theme-controls .control-section:hover .accordion-section-title::after, 
     126#customize-theme-controls .control-section:hover > .accordion-section-title::after, 
    122127#customize-theme-controls .control-section .accordion-section-title:hover::after, 
    123128#customize-theme-controls .control-section.open .accordion-section-title::after, 
    124129#customize-theme-controls .control-section .accordion-section-title:focus::after { 
     
    143148        margin: 0; 
    144149} 
    145150 
     151.control-section.control-page > .accordion-section-title:after { 
     152        content: "\f139"; 
     153} 
     154 
     155.current-page > .accordion-section-title { 
     156        display: none; 
     157} 
     158 
     159.accordion-sub-container.control-page-content { 
     160        display: none; 
     161        position: relative; 
     162        left: 300px; 
     163        top: 0; 
     164        width: 300px; 
     165        border-top: 1px solid #ddd; 
     166        transition: left ease-in-out .18s; 
     167} 
     168 
     169.current-page .accordion-sub-container.control-page-content { 
     170        width: 100%; 
     171        left: 0; 
     172} 
     173 
     174.control-page-back { 
     175        display: block; 
     176        position: fixed; 
     177        top: 0; 
     178        z-index: 99; 
     179        left: -48px; 
     180        width: 45px; 
     181        height: 45px; 
     182        padding-right: 2px; 
     183        background: #eee; 
     184        border-right: 1px solid #ddd; 
     185        cursor: pointer; 
     186        transition: left ease-in-out .18s, color ease-in .1s; 
     187} 
     188 
     189.control-page-back:focus, 
     190.control-page-back:hover { 
     191        background: #0074a2; 
     192        color: #fff; 
     193        outline: none; 
     194} 
     195 
     196.control-page-back:before { 
     197        font: normal 29px/1 dashicons; 
     198        content: "\f340"; 
     199        position: relative; 
     200        top: 9px; 
     201        left: 9px; 
     202} 
     203 
     204.current-page .control-page-back { 
     205        left: 0; 
     206} 
     207 
     208.wp-full-overlay-sidebar .wp-full-overlay-header { 
     209        transition: padding ease-in-out .18s; 
     210} 
     211 
     212.in-page .wp-full-overlay-sidebar .wp-full-overlay-header { 
     213        padding-left: 62px; 
     214} 
     215 
     216#customize-info, 
     217#customize-theme-controls > ul > .accordion-section { 
     218        position: relative; 
     219        left: 0; 
     220        transition: left ease-in-out .18s; 
     221} 
     222 
     223.in-page #customize-info, 
     224.in-page #customize-theme-controls > ul > .accordion-section { 
     225        left: -300px; 
     226        width: 300px; 
     227} 
     228 
     229.in-page .accordion-section.current-page { 
     230        left: 0; 
     231} 
     232 
     233.in-page #customize-theme-controls .accordion-section.current-page { 
     234        position: absolute; 
     235        left: 0; 
     236        top: 0; 
     237        width: 100%; 
     238} 
     239 
     240#customize-theme-controls .control-section.current-page { 
     241        padding: 0; 
     242} 
     243 
     244#customize-theme-controls .control-section.current-page > h3.accordion-section-title { 
     245        position: relative; 
     246        left: -300px; 
     247        width: 300px; 
     248} 
     249 
     250.control-section.current-page .accordion-section-title .page-title { 
     251        font-size: 20px; 
     252        font-weight: 200; 
     253        line-height: 24px; 
     254        display: block; 
     255        border: none; 
     256} 
     257 
     258.control-section.control-page.current-page .preview-notice { 
     259        font-size: 13px; 
     260        line-height: 24px; 
     261} 
     262 
    146263.customize-control { 
    147264        width: 100%; 
    148265        float: left; 
  • src/wp-admin/customize.php

     
    142142 
    143143                        <div id="customize-theme-controls"><ul> 
    144144                                <?php 
    145                                 foreach ( $wp_customize->sections() as $section ) 
     145                                foreach ( $wp_customize->pages() as $page ) { 
     146                                        $page->maybe_render(); 
     147                                } 
     148                                foreach ( $wp_customize->sections() as $section ) { 
    146149                                        $section->maybe_render(); 
     150                                } 
    147151                                ?> 
    148152                        </ul></div> 
    149153                </div> 
  • src/wp-admin/js/accordion.js

     
    1111                        accordionSwitch( $( this ) ); 
    1212                }); 
    1313 
     14                // Back to top-level of pages 
     15                $( '.accordion-container' ).on( 'click keydown', '.control-page-back', function( e ) { 
     16                        if ( e.type === 'keydown' && 13 !== e.which ) // "return" key 
     17                                        return; 
     18                        e.preventDefault(); // Keep this AFTER the key filter above 
     19 
     20                        pageSwitch( $( this ) ); 
     21                }); 
     22 
    1423                // Re-initialize accordion when screen options are toggled 
    1524                $( '.hide-postbox-tog' ).click( function () { 
    1625                        accordionInit(); 
     
    3645                if ( section.hasClass( 'cannot-expand' ) ) 
    3746                        return; 
    3847 
     48                if ( section.hasClass( 'control-page' ) ) { 
     49                        pageSwitch( section ); 
     50                        return; 
     51                } 
     52 
    3953                if ( section.hasClass( 'open' ) ) { 
    4054                        section.toggleClass( 'open' ); 
    4155                        content.toggle( true ).slideToggle( 150 ); 
     
    4963                accordionInit(); 
    5064        } 
    5165 
     66        function pageSwitch( page ) { 
     67                var section = page.closest( '.accordion-section' ), 
     68                        container = section.closest( '.wp-full-overlay' ); 
     69                        siblings = container.find( '.accordion-section.open' ); 
     70                        content = section.find( '.control-page-content' ); 
     71 
     72                if ( section.hasClass( 'current-page' ) ) { 
     73                        section.toggleClass( 'current-page' ); 
     74                        container.toggleClass( 'in-page' ); 
     75                        content.hide(); 
     76                } else { 
     77                        siblings.removeClass( 'open' ); 
     78                        content.show( 0, function() { 
     79                                section.toggleClass( 'current-page' ); 
     80                                container.toggleClass( 'in-page' ); 
     81                        } ); 
     82                } 
     83        } 
     84 
    5285        // Initialize the accordion (currently just corner fixes) 
    5386        accordionInit(); 
    5487 
  • src/wp-includes/class-wp-customize-manager.php

     
    4545        public $widgets; 
    4646 
    4747        protected $settings = array(); 
     48        protected $pages    = array(); 
    4849        protected $sections = array(); 
    4950        protected $controls = array(); 
    5051 
     
    315316        } 
    316317 
    317318        /** 
     319         * Get the registered pages. 
     320         * 
     321         * @since 4.0.0 
     322         * 
     323         * @return array 
     324         */ 
     325        public function pages() { 
     326                return $this->pages; 
     327        } 
     328 
     329        /** 
    318330         * Checks if the current theme is active. 
    319331         * 
    320332         * @since 3.4.0 
     
    648660        } 
    649661 
    650662        /** 
     663         * Add a customize page. 
     664         * 
     665         * @since 4.0.0 
     666         * 
     667         * @param WP_Customize_Page|string $id   Customize Page object, or Page ID. 
     668         * @param array                    $args Page arguments. 
     669         */ 
     670        public function add_page( $id, $args = array() ) { 
     671                if ( is_a( $id, 'WP_Customize_Page' ) ) { 
     672                        $page = $id; 
     673                } 
     674                else { 
     675                        $page = new WP_Customize_Page( $this, $id, $args ); 
     676                } 
     677 
     678                $this->pages[ $page->id ] = $page; 
     679        } 
     680 
     681        /** 
     682         * Retrieve a customize page. 
     683         * 
     684         * @since 4.0.0 
     685         * 
     686         * @param string $id Page ID. 
     687         * @return WP_Customize_Page 
     688         */ 
     689        public function get_page( $id ) { 
     690                if ( isset( $this->pages[ $id ] ) ) { 
     691                        return $this->pages[ $id ]; 
     692                } 
     693        } 
     694 
     695        /** 
     696         * Remove a customize page. 
     697         * 
     698         * @since 4.0.0 
     699         * 
     700         * @param string $id Page ID. 
     701         */ 
     702        public function remove_page( $id ) { 
     703                unset( $this->pages[ $id ] ); 
     704        } 
     705 
     706        /** 
    651707         * Add a customize section. 
    652708         * 
    653709         * @since 3.4.0 
     
    749805        } 
    750806 
    751807        /** 
    752          * Prepare settings and sections. 
     808         * Prepare pages, sections, and controls. 
    753809         * 
    754810         * For each, check if required related components exist, 
    755811         * whether the user has the necessary capabilities, 
     
    763819                $controls = array(); 
    764820 
    765821                foreach ( $this->controls as $id => $control ) { 
    766                         if ( ! isset( $this->sections[ $control->section ] ) || ! $control->check_capabilities() ) 
     822                        if ( ! isset( $this->sections[ $control->section ] ) || ! $control->check_capabilities() ) { 
    767823                                continue; 
     824                        } 
    768825 
    769826                        $this->sections[ $control->section ]->controls[] = $control; 
    770827                        $controls[ $id ] = $control; 
     
    778835                $sections = array(); 
    779836 
    780837                foreach ( $this->sections as $section ) { 
    781                         if ( ! $section->check_capabilities() || ! $section->controls ) 
     838                        if ( ! $section->check_capabilities() || ! $section->controls ) { 
    782839                                continue; 
     840                        } 
    783841 
    784842                        usort( $section->controls, array( $this, '_cmp_priority' ) ); 
    785                         $sections[] = $section; 
     843 
     844                        if ( ! $section->page ) { 
     845                                // Top-level section. 
     846                                $sections[] = $section; 
     847                        } else { 
     848                                // This section belongs to a page. 
     849                                $this->pages[ $section->page ]->sections[] = $section; 
     850                        } 
    786851                } 
    787852                $this->sections = $sections; 
     853 
     854                // Prepare pages. 
     855                // Reversing makes uasort sort by time added when conflicts occur. 
     856                $this->pages = array_reverse( $this->pages ); 
     857                uasort( $this->pages, array( $this, '_cmp_priority' ) ); 
     858                $pages = array(); 
     859 
     860                foreach ( $this->pages as $page ) { 
     861                        if ( ! $page->check_capabilities() || ! $page->sections ) { 
     862                                continue; 
     863                        } 
     864 
     865                        usort( $page->sections, array( $this, '_cmp_priority' ) ); 
     866                        $pages[] = $page; 
     867                } 
     868                $this->pages = $pages; 
    788869        } 
    789870 
    790871        /** 
  • src/wp-includes/class-wp-customize-section.php

     
    3838        public $priority = 10; 
    3939 
    4040        /** 
     41         * Page in which to show the section, making it a sub-section. 
     42         * 
     43         * @since 4.0.0 
     44         * @access public 
     45         * @var string 
     46         */ 
     47        public $page = ''; 
     48 
     49        /** 
    4150         * Capability required for the section. 
    4251         * 
    4352         * @since 3.4.0 
     
    162171         * @since 3.4.0 
    163172         */ 
    164173        protected function render() { 
     174                $classes = 'control-section accordion-section'; 
     175                if ( $this->page ) { 
     176                        $classes .= ' control-subsection in-page-' . $this->page; 
     177                } 
    165178                ?> 
    166                 <li id="accordion-section-<?php echo esc_attr( $this->id ); ?>" class="control-section accordion-section"> 
     179                <li id="accordion-section-<?php echo esc_attr( $this->id ); ?>" class="<?php echo esc_attr( $classes ); ?>"> 
    167180                        <h3 class="accordion-section-title" tabindex="0"><?php echo esc_html( $this->title ); ?></h3> 
    168181                        <ul class="accordion-section-content"> 
    169182                                <?php if ( ! empty( $this->description ) ) : ?> 
     
    178191                <?php 
    179192        } 
    180193} 
     194 
     195/** 
     196 * Customize Page Class. 
     197 * 
     198 * A UI container for sections, managed by the WP_Customize_Manager. 
     199 * 
     200 * @package WordPress 
     201 * @subpackage Customize 
     202 * @since 4.0.0 
     203 */ 
     204class WP_Customize_Page extends WP_Customize_Section { 
     205 
     206        /** 
     207         * Customizer sections for this page. 
     208         * 
     209         * @since 4.0.0 
     210         * @access public 
     211         * @var array 
     212         */ 
     213        public $sections; 
     214 
     215        /** 
     216         * Constructor. 
     217         * 
     218         * Any supplied $args override class property defaults. 
     219         * 
     220         * @since 4.0.0 
     221         * 
     222         * @param WP_Customize_Manager $manager Customizer bootstrap instance. 
     223         * @param string               $id      An specific ID of the section. 
     224         * @param array                $args    Section arguments. 
     225         */ 
     226        public function __construct( $manager, $id, $args = array() ) { 
     227                parent::__construct( $manager, $id, $args ); 
     228 
     229                $this->sections = array(); // Users cannot customize the $sections array. 
     230 
     231                return $this; 
     232        } 
     233 
     234        /** 
     235         * Render the page, and the sections that have been added to it. 
     236         * 
     237         * @since 4.0.0 
     238         */ 
     239        protected function render() { 
     240                ?> 
     241                <li id="accordion-section-<?php echo esc_attr( $this->id ); ?>" class="control-section control-page accordion-section"> 
     242                        <h3 class="accordion-section-title" tabindex="0"><?php echo esc_html( $this->title ); ?></h3> 
     243                        <span class="control-page-back" tabindex="0"><span class="screen-reader-text">Back to Customize</span></span> 
     244                        <ul class="accordion-sub-container control-page-content"> 
     245                                <li class="accordion-section control-section<?php if ( empty( $this->description ) ) echo ' cannot-expand'; ?>"> 
     246                                        <div class="accordion-section-title" tabindex="0"> 
     247                                                <span class="preview-notice"><?php _e( 'You are editing your site&#8217;s' ); ?> 
     248                                                        <strong class="page-title"><?php echo esc_html( $this->title ); ?></strong> 
     249                                                </span> 
     250                                        </div> 
     251                                        <?php if ( ! empty( $this->description ) ) : ?> 
     252                                                <div class="accordion-section-content description"> 
     253                                                        <?php echo $this->description; ?> 
     254                                                </div> 
     255                                        <?php endif; ?> 
     256                                </li> 
     257                                <?php 
     258                                foreach ( $this->sections as $section ) { 
     259                                        $section->maybe_render(); 
     260                                } 
     261                                ?> 
     262                        </ul> 
     263                </li> 
     264                <?php 
     265        } 
     266} 
  • src/wp-includes/class-wp-customize-widgets.php

     
    433433                        $this->manager->add_setting( $setting_id, $setting_args ); 
    434434                } 
    435435 
     436                $this->manager->add_page( 'widgets', array( 
     437                        'title' => __( 'Widgets' ), 
     438                ) ); 
     439 
    436440                foreach ( $sidebars_widgets as $sidebar_id => $sidebar_widget_ids ) { 
    437441                        if ( empty( $sidebar_widget_ids ) ) { 
    438442                                $sidebar_widget_ids = array(); 
     
    458462                                if ( $is_active_sidebar ) { 
    459463 
    460464                                        $section_args = array( 
    461                                                 /* translators: %s: sidebar name */ 
    462                                                 'title' => sprintf( __( 'Widgets: %s' ), $GLOBALS['wp_registered_sidebars'][$sidebar_id]['name'] ), 
    463                                                 'description' => $GLOBALS['wp_registered_sidebars'][$sidebar_id]['description'], 
     465                                                'title' => $GLOBALS['wp_registered_sidebars'][ $sidebar_id ]['name'], 
     466                                                'description' => $GLOBALS['wp_registered_sidebars'][ $sidebar_id ]['description'], 
    464467                                                'priority' => 1000 + array_search( $sidebar_id, array_keys( $wp_registered_sidebars ) ), 
     468                                                'page' => 'widgets', 
    465469                                        ); 
    466470 
    467471                                        /**