Merge pull request #1766 from nasa/inline-edit-1746

Allow inline-editing for editable objects only
This commit is contained in:
Victor Woeltjen 2017-10-10 12:43:07 -07:00 committed by GitHub
commit 9570f2f7a1
3 changed files with 29 additions and 14 deletions

View File

@ -22,7 +22,7 @@
<span class='type-icon flex-elem {{type.getCssClass()}}'></span> <span class='type-icon flex-elem {{type.getCssClass()}}'></span>
<span class="l-elem-wrapper l-flex-row flex-elem grows" ng-controller="ObjectHeaderController as controller"> <span class="l-elem-wrapper l-flex-row flex-elem grows" ng-controller="ObjectHeaderController as controller">
<span ng-if="parameters.mode" class='action flex-elem'>{{parameters.mode}}</span> <span ng-if="parameters.mode" class='action flex-elem'>{{parameters.mode}}</span>
<span contenteditable="true" <span ng-attr-contenteditable="{{ controller.editable ? true : undefined }}"
class='title-label flex-elem holder flex-can-shrink s-input-inline' class='title-label flex-elem holder flex-can-shrink s-input-inline'
ng-click="controller.edit()" ng-click="controller.edit()"
ng-blur="controller.updateName($event)" ng-blur="controller.updateName($event)"

View File

@ -32,7 +32,8 @@ define(
*/ */
function ObjectHeaderController($scope) { function ObjectHeaderController($scope) {
this.$scope = $scope; this.$scope = $scope;
$scope.editing = false; this.domainObject = $scope.domainObject;
this.editable = this.allowEdit();
} }
/** /**
@ -45,18 +46,16 @@ define(
var name = event.currentTarget.innerHTML; var name = event.currentTarget.innerHTML;
if (name.length === 0) { if (name.length === 0) {
name = "Unnamed " + this.$scope.domainObject.getCapability("type").typeDef.name; name = "Unnamed " + this.domainObject.getCapability("type").typeDef.name;
event.currentTarget.innerHTML = name; event.currentTarget.innerHTML = name;
} }
if (name !== this.$scope.domainObject.model.name) { if (name !== this.$scope.domainObject.model.name) {
this.$scope.domainObject.getCapability('mutation').mutate(function (model) { this.domainObject.getCapability('mutation').mutate(function (model) {
model.name = name; model.name = name;
}); });
} }
this.$scope.editing = false;
if (event.which === 13) { if (event.which === 13) {
event.currentTarget.blur(); event.currentTarget.blur();
} }
@ -64,10 +63,14 @@ define(
}; };
/** /**
* Marks the status of the field as editing. * Checks if the domain object is editable.
*
* @private
* @return true if object is editable
*/ */
ObjectHeaderController.prototype.edit = function () { ObjectHeaderController.prototype.allowEdit = function () {
this.$scope.editing = true; var type = this.domainObject && this.domainObject.getCapability('type');
return !!(type && type.hasFeature('creation'));
}; };
return ObjectHeaderController; return ObjectHeaderController;

View File

@ -36,11 +36,12 @@ define(
beforeEach(function () { beforeEach(function () {
mockMutationCapability = jasmine.createSpyObj("mutation", ["mutate"]); mockMutationCapability = jasmine.createSpyObj("mutation", ["mutate"]);
mockTypeCapability = { mockTypeCapability = jasmine.createSpyObj("type", ["typeDef", "hasFeature"]);
typeDef: { mockTypeCapability.typeDef = { name: ""};
name: "" mockTypeCapability.hasFeature.andCallFake(function (feature) {
} return feature === 'creation';
}; });
mockCapabilities = { mockCapabilities = {
mutation: mockMutationCapability, mutation: mockMutationCapability,
type: mockTypeCapability type: mockTypeCapability
@ -115,6 +116,17 @@ define(
expect(mockEvent.currentTarget.blur).toHaveBeenCalled(); expect(mockEvent.currentTarget.blur).toHaveBeenCalled();
}); });
it("allows editting name when object is creatable", function () {
expect(controller.allowEdit()).toBe(true);
});
it("disallows editting name when object is non-creatable", function () {
mockTypeCapability.hasFeature.andReturn(false);
expect(controller.allowEdit()).toBe(false);
});
}); });
} }
); );