ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-01-19 03:06:54 +00:00
Code Issues Actions 9 Packages Projects Releases Wiki Activity

Did review of tutorials

Browse Source
This commit is contained in:
Henry 2015-10-13 12:08:58 -07:00
parent 53a3a2f459
commit 5b617295e9
2 changed files with 65 additions and 61 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

0
docs/src/tutorials/images/add-tasl.png → docs/src/tutorials/images/add-task.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 23 KiB

After

Width:  |  Height:  |  Size: 23 KiB

124
docs/src/tutorials/index.md
View File

@ -720,7 +720,7 @@ all the applicable controls, which means no controls at all.
To support selection, we will need to make some changes to our controller: To support selection, we will need to make some changes to our controller:
+ define(function () { define(function () {
+ // Form to display when adding new tasks + // Form to display when adding new tasks
+ var NEW_TASK_FORM = { + var NEW_TASK_FORM = {
+ name: "Add a Task", + name: "Add a Task",
@ -734,7 +734,7 @@ To support selection, we will need to make some changes to our controller:
+ }] + }]
+ }; + };
function TodoController($scope, dialogService) { + function TodoController($scope, dialogService) {
var showAll = true, var showAll = true,
showCompleted; showCompleted;
@ -745,21 +745,23 @@ To support selection, we will need to make some changes to our controller:
return persistence && persistence.persist(); return persistence && persistence.persist();
} }
// Remove a task + // Remove a task
function removeTaskAtIndex(taskIndex) { + function removeTaskAtIndex(taskIndex) {
$scope.domainObject.useCapability('mutation', function (model) { + $scope.domainObject.useCapability('mutation', function
model.tasks.splice(taskIndex, 1); + (model) {
}); + model.tasks.splice(taskIndex, 1);
persist(); + });
} + persist();
+ }
// Add a task + // Add a task
function addNewTask(task) { + function addNewTask(task) {
$scope.domainObject.useCapability('mutation', function (model) { + $scope.domainObject.useCapability('mutation', function
model.tasks.push(task); + (model) {
}); + model.tasks.push(task);
persist(); + });
} + persist();
+ }
// Change which tasks are visible // Change which tasks are visible
$scope.setVisibility = function (all, completed) { $scope.setVisibility = function (all, completed) {
@ -782,25 +784,25 @@ To support selection, we will need to make some changes to our controller:
}; };
// Handle selection state in edit mode // Handle selection state in edit mode
if ($scope.selection) { + if ($scope.selection) {
// Expose the ability to select tasks + // Expose the ability to select tasks
$scope.selectTask = function (taskIndex) { + $scope.selectTask = function (taskIndex) {
$scope.selection.select({ + $scope.selection.select({
removeTask: function () { + removeTask: function () {
removeTaskAtIndex(taskIndex); + removeTaskAtIndex(taskIndex);
$scope.selection.deselect(); + $scope.selection.deselect();
} + }
}); + });
}; + };
// Expose a view-level selection proxy + // Expose a view-level selection proxy
$scope.selection.proxy({ + $scope.selection.proxy({
addTask: function () { + addTask: function () {
dialogService.getUserInput(NEW_TASK_FORM, {}) + dialogService.getUserInput(NEW_TASK_FORM, {})
.then(addNewTask); + .then(addNewTask);
} + }
}); + });
} + }
} }
return TodoController; return TodoController;
@ -996,10 +998,10 @@ states in the controller:
showCompleted = completed; showCompleted = completed;
}; };
// Check if current visibility settings match + // Check if current visibility settings match
$scope.checkVisibility = function (all, completed) { + $scope.checkVisibility = function (all, completed) {
return showAll ? all : (completed === showCompleted); + return showAll ? all : (completed === showCompleted);
}; + };
// Toggle the completion state of a task // Toggle the completion state of a task
$scope.toggleCompletion = function (taskIndex) { $scope.toggleCompletion = function (taskIndex) {
@ -1024,14 +1026,15 @@ states in the controller:
removeTaskAtIndex(taskIndex); removeTaskAtIndex(taskIndex);
$scope.selection.deselect(); $scope.selection.deselect();
}, },
taskIndex: taskIndex + taskIndex: taskIndex
}); });
}; };
// Expose a check for current selection state + // Expose a check for current selection state
$scope.isSelected = function (taskIndex) { + $scope.isSelected = function (taskIndex) {
return ($scope.selection.get() || {}).taskIndex === taskIndex; + return ($scope.selection.get() || {}).taskIndex ===
}; + taskIndex;
+ };
// Expose a view-level selection proxy // Expose a view-level selection proxy
$scope.selection.proxy({ $scope.selection.proxy({
@ -1503,15 +1506,15 @@ __tutorials/bargraph/res/templates/bargraph.html__
Summarizing these changes: Summarizing these changes:
* Utilize the exposed `low`, `middle`, and `high` values to populate our labels * Utilize the exposed `low`, `middle`, and `high` values to populate our labels
along the vertical axis. Additionally, use the toPercent function to position along the vertical axis. Additionally, use the `toPercent` function to position
these from the bottom. these from the bottom.
* Replace our three hard-coded bars with a repeater that looks at the * Replace our three hard-coded bars with a repeater that looks at the
`telemetryObjects` exposed by the controller and adds one bar each. `telemetryObjects` exposed by the controller and adds one bar each.
* Position the dashed tick-line using the middle value and the `toPercent` * Position the dashed tick-line using the `middle` value and the `toPercent`
function, lining it up with its `label` to the left. function, lining it up with its label to the left.
* At the bottom, repeat a set of labels for the telemetry-providing domain * At the bottom, repeat a set of labels for the telemetry-providing domain
objects, with matching alignment to the bars above. We use an existing objects, with matching alignment to the bars above. We use an existing
representation, label, to make this easier. representation, `label`, to make this easier.
Finally, we expose our controller from our bundle definition. Note that the Finally, we expose our controller from our bundle definition. Note that the
depends declaration includes both `$scope` as well as the `telemetryHandler` depends declaration includes both `$scope` as well as the `telemetryHandler`
@ -1583,10 +1586,10 @@ telemetry-providing domain object, as percentages.
+ var value = handle.getRangeValue(telemetryObject); + var value = handle.getRangeValue(telemetryObject);
+ return $scope.toPercent(Math.min($scope.middle, value)); + return $scope.toPercent(Math.min($scope.middle, value));
+ } + }
$scope.getTop = function (telemetryObject) { + $scope.getTop = function (telemetryObject) {
var value = handle.getRangeValue(telemetryObject); + var value = handle.getRangeValue(telemetryObject);
return 100 - $scope.toPercent(Math.max($scope.middle, value)); + return 100 - $scope.toPercent(Math.max($scope.middle, value));
} + }
// Use the telemetryHandler to get telemetry objects here // Use the telemetryHandler to get telemetry objects here
handle = telemetryHandler.handle($scope.domainObject, function () { handle = telemetryHandler.handle($scope.domainObject, function () {
@ -1816,7 +1819,7 @@ A summary of these changes:
* First, read `low`, `middle`, and `high` from the view configuration instead of * First, read `low`, `middle`, and `high` from the view configuration instead of
initializing them to explicit values. This is placed into its own function, initializing them to explicit values. This is placed into its own function,
since it will be called a lot. since it will be called a lot.
* The function 'setDefault' is included; it will be used to set the default * The function `setDefault` is included; it will be used to set the default
values for `low`, `middle`, and `high` in the view configuration, but only if values for `low`, `middle`, and `high` in the view configuration, but only if
they aren’t present. they aren’t present.
* The tool bar will treat properties in a view proxy as getter-setters if * The tool bar will treat properties in a view proxy as getter-setters if
@ -2218,7 +2221,7 @@ __bundles.json__
...we will be able to reload Open MCT Web and see that it is present: ...we will be able to reload Open MCT Web and see that it is present:
![](images/telemetry-1.png) ![Telemetry](images/telemetry-1.png)
Now, we have somewhere in the UI to put the contents of our telemetry Now, we have somewhere in the UI to put the contents of our telemetry
dictionary. dictionary.
@ -2590,7 +2593,8 @@ Now if we run Open MCT Web (assuming our example telemetry server is also
running) and expand our top-level node completely, we see the contents of our running) and expand our top-level node completely, we see the contents of our
dictionary: dictionary:
[](images/telemetry-2.png) ![Telemetry 2](images/telemetry-2.png)
Note that “My Spacecraft” has changed its name to “Example Spacecraft”, which Note that “My Spacecraft” has changed its name to “Example Spacecraft”, which
is the name it had in the dictionary. is the name it had in the dictionary.
@ -2742,8 +2746,8 @@ during Step 2. (Or, they might come from somewhere else entirely, if we have
other telemetry-providing domain objects in our system; that is something we other telemetry-providing domain objects in our system; that is something we
check for using the `source` property.) check for using the `source` property.)
Finally, note that we also have a subscribe method, to satisfy the interface of Finally, note that we also have a `subscribe` method, to satisfy the interface of
telemetryService, but this subscribe method currently does nothing. `telemetryService`, but this `subscribe` method currently does nothing.
This script uses an `ExampleTelemetrySeries` class, which looks like: This script uses an `ExampleTelemetrySeries` class, which looks like:
@ -2775,7 +2779,7 @@ __tutorials/telemetry/src/ExampleTelemetrySeries.js__
This takes the array of telemetry values (as returned by the server) and wraps This takes the array of telemetry values (as returned by the server) and wraps
it with the interface expected by the platform (the methods shown.) it with the interface expected by the platform (the methods shown.)
Finally, we expose this telemetryService provider declaratively: Finally, we expose this `telemetryService` provider declaratively:
{ {
"name": "Example Telemetry Adapter", "name": "Example Telemetry Adapter",
@ -3029,14 +3033,14 @@ __tutorials/telemetry/src/ExampleTelemetryProvider.js__
A quick summary of these changes: A quick summary of these changes:
First, we maintain current subscribers (callbacks) in an object containing * First, we maintain current subscribers (callbacks) in an object containing
key-value pairs, where keys are request key properties, and values are callback key-value pairs, where keys are request key properties, and values are callback
arrays. arrays.
We listen to new data coming in from the server adapter, and invoke any * We listen to new data coming in from the server adapter, and invoke any
relevant callbacks when this happens. We package the data in the same manner relevant callbacks when this happens. We package the data in the same manner
that historical telemetry is packaged (even though in this case we are that historical telemetry is packaged (even though in this case we are
providing single-element series objects.) providing single-element series objects.)
Finally, in our `subscribe` method we add callbacks to the lists of active * Finally, in our `subscribe` method we add callbacks to the lists of active
subscribers. This method is expected to return a function which terminates the subscribers. This method is expected to return a function which terminates the
subscription when called, so we do some work to remove subscribers in this subscription when called, so we do some work to remove subscribers in this
situations. When our subscriber count for a given measurement drops to zero, situations. When our subscriber count for a given measurement drops to zero,