diff --git a/cms/static/js/views/components/add_xblock.js b/cms/static/js/views/components/add_xblock.js
index 8da194ce49f90a585ee881f528b856344f9f4e37..1479c07563114f584fd237ed32b2e15a8f11e980 100644
--- a/cms/static/js/views/components/add_xblock.js
+++ b/cms/static/js/views/components/add_xblock.js
@@ -2,8 +2,10 @@
* This is a simple component that renders add buttons for all available XBlock template types.
*/
define(['jquery', 'underscore', 'gettext', 'js/views/baseview', 'common/js/components/utils/view_utils',
- 'js/views/components/add_xblock_button', 'js/views/components/add_xblock_menu'],
- function($, _, gettext, BaseView, ViewUtils, AddXBlockButton, AddXBlockMenu) {
+ 'js/views/components/add_xblock_button', 'js/views/components/add_xblock_menu',
+ 'edx-ui-toolkit/js/utils/html-utils'],
+ function($, _, gettext, BaseView, ViewUtils, AddXBlockButton, AddXBlockMenu, HtmlUtils) {
+ 'use strict';
var AddXBlockComponent = BaseView.extend({
events: {
'click .new-component .new-component-type .multiple-templates': 'showComponentTemplates',
@@ -19,9 +21,10 @@ define(['jquery', 'underscore', 'gettext', 'js/views/baseview', 'common/js/compo
},
render: function() {
+ var that;
if (!this.$el.html()) {
- var that = this;
- this.$el.html(this.template({}));
+ that = this;
+ this.$el.html(HtmlUtils.HTML(this.template({})).toString());
this.collection.each(
function(componentModel) {
var view, menu;
@@ -47,6 +50,7 @@ define(['jquery', 'underscore', 'gettext', 'js/views/baseview', 'common/js/compo
},
closeNewComponent: function(event) {
+ var type;
event.preventDefault();
event.stopPropagation();
type = $(event.currentTarget).data('type');
diff --git a/cms/static/js/views/components/add_xblock_button.js b/cms/static/js/views/components/add_xblock_button.js
index aba7bd91b9d92c7fed83b8831f65cc4bed977eaa..e0c4cc522d2d741741e8aa94f8c616a2b1e79d11 100644
--- a/cms/static/js/views/components/add_xblock_button.js
+++ b/cms/static/js/views/components/add_xblock_button.js
@@ -1,16 +1,17 @@
-define(['js/views/baseview'],
- function(BaseView) {
+define(['js/views/baseview', 'edx-ui-toolkit/js/utils/html-utils'],
+ function(BaseView, HtmlUtils) {
+ 'use strict';
return BaseView.extend({
tagName: 'li',
initialize: function() {
+ var attributes = {
+ type: this.model.type,
+ templates: this.model.templates,
+ display_name: this.model.display_name
+ };
BaseView.prototype.initialize.call(this);
this.template = this.loadTemplate('add-xblock-component-button');
- this.$el.html(
- this.template({
- type: this.model.type,
- templates: this.model.templates,
- display_name: this.model.display_name
- })
+ this.$el.html(HtmlUtils.HTML(this.template(attributes)).toString()
);
}
});
diff --git a/cms/static/js/views/course_rerun.js b/cms/static/js/views/course_rerun.js
index ad904493523ffea6671e5327beb446f99452007e..f311ae10374e4a13d35aa3be85e5da78889640d5 100644
--- a/cms/static/js/views/course_rerun.js
+++ b/cms/static/js/views/course_rerun.js
@@ -1,5 +1,7 @@
-define(['domReady', 'jquery', 'underscore', 'js/views/utils/create_course_utils', 'common/js/components/utils/view_utils'],
- function(domReady, $, _, CreateCourseUtilsFactory, ViewUtils) {
+define(['domReady', 'jquery', 'underscore', 'js/views/utils/create_course_utils',
+ 'common/js/components/utils/view_utils', 'edx-ui-toolkit/js/utils/html-utils'],
+ function(domReady, $, _, CreateCourseUtilsFactory, ViewUtils, HtmlUtils) {
+ 'use strict';
var CreateCourseUtils = new CreateCourseUtilsFactory({
name: '.rerun-course-name',
org: '.rerun-course-org',
@@ -20,6 +22,7 @@ define(['domReady', 'jquery', 'underscore', 'js/views/utils/create_course_utils'
});
var saveRerunCourse = function(e) {
+ var courseInfo;
e.preventDefault();
if (CreateCourseUtils.hasInvalidRequiredFields()) {
@@ -32,7 +35,7 @@ define(['domReady', 'jquery', 'underscore', 'js/views/utils/create_course_utils'
var number = $newCourseForm.find('.rerun-course-number').val();
var run = $newCourseForm.find('.rerun-course-run').val();
- course_info = {
+ courseInfo = {
source_course_key: source_course_key,
org: org,
number: number,
@@ -40,18 +43,20 @@ define(['domReady', 'jquery', 'underscore', 'js/views/utils/create_course_utils'
run: run
};
- analytics.track('Reran a Course', course_info);
- CreateCourseUtils.create(course_info, function(errorMessage) {
+ analytics.track('Reran a Course', courseInfo); // eslint-disable-line no-undef
+ CreateCourseUtils.create(courseInfo, function(errorMessage) {
$('.wrapper-error').addClass('is-shown').removeClass('is-hidden');
- $('#course_rerun_error').html('<p>' + errorMessage + '</p>');
- $('.rerun-course-save').addClass('is-disabled').attr('aria-disabled', true).removeClass('is-processing').html(gettext('Create Re-run'));
+ $('#course_rerun_error').html(HtmlUtils.joinHtml(HtmlUtils.HTML('<p>'), errorMessage, HtmlUtils.HTML('</p>')).toString()); // eslint-disable-line max-len
+ $('.rerun-course-save').addClass('is-disabled').attr('aria-disabled', true)
+ .removeClass('is-processing')
+ .text(gettext('Create Re-run'));
$('.action-cancel').removeClass('is-hidden');
});
// Go into creating re-run state
- $('.rerun-course-save').addClass('is-disabled').attr('aria-disabled', true).addClass('is-processing').html(
- '<span class="icon fa fa-refresh fa-spin" aria-hidden="true"></span>' + gettext('Processing Re-run Request') // eslint-disable-line max-len
- );
+ $('.rerun-course-save').addClass('is-disabled').attr('aria-disabled', true)
+ .addClass('is-processing')
+ .html(HtmlUtils.joinHtml(HtmlUtils.HTML('<span class="icon fa fa-refresh fa-spin" aria-hidden="true"></span>'), gettext('Processing Re-run Request')).toString()); // eslint-disable-line max-len
$('.action-cancel').addClass('is-hidden');
};
diff --git a/cms/static/js/views/instructor_info.js b/cms/static/js/views/instructor_info.js
index 2c13b029bb3177b77c50c65b2a55a3b52d927464..8942569c27369d46baa523d4e16cd072c27bcbd3 100644
--- a/cms/static/js/views/instructor_info.js
+++ b/cms/static/js/views/instructor_info.js
@@ -7,9 +7,10 @@ define([
'gettext',
'js/utils/templates',
'js/models/uploads',
- 'js/views/uploads'
+ 'js/views/uploads',
+ 'edx-ui-toolkit/js/utils/html-utils'
],
- function($, _, Backbone, gettext, TemplateUtils, FileUploadModel, FileUploadDialog) {
+ function($, _, Backbone, gettext, TemplateUtils, FileUploadModel, FileUploadDialog, HtmlUtils) {
'use strict';
var InstructorInfoView = Backbone.View.extend({
@@ -31,14 +32,16 @@ define([
},
render: function() {
+ var attributes;
// Assemble the render view for this model.
$('.course-instructor-details-fields').empty();
var self = this;
$.each(this.model.get('instructor_info').instructors, function(index, data) {
- $(self.el).append(self.template({
+ attributes = {
data: data,
index: index
- }));
+ };
+ $(self.el).append(HtmlUtils.HTML(self.template(attributes)).toString());
});
// Avoid showing broken image on mistyped/nonexistent image
diff --git a/cms/static/js/views/list_item_editor.js b/cms/static/js/views/list_item_editor.js
index 4fae99dcf9aa874a77f4ed11f4fd79f6f42ee6f6..33321177895453c2e4e4dae08cb671a386fe1487 100644
--- a/cms/static/js/views/list_item_editor.js
+++ b/cms/static/js/views/list_item_editor.js
@@ -10,8 +10,9 @@
* saved by this view. Note this may be a parent model.
*/
define([
- 'js/views/baseview', 'common/js/components/utils/view_utils', 'underscore', 'gettext'
-], function(BaseView, ViewUtils, _, gettext) {
+ 'js/views/baseview', 'common/js/components/utils/view_utils', 'underscore', 'gettext',
+ 'edx-ui-toolkit/js/utils/html-utils'
+], function(BaseView, ViewUtils, _, gettext, HtmlUtils) {
'use strict';
var ListItemEditorView = BaseView.extend({
@@ -21,9 +22,11 @@ define([
},
render: function() {
- this.$el.html(this.template(_.extend({
+ var template = this.template(_.extend({
error: this.model.validationError || this.getSaveableModel().validationError
- }, this.getTemplateOptions())));
+ }, this.getTemplateOptions())
+ );
+ this.$el.html(HtmlUtils.HTML(template).toString());
},
setAndClose: function(event) {
diff --git a/cms/static/js/views/metadata.js b/cms/static/js/views/metadata.js
index dd28c066a7e937db1743101abe4a9c9a79ded92a..6bf30b3781f79837decfaceba3d3120e39e4bbc8 100644
--- a/cms/static/js/views/metadata.js
+++ b/cms/static/js/views/metadata.js
@@ -6,10 +6,11 @@ define(
'js/models/license', 'js/views/license',
'js/views/video/transcripts/utils',
'js/views/video/transcripts/metadata_videolist',
- 'js/views/video/translations_editor'
+ 'js/views/video/translations_editor',
+ 'edx-ui-toolkit/js/utils/html-utils'
],
function(Backbone, BaseView, _, MetadataModel, AbstractEditor, FileUpload, UploadDialog,
- LicenseModel, LicenseView, TranscriptUtils, VideoList, VideoTranslations) {
+ LicenseModel, LicenseView, TranscriptUtils, VideoList, VideoTranslations, HtmlUtils) {
'use strict';
var Metadata = {};
@@ -22,10 +23,11 @@ function(Backbone, BaseView, _, MetadataModel, AbstractEditor, FileUpload, Uploa
var self = this,
counter = 0,
locator = self.$el.closest('[data-locator]').data('locator'),
- courseKey = self.$el.closest('[data-course-key]').data('course-key');
+ courseKey = self.$el.closest('[data-course-key]').data('course-key'),
+ attributes = {numEntries: this.collection.length, locator: locator};
this.template = this.loadTemplate('metadata-editor');
- this.$el.html(this.template({numEntries: this.collection.length, locator: locator}));
+ this.$el.html(HtmlUtils.HTML(this.template(attributes)).toString());
this.collection.each(
function(model) {
@@ -323,12 +325,16 @@ function(Backbone, BaseView, _, MetadataModel, AbstractEditor, FileUpload, Uploa
list.empty();
_.each(value, function(ele, index) {
var template = _.template(
- '<li class="list-settings-item">' +
- '<input type="text" class="input" value="<%- ele %>">' +
- '<a href="#" class="remove-action remove-setting" data-index="<%- index %>"><span class="icon fa fa-times-circle" aria-hidden="true"></span><span class="sr">' + gettext('Remove') + '</span></a>' + // eslint-disable-line max-len
- '</li>'
+ HtmlUtils.joinHtml(
+ HtmlUtils.HTML('<li class="list-settings-item">'),
+ HtmlUtils.HTML('<input type="text" class="input" value="<%- ele %>">'),
+ HtmlUtils.HTML('<a href="#" class="remove-action remove-setting" data-index="<%- index %>"><span class="icon fa fa-times-circle" aria-hidden="true"></span><span class="sr">'), // eslint-disable-line max-len
+ gettext('Remove'),
+ HtmlUtils.HTML('</span></a>'),
+ HtmlUtils.HTML('</li>')
+ ).toString()
);
- list.append($(template({ele: ele, index: index})));
+ list.append(HtmlUtils.HTML($(template({ele: ele, index: index}))).toString());
});
},
@@ -489,16 +495,19 @@ function(Backbone, BaseView, _, MetadataModel, AbstractEditor, FileUpload, Uploa
_.each(value, function(value, key) {
var template = _.template(
- '<li class="list-settings-item">' +
- '<input type="text" class="input input-key" value="<%= key %>">' +
- '<input type="text" class="input input-value" value="<%= value %>">' +
- '<a href="#" class="remove-action remove-setting" data-value="<%= value %>"><span class="icon fa fa-times-circle" aria-hidden="true"></span><span class="sr">Remove</span></a>' + // eslint-disable-line max-len
- '</li>'
+ HtmlUtils.joinHtml(
+ HtmlUtils.HTML('<li class="list-settings-item">'),
+ HtmlUtils.HTML('<input type="text" class="input input-key" value="<%- key %>">'),
+ HtmlUtils.HTML('<input type="text" class="input input-value" value="<%- value %>">'),
+ HtmlUtils.HTML('<a href="#" class="remove-action remove-setting" data-value="<%- value %>"><span class="icon fa fa-times-circle" aria-hidden="true"></span><span class="sr">Remove</span></a>'), // eslint-disable-line max-len
+ HtmlUtils.HTML('</li>')
+ ).toString()
);
frag.appendChild($(template({key: key, value: value}))[0]);
});
+ // xss-lint: disable=javascript-jquery-html
list.html([frag]);
},
@@ -564,7 +573,7 @@ function(Backbone, BaseView, _, MetadataModel, AbstractEditor, FileUpload, Uploa
});
this.$('#' + this.uniqueId).val(value);
- this.$('.wrapper-uploader-actions').html(html);
+ this.$('.wrapper-uploader-actions').html(HtmlUtils.HTML((html)).toString());
},
upload: function(event) {
diff --git a/cms/static/js/views/video/translations_editor.js b/cms/static/js/views/video/translations_editor.js
index 9c82afa18025a5de479cf15426f3da1fe8c55994..9570cd3ad90e56cdc0818124ea8bf47c0e50cbde 100644
--- a/cms/static/js/views/video/translations_editor.js
+++ b/cms/static/js/views/video/translations_editor.js
@@ -127,17 +127,20 @@ function($, _, HtmlUtils, TranscriptUtils, AbstractEditor, ViewUtils, FileUpload
languageMap = TranscriptUtils.Storage.get('languageMap');
_.each(values, function(value, newLang) {
- var html = $(self.templateItem({
+ var $html = $(self.templateItem({
newLang: newLang,
originalLang: _.findKey(languageMap, function(lang) { return lang === newLang; }) || '',
value: value,
url: self.model.get('urlRoot')
- })).prepend(dropdown.clone().val(newLang))[0];
-
- frag.appendChild(html);
+ }));
+ HtmlUtils.append($html, dropdown.clone().val(newLang));
+ frag.appendChild($html[0]);
});
- this.$el.find('ol').html([frag]);
+ HtmlUtils.setHtml(
+ this.$el.find('ol'),
+ HtmlUtils.HTML([frag])
+ );
},
addEntry: function(event) {
diff --git a/cms/static/js/views/xblock_validation.js b/cms/static/js/views/xblock_validation.js
index e675b3e80fc0b4e4141663bcde619fbfd42286bc..437d7ecc055309e0473695c2ebbecb289fdc0ed9 100644
--- a/cms/static/js/views/xblock_validation.js
+++ b/cms/static/js/views/xblock_validation.js
@@ -1,5 +1,6 @@
-define(['jquery', 'underscore', 'js/views/baseview', 'gettext'],
- function($, _, BaseView, gettext) {
+define(['jquery', 'underscore', 'js/views/baseview', 'gettext', 'edx-ui-toolkit/js/utils/html-utils'],
+ function($, _, BaseView, gettext, HtmlUtils) {
+ 'use strict';
/**
* View for xblock validation messages as displayed in Studio.
*/
@@ -13,12 +14,13 @@ define(['jquery', 'underscore', 'js/views/baseview', 'gettext'],
},
render: function() {
- this.$el.html(this.template({
+ var attributes = {
validation: this.model,
additionalClasses: this.getAdditionalClasses(),
getIcon: this.getIcon.bind(this),
getDisplayName: this.getDisplayName.bind(this)
- }));
+ };
+ this.$el.html(HtmlUtils.HTML(this.template(attributes)).toString());
return this;
},