Accessibility: Improve the Comments and Privacy count text.

- standardizes the Comment count string to `%s Comment in moderation', '%s Comments in moderation` so it can be bulk-updated
- adds the string as visually hidden text in the admin menu 
- introduces an `updateInModerationText` JS simple function, responsible to correctly update all the related text using the data from the AJAX response
- adds a visually hidden text "1 Privacy Policy update" to the Privacy menu items count
- adds/improves translators comments

Changes that apply to all the count bubbles (Updates, plugins, etc.)
- makes the bubbles and their text slightly bigger
- improves the active menu item bubble contrast by changing the background color to red (option 2 in the screenshot attached in a previous comment)

Props adamsoucie, afercia.
Fixes #33030.

Built from https://develop.svn.wordpress.org/trunk@44924


git-svn-id: http://core.svn.wordpress.org/trunk@44755 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Andrea Fercia 2019-03-18 15:22:53 +00:00
parent 513b862cc6
commit e901bc4c2b
11 changed files with 100 additions and 62 deletions

View File

@ -515,14 +515,15 @@ ul#adminmenu > li.current > a.current:after {
#adminmenu .update-plugins { #adminmenu .update-plugins {
display: inline-block; display: inline-block;
vertical-align: top; vertical-align: top;
margin: 1px 2px 0 0; box-sizing: border-box;
margin: 1px 2px -1px 0;
padding: 0 5px; padding: 0 5px;
min-width: 7px; min-width: 18px;
height: 17px; height: 18px;
border-radius: 11px; border-radius: 9px;
background-color: #ca4a1f; background-color: #ca4a1f;
color: #fff; color: #fff;
font-size: 9px; font-size: 11px;
line-height: 17px; line-height: 17px;
text-align: center; text-align: center;
z-index: 26; z-index: 26;
@ -530,7 +531,7 @@ ul#adminmenu > li.current > a.current:after {
#adminmenu li.current a .awaiting-mod, #adminmenu li.current a .awaiting-mod,
#adminmenu li a.wp-has-current-submenu .update-plugins { #adminmenu li a.wp-has-current-submenu .update-plugins {
background-color: #00b9eb; background-color: #ca4a1f;
color: #fff; color: #fff;
} }

File diff suppressed because one or more lines are too long

View File

@ -515,14 +515,15 @@ ul#adminmenu > li.current > a.current:after {
#adminmenu .update-plugins { #adminmenu .update-plugins {
display: inline-block; display: inline-block;
vertical-align: top; vertical-align: top;
margin: 1px 0 0 2px; box-sizing: border-box;
margin: 1px 0 -1px 2px;
padding: 0 5px; padding: 0 5px;
min-width: 7px; min-width: 18px;
height: 17px; height: 18px;
border-radius: 11px; border-radius: 9px;
background-color: #ca4a1f; background-color: #ca4a1f;
color: #fff; color: #fff;
font-size: 9px; font-size: 11px;
line-height: 17px; line-height: 17px;
text-align: center; text-align: center;
z-index: 26; z-index: 26;
@ -530,7 +531,7 @@ ul#adminmenu > li.current > a.current:after {
#adminmenu li.current a .awaiting-mod, #adminmenu li.current a .awaiting-mod,
#adminmenu li a.wp-has-current-submenu .update-plugins { #adminmenu li a.wp-has-current-submenu .update-plugins {
background-color: #00b9eb; background-color: #ca4a1f;
color: #fff; color: #fff;
} }

File diff suppressed because one or more lines are too long

View File

@ -460,7 +460,7 @@ function _wp_ajax_delete_comment_response( $comment_id, $delta = -1 ) {
), ),
'i18n_moderation_text' => sprintf( 'i18n_moderation_text' => sprintf(
/* translators: %s: number of comments in moderation */ /* translators: %s: number of comments in moderation */
_nx( '%s in moderation', '%s in moderation', $counts->moderated, 'comments' ), _n( '%s Comment in moderation', '%s Comments in moderation', $counts->moderated ),
number_format_i18n( $counts->moderated ) number_format_i18n( $counts->moderated )
), ),
'comment_link' => $comment_link, 'comment_link' => $comment_link,
@ -509,21 +509,27 @@ function _wp_ajax_delete_comment_response( $comment_id, $delta = -1 ) {
// The time since the last comment count. // The time since the last comment count.
$time = time(); $time = time();
$comment = get_comment( $comment_id ); $comment = get_comment( $comment_id );
$counts = wp_count_comments();
$x = new WP_Ajax_Response( $x = new WP_Ajax_Response(
array( array(
'what' => 'comment', 'what' => 'comment',
// Here for completeness - not used.
'id' => $comment_id, 'id' => $comment_id,
'supplemental' => array( 'supplemental' => array(
'status' => $comment ? $comment->comment_approved : '', 'status' => $comment ? $comment->comment_approved : '',
'postId' => $comment ? $comment->comment_post_ID : '', 'postId' => $comment ? $comment->comment_post_ID : '',
/* translators: %s: number of comments */ /* translators: %s: number of comments */
'total_items_i18n' => sprintf( _n( '%s item', '%s items', $total ), number_format_i18n( $total ) ), 'total_items_i18n' => sprintf( _n( '%s item', '%s items', $total ), number_format_i18n( $total ) ),
'total_pages' => ceil( $total / $per_page ), 'total_pages' => ceil( $total / $per_page ),
'total_pages_i18n' => number_format_i18n( ceil( $total / $per_page ) ), 'total_pages_i18n' => number_format_i18n( ceil( $total / $per_page ) ),
'total' => $total, 'total' => $total,
'time' => $time, 'time' => $time,
'in_moderation' => $counts->moderated,
'i18n_moderation_text' => sprintf(
/* translators: %s: number of comments in moderation */
_n( '%s Comment in moderation', '%s Comments in moderation', $counts->moderated ),
number_format_i18n( $counts->moderated )
),
), ),
) )
); );
@ -1291,8 +1297,8 @@ function wp_ajax_replyto_comment( $action ) {
number_format_i18n( $counts->approved ) number_format_i18n( $counts->approved )
), ),
'i18n_moderation_text' => sprintf( 'i18n_moderation_text' => sprintf(
/* translators: %s: number of comments moderated */ /* translators: %s: number of comments in moderation */
_nx( '%s in moderation', '%s in moderation', $counts->moderated, 'comments' ), _n( '%s Comment in moderation', '%s Comments in moderation', $counts->moderated ),
number_format_i18n( $counts->moderated ) number_format_i18n( $counts->moderated )
), ),
); );

View File

@ -291,9 +291,7 @@ function wp_dashboard_right_now() {
<?php <?php
$moderated_comments_count_i18n = number_format_i18n( $num_comm->moderated ); $moderated_comments_count_i18n = number_format_i18n( $num_comm->moderated );
/* translators: %s: number of comments in moderation */ /* translators: %s: number of comments in moderation */
$text = sprintf( _nx( '%s in moderation', '%s in moderation', $num_comm->moderated, 'comments' ), $moderated_comments_count_i18n ); $text = sprintf( _n( '%s Comment in moderation', '%s Comments in moderation', $num_comm->moderated ), $moderated_comments_count_i18n );
/* translators: %s: number of comments in moderation */
$aria_label = sprintf( _nx( '%s comment in moderation', '%s comments in moderation', $num_comm->moderated, 'comments' ), $moderated_comments_count_i18n );
?> ?>
<li class="comment-mod-count <li class="comment-mod-count
<?php <?php
@ -301,7 +299,7 @@ function wp_dashboard_right_now() {
echo ' hidden'; echo ' hidden';
} }
?> ?>
"><a href="edit-comments.php?comment_status=moderated" aria-label="<?php echo esc_attr( $aria_label ); ?>"><?php echo $text; ?></a></li> "><a href="edit-comments.php?comment_status=moderated" class="comments-in-moderation-text"><?php echo $text; ?></a></li>
<?php <?php
} }

View File

@ -7,7 +7,7 @@
(function($) { (function($) {
var getCount, updateCount, updateCountText, updatePending, updateApproved, var getCount, updateCount, updateCountText, updatePending, updateApproved,
updateHtmlTitle, updateDashboardText, adminTitle = document.title, updateHtmlTitle, updateDashboardText, updateInModerationText, adminTitle = document.title,
isDashboard = $('#dashboard_right_now').length, isDashboard = $('#dashboard_right_now').length,
titleDiv, titleRegEx; titleDiv, titleRegEx;
@ -86,20 +86,38 @@ var getCount, updateCount, updateCountText, updatePending, updateApproved,
}); });
}; };
updateDashboardText = function ( response ) { updateDashboardText = function( response ) {
if ( ! isDashboard || ! response || ! response.i18n_comments_text ) { if ( ! isDashboard || ! response || ! response.i18n_comments_text ) {
return; return;
} }
var rightNow = $( '#dashboard_right_now' ); $( '.comment-count a', '#dashboard_right_now' ).text( response.i18n_comments_text );
$( '.comment-count a', rightNow ).text( response.i18n_comments_text );
$( '.comment-mod-count a', rightNow ).text( response.i18n_moderation_text )
.parent()
[ response.in_moderation > 0 ? 'removeClass' : 'addClass' ]( 'hidden' );
}; };
updateHtmlTitle = function ( diff ) { /**
* Updates the "comments in moderation" text across the UI.
*
* @since 5.2.0
*
* @param {object} response Ajax response from the server.
*
* @return {void}
*/
updateInModerationText = function( response ) {
if ( ! response || ! response.i18n_moderation_text ) {
return;
}
// Update the "comment in moderation" text across the UI.
$( '.comments-in-moderation-text' ).text( response.i18n_moderation_text );
// Hide the "comment in moderation" text in the Dashboard "At a Glance" widget.
if ( isDashboard && response.in_moderation ) {
$( '.comment-mod-count', '#dashboard_right_now' )
[ response.in_moderation > 0 ? 'removeClass' : 'addClass' ]( 'hidden' );
}
};
updateHtmlTitle = function( diff ) {
var newTitle, regExMatch, titleCount, commentFrag; var newTitle, regExMatch, titleCount, commentFrag;
titleRegEx = titleRegEx || new RegExp( adminCommentsL10n.docTitleCommentsCount.replace( '%s', '\\([0-9' + thousandsSeparator + ']+\\)' ) + '?' ); titleRegEx = titleRegEx || new RegExp( adminCommentsL10n.docTitleCommentsCount.replace( '%s', '\\([0-9' + thousandsSeparator + ']+\\)' ) + '?' );
@ -238,6 +256,7 @@ window.setCommentsList = function() {
diff = $('#' + settings.element).is('.' + settings.dimClass) ? 1 : -1; diff = $('#' + settings.element).is('.' + settings.dimClass) ? 1 : -1;
if ( response ) { if ( response ) {
updateDashboardText( response.supplemental ); updateDashboardText( response.supplemental );
updateInModerationText( response.supplemental );
updatePending( diff, response.supplemental.postId ); updatePending( diff, response.supplemental.postId );
updateApproved( -1 * diff, response.supplemental.postId ); updateApproved( -1 * diff, response.supplemental.postId );
} else { } else {
@ -318,13 +337,18 @@ window.setCommentsList = function() {
spamDiff, trashDiff, pendingDiff, approvedDiff, spamDiff, trashDiff, pendingDiff, approvedDiff,
approved = commentRow.hasClass( 'approved' ), /*
* As `wpList` toggles only the `unapproved` class, the approved comment
* rows can have both the `approved` and `unapproved` classes.
*/
approved = commentRow.hasClass( 'approved' ) && ! commentRow.hasClass( 'unapproved' ),
unapproved = commentRow.hasClass( 'unapproved' ), unapproved = commentRow.hasClass( 'unapproved' ),
spammed = commentRow.hasClass( 'spam' ), spammed = commentRow.hasClass( 'spam' ),
trashed = commentRow.hasClass( 'trash' ), trashed = commentRow.hasClass( 'trash' ),
undoing = false; // ticket #35904 undoing = false; // ticket #35904
updateDashboardText( newTotal ); updateDashboardText( newTotal );
updateInModerationText( newTotal );
// the order of these checks is important // the order of these checks is important
// .unspam can also have .approve or .unapprove // .unspam can also have .approve or .unapprove
@ -508,7 +532,7 @@ window.setCommentsList = function() {
refillTheExtraList(); refillTheExtraList();
animated = $( ':animated', '#the-comment-list' ); animated = $( ':animated', '#the-comment-list' );
animatedCallback = function () { animatedCallback = function() {
if ( ! $( '#the-comment-list tr:visible' ).length ) { if ( ! $( '#the-comment-list tr:visible' ).length ) {
theList.get(0).wpList.add( theExtraList.find( '.no-items' ).clone() ); theList.get(0).wpList.add( theExtraList.find( '.no-items' ).clone() );
} }
@ -603,10 +627,6 @@ window.commentReply = {
}); });
this.comments_listing = $('#comments-form > input[name="comment_status"]').val() || ''; this.comments_listing = $('#comments-form > input[name="comment_status"]').val() || '';
/* $(listTable).bind('beforeChangePage', function(){
commentReply.close();
}); */
}, },
addEvents : function(r) { addEvents : function(r) {
@ -843,12 +863,10 @@ window.commentReply = {
} }
if ( r.supplemental.i18n_comments_text ) { if ( r.supplemental.i18n_comments_text ) {
if ( isDashboard ) { updateDashboardText( r.supplemental );
updateDashboardText( r.supplemental ); updateInModerationText( r.supplemental );
} else { updateApproved( 1, r.supplemental.parent_post_id );
updateApproved( 1, r.supplemental.parent_post_id ); updateCountText( 'span.all-count', 1 );
updateCountText( 'span.all-count', 1 );
}
} }
c = $.trim(r.data); // Trim leading whitespaces c = $.trim(r.data); // Trim leading whitespaces

File diff suppressed because one or more lines are too long

View File

@ -42,6 +42,7 @@ if ( ! is_multisite() ) {
} else { } else {
$cap = 'update_languages'; $cap = 'update_languages';
} }
/* translators: %s: number of pending updates */
$submenu['index.php'][10] = array( sprintf( __( 'Updates %s' ), "<span class='update-plugins count-{$update_data['counts']['total']}'><span class='update-count'>" . number_format_i18n( $update_data['counts']['total'] ) . '</span></span>' ), $cap, 'update-core.php' ); $submenu['index.php'][10] = array( sprintf( __( 'Updates %s' ), "<span class='update-plugins count-{$update_data['counts']['total']}'><span class='update-count'>" . number_format_i18n( $update_data['counts']['total'] ) . '</span></span>' ), $cap, 'update-core.php' );
unset( $cap ); unset( $cap );
} }
@ -74,10 +75,15 @@ $menu[15] = array( __( 'Links' ), 'manage_links', 'lin
// Avoid the comment count query for users who cannot edit_posts. // Avoid the comment count query for users who cannot edit_posts.
if ( current_user_can( 'edit_posts' ) ) { if ( current_user_can( 'edit_posts' ) ) {
$awaiting_mod = wp_count_comments(); $awaiting_mod = wp_count_comments();
$awaiting_mod = $awaiting_mod->moderated; $awaiting_mod = $awaiting_mod->moderated;
$menu[25] = array( $awaiting_mod_i18n = number_format_i18n( $awaiting_mod );
sprintf( __( 'Comments %s' ), '<span class="awaiting-mod count-' . absint( $awaiting_mod ) . '"><span class="pending-count">' . number_format_i18n( $awaiting_mod ) . '</span></span>' ), /* translators: %s: number of comments in moderation */
$awaiting_mod_text = sprintf( _n( '%s Comment in moderation', '%s Comments in moderation', $awaiting_mod ), $awaiting_mod_i18n );
$menu[25] = array(
/* translators: %s: number of comments in moderation */
sprintf( __( 'Comments %s' ), '<span class="awaiting-mod count-' . absint( $awaiting_mod ) . '"><span class="pending-count" aria-hidden="true">' . $awaiting_mod_i18n . '</span><span class="comments-in-moderation-text screen-reader-text">' . $awaiting_mod_text . '</span></span>' ),
'edit_posts', 'edit_posts',
'edit-comments.php', 'edit-comments.php',
'', '',
@ -214,6 +220,7 @@ if ( ! is_multisite() && current_user_can( 'update_plugins' ) ) {
$count = "<span class='update-plugins count-{$update_data['counts']['plugins']}'><span class='plugin-count'>" . number_format_i18n( $update_data['counts']['plugins'] ) . '</span></span>'; $count = "<span class='update-plugins count-{$update_data['counts']['plugins']}'><span class='plugin-count'>" . number_format_i18n( $update_data['counts']['plugins'] ) . '</span></span>';
} }
/* translators: %s: number of pending plugin updates */
$menu[65] = array( sprintf( __( 'Plugins %s' ), $count ), 'activate_plugins', 'plugins.php', '', 'menu-top menu-icon-plugins', 'menu-plugins', 'dashicons-admin-plugins' ); $menu[65] = array( sprintf( __( 'Plugins %s' ), $count ), 'activate_plugins', 'plugins.php', '', 'menu-top menu-icon-plugins', 'menu-plugins', 'dashicons-admin-plugins' );
$submenu['plugins.php'][5] = array( __( 'Installed Plugins' ), 'activate_plugins', 'plugins.php' ); $submenu['plugins.php'][5] = array( __( 'Installed Plugins' ), 'activate_plugins', 'plugins.php' );
@ -264,11 +271,14 @@ if ( ! is_multisite() && defined( 'WP_ALLOW_MULTISITE' ) && WP_ALLOW_MULTISITE )
} }
$change_notice = ''; $change_notice = '';
if ( current_user_can( 'manage_privacy_options' ) && WP_Privacy_Policy_Content::text_change_check() ) { if ( current_user_can( 'manage_privacy_options' ) && ! WP_Privacy_Policy_Content::text_change_check() ) {
$change_notice = ' <span class="update-plugins 1"><span class="plugin-count">' . number_format_i18n( 1 ) . '</span></span>'; $change_notice_number = number_format_i18n( 1 );
/* translators: %s: number of Privacy Policy update is always 1 */
$change_notice_text = sprintf( __( '%s Privacy Policy update' ), $change_notice_number );
$change_notice = '<span class="update-plugins 1"><span class="plugin-count" aria-hidden="true">' . $change_notice_number . '</span><span class="screen-reader-text">' . $change_notice_text . '</span></span>';
} }
// translators: %s is the update notification bubble, if updates are available. /* translators: %s: update notification bubble, if updates are available */
$menu[80] = array( sprintf( __( 'Settings %s' ), $change_notice ), 'manage_options', 'options-general.php', '', 'menu-top menu-icon-settings', 'menu-settings', 'dashicons-admin-settings' ); $menu[80] = array( sprintf( __( 'Settings %s' ), $change_notice ), 'manage_options', 'options-general.php', '', 'menu-top menu-icon-settings', 'menu-settings', 'dashicons-admin-settings' );
$submenu['options-general.php'][10] = array( _x( 'General', 'settings screen' ), 'manage_options', 'options-general.php' ); $submenu['options-general.php'][10] = array( _x( 'General', 'settings screen' ), 'manage_options', 'options-general.php' );
$submenu['options-general.php'][15] = array( __( 'Writing' ), 'manage_options', 'options-writing.php' ); $submenu['options-general.php'][15] = array( __( 'Writing' ), 'manage_options', 'options-writing.php' );
@ -276,7 +286,7 @@ $menu[80] = array( sprintf( __( 'Settings %s' ), $
$submenu['options-general.php'][25] = array( __( 'Discussion' ), 'manage_options', 'options-discussion.php' ); $submenu['options-general.php'][25] = array( __( 'Discussion' ), 'manage_options', 'options-discussion.php' );
$submenu['options-general.php'][30] = array( __( 'Media' ), 'manage_options', 'options-media.php' ); $submenu['options-general.php'][30] = array( __( 'Media' ), 'manage_options', 'options-media.php' );
$submenu['options-general.php'][40] = array( __( 'Permalinks' ), 'manage_options', 'options-permalink.php' ); $submenu['options-general.php'][40] = array( __( 'Permalinks' ), 'manage_options', 'options-permalink.php' );
// translators: %s is the update notification bubble, if updates are available. /* translators: %s: update notification bubble, if updates are available */
$submenu['options-general.php'][45] = array( sprintf( __( 'Privacy %s' ), $change_notice ), 'manage_privacy_options', 'privacy.php' ); $submenu['options-general.php'][45] = array( sprintf( __( 'Privacy %s' ), $change_notice ), 'manage_privacy_options', 'privacy.php' );
$_wp_last_utility_menu = 80; // The index of the last top-level menu in the utility menu group $_wp_last_utility_menu = 80; // The index of the last top-level menu in the utility menu group

View File

@ -885,11 +885,15 @@ function wp_admin_bar_comments_menu( $wp_admin_bar ) {
$awaiting_mod = wp_count_comments(); $awaiting_mod = wp_count_comments();
$awaiting_mod = $awaiting_mod->moderated; $awaiting_mod = $awaiting_mod->moderated;
$awaiting_text = sprintf( _n( '%s comment awaiting moderation', '%s comments awaiting moderation', $awaiting_mod ), number_format_i18n( $awaiting_mod ) ); $awaiting_text = sprintf(
/* translators: %s: number of comments in moderation */
_n( '%s Comment in moderation', '%s Comments in moderation', $awaiting_mod ),
number_format_i18n( $awaiting_mod )
);
$icon = '<span class="ab-icon"></span>'; $icon = '<span class="ab-icon"></span>';
$title = '<span class="ab-label awaiting-mod pending-count count-' . $awaiting_mod . '" aria-hidden="true">' . number_format_i18n( $awaiting_mod ) . '</span>'; $title = '<span class="ab-label awaiting-mod pending-count count-' . $awaiting_mod . '" aria-hidden="true">' . number_format_i18n( $awaiting_mod ) . '</span>';
$title .= '<span class="screen-reader-text">' . $awaiting_text . '</span>'; $title .= '<span class="screen-reader-text comments-in-moderation-text">' . $awaiting_text . '</span>';
$wp_admin_bar->add_menu( $wp_admin_bar->add_menu(
array( array(

View File

@ -13,7 +13,7 @@
* *
* @global string $wp_version * @global string $wp_version
*/ */
$wp_version = '5.2-alpha-44923'; $wp_version = '5.2-alpha-44924';
/** /**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema. * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.