Andal.LND/edx-platform
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added time zone field to user account settings, currently hidden behind a feature flag.

Browse Source
This commit is contained in:
Kevin Kim
2016-06-06 14:24:18 +00:00
parent 1d09f78742
commit 059985b9ec
20 changed files with 227 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
lms/static/js/views/fields.js
View File

@@ -2,13 +2,14 @@
'use strict';
define([
'gettext', 'jquery', 'underscore', 'backbone',
'edx-ui-toolkit/js/utils/html-utils',
'text!templates/fields/field_readonly.underscore',
'text!templates/fields/field_dropdown.underscore',
'text!templates/fields/field_link.underscore',
'text!templates/fields/field_text.underscore',
'text!templates/fields/field_textarea.underscore',
'backbone-super'
], function (gettext, $, _, Backbone,
], function (gettext, $, _, Backbone, HtmlUtils,
field_readonly_template,
field_dropdown_template,
field_link_template,
@@ -30,12 +31,36 @@
tagName: 'div',
indicators: {
'canEdit': '<span class="icon fa fa-pencil message-can-edit" aria-hidden="true"></span><span class="sr">' + gettext("Editable") + '</span>', // jshint ignore:line
'error': '<span class="fa fa-exclamation-triangle message-error" aria-hidden="true"></span><span class="sr">' + gettext("Error") + '</span>', // jshint ignore:line
'validationError': '<span class="fa fa-exclamation-triangle message-validation-error" aria-hidden="true"></span><span class="sr">' + gettext("Validation Error") + '</span>', // jshint ignore:line
'inProgress': '<span class="fa fa-spinner fa-pulse message-in-progress" aria-hidden="true"></span><span class="sr">' + gettext("In Progress") + '</span>', // jshint ignore:line
'success': '<span class="fa fa-check message-success" aria-hidden="true"></span><span class="sr">' + gettext("Success") + '</span>', // jshint ignore:line
'plus': '<span class="fa fa-plus placeholder" aria-hidden="true"></span><span class="sr">' + gettext("Placeholder")+ '</span>' // jshint ignore:line
'canEdit': HtmlUtils.joinHtml(
HtmlUtils.HTML('<span class="icon fa fa-pencil message-can-edit" aria-hidden="true"></span><span class="sr">'), // jshint ignore:line
gettext("Editable"),
HtmlUtils.HTML('</span>')
),
'error': HtmlUtils.joinHtml(
HtmlUtils.HTML('<span class="fa fa-exclamation-triangle message-error" aria-hidden="true"></span><span class="sr">'), // jshint ignore:line
gettext("Error"),
HtmlUtils.HTML('</span>')
),
'validationError': HtmlUtils.joinHtml(
HtmlUtils.HTML('<span class="fa fa-exclamation-triangle message-validation-error" aria-hidden="true"></span><span class="sr">'), // jshint ignore:line
gettext("Validation Error"),
HtmlUtils.HTML('</span>')
),
'inProgress': HtmlUtils.joinHtml(
HtmlUtils.HTML('<span class="fa fa-spinner fa-pulse message-in-progress" aria-hidden="true"></span><span class="sr">'), // jshint ignore:line
gettext("In Progress"),
HtmlUtils.HTML('</span>')
),
'success': HtmlUtils.joinHtml(
HtmlUtils.HTML('<span class="fa fa-check message-success" aria-hidden="true"></span><span class="sr">'), // jshint ignore:line
gettext("Success"),
HtmlUtils.HTML('</span>')
),
'plus': HtmlUtils.joinHtml(
HtmlUtils.HTML('<span class="fa fa-plus placeholder" aria-hidden="true"></span><span class="sr">'),
gettext("Placeholder"),
HtmlUtils.HTML('</span>')
)
},
messages: {
@@ -57,6 +82,7 @@
this.helpMessage = this.options.helpMessage || '';
this.showMessages = _.isUndefined(this.options.showMessages) ? true : this.options.showMessages;
this.enabled = _.isUndefined(this.options.enabled) ? true: this.options.enabled;
_.bindAll(this, 'modelValue', 'modelValueIsSet', 'showNotificationMessage','getNotificationMessage',
'getMessage', 'title', 'showHelpMessage', 'showInProgressMessage', 'showSuccessMessage',
@@ -73,14 +99,14 @@
},
title: function (text) {
return this.$('.u-field-title').html(text);
return this.$('.u-field-title').text(text);
},
getMessage: function(message_status) {
if ((message_status + 'Message') in this) {
return this[message_status + 'Message'].call(this);
} else if (this.showMessages) {
return this.indicators[message_status] + this.messages[message_status];
return HtmlUtils.joinHtml(this.indicators[message_status], this.messages[message_status]);
}
return this.indicators[message_status];
},
@@ -90,16 +116,16 @@
message = this.helpMessage;
}
this.$('.u-field-message-notification').html('');
this.$('.u-field-message-help').html(message);
HtmlUtils.setHtml(this.$('.u-field-message-help'), message);
},
getNotificationMessage: function() {
return this.$('.u-field-message-notification').html();
return HtmlUtils.HTML(this.$('.u-field-message-notification').html());
},
showNotificationMessage: function(message) {
this.$('.u-field-message-help').html('');
this.$('.u-field-message-notification').html(message);
HtmlUtils.setHtml(this.$('.u-field-message-notification'), message);
},
showCanEditMessage: function(show) {
@@ -128,7 +154,8 @@
this.lastSuccessMessageContext = context;
setTimeout(function () {
if ((context === view.lastSuccessMessageContext) && (view.getNotificationMessage() === successMessage)) {
if ((context === view.lastSuccessMessageContext) &&
(view.getNotificationMessage().toString() === successMessage.toString())) {
if (view.editable === 'toggle') {
view.showCanEditMessage(true);
} else {
@@ -142,10 +169,8 @@
if (xhr.status === 400) {
try {
var errors = JSON.parse(xhr.responseText),
validationErrorMessage = _.escape(
errors.field_errors[this.options.valueAttribute].user_message
),
message = this.indicators.validationError + validationErrorMessage;
validationErrorMessage = errors.field_errors[this.options.valueAttribute].user_message,
message = HtmlUtils.joinHtml(this.indicators.validationError, validationErrorMessage);
this.showNotificationMessage(message);
} catch (error) {
this.showNotificationMessage(this.getMessage('error'));
@@ -271,7 +296,7 @@
},
render: function () {
this.$el.html(this.template({
HtmlUtils.setHtml(this.$el, HtmlUtils.template(this.fieldTemplate)({
id: this.options.valueAttribute,
title: this.options.title,
screenReaderTitle: this.options.screenReaderTitle || this.options.title,
@@ -287,7 +312,7 @@
},
updateValueInField: function () {
this.$('.u-field-value ').html(_.escape(this.modelValue()));
this.$('.u-field-value ').text(this.modelValue());
}
});
@@ -308,7 +333,7 @@
},
render: function () {
this.$el.html(this.template({
HtmlUtils.setHtml(this.$el, HtmlUtils.template(this.fieldTemplate)({
id: this.options.valueAttribute,
title: this.options.title,
value: this.modelValue(),
@@ -354,7 +379,7 @@
},
render: function () {
this.$el.html(this.template({
HtmlUtils.setHtml(this.$el, HtmlUtils.template(this.fieldTemplate)({
id: this.options.valueAttribute,
mode: this.mode,
editable: this.editable,
@@ -418,7 +443,7 @@
value = this.options.placeholderValue || '';
}
this.$('.u-field-value').attr('aria-label', this.options.title);
this.$('.u-field-value-readonly').html(_.escape(value));
this.$('.u-field-value-readonly').text(value);
if (this.mode === 'display') {
this.updateDisplayModeClass();
@@ -492,7 +517,7 @@
if (this.mode === 'display') {
value = value || this.options.placeholderValue;
}
this.$el.html(this.template({
HtmlUtils.setHtml(this.$el, HtmlUtils.template(this.fieldTemplate)({
id: this.options.valueAttribute,
screenReaderTitle: this.options.screenReaderTitle || this.options.title,
mode: this.mode,
@@ -587,7 +612,7 @@
},
render: function () {
this.$el.html(this.template({
HtmlUtils.setHtml(this.$el, HtmlUtils.template(this.fieldTemplate)({
id: this.options.valueAttribute,
title: this.options.title,
screenReaderTitle: this.options.screenReaderTitle || this.options.title,