diff --git a/core/modules/edit/js/models/AppModel.js b/core/modules/edit/js/models/AppModel.js index fc276fbbfe94dc60ee08e5306a5df78d393ae0a8..ff752f02686f84c7a17dd38b58be76b205738d2f 100644 --- a/core/modules/edit/js/models/AppModel.js +++ b/core/modules/edit/js/models/AppModel.js @@ -4,8 +4,12 @@ Drupal.edit.AppModel = Backbone.Model.extend({ defaults: { - highlightedEditor: null, - activeEditor: null, + // The currently state = 'highlighted' Drupal.edit.FieldModel, if any. + // @see Drupal.edit.FieldModel.states + highlightedField: null, + // The currently state = 'active' Drupal.edit.FieldModel, if any. + // @see Drupal.edit.FieldModel.states + activeField: null, // Reference to a Drupal.dialog instance if a state change requires // confirmation. activeModal: null diff --git a/core/modules/edit/js/models/EntityModel.js b/core/modules/edit/js/models/EntityModel.js index a4d101fae776441c473945f2a758118b961dcd21..6fefaf35cda4fd4ecbf30fa9d522b781a96b1a61 100644 --- a/core/modules/edit/js/models/EntityModel.js +++ b/core/modules/edit/js/models/EntityModel.js @@ -100,7 +100,7 @@ Drupal.edit.EntityModel = Backbone.Model.extend({ // committing. this.get('fields').chain() .filter(function (fieldModel) { - return _.intersection([fieldModel.get('state')], Drupal.edit.app.fieldReadyStates).length; + return _.intersection([fieldModel.get('state')], Drupal.edit.app.readyFieldStates).length; }) .each(function (fieldModel) { fieldModel.trigger('change:state', fieldModel, fieldModel.get('state'), options); @@ -117,7 +117,7 @@ Drupal.edit.EntityModel = Backbone.Model.extend({ // stored in TempStore. this.get('fields').chain() .filter(function (fieldModel) { - return _.intersection([fieldModel.get('state')], Drupal.edit.app.changedEditorStates).length; + return _.intersection([fieldModel.get('state')], Drupal.edit.app.changedFieldStates).length; }) .each(function (fieldModel) { fieldModel.set('state', 'saving'); @@ -220,7 +220,7 @@ Drupal.edit.EntityModel = Backbone.Model.extend({ // A state change in reaction to another state change must be deferred. _.defer(function () { entityModel.set('state', 'opened', { - 'accept-field-states': Drupal.edit.app.fieldReadyStates + 'accept-field-states': Drupal.edit.app.readyFieldStates }); }); break; @@ -279,7 +279,7 @@ Drupal.edit.EntityModel = Backbone.Model.extend({ // Attempt to save the entity. If the entity's fields are not yet all in // a ready state, the save will not be processed. var options = { - 'accept-field-states': Drupal.edit.app.fieldReadyStates + 'accept-field-states': Drupal.edit.app.readyFieldStates }; if (entityModel.set('isCommitting', true, options)) { entityModel.save({ @@ -299,7 +299,7 @@ Drupal.edit.EntityModel = Backbone.Model.extend({ // A state change in reaction to another state change must be deferred. _.defer(function() { entityModel.set('state', 'closing', { - 'accept-field-states': Drupal.edit.app.fieldReadyStates + 'accept-field-states': Drupal.edit.app.readyFieldStates }); }); break; diff --git a/core/modules/edit/js/views/AppView.js b/core/modules/edit/js/views/AppView.js index 6e1ed41fa6979e975716eaab090277aeea756063..d38f5025c6ecf278db0ad14ff55e63d3d8e177c4 100644 --- a/core/modules/edit/js/views/AppView.js +++ b/core/modules/edit/js/views/AppView.js @@ -27,10 +27,10 @@ Drupal.edit.AppView = Backbone.View.extend({ initialize: function (options) { // AppView's configuration for handling states. // @see Drupal.edit.FieldModel.states - this.activeEditorStates = ['activating', 'active']; - this.singleEditorStates = ['highlighted', 'activating', 'active']; - this.changedEditorStates = ['changed', 'saving', 'saved', 'invalid']; - this.fieldReadyStates = ['candidate', 'highlighted']; + this.activeFieldStates = ['activating', 'active']; + this.singleFieldStates = ['highlighted', 'activating', 'active']; + this.changedFieldStates = ['changed', 'saving', 'saved', 'invalid']; + this.readyFieldStates = ['candidate', 'highlighted']; options.entitiesCollection // Track app state. @@ -134,7 +134,7 @@ Drupal.edit.AppView = Backbone.View.extend({ accept = false; // Allow: activating/active -> candidate. // Necessary to stop editing a field. - if (_.indexOf(this.activeEditorStates, from) !== -1 && to === 'candidate') { + if (_.indexOf(this.activeFieldStates, from) !== -1 && to === 'candidate') { accept = true; } // Allow: changed/invalid -> candidate. @@ -169,25 +169,25 @@ Drupal.edit.AppView = Backbone.View.extend({ // If it's not against the general principle, then here are more // disallowed cases to check. if (accept) { - var activeEditor, activeEditorState; - // Ensure only one editor (field) at a time is active … but allow a user + var activeField, activeFieldState; + // Ensure only one field (editor) at a time is active … but allow a user // to hop from one field to the next, even if we still have to start // saving the field that is currently active: assume it will be valid, // to allow for a fluent UX. (If it turns out to be invalid, this block // of code also handles that.) - if ((this.fieldReadyStates.indexOf(from) !== -1 || from === 'invalid') && this.activeEditorStates.indexOf(to) !== -1) { - activeEditor = this.model.get('activeEditor'); - if (activeEditor && activeEditor !== fieldModel) { - activeEditorState = activeEditor.get('state'); - // Allow the state change. If the state of the active editor is: + if ((this.readyFieldStates.indexOf(from) !== -1 || from === 'invalid') && this.activeFieldStates.indexOf(to) !== -1) { + activeField = this.model.get('activeField'); + if (activeField && activeField !== fieldModel) { + activeFieldState = activeField.get('state'); + // Allow the state change. If the state of the active field is: // - 'activating' or 'active': change it to 'candidate' // - 'changed' or 'invalid': change it to 'saving' // - 'saving'or 'saved': don't do anything. - if (this.activeEditorStates.indexOf(activeEditorState) !== -1) { - activeEditor.set('state', 'candidate'); + if (this.activeFieldStates.indexOf(activeFieldState) !== -1) { + activeField.set('state', 'candidate'); } - else if (activeEditorState === 'changed' || activeEditorState === 'invalid') { - activeEditor.set('state', 'saving'); + else if (activeFieldState === 'changed' || activeFieldState === 'invalid') { + activeField.set('state', 'saving'); } // If the field that's being activated is in fact already in the @@ -198,7 +198,7 @@ Drupal.edit.AppView = Backbone.View.extend({ // change the active editor. All guarantees and assumptions for this // field still hold! if (from === 'invalid') { - this.model.set('activeEditor', fieldModel); + this.model.set('activeField', fieldModel); accept = false; } else { @@ -210,7 +210,7 @@ Drupal.edit.AppView = Backbone.View.extend({ } // Reject going from activating/active to candidate because of a // mouseleave. - else if (_.indexOf(this.activeEditorStates, from) !== -1 && to === 'candidate') { + else if (_.indexOf(this.activeFieldStates, from) !== -1 && to === 'candidate') { if (context && context.reason === 'mouseleave') { accept = false; } @@ -391,24 +391,24 @@ Drupal.edit.AppView = Backbone.View.extend({ var from = fieldModel.previous('state'); var to = state; - // Keep track of the highlighted editor in the global state. - if (_.indexOf(this.singleEditorStates, to) !== -1 && this.model.get('highlightedEditor') !== fieldModel) { - this.model.set('highlightedEditor', fieldModel); + // Keep track of the highlighted field in the global state. + if (_.indexOf(this.singleFieldStates, to) !== -1 && this.model.get('highlightedField') !== fieldModel) { + this.model.set('highlightedField', fieldModel); } - else if (this.model.get('highlightedEditor') === fieldModel && to === 'candidate') { - this.model.set('highlightedEditor', null); + else if (this.model.get('highlightedField') === fieldModel && to === 'candidate') { + this.model.set('highlightedField', null); } - // Keep track of the active editor in the global state. - if (_.indexOf(this.activeEditorStates, to) !== -1 && this.model.get('activeEditor') !== fieldModel) { - this.model.set('activeEditor', fieldModel); + // Keep track of the active field in the global state. + if (_.indexOf(this.activeFieldStates, to) !== -1 && this.model.get('activeField') !== fieldModel) { + this.model.set('activeField', fieldModel); } - else if (this.model.get('activeEditor') === fieldModel && to === 'candidate') { + else if (this.model.get('activeField') === fieldModel && to === 'candidate') { // Discarded if it transitions from a changed state to 'candidate'. if (from === 'changed' || from === 'invalid') { fieldModel.editorView.revert(); } - this.model.set('activeEditor', null); + this.model.set('activeField', null); } }, diff --git a/core/modules/edit/js/views/EntityToolbarView.js b/core/modules/edit/js/views/EntityToolbarView.js index a2998dbb21b26d0f7093c9187334e50ad1b3eddc..d1543628700b1c0d9e4d96109a52e9ffec6fafc8 100644 --- a/core/modules/edit/js/views/EntityToolbarView.js +++ b/core/modules/edit/js/views/EntityToolbarView.js @@ -29,8 +29,8 @@ Drupal.edit.EntityToolbarView = Backbone.View.extend({ // Rerender whenever the entity state changes. this.model.on('change:isActive change:isDirty change:state', this.render, this); - // Also rerender whenever the highlighted or active in-place editor changes. - this.appModel.on('change:highlightedEditor change:activeEditor', this.render, this); + // Also rerender whenever a different field is highlighted or activated. + this.appModel.on('change:highlightedField change:activeField', this.render, this); // Rerender when a field of the entity changes state. this.model.get('fields').on('change:state', this.fieldStateChange, this); @@ -179,7 +179,7 @@ Drupal.edit.EntityToolbarView = Backbone.View.extend({ break; case 1: // Position against a form container. - activeField = Drupal.edit.app.model.get('activeEditor'); + activeField = Drupal.edit.app.model.get('activeField'); of = activeField && activeField.editorView && activeField.editorView.$formContainer && activeField.editorView.$formContainer.find('.edit-form'); break; case 2: @@ -191,7 +191,7 @@ Drupal.edit.EntityToolbarView = Backbone.View.extend({ break; case 3: // Position against a highlighted field. - highlightedField = Drupal.edit.app.model.get('highlightedEditor'); + highlightedField = Drupal.edit.app.model.get('highlightedField'); of = highlightedField && highlightedField.editorView && highlightedField.editorView.getEditedElement(); delay = 250; break; @@ -365,11 +365,11 @@ Drupal.edit.EntityToolbarView = Backbone.View.extend({ var entityLabel = this.model.get('label'); // Label of an active field, if it exists. - var activeEditor = Drupal.edit.app.model.get('activeEditor'); - var activeFieldLabel = activeEditor && activeEditor.get('metadata').label; + var activeField = Drupal.edit.app.model.get('activeField'); + var activeFieldLabel = activeField && activeField.get('metadata').label; // Label of a highlighted field, if it exists. - var highlightedEditor = Drupal.edit.app.model.get('highlightedEditor'); - var highlightedFieldLabel = highlightedEditor && highlightedEditor.get('metadata').label; + var highlightedField = Drupal.edit.app.model.get('highlightedField'); + var highlightedFieldLabel = highlightedField && highlightedField.get('metadata').label; // The label is constructed in a priority order. if (activeFieldLabel) { label = Drupal.theme('editEntityToolbarLabel', {