WordPress.org
Get WordPress

Make WordPress Core

Ticket #32715: 32715.9.diff

File 32715.9.diff, 10.1 KB (added by afercia, 11 years ago)

merges the two last patches

  • src/wp-admin/css/customize-nav-menus.css

     
    619619        background: #eee;
    620620}
    621621
    622 #available-menu-items .open .accordion-section-title:after {
     622/* rework the arrow indicator implementation for NVDA bug see #32715 */
     623#available-menu-items .accordion-section-title:after {
     624        content: none !important;
     625}
     626
     627#available-menu-items .accordion-section-title .toggle-indicator {
     628        display: inline-block;
     629        font-size: 20px;
     630        line-height: 1;
     631}
     632
     633#available-menu-items .accordion-section-title .toggle-indicator:after {
     634        content: '\f140';
     635        font: normal 20px/1 'dashicons';
     636        vertical-align: top;
     637        speak: none;
     638        -webkit-font-smoothing: antialiased;
     639        -moz-osx-font-smoothing: grayscale;
     640        text-decoration: none !important;
     641}
     642
     643#available-menu-items .open .accordion-section-title .toggle-indicator:after {
    623644        content: '\f142';
    624645}
    625646
    … …  
    644665#available-menu-items .accordion-section-title button {
    645666        display: block;
    646667        width: 28px;
    647         height: 32px;
     668        height: 35px;
    648669        position: absolute;
    649670        top: 5px;
    650671        right: 5px;
     672        cursor: pointer;
    651673}
    652674
    653675#available-menu-items .accordion-section-title button:focus {
    … …  
    656678}
    657679
    658680#available-menu-items .accordion-section-title .no-items,
    659 #available-menu-items .cannot-expand .accordion-section-title .spinner {
     681#available-menu-items .cannot-expand .accordion-section-title .spinner,
     682#available-menu-items .cannot-expand .accordion-section-title > button {
    660683        display: none;
    661684}
    662685
     686#available-menu-items-search.cannot-expand .accordion-section-title .spinner {
     687        display: block;
     688}
     689
    663690#available-menu-items .cannot-expand .accordion-section-title .no-items {
    664691        display: block;
    665692        color: #777;
    … …  
    777804
    778805#available-menu-items-search .spinner {
    779806        position: absolute;
    780         top: 18px;
     807        top: 20px;
    781808        margin: 0 !important;
    782809        right: 20px;
    783810}

  • src/wp-admin/js/accordion.js

     
    5353         */
    5454        function accordionSwitch ( el ) {
    5555                var section = el.closest( '.accordion-section' ),
     56                        sectionToggleControl = section.find( '[aria-expanded]' ).eq( 0 ),
    5657                        siblings = section.closest( '.accordion-container' ).find( '.open' ),
     58                        siblingsToggleControl = siblings.find( '[aria-expanded]' ).eq( 0 ),
    5759                        content = section.find( '.accordion-section-content' );
    5860
    5961                // This section has no content and cannot be expanded.
    … …  
    6567                        section.toggleClass( 'open' );
    6668                        content.toggle( true ).slideToggle( 150 );
    6769                } else {
     70                        siblingsToggleControl.attr( 'aria-expanded', 'false' );
    6871                        siblings.removeClass( 'open' );
    6972                        siblings.find( '.accordion-section-content' ).show().slideUp( 150 );
    7073                        content.toggle( false ).slideToggle( 150 );
    7174                        section.toggleClass( 'open' );
    7275                }
     76
     77                // If there's an element with an aria-expanded attribute, assume it's a toggle control and toggle the aria-expanded value.
     78                if ( sectionToggleControl ) {
     79                        sectionToggleControl.attr( 'aria-expanded', sectionToggleControl.attr( 'aria-expanded' ) === 'false' ? 'true' : 'false' );
     80                }
    7381        }
    7482
    7583})(jQuery);

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

     
    173173
    174174                // Search input change handler.
    175175                search: function( event ) {
     176                        var $searchSection = $( '#available-menu-items-search' ),
     177                                $openSections = $( '#available-menu-items .accordion-section.open' );
     178
    176179                        if ( ! event ) {
    177180                                return;
    178181                        }
    179182                        // Manual accordion-opening behavior.
    180                         if ( this.searchTerm && ! $( '#available-menu-items-search' ).hasClass( 'open' ) ) {
    181                                 $( '#available-menu-items .accordion-section-content' ).slideUp( 'fast' );
    182                                 $( '#available-menu-items-search .accordion-section-content' ).slideDown( 'fast' );
    183                                 $( '#available-menu-items .accordion-section.open' ).removeClass( 'open' );
    184                                 $( '#available-menu-items-search' ).addClass( 'open' );
     183                        if ( this.searchTerm && ! $searchSection.hasClass( 'open' ) ) {
     184                                $openSections.find( '.accordion-section-content' ).slideUp( 'fast' );
     185                                $searchSection.find( '.accordion-section-content' ).slideDown( 'fast' );
     186                                $openSections.find( '[aria-expanded]' ).eq( 0 ).attr( 'aria-expanded', 'false' );
     187                                $openSections.removeClass( 'open' );
     188                                $searchSection.addClass( 'open' );
    185189                        }
    186190                        if ( '' === event.target.value ) {
    187                                 $( '#available-menu-items-search' ).removeClass( 'open' );
     191                                $searchSection.removeClass( 'open' );
    188192                        }
    189193                        if ( this.searchTerm === event.target.value ) {
    190194                                return;
    … …  
    19911995                 */
    19921996                toggleReordering: function( showOrHide ) {
    19931997                        var addNewItemBtn = this.container.find( '.add-new-menu-item' ),
    1994                                 reorderBtn = this.container.find( '.reorder-toggle' );
     1998                                reorderBtn = this.container.find( '.reorder-toggle' ),
     1999                                itemsTitle = this.$sectionContent.find( '.item-title' );
    19952000
    19962001                        showOrHide = Boolean( showOrHide );
    19972002
    … …  
    20032008                        this.$sectionContent.toggleClass( 'reordering', showOrHide );
    20042009                        this.$sectionContent.sortable( this.isReordering ? 'disable' : 'enable' );
    20052010                        if ( this.isReordering ) {
    2006                                 addNewItemBtn.attr( 'tabindex', '-1' );
     2011                                addNewItemBtn.attr({ 'tabindex': '-1', 'aria-hidden': 'true' });
    20072012                                reorderBtn.attr( 'aria-label', api.Menus.data.l10n.reorderLabelOff );
    20082013                                wp.a11y.speak( api.Menus.data.l10n.reorderModeOn );
     2014                                itemsTitle.attr( 'aria-hidden', 'false' );
    20092015                        } else {
    2010                                 addNewItemBtn.removeAttr( 'tabindex' );
     2016                                addNewItemBtn.removeAttr( 'tabindex aria-hidden' );
    20112017                                reorderBtn.attr( 'aria-label', api.Menus.data.l10n.reorderLabelOn );
    20122018                                wp.a11y.speak( api.Menus.data.l10n.reorderModeOff );
     2019                                itemsTitle.attr( 'aria-hidden', 'true' );
    20132020                        }
    20142021
    20152022                        if ( showOrHide ) {

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

     
    16791679                ?>
    16801680                <div class="menu-item-bar">
    16811681                        <div class="menu-item-handle">
    1682                                 <span class="item-type">{{ data.item_type_label }}</span>
    1683                                 <span class="item-title">
     1682                                <span class="item-type" aria-hidden="true">{{ data.item_type_label }}</span>
     1683                                <span class="item-title" aria-hidden="true">
    16841684                                        <span class="spinner"></span>
    16851685                                        <span class="menu-item-title<# if ( ! data.title ) { #> no-title<# } #>">{{ data.title || wp.customize.Menus.data.l10n.untitled }}</span>
    16861686                                </span>
    16871687                                <span class="item-controls">
    1688                                         <button type="button" class="not-a-button item-edit"><span class="screen-reader-text"><?php _e( 'Edit Menu Item' ); ?></span></button>
    1689                                         <button type="button" class="not-a-button item-delete submitdelete deletion"><span class="screen-reader-text"><?php _e( 'Remove Menu Item' ); ?></span></button>
     1688                                        <button type="button" class="not-a-button item-edit"><span class="screen-reader-text"><?php
     1689                                                /* translators: 1: Title of a menu item, 2: Type of a menu item */
     1690                                                printf( __( 'Edit menu item: %1$s (%2$s)' ), '{{ data.title || wp.customize.Menus.data.l10n.untitled }}', '{{ data.item_type_label }}' );
     1691                                        ?></span></button>
     1692                                        <button type="button" class="not-a-button item-delete submitdelete deletion"><span class="screen-reader-text"><?php
     1693                                                /* translators: 1: Title of a menu item, 2: Type of a menu item */
     1694                                                printf( __( 'Remove Menu Item: %1$s (%2$s)' ), '{{ data.title || wp.customize.Menus.data.l10n.untitled }}', '{{ data.item_type_label }}' );
     1695                                        ?></span></button>
    16901696                                </span>
    16911697                        </div>
    16921698                </div>

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

     
    721721                                <ul class="accordion-section-content" data-type="search"></ul>
    722722                        </div>
    723723                        <div id="new-custom-menu-item" class="accordion-section">
    724                                 <h4 class="accordion-section-title"><?php _e( 'Custom Links' ); ?><button type="button" class="not-a-button"><span class="screen-reader-text"><?php _e( 'Toggle' ); ?></span></button></h4>
     724                                <h4 class="accordion-section-title" role="presentation"><?php _e( 'Custom Links' ); ?> <button type="button" class="not-a-button" aria-expanded="false"><span class="screen-reader-text"><?php _e( 'Toggle section: Custom Links' ); ?></span><span class="toggle-indicator" aria-hidden="true"></span></button></h4>
    725725                                <div class="accordion-section-content">
    726726                                        <input type="hidden" value="custom" id="custom-menu-item-type" name="menu-item[-1][menu-item-type]" />
    727727                                        <p id="menu-item-url-wrap">
    … …  
    750750                                $id = sprintf( 'available-menu-items-%s-%s', $available_item_type['type'], $available_item_type['object'] );
    751751                                ?>
    752752                                <div id="<?php echo esc_attr( $id ); ?>" class="accordion-section">
    753                                         <h4 class="accordion-section-title"><?php echo esc_html( $available_item_type['title'] ); ?> <span class="no-items"><?php _e( 'No items' ); ?></span><span class="spinner"></span> <button type="button" class="not-a-button"><span class="screen-reader-text"><?php _e( 'Toggle' ); ?></span></button></h4>
     753                                        <h4 class="accordion-section-title" role="presentation"><?php echo esc_html( $available_item_type['title'] ); ?> <span class="spinner"></span> <span class="no-items"><?php _e( 'No items' ); ?></span> <button type="button" class="not-a-button" aria-expanded="false"><span class="screen-reader-text"><?php printf( 'Toggle section: %s', esc_html( $available_item_type['title'] ) ); ?></span><span class="toggle-indicator" aria-hidden="true"></span></button></h4>
    754754                                        <ul class="accordion-section-content" data-type="<?php echo esc_attr( $available_item_type['type'] ); ?>" data-object="<?php echo esc_attr( $available_item_type['object'] ); ?>"></ul>
    755755                                </div>
    756756                                <?php