WordPress.org
Get WordPress

Make WordPress Core

Changeset 31566


Ignore:
Timestamp:
02/27/2015 02:49:05 AM (12 years ago)
Author:
azaozz
Message:

PressThis: accessibility enhancements:

  • Add missing form labels.
  • Add some screen-reader-text and aria-hidden attributes.
  • Focus handling improvements.
  • Change tagcloud-link into a button.
  • Add missing ID attribute in tools.php.

Props afercia. Fixes #31449.

Location:
trunk/src/wp-admin
Files:
5 edited

Legend:

Unmodified
Added
Removed

  • trunk/src/wp-admin/css/press-this.css

    r31565 r31566  
    218218
    219219fieldset {
    220         border: 1px solid #c0c0c0;
    221         margin: 0 2px;
    222         padding: 0.35em 0.625em 0.75em;
     220        border: 0;
     221        margin: 0;
     222        padding: 0;
    223223}
    224224

  • trunk/src/wp-admin/includes/class-wp-press-this.php

    r31556 r31566  
    538538                                ?>
    539539                                <div id="post-formats-select">
     540                                <fieldset><legend class="screen-reader-text"><?php _e( 'Post formats' ); ?></legend>
    540541                                        <input type="radio" name="post_format" class="post-format" id="post-format-0" value="0" <?php checked( $post_format, '0' ); ?> />
    541542                                        <label for="post-format-0" class="post-format-icon post-format-standard"><?php echo get_post_format_string( 'standard' ); ?></label>
    … …  
    551552                                         }
    552553                                         ?>
     554                                </fieldset>
    553555                                </div>
    554556                                <?php
    … …  
    570572                if ( current_user_can( $taxonomy->cap->edit_terms ) ) {
    571573                        ?>
    572                         <button type="button" class="add-cat-toggle button-subtle">
    573                                 <span class="dashicons dashicons-plus"></span>
     574                        <button type="button" class="add-cat-toggle button-subtle" aria-expanded="false">
     575                                <span class="dashicons dashicons-plus"></span><span class="screen-reader-text"><?php _e( 'Toggle add category' ); ?></span>
    574576                        </button>
    575577                        <div class="add-category is-hidden">
    … …  
    593595                <?php } ?>
    594596                <div class="categories-search-wrapper">
    595                         <input id="categories-search" type="search" class="categories-search" placeholder="<?php esc_attr_e( 'Search categories' ) ?>">
     597                        <input id="categories-search" type="search" class="categories-search" placeholder="<?php esc_attr_e( 'Search categories by name' ) ?>">
    596598                        <label for="categories-search">
    597                                 <span class="dashicons dashicons-search"></span>
     599                                <span class="dashicons dashicons-search"></span><span class="screen-reader-text"><?php _e( 'Search categories' ); ?></span>
    598600                        </label>
    599601                </div>
    600                 <ul class="categories-select">
     602                <ul class="categories-select" aria-label="<?php esc_attr_e( 'Categories' ); ?>">
    601603                        <?php wp_terms_checklist( $post->ID, array( 'taxonomy' => 'category' ) ); ?>
    602604                </ul>
    … …  
    646648                if ( $user_can_assign_terms ) {
    647649                        ?>
    648                         <p>
    649                                 <a href="#titlediv" class="tagcloud-link" id="link-post_tag"><?php echo $taxonomy->labels->choose_from_most_used; ?></a>
    650                         </p>
     650                        <button type="button" class="button-reset button-link tagcloud-link" id="link-post_tag"><?php echo $taxonomy->labels->choose_from_most_used; ?></button>
    651651                        <?php
    652652                }
    … …  
    757757        <div id="scanbar" class="scan">
    758758                <form method="GET">
     759                        <label for="url-scan" class="screen-reader-text"><?php _e( 'Scan site for content' ); ?></label>
    759760                        <input type="url" name="u" id="url-scan" class="scan-url" value="" placeholder="<?php esc_attr_e( 'Enter a URL to scan' ) ?>" />
    760761                        <input type="submit" name="url-scan-submit" id="url-scan-submit" class="scan-submit" value="<?php esc_attr_e( 'Scan' ) ?>" />
    … …  
    843844                                <div class="setting-modal is-off-screen is-hidden">
    844845                                        <button type="button" class="button-reset modal-close">
    845                                                 <span class="dashicons dashicons-arrow-left-alt2"></span><span class="setting-title"><?php _e( 'Post format' ); ?></span>
     846                                                <span class="dashicons dashicons-arrow-left-alt2"></span>
     847                                                <span class="setting-title" aria-hidden="true"><?php _e( 'Post format' ); ?></span>
     848                                                <span class="screen-reader-text"><?php _e( 'Back to post options' ) ?></span>
    846849                                        </button>
    847850                                        <?php $this->post_formats_html( $post ); ?>
    … …  
    850853
    851854                        <div class="setting-modal is-off-screen is-hidden">
    852                                 <button type="button" class="button-reset modal-close"><span class="dashicons dashicons-arrow-left-alt2"></span><span class="setting-title"><?php _e( 'Categories' ); ?></span></button>
     855                                <button type="button" class="button-reset modal-close">
     856                                        <span class="dashicons dashicons-arrow-left-alt2"></span>
     857                                        <span class="setting-title" aria-hidden="true"><?php _e( 'Categories' ); ?></span>
     858                                        <span class="screen-reader-text"><?php _e( 'Back to post options' ) ?></span>
     859                                </button>
    853860                                <?php $this->categories_html( $post ); ?>
    854861                        </div>
    855862
    856863                        <div class="setting-modal tags is-off-screen is-hidden">
    857                                 <button type="button" class="button-reset modal-close"><span class="dashicons dashicons-arrow-left-alt2"></span><span class="setting-title"><?php _e( 'Tags' ); ?></span></button>
     864                                <button type="button" class="button-reset modal-close">
     865                                        <span class="dashicons dashicons-arrow-left-alt2"></span>
     866                                        <span class="setting-title" aria-hidden="true"><?php _e( 'Tags' ); ?></span>
     867                                        <span class="screen-reader-text"><?php _e( 'Back to post options' ) ?></span>
     868                                </button>
    858869                                <?php $this->tags_html( $post ); ?>
    859870                        </div>
    … …  
    877888        <?php
    878889
    879                 // TODO: consider running "special" press-this hooks here?
    880                 // Maybe better so we don't output stuff accidentally added by plugins. Would probably prevent some errors.
    881890                do_action( 'admin_footer', '' );
    882891                do_action( 'admin_print_footer_scripts' );

  • trunk/src/wp-admin/js/press-this.js

    r31549 r31566  
    541541                 */
    542542                function saveNewCategory() {
    543                         var data = {
     543                        var data,
     544                                name = $( '#new-category' ).val();
     545
     546                        if ( ! name ) {
     547                                return;
     548                        }
     549
     550                        data = {
    544551                                action: 'press-this-add-category',
    545552                                post_id: $( '#post_ID' ).val() || 0,
    546                                 name: $( '#new-category' ).val() || '',
     553                                name: name,
    547554                                new_cat_nonce: $( '#_ajax_nonce-add-category' ).val() || '',
    548555                                parent: $( '#new-category-parent' ).val() || 0
    … …  
    811818                                        .removeClass( isOffScreen + ' ' + isHidden )
    812819                                        .one( transitionEndEvent, function() {
    813                                                 $( this ).find( $modalClose ).focus();
     820                                                $( this ).find( '.modal-close' ).focus();
    814821                                        } );
    815822                        } );
    … …  
    828835                                        .one( transitionEndEvent, function() {
    829836                                                $( this ).addClass( isHidden );
     837                                                $postOption.eq( index - 1 ).focus();
    830838                                        } );
    831839
    … …  
    834842                                        setTimeout( function() {
    835843                                                $targetSettingModal.addClass( isHidden );
     844                                                $postOption.eq( index - 1 ).focus();
    836845                                        }, 350 );
    837846                                }
    838 
    839                                 $postOption.eq( index - 1 ).focus();
    840847                        } );
    841848                }
    … …  
    964971
    965972                        $( 'button.add-cat-toggle' ).on( 'click.press-this', function() {
    966                                 $( this ).toggleClass( 'is-toggled' );
    967                                 $( '.setting-modal .add-category' ).toggleClass( 'is-hidden' );
    968                                 $( '.categories-search-wrapper' ).toggleClass( 'is-hidden' );
     973                                var $this = $( this );
     974
     975                                $this.toggleClass( 'is-toggled' );
     976                                $this.attr( 'aria-expanded', ! $this.attr( 'aria-expanded' ) );
     977                                $( '.setting-modal .add-category, .categories-search-wrapper' ).toggleClass( 'is-hidden' );
    969978                        } );
    970979
    971980                        $( 'button.add-cat-submit' ).on( 'click.press-this', saveNewCategory );
    972981
    973                         $( '.categories-search' ).on( 'keyup', function() {
     982                        $( '.categories-search' ).on( 'keyup.press-this', function() {
    974983                                var search = $( this ).val().toLowerCase() || '';
    975984

  • trunk/src/wp-admin/js/tags-box.js

    r31538 r31566  
    1919                return out;
    2020        };
    21        
     21
    2222        tagBox = {
    2323                clean : function(tags) {
    … …  
    194194
    195195                        // tag cloud
    196                         $('a.tagcloud-link').click(function(){
     196                        $('.tagcloud-link').click(function(){
    197197                                tagBox.get( $(this).attr('id') );
    198198                                $(this).unbind().click(function(){

  • trunk/src/wp-admin/tools.php

    r31534 r31566  
    5858                </p>
    5959
    60                 <div class="hidden js-pressthis-code-wrap">
     60                <div class="hidden js-pressthis-code-wrap" id="pressthis-code-wrap">
    6161                        <p id="pressthis-code-desc">
    6262                                <?php _e( 'If you can\'t drag it to your bookmarks, copy the following code and create new bookmark. Paste the code into the new bookmark\'s URL field.' ) ?>
Note: See TracChangeset for help on using the changeset viewer.