mirror_php/moodle
1
0
Fork 0
mirror of https://github.com/moodle/moodle.git synced 2025-04-22 17:02:03 +02:00
Code Issues Projects Releases Wiki Activity

MDL-56431 messaging: Adding access to messaging.

Browse Source 
This adds the most crucial elements needed for making
the messaging page accessible. There are still some other
areas that need addressing.
This commit is contained in:
Adrian Greeve 2016-11-16 14:02:40 +08:00 committed by Dan Poltawski
parent 19d8b0f9e1
commit d14207fd25
15 changed files with 65 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
lang/en/message.php
View File

@ -29,15 +29,18 @@ $string['allusers'] = 'All messages from all users';
$string['backupmessageshelp'] = 'If enabled, then instant messages will be included in SITE automated backups';
$string['blockcontact'] = 'Block contact';
$string['blocknoncontacts'] = 'Prevent non-contacts from messaging me';
$string['canceledit'] = 'Cancel editing messages';
$string['contactblocked'] = 'Contact blocked';
$string['contacts'] = 'Contacts';
$string['defaultmessageoutputs'] = 'Default message outputs';
$string['defaults'] = 'Defaults';
$string['deleteallconfirm'] = "Are you sure you would like to delete this entire conversation?";
$string['deleteallmessages'] = "Delete all messages";
$string['deleteselectedmessages'] = 'Delete selected messages';
$string['disableall'] = 'Disable notifications';
$string['disabled'] = 'Messaging is disabled on this site';
$string['disallowed'] = 'Disallowed';
$string['editmessages'] = 'Edit messages';
$string['emailtagline'] = 'This is a copy of a message sent to you at "{$a->sitename}". Go to {$a->url} to reply.';
$string['enabled'] = 'Enabled';
$string['errorcallingprocessor'] = 'Error calling defined output';

2
message/amd/build/message_area_contacts.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
message/amd/build/message_area_messages.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
message/amd/build/message_area_search.min.js vendored
View File

File diff suppressed because one or more lines are too long

36
message/amd/src/message_area_contacts.js
View File

@ -32,6 +32,7 @@ define(['jquery', 'core/ajax', 'core/templates', 'core/notification', 'core/cust
CONTACTS: "[data-region='contacts'][data-region-content='contacts']",
CONTACTSAREA: "[data-region='contacts-area']",
CONVERSATIONS: "[data-region='contacts'][data-region-content='conversations']",
COURSE: "[data-region='course']",
LASTMESSAGETEXT: "[data-region='last-message-text']",
LASTMESSAGEUSER: "[data-region='last-message-user']",
LOADINGICON: '.loading-icon',
@ -134,6 +135,9 @@ define(['jquery', 'core/ajax', 'core/templates', 'core/notification', 'core/cust
this.messageArea.onDelegateEvent(CustomEvents.events.down, SELECTORS.VIEWCONVERSATION,
this._selectNextConversation.bind(this));
this.messageArea.onDelegateEvent(CustomEvents.events.up, SELECTORS.COURSE, this._selectPreviousCourse.bind());
this.messageArea.onDelegateEvent(CustomEvents.events.down, SELECTORS.COURSE, this._selectNextCourse.bind());
this.messageArea.onDelegateEvent('focus', SELECTORS.SEARCHBOX, this._setSearching.bind(this));
this.messageArea.onDelegateEvent('blur', SELECTORS.SEARCHBOX, this._clearSearching.bind(this));
@ -536,10 +540,10 @@ define(['jquery', 'core/ajax', 'core/templates', 'core/notification', 'core/cust
Contacts.prototype._setSelectedUser = function(selector) {
// Remove the 'selected' class from any other contact.
this.messageArea.find(SELECTORS.CONTACT).removeClass('selected');
this.messageArea.find(SELECTORS.CONTACT).removeAttr('tabindex');
this.messageArea.find(SELECTORS.CONTACT).attr('aria-pressed', false);
// Set the tab for the user to selected.
this.messageArea.find(SELECTORS.CONTACT + selector).addClass('selected');
this.messageArea.find(SELECTORS.CONTACT + selector).attr('tabIndex', 0);
this.messageArea.find(SELECTORS.CONTACT + selector).attr('aria-pressed', true);
};
/**
@ -614,6 +618,34 @@ define(['jquery', 'core/ajax', 'core/templates', 'core/notification', 'core/cust
data.originalEvent.stopPropagation();
};
/**
* Shifts focus to the next course in the list.
*
* @param {event} e The jquery event
* @param {object} data Additional event data
*/
Contacts.prototype._selectNextCourse = function(e, data) {
var course = $(e.target).closest(SELECTORS.COURSE);
course.next().focus();
data.originalEvent.preventDefault();
data.originalEvent.stopPropagation();
};
/**
* Shifts focus to the previous course in the list.
*
* @param {event} e The jquery event
* @param {object} data Additional event data
*/
Contacts.prototype._selectPreviousCourse = function(e, data) {
var course = $(e.target).closest(SELECTORS.COURSE);
course.prev().focus();
data.originalEvent.preventDefault();
data.originalEvent.stopPropagation();
};
/**
* Shifts focus to the next conversation in the list.
*

5
message/amd/src/message_area_messages.js
View File

@ -38,6 +38,7 @@ define(['jquery', 'core/ajax', 'core/templates', 'core/notification', 'core/cust
BLOCKTIME: "[data-region='blocktime']",
CANCELDELETEMESSAGES: "[data-action='cancel-delete-messages']",
CONTACT: "[data-region='contact']",
CONTACTPROFILE: "[data-action='view-contact-profile']",
CONVERSATIONS: "[data-region='contacts'][data-region-content='conversations']",
DELETEALLMESSAGES: "[data-action='delete-all-messages']",
DELETEMESSAGES: "[data-action='delete-messages']",
@ -50,7 +51,7 @@ define(['jquery', 'core/ajax', 'core/templates', 'core/notification', 'core/cust
SENDMESSAGE: "[data-action='send-message']",
SENDMESSAGETEXT: "[data-region='send-message-txt']",
SHOWCONTACTS: "[data-action='show-contacts']",
STARTDELETEMESSAGES: "[data-action='start-delete-messages']"
STARTDELETEMESSAGES: "[data-action='start-delete-messages']",
};
/** @type {int} The number of milliseconds in a second. */
@ -207,6 +208,7 @@ define(['jquery', 'core/ajax', 'core/templates', 'core/notification', 'core/cust
this._addScrollEventListener(numberreceived);
// Restart the poll timer.
this._backoffTimer.restart();
this.messageArea.find(SELECTORS.CONTACTPROFILE).focus();
}.bind(this)).fail(Notification.exception);
};
@ -447,6 +449,7 @@ define(['jquery', 'core/ajax', 'core/templates', 'core/notification', 'core/cust
this._isSendingMessage = false;
}.bind(this)).always(function() {
element.prop('disabled', false);
element.focus();
}).fail(Notification.exception);
};

8
message/amd/src/message_area_search.js
View File

@ -30,7 +30,7 @@ define(['jquery', 'core/ajax', 'core/templates', 'core/notification', 'core/str'
CONTACTS: "[data-region='contacts'][data-region-content='contacts']",
CONTACTSAREA: "[data-region='contacts-area']",
CONVERSATIONS: "[data-region='contacts'][data-region-content='conversations']",
DELETESEARCHFILTER: "[data-action='search-filter-delete']",
DELETESEARCHFILTER: "[data-region='search-filter-area']",
LOADINGICON: '.loading-icon',
SEARCHBOX: "[data-region='search-box']",
SEARCHFILTER: "[data-region='search-filter']",
@ -94,23 +94,25 @@ define(['jquery', 'core/ajax', 'core/templates', 'core/notification', 'core/str'
this.messageArea.find(SELECTORS.SEARCHTEXTAREA).on('input', this._searchRequest.bind(this));
// Handle clicking on a course in the list of users.
this.messageArea.onDelegateEvent('click', SELECTORS.SEARCHUSERSINCOURSE, function(e) {
this.messageArea.onDelegateEvent(CustomEvents.events.activate, SELECTORS.SEARCHUSERSINCOURSE, function(e) {
this._setFilter($(e.currentTarget).html());
this._setPlaceholderText('searchforuser');
this._clearSearchArea();
this._searchArea = this._searchAreas.USERSINCOURSE;
this._courseid = $(e.currentTarget).data('courseid');
this._searchUsersInCourse();
this.messageArea.find(SELECTORS.SEARCHBOX).focus();
}.bind(this));
// Handle deleting the search filter.
this.messageArea.onDelegateEvent('click', SELECTORS.DELETESEARCHFILTER, function() {
this.messageArea.onDelegateEvent(CustomEvents.events.activate, SELECTORS.DELETESEARCHFILTER, function() {
this._hideSearchResults();
// Filter has been removed, so we don't want to be searching in a course anymore.
this._searchArea = this._searchAreas.USERS;
this._setPlaceholderText('searchforuserorcourse');
// Go back the contacts.
this.messageArea.trigger(Events.USERSSEARCHCANCELED);
this.messageArea.find(SELECTORS.SEARCHBOX).focus();
}.bind(this));
// Handle events that occur outside this module.

3
message/templates/message_area_contact.mustache
View File

@ -16,7 +16,8 @@
}}
<div class="contact {{#selected}}selected{{/selected}} {{#lastmessage}}{{^isread}}unread{{/isread}}{{/lastmessage}}"
data-action="view-contact-msg"
data-userid="{{userid}}" data-messageid="{{#messageid}}{{.}}{{isread}}{{/messageid}}" data-region="contact" tabindex="0">
data-userid="{{userid}}" data-messageid="{{#messageid}}{{.}}{{isread}}{{/messageid}}" data-region="contact" role="button"
aria-pressed="{{#selected}}true{{/selected}}{{^selected}}false{{/selected}}" tabindex="0">
<div class="picture">
<img src="{{profileimageurl}}" alt="" />
</div>

4
message/templates/message_area_contacts_area.mustache
View File

@ -17,7 +17,7 @@
<div class="searchtextarea" data-region="search-text-area">
<label class="accesshide" for="searchtext">{{#str}}search{{/str}}</label>
<input data-region="search-box" type="text" id="searchtext" placeholder="{{#contactsfirst}} {{#str}}searchforuserorcourse, message{{/str}} {{/contactsfirst}} {{^contactsfirst}} {{#str}}searchmessages, message{{/str}} {{/contactsfirst}}">
<div data-region="search-filter-area" class="searchfilterarea" style="display:none">
<div data-region="search-filter-area" class="searchfilterarea" style="display:none" role="button" tabindex="0">
<div data-region="search-filter" class="searchfilter"></div>
<div data-action="search-filter-delete" class="searchfilterdelete">{{#pix}}t/delete{{/pix}}</div>
</div>
@ -36,7 +36,7 @@
{{/contactsfirst}}
{{! Hidden divs to load the other tab and search panels via JS when appropriate. }}
<div class="contacts searcharea" data-region="search-results-area" style="display:none;"></div>
<div class="tabs">
<div class="tabs" role="tablist">
<div class="tab tabconversations {{^contactsfirst}}selected{{/contactsfirst}} " data-action="conversations-view" role="tab" aria-controls="conversations-tab-panel" aria-selected="{{^contactsfirst}}true{{/contactsfirst}}{{#contactsfirst}}false{{/contactsfirst}}" tabindex="0">
<div class="tabimage">{{#pix}}t/message, moodle{{/pix}}</div>
<div>{{#str}}messages, message{{/str}}</div>

10
message/templates/message_area_messages_area.mustache
View File

@ -51,7 +51,9 @@
<button class="btn btn-link" data-action="show-contacts">&lt; {{#str}} messages, message {{/str}}</button>
</div>
<div class="delete-all btn-container">
<button class="btn btn-link" data-action="delete-all-messages">{{#str}} deleteall {{/str}}</button>
<button class="btn btn-link" data-action="delete-all-messages" aria-label="{{#str}} deleteallmessages, message {{/str}}">
{{#str}} deleteall {{/str}}
</button>
</div>
<div class="name-container">
<div class="name">
@ -71,8 +73,10 @@
{{#str}} selectmessagestodelete, message {{/str}}
</div>
<div class="actions" data-region="messages-header-actions">
<button class="btn btn-link messages-delete" data-action="start-delete-messages">{{#str}}edit{{/str}}</button>
<button class="btn btn-link cancel-messages-delete" data-action="cancel-delete-messages">{{#str}}cancel{{/str}}</button>
<button class="btn btn-link messages-delete" data-action="start-delete-messages"
aria-label="{{#str}} editmessages, message {{/str}}">{{#str}}edit{{/str}}</button>
<button class="btn btn-link cancel-messages-delete" data-action="cancel-delete-messages"
aria-label="{{#str}} canceledit, message {{/str}}">{{#str}}cancel{{/str}}</button>
</div>
</div>
{{/otheruserid}}

1
message/templates/message_area_response.mustache
View File

@ -19,6 +19,7 @@
rows="1"
data-auto-rows
data-max-rows="5"
aria-label="{{#str}} writeamessage, message {{/str}}"
placeholder="{{#str}} writeamessage, message {{/str}}"></textarea>
</div>
<div class="send-button-container">

2
message/templates/message_area_user_search_results.mustache
View File

@ -22,7 +22,7 @@
{{#hascourses}}
<div class="heading">{{#str}}courses{{/str}}</div>
{{#courses}}
<div class="course" data-action="search-users-in-course" data-courseid="{{id}}">
<div class="course" data-action="search-users-in-course" data-courseid="{{id}}" data-region="course" role="button" tabindex="0">
{{fullname}}
</div>
{{/courses}}

2
theme/boost/scss/moodle/message.scss
View File

@ -113,6 +113,7 @@
.searchfilterarea {
line-height: 20px;
cursor: pointer;
.searchfilter {
float: left;
@ -121,7 +122,6 @@
.searchfilterdelete {
float: left;
margin-left: 5px;
cursor: pointer;
}
}
}

2
theme/bootstrapbase/less/moodle/message.less
View File

@ -105,6 +105,7 @@
.searchfilterarea {
line-height: 20px;
cursor: pointer;
.searchfilter {
float: left;
@ -113,7 +114,6 @@
.searchfilterdelete {
float: left;
margin-left: 5px;
cursor: pointer;
}
}
}

2
theme/bootstrapbase/style/moodle.css
View File

@ -5901,6 +5901,7 @@ a.ygtvspacer:hover {
}
.messaging-area-container .messaging-area .contacts-area .searchtextarea .searchfilterarea {
line-height: 20px;
cursor: pointer;
}
.messaging-area-container .messaging-area .contacts-area .searchtextarea .searchfilterarea .searchfilter {
float: left;
@ -5908,7 +5909,6 @@ a.ygtvspacer:hover {
.messaging-area-container .messaging-area .contacts-area .searchtextarea .searchfilterarea .searchfilterdelete {
float: left;
margin-left: 5px;
cursor: pointer;
}
.messaging-area-container .messaging-area .contacts-area .searcharea .heading {
text-align: center;