Make WordPress Core

Changeset 31566


Ignore:
Timestamp:
02/27/2015 02:49:05 AM (10 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.