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

Fix duplicate save and cancel buttons in Studio

Browse Source 
STUD-1531

Also add support for refreshing the modal on custom save
This commit is contained in:
Andy Armstrong
2014-04-14 11:40:02 -04:00
parent b95b595e6b
commit a3b2809601
21 changed files with 277 additions and 192 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
cms/static/js/views/modals/base_modal.js
View File

@@ -71,8 +71,10 @@ define(["jquery", "underscore", "gettext", "js/views/baseview"],
},
cancel: function(event) {
event.preventDefault();
event.stopPropagation(); // Make sure parent modals don't see the click
if (event) {
event.preventDefault();
event.stopPropagation(); // Make sure parent modals don't see the click
}
this.hide();
},
@@ -98,7 +100,21 @@ define(["jquery", "underscore", "gettext", "js/views/baseview"],
name: name,
isPrimary: isPrimary
});
this.$('.modal-actions ul').append(html);
this.getActionBar().find('ul').append(html);
},
/**
* Returns the action bar that contains the modal's action buttons.
*/
getActionBar: function() {
return this.$('.modal-window > div > .modal-actions');
},
/**
* Returns the action button of the specified type.
*/
getActionButton: function(type) {
return this.getActionBar().find('.action-' + type);
},
resize: function() {

58
cms/static/js/views/modals/edit_xblock.js
View File

@@ -37,6 +37,10 @@ define(["jquery", "underscore", "gettext", "js/views/modals/base_modal",
this.editOptions = options;
this.render();
this.show();
// Hide the action bar until we know which buttons we want
this.getActionBar().hide();
// Display the xblock after the modal is shown as there are some xblocks
// that depend upon being visible when they initialize, e.g. the problem xmodule.
this.displayXBlock();
@@ -60,7 +64,17 @@ define(["jquery", "underscore", "gettext", "js/views/modals/base_modal",
onDisplayXBlock: function() {
var editorView = this.editorView,
title = this.getTitle();
title = this.getTitle(),
xblock = editorView.xblock,
runtime = xblock.runtime;
// Notify the runtime that the modal has been shown
if (runtime) {
this.runtime = runtime;
runtime.notify("edit-modal-shown", this);
}
// Update the modal's header
if (editorView.hasCustomTabs()) {
// Hide the modal's header as the custom editor provides its own
this.$('.modal-header').hide();
@@ -74,9 +88,28 @@ define(["jquery", "underscore", "gettext", "js/views/modals/base_modal",
this.selectMode(editorView.mode);
}
}
// If the xblock is not using custom buttons then choose which buttons to show
if (!editorView.hasCustomButtons()) {
// If the xblock does not support save then disable the save button
if (!xblock.save) {
this.disableSave();
}
this.getActionBar().show();
}
// Resize the modal to fit the window
this.resize();
},
disableSave: function() {
var saveButton = this.getActionButton('save'),
cancelButton = this.getActionButton('cancel');
saveButton.hide();
cancelButton.text(gettext('OK'));
cancelButton.addClass('action-primary');
},
getTitle: function() {
var displayName = this.xblockElement.find('.xblock-header .header-details').text().trim();
// If not found, try the old unit page style rendering
@@ -117,23 +150,28 @@ define(["jquery", "underscore", "gettext", "js/views/modals/base_modal",
},
save: function(event) {
var self = this,
xblockInfo = this.xblockInfo,
refresh = self.editOptions.refresh;
event.preventDefault();
this.editorView.save({
success: function() {
self.hide();
if (refresh) {
refresh(xblockInfo);
}
}
success: _.bind(this.onSave, this)
});
},
onSave: function() {
var refresh = this.editOptions.refresh;
this.hide();
if (refresh) {
refresh(this.xblockInfo);
}
},
hide: function() {
BaseModal.prototype.hide.call(this);
// Notify the runtime that the modal has been hidden
if (this.runtime) {
this.runtime.notify('edit-modal-hidden');
}
// Completely clear the contents of the modal
this.undelegateEvents();
this.$el.html("");

47
cms/static/js/views/xblock_editor.js
View File

@@ -49,6 +49,10 @@ define(["jquery", "underscore", "gettext", "js/views/feedback_notification", "js
return this.$('.editor-with-tabs').length > 0;
},
hasCustomButtons: function() {
return this.$('.editor-with-buttons').length > 0;
},
createMetadataEditor: function() {
var metadataEditor,
metadataData,
@@ -88,27 +92,36 @@ define(["jquery", "underscore", "gettext", "js/views/feedback_notification", "js
var xblockInfo = this.model,
data,
saving;
data = this.getXBlockData();
saving = new NotificationView.Mini({
title: gettext('Saving…')
});
saving.show();
return xblockInfo.save(data).done(function() {
var success = options.success;
saving.hide();
if (success) {
success();
}
});
data = this.getXModuleData();
if (data) {
saving = new NotificationView.Mini({
title: gettext('Saving…')
});
saving.show();
return xblockInfo.save(data).done(function() {
var success = options.success;
saving.hide();
if (success) {
success();
}
});
}
},
getXBlockData: function() {
/**
* Returns the data saved for the xmodule. Note that this *does not* work for XBlocks.
*/
getXModuleData: function() {
var xblock = this.xblock,
metadataEditor = this.getMetadataEditor(),
data;
data = xblock.save();
if (metadataEditor) {
data.metadata = _.extend(data.metadata || {}, this.getChangedMetadata());
data = null;
if (xblock.save) {
data = xblock.save();
if (metadataEditor) {
data.metadata = _.extend(data.metadata || {}, this.getChangedMetadata());
}
} else {
console.error('Cannot save xblock as it has no save method');
}
return data;
},