L-electron-Rare/moodle
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

MDL-65127 message: add aria-labels to the numbers in the overview

Browse Source 
Add aria-label to the unread message and notification icons.
Add aria-label to the total conversations, unread conversations
and unread messages in the overview.
Add aria-label to the pending contact requests in the overview
and also in the contacts tab.
Add aria-hidden to the last message date.
This commit is contained in:
Sara Arjona
2019-03-29 09:38:22 +01:00
parent 0920f35ed9
commit ccd4752356
12 changed files with 41 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lang/en/message.php
+5
View File
@@ -139,6 +139,7 @@ $string['online'] = 'Online';
$string['otherparticipants'] = 'Other participants';
$string['outputnotavailable'] = 'Not available';
$string['participants'] = 'Participants';
$string['pendingcontactrequests'] = 'There are {$a} pending contact requests';
$string['permitted'] = 'Permitted';
$string['privacy'] = 'Privacy';
$string['privacy_desc'] = 'You can restrict who can message you';
@@ -229,6 +230,7 @@ $string['shownotificationwindownonew'] = 'Show notification window with no new n
$string['shownotificationwindowwithcount'] = 'Show notification window with {$a} new notifications';
$string['togglenotificationmenu'] = 'Toggle notifications menu';
$string['togglemessagemenu'] = 'Toggle messaging drawer';
$string['totalconversations'] = '{$a} total conversations';
$string['touserdoesntexist'] = 'You can not send a message to a user id ({$a}) that doesn\'t exist';
$string['unabletomessage'] = 'You are unable to message this user';
$string['unblock'] = 'Unblock';
@@ -237,7 +239,10 @@ $string['unblockuser'] = 'Unblock user';
$string['unblockuserconfirm'] = 'Are you sure you want to unblock {$a}?';
$string['unknownuser'] = 'Unknown user';
$string['unmuteconversation'] = 'Unmute';
$string['unreadconversations'] = 'There are {$a} unread conversations';
$string['unreadmessages'] = 'There are {$a} unread messages';
$string['unreadnotification'] = 'Unread notification: {$a}';
$string['unreadnotifications'] = 'There are {$a} unread notifications';
$string['unreadnewgroupconversationmessage'] = 'New message from {$a->name} in {$a->conversationname}';
$string['unreadnewmessage'] = 'New message from {$a}';
$string['useentertosend'] = 'Use enter to send';
message/amd/build/message_drawer_view_overview_section.min.js
Vendored
+1 -1
View File
File diff suppressed because one or more lines are too long
message/amd/src/message_drawer_view_overview_section.js
+7
View File
@@ -116,6 +116,9 @@ function(
var countElement = container.find(SELECTORS.SECTION_TOTAL_COUNT);
countElement.text(count);
container.removeClass('hidden');
Str.get_string('totalconversations', 'core_message', count).done(function(string) {
container.attr('aria-label', string);
});
var numPlaceholders = count > 20 ? 20 : count;
// Array of "true" up to the number of placeholders we want.
@@ -146,6 +149,10 @@ function(
var countElement = root.find(SELECTORS.SECTION_UNREAD_COUNT);
countElement.text(count);
Str.get_string('unreadconversations', 'core_message', count).done(function(string) {
countElement.attr('aria-label', string);
});
if (count > 0) {
countElement.removeClass('hidden');
}
message/output/popup/templates/notification_popover.mustache
+2 -1
View File
@@ -45,7 +45,8 @@
{{$togglelabel}}{{#str}} shownotificationwindownonew, message {{/str}}{{/togglelabel}}
{{$togglecontent}}
{{#pix}} i/notifications, core, {{#str}} togglenotificationmenu, message {{/str}} {{/pix}}
<div class="count-container {{^unreadcount}}hidden{{/unreadcount}}" data-region="count-container">{{unreadcount}}</div>
<div class="count-container {{^unreadcount}}hidden{{/unreadcount}}" data-region="count-container"
aria-label="{{#str}} unreadnotifications, core_message, {{unreadcount}} {{/str}}">{{unreadcount}}</div>
{{/togglecontent}}
{{$containerlabel}}{{#str}} notificationwindow, message {{/str}}{{/containerlabel}}
message/templates/message_drawer_conversations_list.mustache
+2 -1
View File
@@ -83,7 +83,7 @@
<div class="d-flex align-self-stretch">
<div
class="px-2 py-1 small position-absolute position-right text-muted {{^lastmessagedate}}hidden{{/lastmessagedate}}"
data-region="last-message-date"
data-region="last-message-date" aria-hidden="true"
>
{{#lastmessagedate}}
{{#userdate}} {{.}}, {{#str}} strftimetime24, core_langconfig {{/str}} {{/userdate}}
@@ -93,6 +93,7 @@
<span
class="badge badge-pill badge-primary bg-primary {{^unreadcount}}hidden{{/unreadcount}}"
data-region="unread-count"
aria-label="{{#str}} unreadmessages, core_message, {{unreadcount}} {{/str}}"
>
{{unreadcount}}
</span>
message/templates/message_drawer_view_contacts_body.mustache
+3 -1
View File
@@ -64,7 +64,9 @@
aria-selected="false"
>
{{#str}} requests {{/str}}
<span class="badge bg-primary ml-2 {{^contactrequestcount}}hidden{{/contactrequestcount}}" data-region="contact-request-count">
<span class="badge bg-primary ml-2 {{^contactrequestcount}}hidden{{/contactrequestcount}}"
data-region="contact-request-count"
aria-label="{{#str}} pendingcontactrequests, core_message, {{contactrequestcount}} {{/str}}">
{{contactrequestcount}}
</span>
</a>
message/templates/message_drawer_view_overview_header.mustache
+3 -1
View File
@@ -63,7 +63,9 @@
<a href="#" data-route="view-contacts">
{{#pix}} i/user, core {{/pix}}
{{#str}} contacts, core_message {{/str}}
<span class="badge bg-primary ml-2 {{^contactrequestcount}}hidden{{/contactrequestcount}}" data-region="contact-request-count">
<span class="badge bg-primary ml-2 {{^contactrequestcount}}hidden{{/contactrequestcount}}"
data-region="contact-request-count"
aria-label="{{#str}} pendingcontactrequests, core_message, {{contactrequestcount}} {{/str}}">
{{contactrequestcount}}
</span>
</a>
message/templates/message_drawer_view_overview_section.mustache
+5 -2
View File
@@ -54,13 +54,16 @@
{{#pix}} t/expanded, core {{/pix}}
</span>
<span class="font-weight-bold">{{$title}}{{/title}}</span>
<small class="hidden ml-1" data-region="section-total-count-container">
<small class="hidden ml-1" data-region="section-total-count-container"
aria-label="{{#str}} totalconversations, core_message, {{count.total}} {{/str}}">
(<span data-region="section-total-count">{{count.total}}</span>)
</small>
<span class="hidden ml-2" data-region="loading-icon-container">
{{> core/loading }}
</span>
<span class="{{^count.unread}}hidden{{/count.unread}} badge badge-pill badge-primary ml-auto bg-primary" data-region="section-unread-count">
<span class="{{^count.unread}}hidden{{/count.unread}} badge badge-pill badge-primary ml-auto bg-primary"
data-region="section-unread-count"
{{#count.unread}}aria-label="{{#str}} unreadconversations, core_message, {{count.unread}} {{/str}}"{{/count.unread}}>
{{count.unread}}
</span>
</button>
message/templates/message_popover.mustache
+2 -1
View File
@@ -38,7 +38,8 @@
<div class="pull-right popover-region collapsed">
<a id="message-drawer-toggle-{{uniqid}}" class="nav-link d-inline-block popover-region-toggle position-relative" href="#">
{{#pix}} t/message, core, {{#str}} togglemessagemenu, message {{/str}} {{/pix}}
<div class="count-container {{^unreadcount}}hidden{{/unreadcount}}" data-region="count-container">{{unreadcount}}</div>
<div class="count-container {{^unreadcount}}hidden{{/unreadcount}}" data-region="count-container"
aria-label="{{#str}} unreadconversations, core_message, {{unreadcount}} {{/str}}">{{unreadcount}}</div>
</a>
</div>
theme/bootstrapbase/templates/core_message/message_drawer_view_contacts_body.mustache
+3 -1
View File
@@ -69,7 +69,9 @@
aria-selected="false"
>
{{#str}} requests {{/str}}
<span class="badge bg-primary ml-2 {{^contactrequestcount}}hidden{{/contactrequestcount}}" data-region="contact-request-count">
<span class="badge bg-primary ml-2 {{^contactrequestcount}}hidden{{/contactrequestcount}}"
data-region="contact-request-count"
aria-label="{{#str}} pendingcontactrequests, core_message, {{contactrequestcount}} {{/str}}">
{{contactrequestcount}}
</span>
</a>
theme/bootstrapbase/templates/core_message/message_drawer_view_overview_header.mustache
+3 -1
View File
@@ -66,7 +66,9 @@
<a href="#" data-route="view-contacts">
{{#pix}} i/user, core {{/pix}}
{{#str}} contacts, core_message {{/str}}
<span class="badge bg-primary ml-2 {{^contactrequestcount}}hidden{{/contactrequestcount}}" data-region="contact-request-count">
<span class="badge bg-primary ml-2 {{^contactrequestcount}}hidden{{/contactrequestcount}}"
data-region="contact-request-count"
aria-label="{{#str}} pendingcontactrequests, core_message, {{contactrequestcount}} {{/str}}">
{{contactrequestcount}}
</span>
</a>
theme/bootstrapbase/templates/core_message/message_drawer_view_overview_section.mustache
+5 -2
View File
@@ -61,13 +61,16 @@
{{#pix}} t/expanded, core {{/pix}}
</span>
<strong>{{$title}}{{/title}}</strong>
<small class="hidden ml-1" data-region="section-total-count-container">
<small class="hidden ml-1" data-region="section-total-count-container"
aria-label="{{#str}} totalconversations, core_message, {{count.total}} {{/str}}">
(<span data-region="section-total-count">{{count.total}}</span>)
</small>
<span class="hidden ml-2" data-region="loading-icon-container">
{{> core/loading }}
</span>
<span class="{{^count.unread}}hidden{{/count.unread}} badge badge-pill badge-primary ml-auto bg-primary" data-region="section-unread-count">
<span class="{{^count.unread}}hidden{{/count.unread}} badge badge-pill badge-primary ml-auto bg-primary"
data-region="section-unread-count"
{{#count.unread}}aria-label="{{#str}} unreadconversations, core_message, {{count.unread}} {{/str}}"{{/count.unread}}>
{{count.unread}}
</span>
</button>