MDL-64985 message: add better aria labels to the actions menu

Add better aria labels to the action menus in messaging, renaming
some labels and declaring it as a menu.
This commit is contained in:
Sara Arjona
2019-04-24 18:04:27 +02:00
parent 0f7c44657e
commit e2d400a136
5 changed files with 60 additions and 42 deletions
+4 -3
View File
@@ -27,7 +27,7 @@ $string['addcontact'] = 'Add contact';
$string['addcontactconfirm'] = 'Are you sure you want to add {$a} to your contacts?';
$string['addtoyourcontacts'] = 'Add to contacts';
$string['addtoyourcontactsandmessage'] = 'Add to contacts and message';
$string['addtofavourites'] = 'Star';
$string['addtofavourites'] = 'Star conversation';
$string['ago'] = '{$a} ago';
$string['allusers'] = 'All messages from all users';
$string['backto'] = 'Back to {$a}';
@@ -48,6 +48,7 @@ $string['contactblocked'] = 'Contact blocked';
$string['contactrequests'] = 'Contact requests';
$string['contactrequestsent'] = 'Contact request sent';
$string['contacts'] = 'Contacts';
$string['conversationactions'] = 'Conversation actions menu';
$string['decline'] = 'Decline';
$string['defaultmessageoutputs'] = 'Default message outputs';
$string['defaults'] = 'Defaults';
@@ -84,7 +85,7 @@ $string['groupmessages'] = 'Group';
$string['hidemessagewindow'] = 'Hide message window';
$string['hidenotificationwindow'] = 'Hide notification window';
$string['individualconversations'] = 'Private';
$string['info'] = 'Info';
$string['info'] = 'User info';
$string['isnotinyourcontacts'] = '{$a} is not in your contacts';
$string['loadmore'] = 'Load more';
$string['loggedin'] = 'Online';
@@ -203,7 +204,7 @@ $string['removecontact'] = 'Remove contact';
$string['removecontactconfirm'] = 'Are you sure you want to remove {$a} from your contacts?';
$string['removecoursefilter'] = 'Remove filter for course {$a}';
$string['removefromyourcontacts'] = 'Remove from contacts';
$string['removefromfavourites'] = 'Unstar';
$string['removefromfavourites'] = 'Unstar conversation';
$string['requirecontacttomessage'] = 'You need to request {$a} to add you as a contact to be able to message them.';
$string['requiresconfiguration'] = 'Requires configuration';
$string['searchforuser'] = 'Search for a user';
@@ -72,33 +72,39 @@
</a>
</div>
<div class="ml-auto dropdown">
<button class="btn btn-link btn-icon icon-size-3" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
{{#pix}} i/moremenu, core {{/pix}}
<button id="conversation-actions-menu-button" class="btn btn-link btn-icon icon-size-3" type="button"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
aria-label="{{#str}} conversationactions, core_message {{/str}}" aria-controls="conversation-actions-menu">
{{#pix}} i/moremenu, core {{/pix}}
</button>
<div class="dropdown-menu pull-right">
<a class="dropdown-item" href="#" data-action="view-contact">
<div id="conversation-actions-menu" class="dropdown-menu pull-right" role="menu"
aria-labelledby="conversation-actions-menu-button">
<a class="dropdown-item" href="#" data-action="view-contact" role="menuitem">
{{#str}} info, core_message {{/str}}
</a>
<a class="dropdown-item {{#isfavourite}}hidden{{/isfavourite}} {{^showfavourite}}hidden{{/showfavourite}}" href="#" data-action="confirm-favourite">
{{#str}} addtofavourites, core_message {{/str}}
<a class="dropdown-item {{#isfavourite}}hidden{{/isfavourite}} {{^showfavourite}}hidden{{/showfavourite}}" href="#"
data-action="confirm-favourite" role="menuitem">
{{#str}} addtofavourites, core_message {{/str}}
</a>
<a class="dropdown-item {{^isfavourite}}hidden{{/isfavourite}} {{^showfavourite}}hidden{{/showfavourite}}" href="#" data-action="confirm-unfavourite">
{{#str}} removefromfavourites, core_message {{/str}}
<a class="dropdown-item {{^isfavourite}}hidden{{/isfavourite}} {{^showfavourite}}hidden{{/showfavourite}}" href="#"
data-action="confirm-unfavourite" role="menuitem">
{{#str}} removefromfavourites, core_message {{/str}}
</a>
<a class="dropdown-item {{#isblocked}}hidden{{/isblocked}}" href="#" data-action="request-block">
<a class="dropdown-item {{#isblocked}}hidden{{/isblocked}}" href="#" data-action="request-block" role="menuitem">
{{#str}} blockuser, core_message {{/str}}
</a>
<a class="dropdown-item {{^isblocked}}hidden{{/isblocked}}" href="#" data-action="request-unblock">
<a class="dropdown-item {{^isblocked}}hidden{{/isblocked}}" href="#" data-action="request-unblock" role="menuitem">
{{#str}} unblockuser, core_message {{/str}}
</a>
<a class="dropdown-item" href="#" data-action="request-delete-conversation">
{{#str}} deleteconversation, core_message {{/str}}
</a>
<a class="dropdown-item {{#iscontact}}hidden{{/iscontact}}" href="#" data-action="request-add-contact">
<a class="dropdown-item {{#iscontact}}hidden{{/iscontact}}" href="#" data-action="request-add-contact" role="menuitem">
{{#str}} addtoyourcontacts, core_message {{/str}}
</a>
<a class="dropdown-item {{^iscontact}}hidden{{/iscontact}}" href="#" data-action="request-remove-contact">
{{#str}} removefromyourcontacts, core_message {{/str}}
<a class="dropdown-item {{^iscontact}}hidden{{/iscontact}}" href="#" data-action="request-remove-contact"
role="menuitem">
{{#str}} removefromyourcontacts, core_message {{/str}}
</a>
<a class="dropdown-item" href="#" data-action="request-delete-conversation" role="menuitem">
{{#str}} deleteconversation, core_message {{/str}}
</a>
</div>
</div>
@@ -66,18 +66,23 @@
</a>
</div>
<div class="ml-auto dropdown">
<button class="btn btn-link btn-icon icon-size-3" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
{{#pix}} i/moremenu, core {{/pix}}
<button id="conversation-actions-menu-button" class="btn btn-link btn-icon icon-size-3" type="button"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
aria-label="{{#str}} conversationactions, core_message {{/str}}" aria-controls="conversation-actions-menu">
{{#pix}} i/moremenu, core {{/pix}}
</button>
<div class="dropdown-menu pull-right">
<a class="dropdown-item" href="#" data-action="view-group-info">
<div id="conversation-actions-menu" class="dropdown-menu pull-right" role="menu"
aria-labelledby="conversation-actions-menu-button">
<a class="dropdown-item" href="#" data-action="view-group-info" role="menuitem">
{{#str}} groupinfo, core_message {{/str}}
</a>
<a class="dropdown-item {{#isfavourite}}hidden{{/isfavourite}}" href="#" data-action="confirm-favourite">
{{#str}} addtofavourites, core_message {{/str}}
<a class="dropdown-item {{#isfavourite}}hidden{{/isfavourite}}" href="#" data-action="confirm-favourite"
role="menuitem">
{{#str}} addtofavourites, core_message {{/str}}
</a>
<a class="dropdown-item {{^isfavourite}}hidden{{/isfavourite}}" href="#" data-action="confirm-unfavourite">
{{#str}} removefromfavourites, core_message {{/str}}
<a class="dropdown-item {{^isfavourite}}hidden{{/isfavourite}}" href="#" data-action="confirm-unfavourite"
role="menuitem">
{{#str}} removefromfavourites, core_message {{/str}}
</a>
</div>
</div>
@@ -77,47 +77,50 @@
</a>
</div>
<div class="ml-auto dropdown">
<button class="btn btn-link btn-icon icon-size-3" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<button id="conversation-actions-menu-button" class="btn btn-link btn-icon icon-size-3" type="button"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
aria-label="{{#str}} conversationactions, core_message {{/str}}" aria-controls="conversation-actions-menu">
{{#pix}} i/moremenu, core {{/pix}}
</button>
<ul class="dropdown-menu pull-right">
<ul id="conversation-actions-menu" class="dropdown-menu pull-right" role="menu"
aria-labelledby="conversation-actions-menu-button">
<li data-action="view-contact">
<a class="dropdown-item" href="#">
<a class="dropdown-item" href="#" role="menuitem">
{{#str}} info, core_message {{/str}}
</a>
</li>
<li class="{{#isfavourite}}hidden{{/isfavourite}} {{^showfavourite}}hidden{{/showfavourite}}" data-action="confirm-favourite">
<a class="dropdown-item" href="#">
<a class="dropdown-item" href="#" role="menuitem">
{{#str}} addtofavourites, core_message {{/str}}
</a>
</li>
<li class="{{^isfavourite}}hidden{{/isfavourite}} {{^showfavourite}}hidden{{/showfavourite}}" data-action="confirm-unfavourite">
<a class="dropdown-item " href="#">
<a class="dropdown-item " href="#" role="menuitem">
{{#str}} removefromfavourites, core_message {{/str}}
</a>
</li>
<li class="{{#isblocked}}hidden{{/isblocked}}" data-action="request-block">
<a class="dropdown-item" href="#">
<a class="dropdown-item" href="#" role="menuitem">
{{#str}} blockuser, core_message {{/str}}
</a>
</li>
<li class="{{^isblocked}}hidden{{/isblocked}}" data-action="request-unblock">
<a class="dropdown-item" href="#">
<a class="dropdown-item" href="#" role="menuitem">
{{#str}} unblockuser, core_message {{/str}}
</a>
</li>
<li data-action="request-delete-conversation">
<a class="dropdown-item" href="#">
<a class="dropdown-item" href="#" role="menuitem">
{{#str}} deleteconversation, core_message {{/str}}
</a>
</li>
<li class="{{#iscontact}}hidden{{/iscontact}}" data-action="request-add-contact">
<a class="dropdown-item" href="#">
<a class="dropdown-item" href="#" role="menuitem">
{{#str}} addtoyourcontacts, core_message {{/str}}
</a>
</li>
<li class="{{^iscontact}}hidden{{/iscontact}}" data-action="request-remove-contact">
<a class="dropdown-item" href="#">
<a class="dropdown-item" href="#" role="menuitem">
{{#str}} removefromyourcontacts, core_message {{/str}}
</a>
</li>
@@ -70,22 +70,25 @@
</a>
</div>
<div class="ml-auto dropdown">
<button class="btn btn-link btn-icon icon-size-3" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<button id="conversation-actions-menu-button" class="btn btn-link btn-icon icon-size-3" type="button"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
aria-label="{{#str}} conversationactions, core_message {{/str}}" aria-controls="conversation-actions-menu">
{{#pix}} i/moremenu, core {{/pix}}
</button>
<ul class="dropdown-menu pull-right">
<ul id="conversation-actions-menu" class="dropdown-menu pull-right" role="menu"
aria-labelledby="conversation-actions-menu-button">
<li data-action="view-group-info">
<a class="dropdown-item" href="#">
<a class="dropdown-item" href="#" role="menuitem">
{{#str}} groupinfo, core_message {{/str}}
</a>
</li>
<li class="{{#isfavourite}}hidden{{/isfavourite}}" data-action="confirm-favourite">
<a class="dropdown-item" href="#">
<a class="dropdown-item" href="#" role="menuitem">
{{#str}} addtofavourites, core_message {{/str}}
</a>
</li>
<li class="{{^isfavourite}}hidden{{/isfavourite}}" data-action="confirm-unfavourite">
<a class="dropdown-item" href="#">
<a class="dropdown-item" href="#" role="menuitem">
{{#str}} removefromfavourites, core_message {{/str}}
</a>
</li>