mirror of
https://github.com/nasa/openmct.git
synced 2025-06-13 20:58:15 +00:00
[Forms] Implement DialogButtonController
Implement controller for dialog buttons sufficient to satisfy spec; these will be used to launch dialogs to collect user input for Image Properties et al to complete toolbar for Fixed Position view, WTD-881.
This commit is contained in:
@ -0,0 +1,72 @@
|
|||||||
|
/*global define*/
|
||||||
|
define(
|
||||||
|
[],
|
||||||
|
function () {
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Controller for the `dialog-button` control type. Provides
|
||||||
|
* structure for a button (embedded via the template) which
|
||||||
|
* will show a dialog for editing a single property when clicked.
|
||||||
|
* @constructor
|
||||||
|
* @param $scope the control's Angular scope
|
||||||
|
* @param {DialogService} dialogService service to use to prompt
|
||||||
|
* for user input
|
||||||
|
*/
|
||||||
|
function DialogButtonController($scope, dialogService) {
|
||||||
|
var buttonStructure,
|
||||||
|
buttonForm,
|
||||||
|
field;
|
||||||
|
|
||||||
|
// Store the result of user input to the model
|
||||||
|
function storeResult(result) {
|
||||||
|
$scope.ngModel[$scope.field] = result[$scope.field];
|
||||||
|
}
|
||||||
|
|
||||||
|
// Prompt for user input
|
||||||
|
function showDialog() {
|
||||||
|
dialogService.getUserInput(buttonForm, $scope.ngModel)
|
||||||
|
.then(storeResult);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Refresh state based on structure for this control
|
||||||
|
function refreshStructure(structure) {
|
||||||
|
var row = Object.create(structure.dialog || {});
|
||||||
|
|
||||||
|
structure = structure || {};
|
||||||
|
|
||||||
|
// Add the key, to read back from that row
|
||||||
|
row.key = $scope.field;
|
||||||
|
|
||||||
|
// Prepare the structure for the button itself
|
||||||
|
buttonStructure = {};
|
||||||
|
buttonStructure.glyph = structure.glyph;
|
||||||
|
buttonStructure.name = structure.name;
|
||||||
|
buttonStructure.description = structure.description;
|
||||||
|
buttonStructure.click = showDialog;
|
||||||
|
|
||||||
|
// Prepare the form; a single row
|
||||||
|
buttonForm = {
|
||||||
|
name: structure.title,
|
||||||
|
sections: [ { rows: [ row ] } ]
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
$scope.$watch('structure', refreshStructure);
|
||||||
|
|
||||||
|
return {
|
||||||
|
/**
|
||||||
|
* Get the structure for an `mct-control` of type
|
||||||
|
* `button`; a dialog will be launched when this button
|
||||||
|
* is clicked.
|
||||||
|
* @returns dialog structure
|
||||||
|
*/
|
||||||
|
getButtonStructure: function () {
|
||||||
|
return buttonStructure;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
return DialogButtonController;
|
||||||
|
}
|
||||||
|
);
|
@ -26,7 +26,6 @@ define(
|
|||||||
[ 'then' ]
|
[ 'then' ]
|
||||||
);
|
);
|
||||||
testStructure = {
|
testStructure = {
|
||||||
key: "testKey",
|
|
||||||
name: "A Test",
|
name: "A Test",
|
||||||
glyph: "T",
|
glyph: "T",
|
||||||
description: "Test description",
|
description: "Test description",
|
||||||
@ -38,6 +37,7 @@ define(
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
mockScope.field = "testKey";
|
||||||
mockScope.ngModel = { testKey: "initial test value" };
|
mockScope.ngModel = { testKey: "initial test value" };
|
||||||
mockScope.structure = testStructure;
|
mockScope.structure = testStructure;
|
||||||
|
|
||||||
@ -61,7 +61,7 @@ define(
|
|||||||
jasmine.any(Function)
|
jasmine.any(Function)
|
||||||
);
|
);
|
||||||
|
|
||||||
mockScope.$watch.mostRecentCall.args(testStructure);
|
mockScope.$watch.mostRecentCall.args[1](testStructure);
|
||||||
|
|
||||||
buttonStructure = controller.getButtonStructure();
|
buttonStructure = controller.getButtonStructure();
|
||||||
expect(buttonStructure.glyph).toEqual(testStructure.glyph);
|
expect(buttonStructure.glyph).toEqual(testStructure.glyph);
|
||||||
@ -71,7 +71,7 @@ define(
|
|||||||
});
|
});
|
||||||
|
|
||||||
it("shows a dialog when clicked", function () {
|
it("shows a dialog when clicked", function () {
|
||||||
mockScope.$watch.mostRecentCall.args(testStructure);
|
mockScope.$watch.mostRecentCall.args[1](testStructure);
|
||||||
// Verify precondition - no dialog shown
|
// Verify precondition - no dialog shown
|
||||||
expect(mockDialogService.getUserInput).not.toHaveBeenCalled();
|
expect(mockDialogService.getUserInput).not.toHaveBeenCalled();
|
||||||
// Click!
|
// Click!
|
||||||
@ -83,7 +83,7 @@ define(
|
|||||||
it("stores user input to the model", function () {
|
it("stores user input to the model", function () {
|
||||||
var key, input = {};
|
var key, input = {};
|
||||||
// Show dialog, click...
|
// Show dialog, click...
|
||||||
mockScope.$watch.mostRecentCall.args(testStructure);
|
mockScope.$watch.mostRecentCall.args[1](testStructure);
|
||||||
controller.getButtonStructure().click();
|
controller.getButtonStructure().click();
|
||||||
// Should be listening to 'then'
|
// Should be listening to 'then'
|
||||||
expect(mockPromise.then)
|
expect(mockPromise.then)
|
||||||
@ -101,7 +101,7 @@ define(
|
|||||||
|
|
||||||
it("supplies initial model state to the dialog", function () {
|
it("supplies initial model state to the dialog", function () {
|
||||||
var key, state;
|
var key, state;
|
||||||
mockScope.$watch.mostRecentCall.args(testStructure);
|
mockScope.$watch.mostRecentCall.args[1](testStructure);
|
||||||
controller.getButtonStructure().click();
|
controller.getButtonStructure().click();
|
||||||
// Find the key that the dialog should return
|
// Find the key that the dialog should return
|
||||||
key = mockDialogService.getUserInput.mostRecentCall
|
key = mockDialogService.getUserInput.mostRecentCall
|
||||||
|
Reference in New Issue
Block a user