From 79c5895f2f02a9e42ca9718c759f5053a1c2c3f0 Mon Sep 17 00:00:00 2001 From: Alex M Date: Wed, 24 Aug 2016 21:07:11 +0300 Subject: [PATCH 1/4] [Documentation] Fix code formatting --- docs/src/tutorials/index.md | 54 ++++++++++++++++++------------------- 1 file changed, 27 insertions(+), 27 deletions(-) diff --git a/docs/src/tutorials/index.md b/docs/src/tutorials/index.md index 84c571bec8..208026a20b 100644 --- a/docs/src/tutorials/index.md +++ b/docs/src/tutorials/index.md @@ -2346,35 +2346,35 @@ add a top-level object which will serve as a container; in the next step, we will populate this with the contents of the telemetry dictionary (which we will retrieve from the server.) -define([ - 'legacyRegistry' -], function ( - legacyRegistry -) { - legacyRegistry.register("tutorials/telemetry", { - "name": "Example Telemetry Adapter", - "extensions": { - "types": [ - { - "name": "Spacecraft", - "key": "example.spacecraft", - "glyph": "o" - } - ], - "roots": [ - { - "id": "example:sc", - "priority": "preferred", - "model": { - "type": "example.spacecraft", - "name": "My Spacecraft", - "composition": [] + define([ + 'legacyRegistry' + ], function ( + legacyRegistry + ) { + legacyRegistry.register("tutorials/telemetry", { + "name": "Example Telemetry Adapter", + "extensions": { + "types": [ + { + "name": "Spacecraft", + "key": "example.spacecraft", + "glyph": "o" } - } - ] - } + ], + "roots": [ + { + "id": "example:sc", + "priority": "preferred", + "model": { + "type": "example.spacecraft", + "name": "My Spacecraft", + "composition": [] + } + } + ] + } + }); }); -}); __tutorials/telemetry/bundle.js__ Here, we've created our initial telemetry plugin. This exposes a new domain From 5161205a062d7f762144ca4f007bfffca22a0d47 Mon Sep 17 00:00:00 2001 From: Alex M Date: Wed, 24 Aug 2016 22:45:55 +0300 Subject: [PATCH 2/4] [Documentation] Switch Step 1 to fenced --- docs/src/tutorials/index.md | 56 +++++++++++++++++++------------------ 1 file changed, 29 insertions(+), 27 deletions(-) diff --git a/docs/src/tutorials/index.md b/docs/src/tutorials/index.md index 208026a20b..c2633baf02 100644 --- a/docs/src/tutorials/index.md +++ b/docs/src/tutorials/index.md @@ -2346,35 +2346,37 @@ add a top-level object which will serve as a container; in the next step, we will populate this with the contents of the telemetry dictionary (which we will retrieve from the server.) - define([ - 'legacyRegistry' - ], function ( - legacyRegistry - ) { - legacyRegistry.register("tutorials/telemetry", { - "name": "Example Telemetry Adapter", - "extensions": { - "types": [ - { - "name": "Spacecraft", - "key": "example.spacecraft", - "glyph": "o" +```diff +define([ + 'legacyRegistry' +], function ( + legacyRegistry +) { + legacyRegistry.register("tutorials/telemetry", { + "name": "Example Telemetry Adapter", + "extensions": { + "types": [ + { + "name": "Spacecraft", + "key": "example.spacecraft", + "glyph": "o" + } + ], + "roots": [ + { + "id": "example:sc", + "priority": "preferred", + "model": { + "type": "example.spacecraft", + "name": "My Spacecraft", + "composition": [] } - ], - "roots": [ - { - "id": "example:sc", - "priority": "preferred", - "model": { - "type": "example.spacecraft", - "name": "My Spacecraft", - "composition": [] - } - } - ] - } - }); + } + ] + } }); +}); +``` __tutorials/telemetry/bundle.js__ Here, we've created our initial telemetry plugin. This exposes a new domain From 2cb636b050fb418c8d1ec8c684f0c671174ebce2 Mon Sep 17 00:00:00 2001 From: Alex M Date: Wed, 24 Aug 2016 22:56:43 +0300 Subject: [PATCH 3/4] [Documentation] Switch Step 2 to fenced --- docs/src/tutorials/index.md | 328 ++++++++++++++++++------------------ 1 file changed, 167 insertions(+), 161 deletions(-) diff --git a/docs/src/tutorials/index.md b/docs/src/tutorials/index.md index c2633baf02..53960577fe 100644 --- a/docs/src/tutorials/index.md +++ b/docs/src/tutorials/index.md @@ -2488,43 +2488,45 @@ server. Our first step will be to add a service that will handle interactions with the server; this will not be used by Open MCT directly, but will be used by subsequent components we add. - /*global define,WebSocket*/ - - define( - [], - function () { - "use strict"; - - function ExampleTelemetryServerAdapter($q, wsUrl) { - var ws = new WebSocket(wsUrl), - dictionary = $q.defer(); - - // Handle an incoming message from the server - ws.onmessage = function (event) { - var message = JSON.parse(event.data); - - switch (message.type) { - case "dictionary": - dictionary.resolve(message.value); - break; - } - }; - - // Request dictionary once connection is established - ws.onopen = function () { - ws.send("dictionary"); - }; - - return { - dictionary: function () { - return dictionary.promise; - } - }; - } - - return ExampleTelemetryServerAdapter; +```diff +/*global define,WebSocket*/ + +define( + [], + function () { + "use strict"; + + function ExampleTelemetryServerAdapter($q, wsUrl) { + var ws = new WebSocket(wsUrl), + dictionary = $q.defer(); + + // Handle an incoming message from the server + ws.onmessage = function (event) { + var message = JSON.parse(event.data); + + switch (message.type) { + case "dictionary": + dictionary.resolve(message.value); + break; + } + }; + + // Request dictionary once connection is established + ws.onopen = function () { + ws.send("dictionary"); + }; + + return { + dictionary: function () { + return dictionary.promise; + } + }; } - ); + + return ExampleTelemetryServerAdapter; + } +); +``` __tutorials/telemetry/src/ExampleTelemetryServerAdapter.js__ When created, this service initiates a connection to the server, and begins @@ -2541,86 +2543,88 @@ subsystems. This means that we need to convert the data from the dictionary into domain object models, and expose these to Open MCT via a `modelService`. - /*global define*/ - - define( - function () { - "use strict"; - - var PREFIX = "example_tlm:", - FORMAT_MAPPINGS = { - float: "number", - integer: "number", - string: "string" - }; - - function ExampleTelemetryModelProvider(adapter, $q) { - var modelPromise, empty = $q.when({}); - - // Check if this model is in our dictionary (by prefix) - function isRelevant(id) { - return id.indexOf(PREFIX) === 0; - } - - // Build a domain object identifier by adding a prefix - function makeId(element) { - return PREFIX + element.identifier; - } - - // Create domain object models from this dictionary - function buildTaxonomy(dictionary) { - var models = {}; - - // Create & store a domain object model for a measurement - function addMeasurement(measurement) { - var format = FORMAT_MAPPINGS[measurement.type]; - models[makeId(measurement)] = { - type: "example.measurement", - name: measurement.name, - telemetry: { - key: measurement.identifier, - ranges: [{ - key: "value", - name: "Value", - units: measurement.units, - format: format - }] - } - }; - } - - // Create & store a domain object model for a subsystem - function addSubsystem(subsystem) { - var measurements = - (subsystem.measurements || []); - models[makeId(subsystem)] = { - type: "example.subsystem", - name: subsystem.name, - composition: measurements.map(makeId) - }; - measurements.forEach(addMeasurement); - } - - (dictionary.subsystems || []).forEach(addSubsystem); - - return models; - } - - // Begin generating models once the dictionary is available - modelPromise = adapter.dictionary().then(buildTaxonomy); - - return { - getModels: function (ids) { - // Return models for the dictionary only when they - // are relevant to the request. - return ids.some(isRelevant) ? modelPromise : empty; - } - }; +```diff +/*global define*/ + +define( + function () { + "use strict"; + + var PREFIX = "example_tlm:", + FORMAT_MAPPINGS = { + float: "number", + integer: "number", + string: "string" + }; + + function ExampleTelemetryModelProvider(adapter, $q) { + var modelPromise, empty = $q.when({}); + + // Check if this model is in our dictionary (by prefix) + function isRelevant(id) { + return id.indexOf(PREFIX) === 0; } - - return ExampleTelemetryModelProvider; + + // Build a domain object identifier by adding a prefix + function makeId(element) { + return PREFIX + element.identifier; + } + + // Create domain object models from this dictionary + function buildTaxonomy(dictionary) { + var models = {}; + + // Create & store a domain object model for a measurement + function addMeasurement(measurement) { + var format = FORMAT_MAPPINGS[measurement.type]; + models[makeId(measurement)] = { + type: "example.measurement", + name: measurement.name, + telemetry: { + key: measurement.identifier, + ranges: [{ + key: "value", + name: "Value", + units: measurement.units, + format: format + }] + } + }; + } + + // Create & store a domain object model for a subsystem + function addSubsystem(subsystem) { + var measurements = + (subsystem.measurements || []); + models[makeId(subsystem)] = { + type: "example.subsystem", + name: subsystem.name, + composition: measurements.map(makeId) + }; + measurements.forEach(addMeasurement); + } + + (dictionary.subsystems || []).forEach(addSubsystem); + + return models; + } + + // Begin generating models once the dictionary is available + modelPromise = adapter.dictionary().then(buildTaxonomy); + + return { + getModels: function (ids) { + // Return models for the dictionary only when they + // are relevant to the request. + return ids.some(isRelevant) ? modelPromise : empty; + } + }; } - ); + + return ExampleTelemetryModelProvider; + } +); +``` __tutorials/telemetry/src/ExampleTelemetryModelProvider.js__ This script implements a `provider` for `modelService`; the `modelService` is a @@ -2673,55 +2677,57 @@ This allows our telemetry dictionary to be expressed as domain object models fix this, we will need another script which will add these subsystems to the root-level object we added in Step 1. - /*global define*/ - - define( - function () { - "use strict"; - - var TAXONOMY_ID = "example:sc", - PREFIX = "example_tlm:"; - - function ExampleTelemetryInitializer(adapter, objectService) { - // Generate a domain object identifier for a dictionary element - function makeId(element) { - return PREFIX + element.identifier; - } - - // When the dictionary is available, add all subsystems - // to the composition of My Spacecraft - function initializeTaxonomy(dictionary) { - // Get the top-level container for dictionary objects - // from a group of domain objects. - function getTaxonomyObject(domainObjects) { - return domainObjects[TAXONOMY_ID]; - } - - // Populate - function populateModel(taxonomyObject) { - return taxonomyObject.useCapability( - "mutation", - function (model) { - model.name = - dictionary.name; - model.composition = - dictionary.subsystems.map(makeId); - } - ); - } - - // Look up My Spacecraft, and populate it accordingly. - objectService.getObjects([TAXONOMY_ID]) - .then(getTaxonomyObject) - .then(populateModel); - } - - adapter.dictionary().then(initializeTaxonomy); +```diff +/*global define*/ + +define( + function () { + "use strict"; + + var TAXONOMY_ID = "example:sc", + PREFIX = "example_tlm:"; + + function ExampleTelemetryInitializer(adapter, objectService) { + // Generate a domain object identifier for a dictionary element + function makeId(element) { + return PREFIX + element.identifier; } - - return ExampleTelemetryInitializer; + + // When the dictionary is available, add all subsystems + // to the composition of My Spacecraft + function initializeTaxonomy(dictionary) { + // Get the top-level container for dictionary objects + // from a group of domain objects. + function getTaxonomyObject(domainObjects) { + return domainObjects[TAXONOMY_ID]; + } + + // Populate + function populateModel(taxonomyObject) { + return taxonomyObject.useCapability( + "mutation", + function (model) { + model.name = + dictionary.name; + model.composition = + dictionary.subsystems.map(makeId); + } + ); + } + + // Look up My Spacecraft, and populate it accordingly. + objectService.getObjects([TAXONOMY_ID]) + .then(getTaxonomyObject) + .then(populateModel); + } + + adapter.dictionary().then(initializeTaxonomy); } - ); + + return ExampleTelemetryInitializer; + } +); +``` __tutorials/telemetry/src/ExampleTelemetryInitializer.js__ At the conclusion of Step 1, the top-level My Spacecraft object was empty. This From 30750e63aaaefd5c74c53062f530274fe97ad405 Mon Sep 17 00:00:00 2001 From: Alex M Date: Wed, 24 Aug 2016 23:23:57 +0300 Subject: [PATCH 4/4] [Documentation] Code block spacing now consistent --- docs/src/tutorials/index.md | 21 ++++++++++++--------- 1 file changed, 12 insertions(+), 9 deletions(-) diff --git a/docs/src/tutorials/index.md b/docs/src/tutorials/index.md index 53960577fe..038f76cf5c 100644 --- a/docs/src/tutorials/index.md +++ b/docs/src/tutorials/index.md @@ -130,7 +130,6 @@ to this plugin as tutorials/todo as well.) We will start with an "empty bundle", one which exposes no extensions - which looks like: ```diff - define([ 'legacyRegistry' ], function ( @@ -144,7 +143,6 @@ define([ } }); }); - ``` __tutorials/todo/bundle.js__ @@ -348,7 +346,8 @@ deeper explanation of domain objects, see the Open MCT Developer Guide.) In the case of our to-do list feature, the to-do list itself is the thing we'll want users to be able to create and edit. So, we will add that as a new type in our bundle definition: -```diff + +```diff define([ 'legacyRegistry' ], function ( @@ -370,7 +369,6 @@ define([ + ]} }); }); - ``` __tutorials/todo/bundle.js__ @@ -427,7 +425,6 @@ are stored by convention.) ``` - __tutorials/todo/res/templates/todo.html__ A summary of what's included: @@ -573,6 +570,7 @@ We will define that in an AMD module (see http://requirejs.org/docs/whyamd.html) in the directory `tutorials/todo/src/controllers` (`src` is, by default, the directory where bundle-related source code is kept, and controllers is where Angular controllers are stored by convention.) + ```diff define(function () { function TodoController($scope) { @@ -971,6 +969,7 @@ by the tool bar we've defined. Additionally, we need to make changes to our template to select specific tasks in response to some user gesture. Here, we will select tasks when a user clicks the description. + ```diff
@@ -996,6 +995,7 @@ __tutorials/todo/res/templates/todo.html__ Finally, the `TodoController` uses the `dialogService` now, so we need to declare that dependency in its extension definition: + ```diff define([ 'legacyRegistry', @@ -1248,7 +1248,6 @@ another file to the res directory of our bundle; this time, it is `css/todo.css` font-style: italic; } ``` - __tutorials/todo/res/css/todo.css__ Here, we have defined classes and appearances for: @@ -1261,6 +1260,7 @@ Here, we have defined classes and appearances for: To include this CSS file in our running instance of Open MCT, we need to declare it in our bundle definition, this time as an extension of category `stylesheets`: + ```diff define([ 'legacyRegistry', @@ -1430,7 +1430,6 @@ define([ }); }); ``` - __tutorials/bargraph/bundle.js__ The view definition should look familiar after the To-Do List tutorial, with @@ -1499,6 +1498,7 @@ The third is for labels along the horizontal axis, which will indicate which bar corresponds to which telemetry point. Inline `style` attributes are used wherever dynamic positioning (handled by a script) is anticipated. The corresponding CSS file which styles and positions these elements: + ```diff .example-bargraph { position: absolute; @@ -1596,6 +1596,7 @@ actual telemetry data in subsequent steps.) Notably, we will not try to show telemetry data after this step. To support this, we will add a new controller which supports our Bar Graph view: + ```diff define(function () { function BarGraphController($scope, telemetryHandler) { @@ -1647,6 +1648,7 @@ Whenever the telemetry handler invokes its callbacks, we update the set of telemetry objects in view, as well as the width for each bar. We will also utilize this from our template: + ```diff +
@@ -2471,7 +2473,6 @@ define([ }; }); ``` - __main.js__ ...we will be able to reload Open MCT and see that it is present: @@ -2942,6 +2943,7 @@ identifier, the pending promise is resolved. This `history` method will be used by a `telemetryService` provider which we will implement: + ```diff /*global define*/ @@ -3027,6 +3029,7 @@ Finally, note that we also have a `subscribe` method, to satisfy the interface o `telemetryService`, but this `subscribe` method currently does nothing. This script uses an `ExampleTelemetrySeries` class, which looks like: + ```diff /*global define*/ @@ -3058,6 +3061,7 @@ 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.) Finally, we expose this `telemetryService` provider declaratively: + ```diff define([ 'legacyRegistry', @@ -3324,7 +3328,6 @@ define( } ); ``` - __tutorials/telemetry/src/ExampleTelemetryProvider.js__ A quick summary of these changes: