From 01b2c8e34b29f8d37a6f1a43dca5a0a71fccb611 Mon Sep 17 00:00:00 2001 From: Andrea Fercia Date: Mon, 18 Mar 2019 15:21:17 +0000 Subject: [PATCH] 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. git-svn-id: https://develop.svn.wordpress.org/trunk@44924 602fd350-edb4-49c9-b593-d223f7449a82 --- src/js/_enqueues/admin/edit-comments.js | 60 ++++++++++++++++--------- src/wp-admin/css/admin-menu.css | 13 +++--- src/wp-admin/includes/ajax-actions.php | 28 +++++++----- src/wp-admin/includes/dashboard.php | 6 +-- src/wp-admin/menu.php | 26 +++++++---- src/wp-includes/admin-bar.php | 8 +++- 6 files changed, 89 insertions(+), 52 deletions(-) diff --git a/src/js/_enqueues/admin/edit-comments.js b/src/js/_enqueues/admin/edit-comments.js index fff7191a1a..62fd7fa7d0 100644 --- a/src/js/_enqueues/admin/edit-comments.js +++ b/src/js/_enqueues/admin/edit-comments.js @@ -7,7 +7,7 @@ (function($) { var getCount, updateCount, updateCountText, updatePending, updateApproved, - updateHtmlTitle, updateDashboardText, adminTitle = document.title, + updateHtmlTitle, updateDashboardText, updateInModerationText, adminTitle = document.title, isDashboard = $('#dashboard_right_now').length, 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 ) { return; } - var rightNow = $( '#dashboard_right_now' ); - - $( '.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' ); + $( '.comment-count a', '#dashboard_right_now' ).text( response.i18n_comments_text ); }; - 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; 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; if ( response ) { updateDashboardText( response.supplemental ); + updateInModerationText( response.supplemental ); updatePending( diff, response.supplemental.postId ); updateApproved( -1 * diff, response.supplemental.postId ); } else { @@ -318,13 +337,18 @@ window.setCommentsList = function() { 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' ), spammed = commentRow.hasClass( 'spam' ), trashed = commentRow.hasClass( 'trash' ), undoing = false; // ticket #35904 updateDashboardText( newTotal ); + updateInModerationText( newTotal ); // the order of these checks is important // .unspam can also have .approve or .unapprove @@ -508,7 +532,7 @@ window.setCommentsList = function() { refillTheExtraList(); animated = $( ':animated', '#the-comment-list' ); - animatedCallback = function () { + animatedCallback = function() { if ( ! $( '#the-comment-list tr:visible' ).length ) { 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() || ''; - - /* $(listTable).bind('beforeChangePage', function(){ - commentReply.close(); - }); */ }, addEvents : function(r) { @@ -843,12 +863,10 @@ window.commentReply = { } if ( r.supplemental.i18n_comments_text ) { - if ( isDashboard ) { - updateDashboardText( r.supplemental ); - } else { - updateApproved( 1, r.supplemental.parent_post_id ); - updateCountText( 'span.all-count', 1 ); - } + updateDashboardText( r.supplemental ); + updateInModerationText( r.supplemental ); + updateApproved( 1, r.supplemental.parent_post_id ); + updateCountText( 'span.all-count', 1 ); } c = $.trim(r.data); // Trim leading whitespaces diff --git a/src/wp-admin/css/admin-menu.css b/src/wp-admin/css/admin-menu.css index 182fd780f4..320d99f351 100644 --- a/src/wp-admin/css/admin-menu.css +++ b/src/wp-admin/css/admin-menu.css @@ -515,14 +515,15 @@ ul#adminmenu > li.current > a.current:after { #adminmenu .update-plugins { display: inline-block; vertical-align: top; - margin: 1px 0 0 2px; + box-sizing: border-box; + margin: 1px 0 -1px 2px; padding: 0 5px; - min-width: 7px; - height: 17px; - border-radius: 11px; + min-width: 18px; + height: 18px; + border-radius: 9px; background-color: #ca4a1f; color: #fff; - font-size: 9px; + font-size: 11px; line-height: 17px; text-align: center; z-index: 26; @@ -530,7 +531,7 @@ ul#adminmenu > li.current > a.current:after { #adminmenu li.current a .awaiting-mod, #adminmenu li a.wp-has-current-submenu .update-plugins { - background-color: #00b9eb; + background-color: #ca4a1f; color: #fff; } diff --git a/src/wp-admin/includes/ajax-actions.php b/src/wp-admin/includes/ajax-actions.php index 642d43d55e..ea5090b588 100644 --- a/src/wp-admin/includes/ajax-actions.php +++ b/src/wp-admin/includes/ajax-actions.php @@ -460,7 +460,7 @@ function _wp_ajax_delete_comment_response( $comment_id, $delta = -1 ) { ), 'i18n_moderation_text' => sprintf( /* 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 ) ), '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. $time = time(); $comment = get_comment( $comment_id ); + $counts = wp_count_comments(); $x = new WP_Ajax_Response( array( 'what' => 'comment', - // Here for completeness - not used. 'id' => $comment_id, 'supplemental' => array( - 'status' => $comment ? $comment->comment_approved : '', - 'postId' => $comment ? $comment->comment_post_ID : '', + 'status' => $comment ? $comment->comment_approved : '', + 'postId' => $comment ? $comment->comment_post_ID : '', /* translators: %s: number of comments */ - 'total_items_i18n' => sprintf( _n( '%s item', '%s items', $total ), number_format_i18n( $total ) ), - 'total_pages' => ceil( $total / $per_page ), - 'total_pages_i18n' => number_format_i18n( ceil( $total / $per_page ) ), - 'total' => $total, - 'time' => $time, + 'total_items_i18n' => sprintf( _n( '%s item', '%s items', $total ), number_format_i18n( $total ) ), + 'total_pages' => ceil( $total / $per_page ), + 'total_pages_i18n' => number_format_i18n( ceil( $total / $per_page ) ), + 'total' => $total, + '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 ) ), 'i18n_moderation_text' => sprintf( - /* translators: %s: number of comments moderated */ - _nx( '%s in moderation', '%s in moderation', $counts->moderated, 'comments' ), + /* translators: %s: number of comments in moderation */ + _n( '%s Comment in moderation', '%s Comments in moderation', $counts->moderated ), number_format_i18n( $counts->moderated ) ), ); diff --git a/src/wp-admin/includes/dashboard.php b/src/wp-admin/includes/dashboard.php index 63ee7d667b..e3160bb390 100644 --- a/src/wp-admin/includes/dashboard.php +++ b/src/wp-admin/includes/dashboard.php @@ -291,9 +291,7 @@ function wp_dashboard_right_now() { moderated ); /* translators: %s: number of comments in moderation */ - $text = sprintf( _nx( '%s in moderation', '%s in moderation', $num_comm->moderated, 'comments' ), $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 ); + $text = sprintf( _n( '%s Comment in moderation', '%s Comments in moderation', $num_comm->moderated ), $moderated_comments_count_i18n ); ?>
    • + "> " . number_format_i18n( $update_data['counts']['total'] ) . '' ), $cap, 'update-core.php' ); unset( $cap ); } @@ -74,10 +75,15 @@ $menu[15] = array( __( 'Links' ), 'manage_links', 'lin // Avoid the comment count query for users who cannot edit_posts. if ( current_user_can( 'edit_posts' ) ) { - $awaiting_mod = wp_count_comments(); - $awaiting_mod = $awaiting_mod->moderated; - $menu[25] = array( - sprintf( __( 'Comments %s' ), '' . number_format_i18n( $awaiting_mod ) . '' ), + $awaiting_mod = wp_count_comments(); + $awaiting_mod = $awaiting_mod->moderated; + $awaiting_mod_i18n = number_format_i18n( $awaiting_mod ); + /* 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' ), '' . $awaiting_mod_text . '' ), 'edit_posts', 'edit-comments.php', '', @@ -214,6 +220,7 @@ if ( ! is_multisite() && current_user_can( 'update_plugins' ) ) { $count = "" . number_format_i18n( $update_data['counts']['plugins'] ) . ''; } +/* 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' ); $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 = ''; -if ( current_user_can( 'manage_privacy_options' ) && WP_Privacy_Policy_Content::text_change_check() ) { - $change_notice = ' ' . number_format_i18n( 1 ) . ''; +if ( current_user_can( 'manage_privacy_options' ) && ! WP_Privacy_Policy_Content::text_change_check() ) { + $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 = '' . $change_notice_text . ''; } -// 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' ); $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' ); @@ -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'][30] = array( __( 'Media' ), 'manage_options', 'options-media.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' ); $_wp_last_utility_menu = 80; // The index of the last top-level menu in the utility menu group diff --git a/src/wp-includes/admin-bar.php b/src/wp-includes/admin-bar.php index 412d42f571..6511937c3b 100644 --- a/src/wp-includes/admin-bar.php +++ b/src/wp-includes/admin-bar.php @@ -885,11 +885,15 @@ function wp_admin_bar_comments_menu( $wp_admin_bar ) { $awaiting_mod = wp_count_comments(); $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 = ''; $title = ''; - $title .= '' . $awaiting_text . ''; + $title .= '' . $awaiting_text . ''; $wp_admin_bar->add_menu( array(