I use modal forms pretty extensively across my app and have a lot of properties that are common throughout. Things like ModalTitle, SubmitButtonTitle, and a basic set of actions. I want to abstract this out into a more maintainable form. I originally had created a custom ModalFormController by extending ObjectController but I’m wondering if a Mixin is a better approach. Here’s what my ModalFormController looks like:
App.ModalFormController = Ember.ObjectController.extend({
modalNewTitle: 'Create',
modalEditTitle: 'Edit',
submitButtonNewTitle: 'Create',
submitButtonEditTitle: 'Save Changes',
isNew: function () {
return this.get('model').get('isNew');
}.property('model'),
isEdit: function() {
return !this.get('isNew');
}.property('isNew'),
modalTitle: function() {
if (this.get('isNew')) {
return this.get('modalNewTitle');
} else {
return this.get('modalEditTitle');
}
}.property('isNew'),
submitButtonTitle: function () {
if (this.get('isNew')) {
return this.get('submitButtonNewTitle');
} else {
return this.get('submitButtonEditTitle');
}
}.property('isNew'),
actions: {
cancel: function () {
var self = this;
if (this.get('isNew')) {
this.send('cancelNew');
} else {
this.send('cancelEdit');
}
},
cancelNew: function () {
var model = this.get('model');
if (model) {
model.deleteRecord();
}
this.send('closeModal');
},
cancelEdit: function () {
var model = this.get('model');
if (Ember.isNone(model)) {
} else if (model.get('isDirty') && !confirm('You have unsaved changes. They will be lost if you continue!')) {
model.rollback();
if (model.get('isNew')) {
model.deleteRecord();
}
} else {
model.rollback();
if (model.get('isNew')) {
model.deleteRecord();
}
}
this.send('closeModal');
}
}
});
Does it make sense to keep the controller and have all of my modal controllers extend App.ModalFormController or to move to something like
App.SomeModalController = Ember.ObjectController.extend(App.ModalFormMixin, {...});