WordPress.org

Make WordPress Core

Ticket #35374: 35374.patch

File 35374.patch, 16.0 KB (added by afercia, 5 years ago)

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

     
    6161        position: relative;
    6262}
    6363
    64 .blank-slate .menu-name {
    65         height: 2em;
    66 }
    67 
    6864.blank-slate .menu-settings {
    6965        border: none;
    7066        margin-top: 0;
    … …  
    180176}
    181177
    182178#nav-menu-header .menu-name-label {
    183         margin-top: 4px;
     179        display: inline-block;
     180        vertical-align: middle;
     181        margin-right: 7px;
     182        font-style: italic;
    184183}
    185184
    186185.nav-menus-php #post-body div.updated,
    … …  
    253252        border-right: 1px solid #ccc;
    254253}
    255254
    256 #wpbody .open-label {
    257         display: block;
    258         float:left;
    259 }
    260 
    261 #wpbody .open-label span {
    262         padding-right: 10px;
    263 }
    264 
    265 .js .input-with-default-title {
    266         color: #a0a5aa;
    267         font-style: italic;
    268 }
    269 
    270255#menu-management .inside {
    271256        padding: 0 10px;
    272257}
    … …  
    273258
    274259/* Add Menu Item Boxes */
    275260.postbox .howto input,
    276 .accordion-container .howto input {
     261.customlinkdiv .menu-item-textbox {
    277262        width: 180px;
    278263        float: right;
    279264}
    … …  
    282267        margin: 0;
    283268}
    284269
    285 .customlinkdiv .howto input {
    286         width: 180px;
    287 }
    288 
    289270.customlinkdiv p {
    290271        margin-top: 0
    291272}
    … …  
    366347/* Create Menu */
    367348#menu-name {
    368349        width: 270px;
     350        vertical-align: middle;
    369351}
    370352
    371353#manage-menu .inside {
    … …  
    392374        width: 180px;
    393375}
    394376
     377.customlinkdiv label,
    395378.nav-menus-php .howto span {
     379        float: left;
    396380        margin-top: 6px;
    397         display: block;
    398         float: left;
    399381}
    400382
    401383/* Menu item types */
    … …  
    742724/* Major/minor publishing actions (classes) */
    743725.nav-menus-php .major-publishing-actions {
    744726        clear: both;
    745         padding: 3px 0 6px;
     727        padding: 7px 0 6px;
    746728}
    747729
    748730.nav-menus-php .major-publishing-actions .publishing-action {
    749731        text-align: right;
    750732        float: right;
    751         line-height: 23px;
    752         margin: 4px 0 1px;
    753733}
    754734
    755735.nav-menus-php .blank-slate .menu-settings {

  • src/wp-admin/includes/nav-menu.php

     
    264264        <div class="customlinkdiv" id="customlinkdiv">
    265265                <input type="hidden" value="custom" name="menu-item[<?php echo $_nav_menu_placeholder; ?>][menu-item-type]" />
    266266                <p id="menu-item-url-wrap">
    267                         <label class="howto" for="custom-menu-item-url">
    268                                 <span><?php _e('URL'); ?></span>
    269                                 <input id="custom-menu-item-url" name="menu-item[<?php echo $_nav_menu_placeholder; ?>][menu-item-url]" type="text" class="code menu-item-textbox" value="http://" />
    270                         </label>
     267                        <label class="howto" for="custom-menu-item-url"><?php _e( 'URL' ); ?></label>
     268                        <input id="custom-menu-item-url" name="menu-item[<?php echo $_nav_menu_placeholder; ?>][menu-item-url]" type="text" class="code menu-item-textbox" value="http://" />
    271269                </p>
    272270
    273271                <p id="menu-item-name-wrap">
    274                         <label class="howto" for="custom-menu-item-name">
    275                                 <span><?php _e( 'Link Text' ); ?></span>
    276                                 <input id="custom-menu-item-name" name="menu-item[<?php echo $_nav_menu_placeholder; ?>][menu-item-title]" type="text" class="regular-text menu-item-textbox input-with-default-title" title="<?php esc_attr_e('Menu Item'); ?>" />
    277                         </label>
     272                        <label class="howto" for="custom-menu-item-name"><?php _e( 'Link Text' ); ?></label>
     273                        <input id="custom-menu-item-name" name="menu-item[<?php echo $_nav_menu_placeholder; ?>][menu-item-title]" type="text" class="regular-text menu-item-textbox" />
    278274                </p>
    279275
    280276                <p class="button-controls">
    … …  
    435431                        }
    436432                        ?>
    437433                        <p class="quick-search-wrap">
    438                                 <input type="search" class="quick-search input-with-default-title" title="<?php esc_attr_e('Search'); ?>" value="<?php echo $searched; ?>" name="quick-search-posttype-<?php echo $post_type_name; ?>" />
     434                                <label for="quick-search-posttype-<?php echo $post_type_name; ?>" class="screen-reader-text"><?php _e( 'Search' ); ?></label>
     435                                <input type="search" class="quick-search" value="<?php echo $searched; ?>" name="quick-search-posttype-<?php echo $post_type_name; ?>" id="quick-search-posttype-<?php echo $post_type_name; ?>" />
    439436                                <span class="spinner"></span>
    440437                                <?php submit_button( __( 'Search' ), 'button-small quick-search-submit button-secondary hide-if-js', 'submit', false, array( 'id' => 'submit-quick-search-posttype-' . $post_type_name ) ); ?>
    441438                        </p>
    … …  
    714711                        }
    715712                        ?>
    716713                        <p class="quick-search-wrap">
    717                                 <input type="search" class="quick-search input-with-default-title" title="<?php esc_attr_e('Search'); ?>" value="<?php echo $searched; ?>" name="quick-search-taxonomy-<?php echo $taxonomy_name; ?>" />
     714                                <label for="quick-search-taxonomy-<?php echo $taxonomy_name; ?>" class="screen-reader-text"><?php _e( 'Search' ); ?></label>
     715                                <input type="search" class="quick-search" value="<?php echo $searched; ?>" name="quick-search-taxonomy-<?php echo $taxonomy_name; ?>" id="quick-search-taxonomy-<?php echo $taxonomy_name; ?>" />
    718716                                <span class="spinner"></span>
    719717                                <?php submit_button( __( 'Search' ), 'button-small quick-search-submit button-secondary hide-if-js', 'submit', false, array( 'id' => 'submit-quick-search-taxonomy-' . $taxonomy_name ) ); ?>
    720718                        </p>

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

     
    913913        aria_button_if_js();
    914914
    915915        $document.on( 'wp-pin-menu wp-window-resized.pin-menu postboxes-columnchange.pin-menu postbox-toggled.pin-menu wp-collapse-menu.pin-menu wp-scroll-start.pin-menu', setPinMenu );
     916
     917        // Set initial focus on a specific element.
     918        $( '.wp-initial-focus' ).focus();
    916919});
    917920
    918921// Fire a custom jQuery event at the end of window resize

  • src/wp-admin/js/nav-menu.js

     
    3030                menusChanged : false,
    3131                isRTL: !! ( 'undefined' != typeof isRtl && isRtl ),
    3232                negateIfRTL: ( 'undefined' != typeof isRtl && isRtl ) ? -1 : 1,
     33                lastSearch: '',
    3334
    3435                // Functions that run on init.
    3536                init : function() {
    … …  
    4041
    4142                        this.attachMenuEditListeners();
    4243
    43                         this.setupInputWithDefaultTitle();
    4444                        this.attachQuickSearchListeners();
    4545                        this.attachThemeLocationsListeners();
    4646
    … …  
    444444                        // Where can they move this menu item?
    445445                        if ( 0 !== position ) {
    446446                                thisLink = menuItem.find( '.menus-move-up' );
    447                                 thisLink.prop( 'title', menus.moveUp ).css( 'display', 'inline' );
     447                                thisLink.attr( 'aria-label', menus.moveUp ).css( 'display', 'inline' );
    448448                        }
    449449
    450450                        if ( 0 !== position && isPrimaryMenuItem ) {
    451451                                thisLink = menuItem.find( '.menus-move-top' );
    452                                 thisLink.prop( 'title', menus.moveToTop ).css( 'display', 'inline' );
     452                                thisLink.attr( 'aria-label', menus.moveToTop ).css( 'display', 'inline' );
    453453                        }
    454454
    455455                        if ( position + 1 !== totalMenuItems && 0 !== position ) {
    456456                                thisLink = menuItem.find( '.menus-move-down' );
    457                                 thisLink.prop( 'title', menus.moveDown ).css( 'display', 'inline' );
     457                                thisLink.attr( 'aria-label', menus.moveDown ).css( 'display', 'inline' );
    458458                        }
    459459
    460460                        if ( 0 === position && 0 !== hasSameDepthSibling ) {
    461461                                thisLink = menuItem.find( '.menus-move-down' );
    462                                 thisLink.prop( 'title', menus.moveDown ).css( 'display', 'inline' );
     462                                thisLink.attr( 'aria-label', menus.moveDown ).css( 'display', 'inline' );
    463463                        }
    464464
    465465                        if ( ! isPrimaryMenuItem ) {
    466466                                thisLink = menuItem.find( '.menus-move-left' ),
    467467                                thisLinkText = menus.outFrom.replace( '%s', prevItemNameLeft );
    468                                 thisLink.prop( 'title', menus.moveOutFrom.replace( '%s', prevItemNameLeft ) ).text( thisLinkText ).css( 'display', 'inline' );
     468                                thisLink.attr( 'aria-label', menus.moveOutFrom.replace( '%s', prevItemNameLeft ) ).text( thisLinkText ).css( 'display', 'inline' );
    469469                        }
    470470
    471471                        if ( 0 !== position ) {
    … …  
    472472                                if ( menuItem.find( '.menu-item-data-parent-id' ).val() !== menuItem.prev().find( '.menu-item-data-db-id' ).val() ) {
    473473                                        thisLink = menuItem.find( '.menus-move-right' ),
    474474                                        thisLinkText = menus.under.replace( '%s', prevItemNameRight );
    475                                         thisLink.prop( 'title', menus.moveUnder.replace( '%s', prevItemNameRight ) ).text( thisLinkText ).css( 'display', 'inline' );
     475                                        thisLink.attr( 'aria-label', menus.moveUnder.replace( '%s', prevItemNameRight ) ).text( thisLinkText ).css( 'display', 'inline' );
    476476                                }
    477477                        }
    478478
    … …  
    494494                                title = menus.subMenuFocus.replace( '%1$s', itemName ).replace( '%2$d', itemPosition ).replace( '%3$s', parentItemName );
    495495                        }
    496496
    497                         $this.prop('title', title).text( title );
     497                        // @todo Consider to update just the `aria-label` attribute.
     498                        $this.attr( 'aria-label', title ).text( title );
    498499
    499500                        // Mark this item's accessibility as refreshed
    500501                        $this.data( 'needs_accessibility_refresh', false );
    … …  
    833834                        });
    834835                },
    835836
    836                 /**
    837                  * An interface for managing default values for input elements
    838                  * that is both JS and accessibility-friendly.
    839                  *
    840                  * Input elements that add the class 'input-with-default-title'
    841                  * will have their values set to the provided HTML title when empty.
    842                  */
    843                 setupInputWithDefaultTitle : function() {
    844                         var name = 'input-with-default-title';
    845 
    846                         $('.' + name).each( function(){
    847                                 var $t = $(this), title = $t.attr('title'), val = $t.val();
    848                                 $t.data( name, title );
    849 
    850                                 if( '' === val ) $t.val( title );
    851                                 else if ( title == val ) return;
    852                                 else $t.removeClass( name );
    853                         }).focus( function(){
    854                                 var $t = $(this);
    855                                 if( $t.val() == $t.data(name) )
    856                                         $t.val('').removeClass( name );
    857                         }).blur( function(){
    858                                 var $t = $(this);
    859                                 if( '' === $t.val() )
    860                                         $t.addClass( name ).val( $t.data(name) );
    861                         });
    862 
    863                         $( '.blank-slate .input-with-default-title' ).focus();
    864                 },
    865 
    866837                attachThemeLocationsListeners : function() {
    867838                        var loc = $('#nav-menu-theme-locations'), params = {};
    868839                        params.action = 'menu-locations-save';
    … …  
    882853                attachQuickSearchListeners : function() {
    883854                        var searchTimer;
    884855
    885                         $('.quick-search').keypress(function(e){
     856                        // Uniform events on all "self submitting" fields, see ticket #26600#comment:59
     857                        $( '.quick-search' ).on( 'input keyup', function( e ) {
    886858                                var t = $(this);
    887859
    888860                                if( 13 == e.which ) {
    … …  
    894866
    895867                                searchTimer = setTimeout(function(){
    896868                                        api.updateQuickSearchResults( t );
    897                                 }, 400);
     869                                }, 500 );
     870                        }).on( 'blur', function() {
     871                                api.lastSearch = '';
    898872                        }).attr('autocomplete','off');
    899873                },
    900874
    901875                updateQuickSearchResults : function(input) {
    902876                        var panel, params,
    903                         minSearchLength = 2,
    904                         q = input.val();
     877                                minSearchLength = 2,
     878                                q = input.val();
    905879
    906                         if( q.length < minSearchLength ) return;
     880                        /*
     881                         * Minimum characters for a search. Also avoid a new AJAX search when
     882                         * the key pressed (e.g.arrows) doesn't change the searched term.
     883                         */
     884                        if ( q.length < minSearchLength || api.lastSearch == q ) {
     885                                return;
     886                        }
    907887
     888                        api.lastSearch = q;
     889
    908890                        panel = input.parents('.tabs-panel');
    909891                        params = {
    910892                                'action': 'menu-quick-search',

  • src/wp-admin/nav-menus.php

     
    736736                                        wp_nonce_field( 'meta-box-order', 'meta-box-order-nonce', false );
    737737                                        wp_nonce_field( 'update-nav_menu', 'update-nav-menu-nonce' );
    738738
    739                                         if ( $one_theme_location_no_menus ) { ?>
     739                                        $menu_name_aria_desc = $add_new_screen ? ' aria-describedby="menu-name-desc"' : '';
     740
     741                                        if ( $one_theme_location_no_menus ) {
     742                                                $menu_name_val = 'value="' . esc_attr( 'Menu 1' ) . '"';
     743                                        ?>
    740744                                                <input type="hidden" name="zero-menu-state" value="true" />
    741                                         <?php } ?>
     745                                        <?php } else {
     746                                                $menu_name_val = 'value="' . esc_attr( $nav_menu_selected_title ) . '"';
     747                                        } ?>
    742748                                        <input type="hidden" name="action" value="update" />
    743749                                        <input type="hidden" name="menu" id="menu" value="<?php echo esc_attr( $nav_menu_selected_id ); ?>" />
    744750                                        <div id="nav-menu-header">
    745751                                                <div class="major-publishing-actions">
    746                                                         <label class="menu-name-label howto open-label" for="menu-name">
    747                                                                 <span><?php _e( 'Menu Name' ); ?></span>
    748                                                                 <input name="menu-name" id="menu-name" type="text" class="menu-name regular-text menu-item-textbox input-with-default-title" title="<?php esc_attr_e( 'Enter menu name here' ); ?>" value="<?php if ( $one_theme_location_no_menus ) _e( 'Menu 1' ); else echo esc_attr( $nav_menu_selected_title ); ?>" />
    749                                                         </label>
     752                                                        <label class="menu-name-label" for="menu-name"><?php _e( 'Menu Name' ); ?></label>
     753                                                        <input name="menu-name" id="menu-name" type="text" class="menu-name regular-text menu-item-textbox" <?php echo $menu_name_val . $menu_name_aria_desc; ?> />
    750754                                                        <div class="publishing-action">
    751755                                                                <?php submit_button( empty( $nav_menu_selected_id ) ? __( 'Create Menu' ) : __( 'Save Menu' ), 'button-primary menu-save', 'save_menu', false, array( 'id' => 'save_menu_header' ) ); ?>
    752756                                                        </div><!-- END .publishing-action -->
    … …  
    769773                                                        <?php } ?>
    770774                                                        <?php endif; ?>
    771775                                                        <?php if ( $add_new_screen ) : ?>
    772                                                                 <p class="post-body-plain"><?php _e( 'Give your menu a name above, then click Create Menu.' ); ?></p>
     776                                                                <p class="post-body-plain" id="menu-name-desc"><?php _e( 'Give your menu a name, then click Create Menu.' ); ?></p>
    773777                                                                <?php if ( isset( $_GET['use-location'] ) ) : ?>
    774778                                                                        <input type="hidden" name="use-location" value="<?php echo esc_attr( $_GET['use-location'] ); ?>" />
    775779                                                                <?php endif; ?>
    … …  
    801805                                                                                        <input type="checkbox"<?php checked( isset( $menu_locations[ $location ] ) && $menu_locations[ $location ] == $nav_menu_selected_id ); ?> name="menu-locations[<?php echo esc_attr( $location ); ?>]" id="locations-<?php echo esc_attr( $location ); ?>" value="<?php echo esc_attr( $nav_menu_selected_id ); ?>" />
    802806                                                                                        <label for="locations-<?php echo esc_attr( $location ); ?>"><?php echo $description; ?></label>
    803807                                                                                        <?php if ( ! empty( $menu_locations[ $location ] ) && $menu_locations[ $location ] != $nav_menu_selected_id ) : ?>
    804                                                                                                 <span class="theme-location-set"><?php 
     808                                                                                                <span class="theme-location-set"><?php
    805809                                                                                                        /* translators: %s: menu name */
    806810                                                                                                        printf( _x( '(Currently set to: %s)', 'menu location' ),
    807811                                                                                                                wp_get_nav_menu_object( $menu_locations[ $location ] )->name

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

     
    743743                                                <span class="toggle-indicator" aria-hidden="true"></span>
    744744                                        </button>
    745745                                </h4>
    746                                 <div class="accordion-section-content">
     746                                <div class="accordion-section-content customlinkdiv">
    747747                                        <input type="hidden" value="custom" id="custom-menu-item-type" name="menu-item[-1][menu-item-type]" />
    748748                                        <p id="menu-item-url-wrap">
    749                                                 <label class="howto" for="custom-menu-item-url">
    750                                                         <span><?php _e( 'URL' ); ?></span>
    751                                                         <input id="custom-menu-item-url" name="menu-item[-1][menu-item-url]" type="text" class="code menu-item-textbox" value="http://">
    752                                                 </label>
     749                                                <label class="howto" for="custom-menu-item-url"><?php _e( 'URL' ); ?></label>
     750                                                <input id="custom-menu-item-url" name="menu-item[-1][menu-item-url]" type="text" class="code menu-item-textbox" value="http://">
    753751                                        </p>
    754752                                        <p id="menu-item-name-wrap">
    755                                                 <label class="howto" for="custom-menu-item-name">
    756                                                         <span><?php _e( 'Link Text' ); ?></span>
    757                                                         <input id="custom-menu-item-name" name="menu-item[-1][menu-item-title]" type="text" class="regular-text menu-item-textbox">
    758                                                 </label>
     753                                                <label class="howto" for="custom-menu-item-name"><?php _e( 'Link Text' ); ?></label>
     754                                                <input id="custom-menu-item-name" name="menu-item[-1][menu-item-title]" type="text" class="regular-text menu-item-textbox">
    759755                                        </p>
    760756                                        <p class="button-controls">
    761757                                                <span class="add-to-menu">