[Merge] WIP cleanups to markup and SCSS

Fixes #1894
- IN PROGRESS, for Andrew to pick up
and modify to remove need for 'status-block-holder'
in SimpleIndicator.js

API.md

@@ -567,7 +567,7 @@ openmct.time.timeSystem(utcTimeSystem, bounds);
 Setting the active time system will trigger a [`'timeSystem'`](#time-events) 
 event.  If you supplied bounds, a [`'bounds'`](#time-events) event will be triggered afterwards with your newly supplied bounds.
 
-### Time Bounds
+#### Time Bounds
 
 The TimeAPI provides a getter/setter for querying and setting time bounds. Time 
 bounds are simply an object with a `start` and an end `end` attribute.
@@ -591,7 +591,7 @@ openmct.time.bounds({start: now - ONE_HOUR, now);
 To respond to bounds change events, listen for the [`'bounds'`](#time-events)
 event.
 
-## Clocks
+### Clocks
 
 The Time API can be set to follow a clock source which will cause the bounds
 to be updated automatically whenever the clock source "ticks". A clock is simply
@@ -610,7 +610,7 @@ be defined to tick on some remote timing source.
 The values provided by clocks are simple `number`s, which are interpreted in the
 context of the active [Time System](#defining-and-registering-time-systems).
 
-### Defining and registering clocks
+#### Defining and registering clocks
 
 A clock is an object that defines certain required metadata and functions:
 
@@ -724,7 +724,7 @@ __Note:__ Setting the clock offsets will trigger an immediate bounds change, as
 new bounds will be calculated based on the `currentValue()` of the active clock. 
 Clock offsets are only relevant when a clock source is active.
 
-## Time Events
+### Time Events
 
 The Time API is a standard event emitter; you can register callbacks for events using the `on` method and remove callbacks for events with the `off` method.
 
@@ -766,7 +766,7 @@ The events emitted by the Time API are:
   * `clockOffsets`: The new [clock offsets](#clock-offsets).
 
 
-## The Time Conductor
+### The Time Conductor
 
 The Time Conductor provides a user interface for managing time bounds in Open 
 MCT. It allows a user to select from configured time systems and clocks, and to set bounds and clock offsets.
@@ -856,6 +856,90 @@ openmct.install(openmct.plugins.Conductor({
 }));
 ```
 
+## Indicators
+
+Indicators are small widgets that reside at the bottom of the screen and are visible from 
+every screen in Open MCT. They can be used to convey system state using an icon and text.
+Indicators tend to be collapsed to an icon by default (though this behavior can be customized 
+by defining a [custom indicator](#custom-indicators)), and hovering over them will reveal 
+text providing more information.
+
+### The URL Status Indicator
+
+A common use case for indicators is to convey the state of some external system such as a 
+persistence backend or HTTP server. So long as this system is accessible via http request, 
+Open MCT provides a general purpose indicator to show whether the server is available and 
+returing a 2xx status code. The URL Status Indicator is made available as a default plugin. See
+[Included Plugins](#included-plugins) below for details on how to install and configure the 
+URL Status Indicator.
+
+### Creating a New Indicator
+
+A new indicator can be created with a simple API call, eg.
+
+``` javascript
+var myIndicator = openmct.indicators.create();
+myIndicator.text("Hello World!");
+```
+
+This will create a new indicator and add it to the bottom of the screen in Open MCT.
+By default, the indicator will appear as an information icon. Hovering over the icon will
+reveal the text set via the call to `.text()`. The Indicator object returned by the API 
+call exposes a number of functions for customizing the content and appearance of the indicator:
+
+* `.text([text])`: Gets or sets the text shown when the user hovers over the indicator.
+Accepts an __optional__ `string` argument that, if provided, will be used to set the text. 
+Hovering over the indicator will expand it to its full size, revealing this text alongside 
+the icon. Returns the currently set text as a `string`.
+* `.description([description])`: Gets or sets the indicator's description. Accepts an 
+__optional__ `string` argument that, if provided, will be used to set the text. The description 
+allows for more detail to be provided in a tooltip when the user hovers over the indicator. 
+Returns the currently set text as a `string`.
+* `.iconClass([className])`: Gets or sets the CSS class used to define the icon. Accepts an __optional__ 
+`string` parameter to be used to set the class applied to the indicator. Any of 
+[the built-in glyphs](https://nasa.github.io/openmct/style-guide/#/browse/styleguide:home/glyphs?view=styleguide.glyphs) 
+may be used here, or a custom CSS class can be provided. Returns the currently defined CSS 
+class as a `string`.
+* `.statusClass([className])`: Gets or sets the CSS class used to determine status. Accepts an __optional __
+`string` parameter to be used to set a status class applied to the indicator. May be used to apply 
+different colors to indicate status.
+
+### Custom Indicators
+
+A completely custom indicator can be added by registering a factory function that produces 
+a DOM element for your custom indicator. eg.
+
+``` javascript
+openmct.indicators.create(function () {
+    var domNode = document.createElement('div');
+    domNode.innerText = new Date().toString();
+    setInterval(function () {
+        domNode.innerText = new Date().toString();
+    }, 1000);
+    return domNode;
+});
+```
+
+### Priority
+
+When creating a new indicator or defining a custom indicator, a `number` can optionally be 
+provided that will determine the order that the indicator appears on the screen. An indicator 
+with a higher `priority` number will be shown to the left of indicators with lower 
+priority numbers. The lowest possible `priority` (and the default value if no `priority` is specified) 
+is `Number.NEGATIVE_INFINTY`, and the highest possible priority is `Number.POSITIVE_INFINITY`.
+
+eg.
+``` javascript
+var myIndicator = openmct.indicators.create(1);
+myIndicator.text("I'm on the left!");
+
+openmct.indicators.create(0, function () {
+    var domNode = document.createElement('div');
+    domNode.innerText = "I'm on the right!";
+    return domNode;
+});
+```
+
 ## Included Plugins
 
 Open MCT is packaged along with a few general-purpose plugins:
@@ -879,18 +963,18 @@ openmct.install(openmct.plugins.CouchDB('http://localhost:9200'))
 * `openmct.plugins.Espresso` and `openmct.plugins.Snow` are two different
   themes (dark and light) available for Open MCT. Note that at least one
   of these themes must be installed for Open MCT to appear correctly.
-* `openmct.plugins.URLIndicatorPlugin` adds an indicator which shows the
+* `openmct.plugins.URLIndicator` adds an indicator which shows the
 availability of a URL with the following options: 
   - `url` : URL to indicate the status of
-  - `cssClass`: Icon to show in the status bar, defaults to `icon-database`, [list of all icons](https://nasa.github.io/openmct/style-guide/#/browse/styleguide:home?view=items)
+  - `iconClass`: Icon to show in the status bar, defaults to `icon-database`, [list of all icons](https://nasa.github.io/openmct/style-guide/#/browse/styleguide:home?view=items)
   - `interval`: Interval between checking the connection, defaults to `10000`
   - `label` Name showing up as text in the status bar, defaults to url
 ```javascript
-openmct.install(openmct.plugins.URLIndicatorPlugin({
-  url: 'http://google.com',
-  cssClass: 'check',
-  interval: 10000,
-  label: 'Google'
+openmct.install(openmct.plugins.URLIndicator({
+  url: 'http://localhost:8080',
+    iconClass: 'check',
+    interval: 10000,
+    label: 'Localhost'
  })
 );
 ```

bower.json

@@ -17,7 +17,7 @@
     "screenfull": "^3.0.0",
     "node-uuid": "^1.4.7",
     "comma-separated-values": "^3.6.4",
-    "file-saver": "1.3.3",
+    "file-saver": "^1.3.3",
     "zepto": "^1.1.6",
     "eventemitter3": "^1.2.0",
     "lodash": "3.10.1",
@@ -25,4 +25,4 @@
     "html2canvas": "^0.4.1",
     "moment-timezone": "^0.5.13"
   }
-}
+}

docs/src/guide/security.md

@@ -1,121 +0,0 @@
-# Security Guide
-
-Open MCT is a rich client with plugin support that executes as a single page
-web application in a browser environment. Security concerns and
-vulnerabilities associated with the web as a platform should be considered
-before deploying Open MCT (or any other web application) for mission or
-production usage.
-
-This document describes several important points to consider when developing
-for or deploying Open MCT securely. Other resources such as
-[Open Web Application Security Project (OWASP)](https://www.owasp.org)
-provide a deeper and more general overview of security for web applications.
-
-
-## Security Model
-
-Open MCT has been architected assuming the following deployment pattern:
-
-* A tagged, tested Open MCT version will be used.
-* Externally authored plugins will be installed.
-* A server will provide persistent storage, telemetry, and other shared data.
-* Authorization, authentication, and auditing will be handled by a server.
-
-
-## Security Procedures
-
-The Open MCT team secures our code base using a combination of code review,
-dependency review, and periodic security reviews. Static analysis performed 
-during automated verification additionally safeguards against common 
-coding errors which may result in vulnerabilities.
-
-
-### Code Review
-
-All contributions are reviewed by internal team members. External
-contributors receive increased scrutiny for security and quality,
-and must sign a licensing agreement.
-
-### Dependency Review
-
-Before integrating third-party dependencies, they are reviewed for security
-and quality, with consideration given to authors and users of these
-dependencies, as well as review of open source code.
-
-### Periodic Security Reviews
-
-Open MCT's code, design, and architecture are periodically reviewed
-(approximately annually) for common security issues, such as the
-[OWASP Top Ten](https://www.owasp.org/index.php/Category:OWASP_Top_Ten_Project).
-
-
-## Security Concerns
-
-Certain security concerns deserve special attention when deploying Open MCT,
-or when authoring plugins.
-
-### Identity Spoofing
-
-Open MCT issues calls to web services with the privileges of a logged in user.
-Compromised sources (either for Open MCT itself or a plugin) could
-therefore allow malicious code to execute with those privileges.
-
-To avoid this:
-
-* Serve Open MCT and other scripts over SSL (https rather than http)
-  to prevent man-in-the-middle attacks.
-* Exercise precautions such as security reviews for any plugins or
-  applications built for or with Open MCT to reject malicious changes.
-
-### Information Disclosure
-
-If Open MCT is used to handle or display sensitive data, any components
-(such as adapter plugins) must take care to avoid leaking or disclosing
-this information. For example, avoid sending sensitive data to third-party
-servers or insecure APIs.
-
-### Data Tampering
-
-The web application architecture leaves open the possibility that direct
-calls will be made to back-end services, circumventing Open MCT entirely.
-As such, Open MCT assumes that server components will perform any necessary
-data validation during calls issues to the server.
-
-Additionally, plugins which serialize and write data to the server must
-escape that data to avoid database injection attacks, and similar.
-
-### Repudiation
-
-Open MCT assumes that servers log any relevant interactions and associates
-these with a user identity; the specific user actions taken within the
-application are assumed not to be of concern for auditing.
-
-In the absence of server-side logging, users may disclaim (maliciously,
-mistakenly, or otherwise) actions taken within the system without any
-way to prove otherwise.
-
-If keeping client-level interactions is important, this will need to be
-implemented via a plugin.
-
-### Denial-of-service
-
-Open MCT assumes that server-side components will be insulated against
-denial-of-service attacks. Services should only permit resource-intensive
-tasks to be initiated by known or trusted users.
-
-### Elevation of Privilege
-
-Corollary to the assumption that servers guide against identity spoofing,
-Open MCT assumes that services do not allow a user to act with
-inappropriately escalated privileges. Open MCT cannot protect against
-such escalation; in the clearest case, a malicious actor could interact
-with web services directly to exploit such a vulnerability.
-
-## Additional Reading
-
-The following resources have been used as a basis for identifying potential
-security threats to Open MCT deployments in preparation of this document:
-
-* [STRIDE model](https://www.owasp.org/index.php/Threat_Risk_Modeling#STRIDE)
-* [Attack Surface Analysis Cheat Sheet](https://www.owasp.org/index.php/Attack_Surface_Analysis_Cheat_Sheet)
-* [XSS Prevention Cheat Sheet](https://www.owasp.org/index.php/XSS_(Cross_Site_Scripting)_Prevention_Cheat_Sheet)

example/generator/GeneratorProvider.js

@@ -30,8 +30,7 @@ define([
         amplitude: 1,
         period: 10,
         offset: 0,
-        dataRateInHz: 1,
-        phase: 0
+        dataRateInHz: 1
     };
 
     function GeneratorProvider() {
@@ -51,12 +50,9 @@ define([
             'amplitude',
             'period',
             'offset',
-            'dataRateInHz',
-            'phase',
+            'dataRateInHz'
         ];
 
-        request = request || {};
-
         var workerRequest = {};
 
         props.forEach(function (prop) {
@@ -71,7 +67,7 @@ define([
             }
             workerRequest[prop] = Number(workerRequest[prop]);
         });
-        workerRequest.name = domainObject.name;
+
         return workerRequest;
     };
 

example/generator/StateGeneratorProvider.js

@@ -1,80 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2017, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-define([
-
-], function (
-
-) {
-
-    function StateGeneratorProvider() {
-
-    }
-
-    function pointForTimestamp(timestamp, duration, name) {
-        return {
-            name: name,
-            utc: Math.floor(timestamp / duration) * duration,
-            value: Math.floor(timestamp / duration) % 2
-        };
-    }
-
-    StateGeneratorProvider.prototype.supportsSubscribe = function (domainObject) {
-        return domainObject.type === 'example.state-generator';
-    };
-
-    StateGeneratorProvider.prototype.subscribe = function (domainObject, callback) {
-        var duration = domainObject.telemetry.duration * 1000;
-
-        var interval = setInterval(function () {
-            var now = Date.now();
-            callback(pointForTimestamp(now, duration, domainObject.name));
-        }, duration);
-
-        return function () {
-            clearInterval(interval);
-        };
-    };
-
-
-    StateGeneratorProvider.prototype.supportsRequest = function (domainObject, options) {
-        return domainObject.type === 'example.state-generator';
-    };
-
-    StateGeneratorProvider.prototype.request = function (domainObject, options) {
-        var start = options.start;
-        var end = options.end;
-        var duration = domainObject.telemetry.duration * 1000;
-        if (options.strategy === 'latest' || options.size === 1) {
-            start = end;
-        }
-        var data = [];
-        while (start <= end && data.length < 5000) {
-            data.push(pointForTimestamp(start, duration, domainObject.name));
-            start += 5000;
-        }
-        return Promise.resolve(data);
-    };
-
-    return StateGeneratorProvider;
-
-});

example/generator/generatorWorker.js

@@ -62,11 +62,10 @@
                 self.postMessage({
                     id: message.id,
                     data: {
-                        name: data.name,
                         utc: nextStep,
                         yesterday: nextStep - 60*60*24*1000,
-                        sin: sin(nextStep, data.period, data.amplitude, data.offset, data.phase),
-                        cos: cos(nextStep, data.period, data.amplitude, data.offset, data.phase)
+                        sin: sin(nextStep, data.period, data.amplitude, data.offset),
+                        cos: cos(nextStep, data.period, data.amplitude, data.offset)
                     }
                 });
                 nextStep += step;
@@ -83,22 +82,21 @@
     }
 
     function onRequest(message) {
-        var request = message.data;
-        if (request.end == undefined) {
-            request.end = Date.now();
+        var data = message.data;
+        if (data.end == undefined) {
+            data.end = Date.now();
         }
-        if (request.start == undefined){
-            request.start = request.end - FIFTEEN_MINUTES;
+        if (data.start == undefined){
+            data.start = data.end - FIFTEEN_MINUTES;
         }
 
         var now = Date.now();
-        var start = request.start;
-        var end = request.end > now ? now : request.end;
-        var amplitude = request.amplitude;
-        var period = request.period;
-        var offset = request.offset;
-        var dataRateInHz = request.dataRateInHz;
-        var phase = request.phase;
+        var start = data.start;
+        var end = data.end > now ? now : data.end;
+        var amplitude = data.amplitude;
+        var period = data.period;
+        var offset = data.offset;
+        var dataRateInHz = data.dataRateInHz;
 
         var step = 1000 / dataRateInHz;
         var nextStep = start - (start % step) + step;
@@ -107,11 +105,10 @@
 
         for (; nextStep < end && data.length < 5000; nextStep += step) {
             data.push({
-                name: request.name,
                 utc: nextStep,
                 yesterday: nextStep - 60*60*24*1000,
-                sin: sin(nextStep, period, amplitude, offset, phase),
-                cos: cos(nextStep, period, amplitude, offset, phase)
+                sin: sin(nextStep, period, amplitude, offset),
+                cos: cos(nextStep, period, amplitude, offset)
             });
         }
         self.postMessage({
@@ -120,14 +117,14 @@
         });
     }
 
-    function cos(timestamp, period, amplitude, offset, phase) {
+    function cos(timestamp, period, amplitude, offset) {
         return amplitude *
-            Math.cos(phase + (timestamp / period / 1000 * Math.PI * 2)) + offset;
+            Math.cos(timestamp / period / 1000 * Math.PI * 2) + offset;
     }
 
-    function sin(timestamp, period, amplitude, offset, phase) {
+    function sin(timestamp, period, amplitude, offset) {
         return amplitude *
-            Math.sin(phase + (timestamp / period / 1000 * Math.PI * 2)) + offset;
+            Math.sin(timestamp / period / 1000 * Math.PI * 2) + offset;
     }
 
     function sendError(error, message) {

example/generator/plugin.js

@@ -23,12 +23,10 @@
 
 define([
     "./GeneratorProvider",
-    "./SinewaveLimitCapability",
-    "./StateGeneratorProvider"
+    "./SinewaveLimitCapability"
 ], function (
     GeneratorProvider,
-    SinewaveLimitCapability,
-    StateGeneratorProvider
+    SinewaveLimitCapability
 ) {
 
     var legacyExtensions = {
@@ -48,75 +46,6 @@ define([
                 openmct.legacyExtension(type, extension)
             })
         });
-
-        openmct.types.addType("example.state-generator", {
-            name: "State Generator",
-            description: "For development use.  Generates test enumerated telemetry by cycling through a given set of states",
-            cssClass: "icon-telemetry",
-            creatable: true,
-            form: [
-                {
-                    name: "State Duration (seconds)",
-                    control: "textfield",
-                    cssClass: "l-input-sm l-numeric",
-                    key: "duration",
-                    required: true,
-                    property: [
-                        "telemetry",
-                        "duration"
-                    ],
-                    pattern: "^\\d*(\\.\\d*)?$"
-                }
-            ],
-            initialize: function (object) {
-                object.telemetry = {
-                    duration: 5,
-                    values: [
-                        {
-                            key: "name",
-                            name: "Name"
-                        },
-                        {
-                            key: "utc",
-                            name: "Time",
-                            format: "utc",
-                            hints: {
-                                domain: 1
-                            }
-                        },
-                        {
-                            key: "state",
-                            source: "value",
-                            name: "State",
-                            format: "enum",
-                            enumerations: [
-                                {
-                                    value: 0,
-                                    string: "OFF"
-                                },
-                                {
-                                    value: 1,
-                                    string: "ON"
-                                }
-                            ],
-                            hints: {
-                                range: 1
-                            }
-                        },
-                        {
-                            key: "value",
-                            name: "Value",
-                            hints: {
-                                range: 2
-                            }
-                        }
-                    ]
-                }
-            }
-        });
-
-        openmct.telemetry.addProvider(new StateGeneratorProvider());
-
         openmct.types.addType("generator", {
             name: "Sine Wave Generator",
             description: "For development use. Generates example streaming telemetry data using a simple sine wave algorithm.",
@@ -170,18 +99,6 @@ define([
                         "dataRateInHz"
                     ],
                     pattern: "^\\d*(\\.\\d*)?$"
-                },
-                {
-                    name: "Phase (radians)",
-                    control: "textfield",
-                    cssClass: "l-input-sm l-numeric",
-                    key: "phase",
-                    required: true,
-                    property: [
-                        "telemetry",
-                        "phase"
-                    ],
-                    pattern: "^\\d*(\\.\\d*)?$"
                 }
             ],
             initialize: function (object) {
@@ -190,12 +107,7 @@ define([
                     amplitude: 1,
                     offset: 0,
                     dataRateInHz: 1,
-                    phase: 0,
                     values: [
-                        {
-                            key: "name",
-                            name: "Name"
-                        },
                         {
                             key: "utc",
                             name: "Time",
@@ -230,7 +142,6 @@ define([
                 };
             }
         });
-
         openmct.telemetry.addProvider(new GeneratorProvider());
     };
 

example/identity/bundle.js

@@ -38,7 +38,8 @@ define([
                     "provides": "identityService",
                     "type": "provider",
                     "depends": [
-                        "dialogService"
+                        "dialogService",
+                        "$q"
                     ]
                 }
             ]

example/identity/src/ExampleIdentityService.js

@@ -55,21 +55,37 @@ define(
          * @implements {IdentityService}
          * @memberof platform/identity
          */
-        function ExampleIdentityProvider(dialogService) {
-            // Handle rejected dialog messages by treating the
-            // current user as undefined.
-            function echo(v) { return v; }
-            function giveUndefined() { return undefined; }
+        function ExampleIdentityProvider(dialogService, $q) {
+            this.dialogService = dialogService;
+            this.$q = $q;
 
-            this.userPromise =
-                dialogService.getUserInput(DIALOG_STRUCTURE, DEFAULT_IDENTITY)
-                    .then(echo, giveUndefined);
+            this.returnUser = this.returnUser.bind(this);
+            this.returnUndefined = this.returnUndefined.bind(this);
         }
 
         ExampleIdentityProvider.prototype.getUser = function () {
-            return this.userPromise;
+            if (this.user) {
+                return this.$q.when(this.user);
+            } else {
+                return this.dialogService.getUserInput(DIALOG_STRUCTURE, DEFAULT_IDENTITY)
+                    .then(this.returnUser, this.returnUndefined);
+            }
         };
 
+        /**
+         * @private
+         */
+        ExampleIdentityProvider.prototype.returnUser = function (user) {
+            return this.user = user;
+        }
+
+        /**
+         * @private
+         */
+        ExampleIdentityProvider.prototype.returnUndefined = function () {
+            return undefined;
+        }
+
         return ExampleIdentityProvider;
     }
 );

example/imagery/plugin.js

@@ -48,9 +48,8 @@ define([
                 "https://www.hq.nasa.gov/alsj/a16/AS16-117-18748.jpg"
             ];
 
-        function pointForTimestamp(timestamp, name) {
+        function pointForTimestamp(timestamp) {
             return {
-                name: name,
                 utc: Math.floor(timestamp / 5000) * 5000,
                 url: IMAGE_SAMPLES[Math.floor(timestamp / 5000) % IMAGE_SAMPLES.length]
             };
@@ -62,7 +61,7 @@ define([
             },
             subscribe: function (domainObject, callback) {
                 var interval = setInterval(function () {
-                    callback(pointForTimestamp(Date.now(), domainObject.name));
+                    callback(pointForTimestamp(Date.now()));
                 }, 5000);
 
                 return function (interval) {
@@ -80,8 +79,8 @@ define([
                 var start = options.start;
                 var end = options.end;
                 var data = [];
-                while (start <= end && data.length < 5000) {
-                    data.push(pointForTimestamp(start, domainObject.name));
+                while (start < end && data.length < 5000) {
+                    data.push(pointForTimestamp(start));
                     start += 5000;
                 }
                 return Promise.resolve(data);
@@ -94,7 +93,7 @@ define([
                     options.strategy === 'latest';
             },
             request: function (domainObject, options) {
-                return Promise.resolve([pointForTimestamp(Date.now(), domainObject.name)]);
+                return Promise.resolve([pointForTimestamp(Date.now())]);
             }
         };
 
@@ -110,10 +109,6 @@ define([
                 initialize: function (object) {
                     object.telemetry = {
                         values: [
-                            {
-                                name: 'Name',
-                                key: 'name'
-                            },
                             {
                                 name: 'Time',
                                 key: 'utc',

example/notifications/res/dialog-launch.html

@@ -1,9 +1,9 @@
-<span class="status block" ng-controller="DialogLaunchController">
+<span class="l-indicator s-indicator icon-box-with-arrow" ng-controller="DialogLaunchController">
     <!-- DO NOT ADD SPACES BETWEEN THE SPANS - IT ADDS WHITE SPACE!! -->
-    <span class="status-indicator icon-box-with-arrow"></span><span class="label">
+    <span class="label">
         <a ng-click="launchProgress(true)">Known</a> |
         <a ng-click="launchProgress(false)">Unknown</a> |
         <a ng-click="launchError()">Error</a> |
         <a ng-click="launchInfo()">Info</a>
-    </span><span class="count"></span>
+    </span>
 </span>

example/notifications/res/notification-launch.html

@@ -1,9 +1,9 @@
-<span class="status block" ng-controller="NotificationLaunchController">
+<span class="l-indicator s-indicator icon-bell" ng-controller="NotificationLaunchController">
     <!-- DO NOT ADD SPACES BETWEEN THE SPANS - IT ADDS WHITE SPACE!! -->
-    <span class="status-indicator icon-bell"></span><span class="label">
+    <span class="label">
         <a ng-click="newInfo()">Success</a> |
         <a ng-click="newError()">Error</a> |
         <a ng-click="newAlert()">Alert</a> |
         <a ng-click="newProgress()">Progress</a>
-    </span><span class="count"></span>
+    </span>
 </span>

example/plotOptions/bundle.js

@@ -0,0 +1,146 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2017, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+/*global define*/
+
+define([
+    'legacyRegistry',
+    '../../platform/commonUI/browse/src/InspectorRegion',
+    '../../platform/commonUI/regions/src/Region'
+], function (
+    legacyRegistry,
+    InspectorRegion,
+    Region
+) {
+    "use strict";
+
+    /**
+     * Add a 'plot options' region part to the inspector region for the
+     * Telemetry Plot type only. {@link InspectorRegion} is a default region
+     * implementation that is added automatically to all types. In order to
+     * customize what appears in the inspector region, you can start from a
+     * blank slate by using Region, or customize the default inspector
+     * region by using {@link InspectorRegion}.
+     */
+    var plotInspector = new InspectorRegion(),
+     /**
+      * Two region parts are defined here. One that appears only in browse
+      * mode, and one that appears only in edit mode. For not they both point
+      * to the same representation, but a different key could be used here to
+      * include a customized representation for edit mode.
+      */
+        plotOptionsBrowseRegion = new Region({
+            name: "plot-options",
+            title: "Plot Options",
+            modes: ['browse'],
+            content: {
+                key: "plot-options-browse"
+            }
+        }),
+        plotOptionsEditRegion = new Region({
+            name: "plot-options",
+            title: "Plot Options",
+            modes: ['edit'],
+            content: {
+                key: "plot-options-browse"
+            }
+        });
+
+    /**
+     * Both parts are added, and policies of type 'region' will determine
+     * which is shown based on domain object state. A default policy is
+     * provided which will check the 'modes' attribute of the region part
+     * definition.
+     */
+    plotInspector.addRegion(plotOptionsBrowseRegion);
+    plotInspector.addRegion(plotOptionsEditRegion);
+
+    legacyRegistry.register("example/plotType", {
+        "name": "Plot Type",
+        "description": "Example illustrating registration of a new object type",
+        "extensions": {
+            "types": [
+                {
+                    "key": "plot",
+                    "name": "Example Telemetry Plot",
+                    "cssClass": "icon-telemetry-panel",
+                    "description": "For development use. A plot for displaying telemetry.",
+                    "priority": 10,
+                    "delegates": [
+                        "telemetry"
+                    ],
+                    "features": "creation",
+                    "contains": [
+                        {
+                            "has": "telemetry"
+                        }
+                    ],
+                    "model": {
+                        "composition": []
+                    },
+                    "inspector": plotInspector,
+                    "telemetry": {
+                        "source": "generator",
+                        "domains": [
+                            {
+                                "key": "time",
+                                "name": "Time"
+                            },
+                            {
+                                "key": "yesterday",
+                                "name": "Yesterday"
+                            },
+                            {
+                                "key": "delta",
+                                "name": "Delta",
+                                "format": "example.delta"
+                            }
+                        ],
+                        "ranges": [
+                            {
+                                "key": "sin",
+                                "name": "Sine"
+                            },
+                            {
+                                "key": "cos",
+                                "name": "Cosine"
+                            }
+                        ]
+                    },
+                    "properties": [
+                        {
+                            "name": "Period",
+                            "control": "textfield",
+                            "cssClass": "l-input-sm l-numeric",
+                            "key": "period",
+                            "required": true,
+                            "property": [
+                                "telemetry",
+                                "period"
+                            ],
+                            "pattern": "^\\d*(\\.\\d*)?$"
+                        }
+                    ]
+                }
+            ]
+        }
+    });
+});

example/styleguide/res/sass/_style-guide-base.scss

@@ -58,7 +58,11 @@
         position: relative;
     }
 
-    .w-mct-example > div { margin-bottom: $interiorMarginLg; }
+    .w-mct-example {
+        div {
+            margin-bottom: $interiorMarginLg;
+        }
+    }
 
     code,
     pre {

example/styleguide/res/templates/status.html

@@ -129,6 +129,44 @@
         </div>
     </div>
 
+    <div class="l-section">
+        <h2>Status Bar Indicators</h2>
+        <div class="cols cols1-1">
+            <div class="col">
+                <p>Indicators content goes here.</p>
+            </div>
+<mct-example><div class="status-holder s-status-bar">
+<span class="status-block-holder">
+    <span class="l-indicator s-indicator">
+        <span class="status-indicator icon-bell"></span>
+        <span class="label">Collapsible Indicator</span>
+    </span>
+</span>
+<span class="status-block-holder no-collapse caution">
+    <span class="l-indicator s-indicator">
+        <span class="status-indicator icon-bell"></span>
+        <span class="label">No collapse</span>
+    </span>
+</span>
+</div>
+<div class="status-holder s-status-bar">
+<span class="status-block-holder">
+    <span class="l-indicator s-indicator">
+        <span class="status-indicator icon-bell"></span>
+        <span class="label">Collapsible Indicator</span>
+    </span>
+</span>
+    <span class="status-block-holder">
+    <span class="status block s-status-info icon-info">
+        <span class="label">No collapse</span>
+    </span>
+</span>
+</div>
+</mct-example>
+        </div>
+    </div>
+
+
     <div class="l-section">
         <h2>Synchronization</h2>
         <div class="cols cols1-1">

example/worker/src/FibonacciIndicator.js

@@ -54,7 +54,7 @@ define(
                     return "icon-object-unknown";
                 },
                 getText: function () {
-                    return latest;
+                    return "" + latest;
                 },
                 getDescription: function () {
                     return "";

index.html

@@ -68,7 +68,6 @@
                 ]
             }));
             openmct.install(openmct.plugins.SummaryWidget());
-            openmct.install(openmct.plugins.Notebook());
             openmct.time.clock('local', {start: -THIRTY_MINUTES, end: 0});
             openmct.time.timeSystem('utc');
             openmct.start();

karma.conf.js

@@ -37,14 +37,14 @@ module.exports = function(config) {
             {pattern: 'bower_components/**/*.js', included: false},
             {pattern: 'node_modules/d3-*/**/*.js', included: false},
             {pattern: 'node_modules/vue/**/*.js', included: false},
-            {pattern: 'src/**/*', included: false},
-            {pattern: 'node_modules/@cristian77/**/*.js', included: false},
+            {pattern: 'src/**/*.js', included: false},
             {pattern: 'example/**/*.html', included: false},
             {pattern: 'example/**/*.js', included: false},
             {pattern: 'example/**/*.json', included: false},
             {pattern: 'platform/**/*.js', included: false},
             {pattern: 'warp/**/*.js', included: false},
             {pattern: 'platform/**/*.html', included: false},
+            {pattern: 'src/**/*.html', included: false},
             'test-main.js'
         ],
 
@@ -89,8 +89,7 @@ module.exports = function(config) {
                 "dist/reports/coverage",
             check: {
                 global: {
-                    lines: 80,
-                    excludes: ['src/plugins/plot/**/*.js']
+                    lines: 80
                 }
             }
         },

openmct.js

@@ -40,7 +40,7 @@ requirejs.config({
         "vue": "node_modules/vue/dist/vue.min",
         "zepto": "bower_components/zepto/zepto.min",
         "lodash": "bower_components/lodash/lodash",
-        "d3-selection": "node_modules/d3-selection/dist/d3-selection.min",
+        "d3-selection": "node_modules/d3-selection/build/d3-selection.min",
         "d3-scale": "node_modules/d3-scale/build/d3-scale.min",
         "d3-axis": "node_modules/d3-axis/build/d3-axis.min",
         "d3-array": "node_modules/d3-array/build/d3-array.min",
@@ -49,9 +49,7 @@ requirejs.config({
         "d3-format": "node_modules/d3-format/build/d3-format.min",
         "d3-interpolate": "node_modules/d3-interpolate/build/d3-interpolate.min",
         "d3-time": "node_modules/d3-time/build/d3-time.min",
-        "d3-time-format": "node_modules/d3-time-format/build/d3-time-format.min",
-        "dom-to-image": "node_modules/dom-to-image/src/dom-to-image",
-        "painterro": "node_modules/@cristian77/painterro/build/painterro.min"
+        "d3-time-format": "node_modules/d3-time-format/build/d3-time-format.min"
     },
     "shim": {
         "angular": {
@@ -69,9 +67,6 @@ requirejs.config({
         "moment-duration-format": {
             "deps": ["moment"]
         },
-        "painterro": {
-            "exports": "Painterro"
-        },
         "saveAs": {
             "exports": "saveAs"
         },
@@ -93,9 +88,6 @@ requirejs.config({
         },
         "d3-axis": {
             "exports": "d3-axis"
-        },
-        "dom-to-image": {
-            "exports": "dom-to-image"
         }
     }
 });
@@ -109,7 +101,6 @@ define([
     var openmct = new MCT();
 
     openmct.legacyRegistry = defaultRegistry;
-    openmct.install(openmct.plugins.Plot());
 
     if (typeof BUILD_CONSTANTS !== 'undefined') {
         openmct.install(buildInfo(BUILD_CONSTANTS));

package.json

@@ -1,9 +1,8 @@
 {
   "name": "openmct",
-  "version": "0.13.3-SNAPSHOT",
+  "version": "0.12.1-SNAPSHOT",
   "description": "The Open MCT core platform",
   "dependencies": {
-    "@cristian77/painterro": "^0.2.48",
     "d3-array": "^1.0.2",
     "d3-axis": "^1.0.4",
     "d3-collection": "^1.0.2",
@@ -14,7 +13,6 @@
     "d3-selection": "^1.0.3",
     "d3-time": "^1.0.4",
     "d3-time-format": "^2.0.3",
-    "dom-to-image": "^2.6.0",
     "express": "^4.13.1",
     "minimist": "^1.1.1",
     "request": "^2.69.0",
@@ -30,7 +28,7 @@
     "gulp-jshint-html-reporter": "^0.1.3",
     "gulp-rename": "^1.2.2",
     "gulp-requirejs-optimize": "^0.3.1",
-    "gulp-sass": "^3.1.0",
+    "gulp-sass": "^2.2.0",
     "gulp-sourcemaps": "^1.6.0",
     "jasmine-core": "^2.3.0",
     "jscs-html-reporter": "^0.1.0",

platform/commonUI/browse/res/templates/browse/object-properties.html

@@ -38,7 +38,6 @@
                   ng-class="{ last:($index + 1) === contextualParents.length }">
                 <mct-representation key="'label'"
                                     mct-object="parent"
-                                    ng-click="parent.getCapability('action').perform('navigate')"
                                     class="location-item">
                 </mct-representation>
             </span>
@@ -50,7 +49,6 @@
                   ng-class="{ last:($index + 1) === primaryParents.length }">
                 <mct-representation key="'label'"
                                     mct-object="parent"
-                                    ng-click="parent.getCapability('action').perform('navigate')"
                                     class="location-item">
                 </mct-representation>
             </span>

platform/commonUI/edit/src/controllers/ElementsController.js

@@ -52,22 +52,8 @@ define(
             }
 
             function setSelection(selection) {
-                if (!selection[0]) {
-                    return;
-                }
-
-                if (self.mutationListener) {
-                    self.mutationListener();
-                    delete self.mutationListener;
-                }
-
-                var domainObject = selection[0].context.oldItem;
-                self.refreshComposition(domainObject);
-
-                if (domainObject) {
-                    self.mutationListener = domainObject.getCapability('mutation')
-                        .listen(self.refreshComposition.bind(self, domainObject));
-                }
+                self.scope.selection = selection;
+                self.refreshComposition(selection);
             }
 
             $scope.filterBy = filterBy;
@@ -84,19 +70,20 @@ define(
         /**
          * Gets the composition for the selected object and populates the scope with it.
          *
-         * @param domainObject the selected object
+         * @param selection the selection object
          * @private
          */
-        ElementsController.prototype.refreshComposition = function (domainObject) {
-            var refreshTracker = {};
-            this.currentRefresh = refreshTracker;
+        ElementsController.prototype.refreshComposition = function (selection) {
+            if (!selection[0]) {
+                return;
+            }
+
+            var selected = selection[0].context.oldItem;
+            var selectedObjectComposition = selected && selected.useCapability('composition');
 
-            var selectedObjectComposition = domainObject && domainObject.useCapability('composition');
             if (selectedObjectComposition) {
                 selectedObjectComposition.then(function (composition) {
-                    if (this.currentRefresh === refreshTracker) {
-                        this.scope.composition = composition;
-                    }
+                    this.scope.composition = composition;
                 }.bind(this));
             } else {
                 this.scope.composition = [];

platform/commonUI/edit/test/controllers/ElementsControllerSpec.js

@@ -29,48 +29,9 @@ define(
             var mockScope,
                 mockOpenMCT,
                 mockSelection,
-                mockDomainObject,
-                mockMutationCapability,
-                mockCompositionCapability,
-                mockCompositionObjects,
-                mockComposition,
-                mockUnlisten,
-                selectable = [],
                 controller;
 
-            function mockPromise(value) {
-                return {
-                    then: function (thenFunc) {
-                        return mockPromise(thenFunc(value));
-                    }
-                };
-            }
-
-            function createDomainObject() {
-                return {
-                    useCapability: function () {
-                        return mockCompositionCapability;
-                    }
-                };
-            }
-
             beforeEach(function () {
-                mockComposition = ["a", "b"];
-                mockCompositionObjects = mockComposition.map(createDomainObject);
-                mockCompositionCapability = mockPromise(mockCompositionObjects);
-
-                mockUnlisten = jasmine.createSpy('unlisten');
-                mockMutationCapability = jasmine.createSpyObj("mutationCapability", [
-                    "listen"
-                ]);
-                mockMutationCapability.listen.andReturn(mockUnlisten);
-                mockDomainObject = jasmine.createSpyObj("domainObject", [
-                    "getCapability",
-                    "useCapability"
-                ]);
-                mockDomainObject.useCapability.andReturn(mockCompositionCapability);
-                mockDomainObject.getCapability.andReturn(mockMutationCapability);
-
                 mockScope = jasmine.createSpyObj("$scope", ['$on']);
                 mockSelection = jasmine.createSpyObj("selection", [
                     'on',
@@ -82,14 +43,6 @@ define(
                     selection: mockSelection
                 };
 
-                selectable[0] = {
-                    context: {
-                        oldItem: mockDomainObject
-                    }
-                };
-
-                spyOn(ElementsController.prototype, 'refreshComposition').andCallThrough();
-
                 controller = new ElementsController(mockScope, mockOpenMCT);
             });
 
@@ -122,63 +75,6 @@ define(
                 expect(objects.filter(mockScope.searchElements).length).toBe(4);
             });
 
-            it("refreshes composition on selection", function () {
-                mockOpenMCT.selection.on.mostRecentCall.args[1](selectable);
-
-                expect(ElementsController.prototype.refreshComposition).toHaveBeenCalledWith(mockDomainObject);
-            });
-
-            it("listens on mutation and refreshes composition", function () {
-                mockOpenMCT.selection.on.mostRecentCall.args[1](selectable);
-
-                expect(mockDomainObject.getCapability).toHaveBeenCalledWith('mutation');
-                expect(mockMutationCapability.listen).toHaveBeenCalled();
-                expect(ElementsController.prototype.refreshComposition.calls.length).toBe(1);
-
-                mockMutationCapability.listen.mostRecentCall.args[0](mockDomainObject);
-
-                expect(ElementsController.prototype.refreshComposition.calls.length).toBe(2);
-            });
-
-            it("cleans up mutation listener when selection changes", function () {
-                mockOpenMCT.selection.on.mostRecentCall.args[1](selectable);
-
-                expect(mockMutationCapability.listen).toHaveBeenCalled();
-
-                mockOpenMCT.selection.on.mostRecentCall.args[1](selectable);
-
-                expect(mockUnlisten).toHaveBeenCalled();
-            });
-
-            it("does not listen on mutation for element proxy selectable", function () {
-                selectable[0] = {
-                    context: {
-                        elementProxy: {}
-                    }
-                };
-                mockOpenMCT.selection.on.mostRecentCall.args[1](selectable);
-
-                expect(mockDomainObject.getCapability).not.toHaveBeenCalledWith('mutation');
-            });
-
-            it("checks concurrent changes to composition", function () {
-                var secondMockComposition = ["a", "b", "c"],
-                    secondMockCompositionObjects = secondMockComposition.map(createDomainObject),
-                    firstCompositionCallback,
-                    secondCompositionCallback;
-
-                spyOn(mockCompositionCapability, "then").andCallThrough();
-
-                controller.refreshComposition(mockDomainObject);
-                controller.refreshComposition(mockDomainObject);
-
-                firstCompositionCallback = mockCompositionCapability.then.calls[0].args[0];
-                secondCompositionCallback = mockCompositionCapability.then.calls[1].args[0];
-                secondCompositionCallback(secondMockCompositionObjects);
-                firstCompositionCallback(mockCompositionObjects);
-
-                expect(mockScope.composition).toBe(secondMockCompositionObjects);
-            });
         });
     }
 );

platform/commonUI/general/bundle.js

@@ -34,7 +34,6 @@ define([
     "./src/controllers/ContextMenuController",
     "./src/controllers/ClickAwayController",
     "./src/controllers/ViewSwitcherController",
-    "./src/controllers/BottomBarController",
     "./src/controllers/GetterSetterController",
     "./src/controllers/SelectorController",
     "./src/controllers/ObjectInspectorController",
@@ -49,11 +48,12 @@ define([
     "./src/directives/MCTSplitPane",
     "./src/directives/MCTSplitter",
     "./src/directives/MCTTree",
+    "./src/directives/MCTIndicators",
     "./src/filters/ReverseFilter",
     "text!./res/templates/bottombar.html",
     "text!./res/templates/controls/action-button.html",
     "text!./res/templates/controls/input-filter.html",
-    "text!./res/templates/indicator.html",
+    "text!./res/templates/angular-indicator.html",
     "text!./res/templates/message-banner.html",
     "text!./res/templates/progress-bar.html",
     "text!./res/templates/controls/time-controller.html",
@@ -84,7 +84,6 @@ define([
     ContextMenuController,
     ClickAwayController,
     ViewSwitcherController,
-    BottomBarController,
     GetterSetterController,
     SelectorController,
     ObjectInspectorController,
@@ -99,6 +98,7 @@ define([
     MCTSplitPane,
     MCTSplitter,
     MCTTree,
+    MCTIndicators,
     ReverseFilter,
     bottombarTemplate,
     actionButtonTemplate,
@@ -275,13 +275,6 @@ define([
                         "$timeout"
                     ]
                 },
-                {
-                    "key": "BottomBarController",
-                    "implementation": BottomBarController,
-                    "depends": [
-                        "indicators[]"
-                    ]
-                },
                 {
                     "key": "GetterSetterController",
                     "implementation": GetterSetterController,
@@ -395,6 +388,11 @@ define([
                     "key": "mctTree",
                     "implementation": MCTTree,
                     "depends": ['gestureService']
+                },
+                {
+                    "key": "mctIndicators",
+                    "implementation": MCTIndicators,
+                    "depends": ['openmct']
                 }
             ],
             "constants": [

platform/commonUI/general/res/sass/_constants.scss

@@ -99,7 +99,7 @@ $plotXBarH: 32px;
 $plotLegendH: 20px;
 $plotSwatchD: 8px;
 // 1: Top, 2: right, 3: bottom, 4: left
-$plotDisplayArea: (0, 0, $plotXBarH, $plotYBarW);
+$plotDisplayArea: ($plotLegendH + $interiorMargin, 0, $plotXBarH, $plotYBarW);
 /* min plot height is based on user testing to find minimum useful height */
 $plotMinH: 95px;
 /*************** Bubbles */

platform/commonUI/general/res/sass/_global.scss

@@ -40,7 +40,7 @@
     * Use https://icomoon.io/app with icomoon-project-openmct-symbols-12px.json
     * to generate font files
     */
-    font-family: 'symbolsfont-12px';
+    font-family: 'symbolsfont 12px';
     src: url($dirCommonRes + 'fonts/symbols/openmct-symbols-12px.eot');
     src: url($dirCommonRes + 'fonts/symbols/openmct-symbols-12px.eot?#iefix') format('embedded-opentype'),
     url($dirCommonRes + 'fonts/symbols/openmct-symbols-12px.woff') format('woff'),
@@ -248,12 +248,6 @@ a.disabled {
     color: rgba(#fff, 0.2);
 }
 
-.comma-list span {
-    &:not(:first-child) {
-        &:before { content: ', '; }
-    }
-}
-
 .test-stripes {
     @include bgDiagonalStripes();
 }

platform/commonUI/general/res/sass/_glyphs.scss

@@ -33,14 +33,6 @@
     }
 }
 
-[class*="icon-"].labeled {
-    // Moved from .s-button and generalized
-    &:before {
-        // Fend off label from icon when it's included
-        margin-right: $interiorMarginSm;
-    }
-}
-
 /************************** CHAR UNICODES */
 
 $glyph-icon-alert-rect: '\e900';

platform/commonUI/general/res/sass/_icons.scss

@@ -44,12 +44,6 @@
     }
 }
 
-
-.t-alert-unsynced {
-    @extend .icon-alert-triangle;
-    color: $colorPausedBg;
-}
-
 .bar .ui-symbol {
 	display: inline-block;
 }
@@ -87,5 +81,18 @@
             @include transform(scale(0.3));
             z-index: 2;
         }
+
+/*        .t-item-icon-glyph {
+            &:after {
+                color: $colorIconLink;
+                content: '\e921'; //$glyph-icon-link;
+                height: auto; width: auto;
+                position: absolute;
+                left: 0; top: 0; right: 0; bottom: 20%;
+                @include transform-origin(bottom left);
+                @include transform(scale(0.3));
+                z-index: 2;
+            }
+        }*/
     }
 }

platform/commonUI/general/res/sass/_inspector.scss

@@ -53,7 +53,6 @@
     .l-inspector-part {
         box-sizing: border-box;
         padding-right: $interiorMargin;
-
         .tree .form {
             margin-left: $treeVCW + $interiorMarginLg;
         }
@@ -79,7 +78,6 @@
                 }
             }
             .form-row {
-                // To be replaced with .inspector-config, see below.
                 @include align-items(center);
                 border: none !important;
                 margin-bottom: 0 !important;
@@ -101,12 +99,15 @@
         position: relative;
     }
 
+    ul li {
+        margin-bottom: $interiorMarginLg;
+    }
+
     em.t-inspector-part-header {
         border-radius: $basicCr;
         background-color: $colorInspectorSectionHeaderBg;
         color: $colorInspectorSectionHeaderFg;
-        margin-top: $interiorMarginLg;
-        //margin-bottom: $interiorMargin;
+        margin-bottom: $interiorMargin;
         padding: floor($formTBPad * .75) $formLRPad;
         text-transform: uppercase;
     }
@@ -200,102 +201,3 @@ mct-representation:not(.s-status-editing) .l-inspect {
         pointer-events: inherit;
     }
 }
-
-// NEW COMPACT FORM, FOR USE IN INSPECTOR
-// ul > li > label, control
-// Make a new UL for each form section
-// Allow control-first, controls-below
-
-.l-inspect .tree ul li,
-.inspector-config ul li {
-    padding: 2px 0;
-}
-
-
-.inspector-config {
-    $labelW: 40%;
-    $minW: $labelW;
-    ul {
-        margin-bottom: $interiorMarginLg;
-        li {
-            @include display(flex);
-            @include flex-wrap(wrap);
-            @include align-items(center);
-            label,
-            .control {
-                @include display(flex);
-                min-width: $minW;
-            }
-            label {
-                line-height: inherit;
-                padding: $interiorMarginSm 0;
-                width: $labelW;
-            }
-            .control {
-                @include flex-grow(1);
-            }
-
-            &:not(.section-header) {
-                &:not(.connects-to-previous) {
-                    //border-top: 1px solid $colorFormLines;
-                }
-            }
-
-            &.connects-to-previous {
-                padding-top: 0 !important;
-            }
-
-            &.section-header {
-                margin-top: $interiorMarginLg;
-                border-top: 1px solid $colorFormLines;
-            }
-
-            &.controls-first {
-                .control {
-                    @include flex-grow(0);
-                    margin-right: $interiorMargin;
-                    min-width: 0;
-                    order: 1;
-                    width: auto;
-                }
-                label {
-                    @include flex-grow(1);
-                    order: 2;
-                    width: auto;
-                }
-            }
-            &.controls-under {
-                display: block;
-                .control, label {
-                    display: block;
-                    width: auto;
-                }
-
-                ul li {
-                    border-top: none !important;
-                    padding: 0;
-                }
-            }
-        }
-    }
-
-    .form-error {
-        // Block element that visually flags an error and contains a message
-        background-color: $colorFormFieldErrorBg;
-        color: $colorFormFieldErrorFg;
-        border-radius: $basicCr;
-        display: block;
-        padding: 1px 6px;
-        &:before {
-            content: $glyph-icon-alert-triangle;
-            display: inline;
-            font-family: symbolsfont;
-            margin-right: $interiorMarginSm;
-        }
-    }
-}
-
-.tree .inspector-config {
-    margin-left: $treeVCW + $interiorMarginLg;
-}
-

platform/commonUI/general/res/sass/_main.scss

@@ -42,6 +42,7 @@
 @import "controls/lists";
 @import "controls/menus";
 @import "controls/messages";
+@import "controls/indicators";
 @import "mobile/controls/menus";
 
 /********************************* FORMS */
@@ -70,7 +71,6 @@
 @import "fixed-position";
 @import "lists/tabular";
 @import "plots/plots-main";
-@import "plots/legend";
 @import "iframe";
 @import "views";
 @import "items/item";

platform/commonUI/general/res/sass/_status.scss

@@ -20,13 +20,15 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 /*************************************************** MIXINS */
-@mixin formulateStatusColors($c) {
+@mixin elementStatusColors($c) {
     // Sets bg and icon colors for elements
     background: rgba($c, 0.4) !important;
     &:before { color: $c !important; }
 }
 
-
+@mixin indicatorStatusColors($c) {
+    &:before, .count { color: $c; }
+}
 
 /*************************************************** GENERAL */
 .s-limit-yellow,
@@ -54,14 +56,13 @@
     }
 }
 
-
 /*************************************************** LIMITS */
 .s-limit-yellow, .s-limit-yellow-icon {
-    @include formulateStatusColors($colorWarningLo);
+    @include elementStatusColors($colorWarningLo);
 }
 
 .s-limit-red, .s-limit-red-icon {
-    @include formulateStatusColors($colorWarningHi);
+    @include elementStatusColors($colorWarningHi);
 }
 
 .s-limit-upr:before { content: $glyph-icon-arrow-double-up; }
@@ -70,11 +71,11 @@
 .s-limit-red-icon:before { content: $glyph-icon-alert-triangle; }
 
 /*************************************************** STATUS */
-.s-status-warning-hi, .s-status-warning-hi-icon {  @include formulateStatusColors($colorWarningHi); }
-.s-status-warning-lo, .s-status-warning-lo-icon {  @include formulateStatusColors($colorWarningLo); }
-.s-status-diagnostic, .s-status-diagnostic-icon {  @include formulateStatusColors($colorDiagnostic); }
-.s-status-info, .s-status-info-icon {  @include formulateStatusColors($colorInfo); }
-.s-status-ok, .s-status-ok-icon {  @include formulateStatusColors($colorOk); }
+.s-status-warning-hi, .s-status-warning-hi-icon {  @include elementStatusColors($colorWarningHi); }
+.s-status-warning-lo, .s-status-warning-lo-icon {  @include elementStatusColors($colorWarningLo); }
+.s-status-diagnostic, .s-status-diagnostic-icon {  @include elementStatusColors($colorDiagnostic); }
+.s-status-info, .s-status-info-icon {  @include elementStatusColors($colorInfo); }
+.s-status-ok, .s-status-ok-icon {  @include elementStatusColors($colorOk); }
 
 .s-status-warning-hi-icon:before { content: $glyph-icon-alert-triangle; }
 .s-status-warning-lo-icon:before { content: $glyph-icon-alert-rect; }
@@ -82,4 +83,25 @@
 .s-status-info-icon:before { content: $glyph-icon-info; }
 .s-status-ok-icon:before { content: $glyph-icon-check; }
 
+/*************************************************** INDICATORS */
+.s-indicator-status-info {
+    @include indicatorStatusColors($colorInfo);
+}
+.s-indicator-status-ok {
+    @include indicatorStatusColors($colorOk);
+}
+.s-indicator-status-caution, .s-indicator-status-warning, .s-indicator-status-alert {
+    @include indicatorStatusColors($colorStatusAlert);
+}
+.s-indicator-status-error, .s-indicator-status-err {
+    @include indicatorStatusColors($colorStatusError);
+}
+.s-indicator-status-available {
+    @include indicatorStatusColors($colorStatusAvailable);
+}
+.s-indicator-status-subdued {
+    opacity: 0.7;
+}
+
+
 

platform/commonUI/general/res/sass/_views.scss

@@ -5,7 +5,6 @@
 }
 
 .l-view-section {
-    //@include test(orange, 0.1);
 	@include absPosDefault(0);
 	h2 {
 		color: #fff;

platform/commonUI/general/res/sass/_widgets.scss

@@ -270,4 +270,37 @@
     @extend .s-summary-widget;
     @extend .l-summary-widget;
     padding: $interiorMarginSm $interiorMargin;
+}
+
+// Hide and show elements in the rule-header on hover
+.l-widget-rule,
+.l-widget-test-data-item {
+    .grippy,
+    .l-rule-action-buttons-wrapper,
+    .l-condition-action-buttons-wrapper,
+    .l-widget-test-data-item-action-buttons-wrapper {
+        @include trans-prop-nice($props: opacity, $dur: 500ms);
+        opacity: 0;
+    }
+    &:hover {
+        .grippy,
+        .l-rule-action-buttons-wrapper,
+        .l-widget-test-data-item-action-buttons-wrapper {
+            @include trans-prop-nice($props: opacity, $dur: 0);
+            opacity: 1;
+        }
+    }
+    .l-rule-action-buttons-wrapper {
+          .t-delete {
+            margin-left: 10px;
+          }
+    }
+    .t-condition {
+        &:hover {
+            .l-condition-action-buttons-wrapper {
+                @include trans-prop-nice($props: opacity, $dur: 0);
+                opacity: 1;
+            }
+        }
+    }
 }

platform/commonUI/general/res/sass/controls/_buttons.scss

@@ -34,6 +34,11 @@ $pad: $interiorMargin * $baseRatio;
     line-height: $btnStdH;
     padding: 0 $pad;
 
+    &.labeled:before {
+        // Icon when it's included
+        margin-right: $interiorMarginSm;
+    }
+
 	&.lg {
 		font-size: 1rem;
 	}

platform/commonUI/general/res/sass/controls/_controls.scss

@@ -150,26 +150,6 @@
     }
 }
 
-/******************************************************** VIEW CONTROLS */
-// Expand/collapse > and v arrows, used in tree and plot legend
-// Moved this over from a tree-only context 5/18/17
-
-.view-control {
-    @extend .ui-symbol;
-    cursor: pointer;
-    height: 1em; width: 1em;
-    line-height: inherit;
-    &:before {
-        position: absolute;
-        @include trans-prop-nice(transform, 100ms);
-        content: $glyph-icon-arrow-right;
-        @include transform-origin(center);
-    }
-    &.expanded:before {
-        @include transform(rotate(90deg));
-    }
-}
-
 /******************************************************** CUSTOM CHECKBOXES */
 label.checkbox.custom,
 label.radio.custom {
@@ -338,7 +318,7 @@ input[type="text"].s-input-inline,
     @include btnSubtle($bg: $colorSelectBg);
     @extend .icon-arrow-down; // Context arrow
     display: inline-block;
-    line-height: 180%;
+    padding: 0 $interiorMargin;
     overflow: hidden;
     position: relative;
     select {
@@ -349,8 +329,8 @@ input[type="text"].s-input-inline,
         color: $colorSelectFg;
         cursor: pointer;
         border: none !important;
-        padding: 0 20px 0 $interiorMargin;
-        width: 100%;
+        padding: 4px 25px 2px 0px;
+        width: 130%;
         option {
             margin: $interiorMargin 0; // Firefox
         }
@@ -359,7 +339,6 @@ input[type="text"].s-input-inline,
         @include transform(translateY(-50%));
         color: rgba($colorInvokeMenu, percentToDecimal($contrastInvokeMenuPercent));
         display: block;
-        font-size: 0.8em;
         pointer-events: none;
         position: absolute;
         right: $interiorMargin;

platform/commonUI/general/res/sass/controls/_indicators.scss

@@ -0,0 +1,99 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2017, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+
+/* Indicators are generally only displayed in the ue-bottom-bar element of the main interface */
+
+.l-indicator {
+    $transDelayHover: 1.5s;
+    $transDelayWhileExpanded: 2.5s;
+    $transSpeed: .25s;
+    display: inline-block;
+    margin-right: $interiorMarginSm;
+
+    &:before {
+        // Icon
+        display: inline-block;
+        opacity: 0.85;
+    }
+
+    .label,
+    .count {
+        display: inline-block;
+        vertical-align: top;
+    }
+
+    &.float-right {
+        float: right;
+    }
+
+    &.no-icon {
+        &:before {
+            display: none;
+        }
+    }
+
+    &:not(.no-collapse) {
+        .label {
+            // Max-width silliness is necessary for width transition
+            @include trans-prop-nice((max-width, margin-right), $transSpeed, $transDelayWhileExpanded);
+            overflow: hidden;
+            margin-right: 0;
+            max-width: 0px;
+            white-space: nowrap;
+        }
+        &:hover {
+            &:before {
+                opacity: 1;
+            }
+
+            .label {
+                @include trans-prop-nice((max-width, margin-right), 0s);
+                margin-right: $interiorMargin;
+                max-width: 600px;
+                width: auto;
+            }
+
+            .count {
+                @include trans-prop-nice(max-width, 0s);
+                opacity: 0;
+            }
+        }
+    }
+
+    .count {
+        @include trans-prop-nice(opacity, $transSpeed, $transDelayWhileExpanded);
+        font-weight: bold;
+        opacity: 1;
+    }
+
+    .s-button {
+        background: $colorStatusBtnBg;
+        padding: 0 $interiorMargin;
+        height: auto;
+        line-height: inherit;
+    }
+}
+
+.s-indicator {
+    color: $colorStatusDefault;
+
+}

platform/commonUI/general/res/sass/controls/_menus.scss

@@ -77,14 +77,6 @@
     position: relative;
 }
 
-.s-menu {
-    border-radius: $basicCr;
-    @include containerSubtle($colorMenuBg, $colorMenuFg);
-    @include boxShdw($shdwMenu);
-    @include txtShdw($shdwMenuText);
-    padding: $interiorMarginSm 0;
-}
-
 .menu {
     border-radius: $basicCr;
     @include containerSubtle($colorMenuBg, $colorMenuFg);

platform/commonUI/general/res/sass/controls/_messages.scss

@@ -19,7 +19,7 @@
  * this source code distribution or the Licensing information page available
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
-/******************************************************************* STATUS BLOCK ELEMS */
+
 @mixin statusBannerColors($bg, $fg: $colorStatusFg) {
 	$bgPb: 30%;
 	$bgPbD: 10%;
@@ -36,110 +36,6 @@
 	}
 }
 
-// Status coloring
-.ok, .info {
-    .status-indicator {
-        color: $colorInfo;
-    }
-}
-
-.alert, .caution, .warning {
-    .status-indicator, .count {
-        color: $colorStatusAlert;
-    }
-
-}
-
-.error, .err {
-    .status-indicator, .count {
-        color: $colorStatusError;
-    }
-}
-
-.available {
-    .status-indicator, .count {
-        color: $colorStatusAvailable;
-    }
-}
-
-.subdued {
-    .status-indicator {
-        color: pullForward($colorStatusBarBg, 40%);
-    }
-}
-
-.status-block-holder {
-    // Applied to mct-include element
-    // Contains status.block elements
-    $transDelay: 1.5s;
-    $transSpeed: .25s;
-    display: inline-block;
-    &.clickable { cursor: pointer; }
-    &:not(.clickable) { cursor: default; }
-    &.no-icon .status.block {
-        .status-indicator {
-            display: none;
-        }
-    }
-    &.float-right {
-        float: right;
-    }
-    &:not(.no-collapse) .status.block {
-        .label {
-            // Max-width silliness is necessary for width transition
-            @include trans-prop-nice(max-width, $transSpeed, $transDelay);
-            overflow: hidden;
-            max-width: 0px;
-        }
-        &:hover {
-            .label {
-                @include trans-prop-nice(max-width, $transSpeed, 0s);
-                max-width: 600px;
-                width: auto;
-            }
-            .count {
-                @include trans-prop-nice(max-width, $transSpeed, 0s);
-                opacity: 0;
-            }
-        }
-    }
-
-}
-
-.status.block {
-    $transDelay: 1.5s;
-    $transSpeed: .25s;
-	color: $colorStatusDefault;
-	display: inline-block;
-	margin-right: $interiorMargin;
-	.status-indicator,
-	.label,
-	.count {
-		display: inline-block;
-		vertical-align: top;
-	}
-
-	.status-indicator {
-        background: none !important;
-		margin-right: $interiorMarginSm;
-        &[class*='s-status']:before {
-            font-size: 1em;
-        }
-	}
-
-	.count {
-		@include trans-prop-nice(opacity, $transSpeed, $transDelay);
-		font-weight: bold;
-		opacity: 1;
-	}
-    .s-button {
-        background: $colorStatusBtnBg;
-        padding: 0 $interiorMargin;
-        height: auto;
-        line-height: inherit;
-    }
-}
-
 /******************************************************************* MESSAGE BANNERS */
 .message {
 	&.block {
@@ -398,6 +294,10 @@ body.desktop .t-message-list {
     .object-header {
         .t-object-alert {
             display: inline;
+            &.t-alert-unsynced {
+                @extend .icon-alert-triangle;
+                color: $colorPausedBg;
+            }
         }
     }
 }

platform/commonUI/general/res/sass/controls/_palette.scss

@@ -20,70 +20,53 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 .l-palette {
+	$d: 16px;
+	$colorsPerRow: 10;
+	$m: 1;
+
 	box-sizing: border-box;
 	padding: $interiorMargin !important;
-}
 
-.l-palette-row {
-    $d: 16px;
-    $m: 1;
-    $colorsPerRow: 10;
-    display: flex;
-    flex-wrap: wrap;
-    line-height: $d;
-    width: ($d * $colorsPerRow) + ($m * $colorsPerRow);
+	.l-palette-row {
+		@include clearfix;
+		line-height: $d;
+		width: ($d * $colorsPerRow) + ($m * $colorsPerRow);
 
-    &.l-option-row {
-        margin-bottom: $interiorMargin;
-        .s-palette-item {
-            border-color: $colorPaletteFg;
-        }
-    }
-
-    .l-palette-item {
-        box-sizing: border-box;
-        display: block;
-        height: $d; width: $d;
-        min-width: $d;
-        line-height: $d * 0.9;
-        margin: 0 ($m * 1px) ($m * 1px) 0;
-        position: relative;
-        text-align: center;
-    }
-}
-
-.s-palette-item {
-    border: 1px solid transparent;
-    color: $colorPaletteFg;
-    text-shadow: $shdwPaletteFg;
-    @include trans-prop-nice-fade(0.25s);
-    &:hover {
-        @include trans-prop-nice-fade(0);
-        border-color: $colorPaletteSelected !important;
-    }
-    &.selected {
-        border-color: $colorPaletteSelected;
-        box-shadow: $shdwPaletteSelected; //Needed to see selection rect on light colored swatches
-    }
-}
-
-.l-palette-item-label {
-    margin-left: $interiorMargin;
-}
-
-.l-inline-palette {
-    .l-palette-row {
-        width: 100%;
-        .l-palette-item {
-            //@include display(flex);
-            @include flex(1 0 auto);
-            margin: 1px;
-            min-width: auto;
-            width: auto;
-            &:before {
-                content: '';
-                padding-top: 75%;
+        &.l-option-row {
+            margin-bottom: $interiorMargin;
+            .s-palette-item {
+                border-color: $colorPaletteFg;
             }
         }
-    }
-}
+
+		.l-palette-item {
+			box-sizing: border-box;
+			display: block;
+			float: left;
+			height: $d; width: $d;
+			line-height: $d * 0.9;
+			margin: 0 ($m * 1px) ($m * 1px) 0;
+            position: relative;
+			text-align: center;
+		}
+
+		.s-palette-item {
+            border: 1px solid transparent;
+            color: $colorPaletteFg;
+            text-shadow: $shdwPaletteFg;
+            @include trans-prop-nice-fade(0.25s);
+			&:hover {
+				@include trans-prop-nice-fade(0);
+				border-color: $colorPaletteSelected !important;
+			}
+            &.selected {
+                border-color: $colorPaletteSelected;
+                box-shadow: $shdwPaletteSelected; //Needed to see selection rect on light colored swatches
+            }
+		}
+
+		.l-palette-item-label {
+			margin-left: $interiorMargin;
+		}
+	}
+}

platform/commonUI/general/res/sass/features/_imagery.scss

@@ -11,6 +11,7 @@
 	}
 	min-width: 150px;
 	.l-image-main {
+		background-color: $colorPlotBg;
         margin-bottom: $interiorMargin;
 	}
 	.l-image-main-controlbar {
@@ -75,7 +76,6 @@
 }
 
 .s-image-main {
-    background-color: $colorPlotBg;
 	border: 1px solid transparent;
 	&.paused {
 		@extend .s-unsynced;

platform/commonUI/general/res/sass/mobile/_layout.scss

@@ -131,18 +131,16 @@ body.mobile {
     }
 }
 
-@include phonePortrait() {
-    body.phone {
-        .pane-tree-showing {
-            .pane.left.treeview {
-                width: $proporMenuOnly !important;
-            }
-            .pane.right.items {
-                left: 0 !important;
-                @include transform(translateX($proporMenuOnly));
-                .holder-object-and-inspector {
-                    opacity: 0;
-                }
+body.phone.portrait {
+    .pane-tree-showing {
+        .pane.left.treeview {
+            width: $proporMenuOnly !important;
+        }
+        .pane.right.items {
+            left: 0 !important;
+            @include transform(translateX($proporMenuOnly));
+            .holder-object-and-inspector {
+                opacity: 0;
             }
         }
     }

platform/commonUI/general/res/sass/mobile/_tree.scss

@@ -34,7 +34,18 @@ body.touch {
 		line-height: $mobileTreeItemH !important;
 		.view-control {
             font-size: 1em;
-            width: ceil($mobileTreeItemH * 0.5);
+            margin-right: $interiorMargin;
+            width: ceil($mobileTreeItemH * 0.75);
+            &.has-children {
+                &:before {
+                    content: $glyph-icon-arrow-down;
+                    left: 50%;
+                    @include transform(translateX(-50%) rotate(-90deg));
+                }
+                &.expanded:before {
+                    @include transform(translateX(-50%) rotate(0deg));
+                }
+            }
 		}
 		.t-object-label {
 			line-height: inherit;

platform/commonUI/general/res/sass/plots/_legend.scss

@@ -1,208 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2017, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-.gl-plot {
-    .gl-plot-legend {
-        min-height: $plotLegendH;
-
-        .view-control {
-            font-size: 1em;
-            margin-right: $interiorMarginSm;
-        }
-
-        table {
-            table-layout: fixed;
-            tr {
-                display: table-row;
-            }
-            th,
-            td {
-                @include ellipsize(); // Note: this won't work if table-layout uses anything other than fixed.
-                display: table-cell;
-                padding: 1px 3px; // Tighter than standard tabular padding
-            }
-        }
-
-        &.hover-on-plot {
-            // User is hovering over the plot to get a value at a point
-            .hover-value-enabled {
-                background-color: $legendHoverValueBg;
-                border-radius: $smallCr;
-                padding: 0 $interiorMarginSm;
-                &:before {
-                    opacity: 0.5;
-                }
-                &.cursor-hover,
-                .value-to-display-nearestTimestamp,
-                .value-to-display-nearestValue
-                {
-                    @extend .icon-crosshair-12px;
-                    &:before {
-                        font-size: 9px;
-                    }
-                }
-
-                &.value-to-display-min:before {
-                    content: 'MIN ';
-                }
-                &.value-to-display-max:before {
-                    content: 'MAX ';
-                }
-            }
-        }
-    }
-
-    &.plot-legend-collapsed .plot-wrapper-expanded-legend { display: none; }
-    &.plot-legend-expanded .plot-wrapper-collapsed-legend { display: none; }
-
-    /***************** GENERAL STYLES, ALL STATES */
-    .plot-legend-item {
-        // General styles for legend items, both expanded and collapsed legend states
-        .plot-series-color-swatch {
-            border-radius: $smallCr;
-            border: 1px solid $colorBodyBg;
-            display: inline-block;
-            height: $plotSwatchD;
-            width: $plotSwatchD;
-        }
-        .plot-series-name {
-            display: inline;
-        }
-
-        .plot-series-value {
-            @include ellipsize();
-        }
-    }
-
-    /***************** GENERAL STYLES, COLLAPSED */
-    &.plot-legend-collapsed {
-        // .plot-legend-item is a span of spans.
-        &.plot-legend-top .gl-plot-legend { margin-bottom: $interiorMargin; }
-        &.plot-legend-bottom .gl-plot-legend { margin-top: $interiorMargin; }
-        &.plot-legend-right .gl-plot-legend { margin-left: $interiorMargin; }
-        &.plot-legend-left .gl-plot-legend { margin-right: $interiorMargin; }
-
-        .plot-legend-item {
-            display: flex;
-            align-items: center;
-            &:not(:first-child) {
-                margin-left: $interiorMarginLg;
-            }
-            .plot-series-swatch-and-name,
-            .plot-series-value {
-                @include ellipsize();
-                flex: 1 1 auto;
-            }
-
-            .plot-series-swatch-and-name {
-                margin-right: $interiorMarginSm;
-            }
-
-            .plot-series-value {
-                text-align: left;
-                width: 170px;
-            }
-        }
-    }
-
-    /***************** GENERAL STYLES, EXPANDED */
-    &.plot-legend-expanded {
-        .gl-plot-legend {
-            max-height: 70%;
-        }
-
-        .plot-wrapper-expanded-legend {
-            overflow-y: auto;
-        }
-
-        &.plot-legend-top .gl-plot-legend {
-            margin-bottom: $interiorMargin;
-        }
-        &.plot-legend-bottom .gl-plot-legend {
-            margin-top: $interiorMargin;
-        }
-    }
-
-    /***************** TOP OR BOTTOM */
-    &.plot-legend-top,
-    &.plot-legend-bottom {
-        // General styles when legend is on the top or bottom
-        @extend .l-flex-col;
-        &.plot-legend-collapsed {
-            // COLLAPSED ON TOP OR BOTTOM
-            .plot-wrapper-collapsed-legend {
-                display: flex;
-                flex: 1 1 auto;
-                overflow: hidden;
-            }
-        }
-    }
-
-    /***************** EITHER SIDE */
-    &.plot-legend-left,
-    &.plot-legend-right {
-        @extend .l-flex-row;
-        // If the legend is expanded, use flex-col instead so that the legend gets the width it needs.
-        &.plot-legend-expanded {
-            // EXPANDED, ON EITHER SIDE
-            @extend .l-flex-col;
-        }
-
-        &.plot-legend-collapsed {
-            // COLLAPSED, ON EITHER SIDE
-            .gl-plot-legend {
-                max-height: inherit;
-                width: 25%;
-            }
-            .plot-wrapper-collapsed-legend {
-                display: flex;
-                flex-flow: column nowrap;
-                min-width: 0;
-                flex: 1 1 auto;
-                overflow-y: auto;
-            }
-            .plot-legend-item {
-                margin-bottom: 1px;
-                margin-left: 0;
-                flex-wrap: wrap;
-                .plot-series-swatch-and-name {
-                    flex: 0 1 auto;
-                    min-width: 20%;
-                }
-                .plot-series-value {
-                    flex: 0 1 auto;
-                    width: auto;
-                }
-            }
-        }
-    }
-
-    /***************** ON BOTTOM OR RIGHT */
-    &.plot-legend-right:not(.plot-legend-expanded),
-    &.plot-legend-bottom {
-        .gl-plot-legend {
-            order: 2;
-        }
-        .plot-wrapper-axis-and-display-area {
-            order: 1;
-        }
-    }
-}

platform/commonUI/general/res/sass/plots/_plots-main.scss

@@ -20,64 +20,18 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 .abs.holder-plot {
-    right: $interiorMargin; // Fend off the scrollbar when less than min-height;
-    .t-object-alert.t-alert-unsynced {
-        display: none;
-    }
+    // Fend off the scrollbar when less than min-height;
+    right: $interiorMargin;
 }
 
-/********************************************* STACKED PLOT LAYOUT */
-.t-plot-stacked {
-    .l-view-section {
-        //  Make this a flex container
-        display: flex;
-        flex-flow: column nowrap;
-        .gl-plot.child-frame {
-            mct-plot { 
-                display: flex; 
-                flex: 1 1 auto;
-                height: 100%;
-                position: relative;
-            }
-            flex: 1 1 auto;
-            &:not(:first-child) {
-                margin-top: $interiorMargin;
-            }
-        }
-    }
-
-    .s-status-timeconductor-unsynced .holder-plot {
-        .t-object-alert.t-alert-unsynced {
-            display: block;
-        }
-    }
-
-}
-
-
-
 .gl-plot {
 	color: $colorPlotFg;
-    display: flex;
 	font-size: 0.7rem;
 	position: relative;
 	width: 100%;
 	height: 100%;
     min-height: $plotMinH;
 
-    /********************************************* AXIS AND DISPLAY AREA */
-    .plot-wrapper-axis-and-display-area {
-        margin-top: $interiorMargin; // Keep the top tick label from getting clipped
-        position: relative;
-        flex: 1 1 auto;
-        .t-object-alert {
-            position: absolute;
-            display: block;
-            font-size: 1.5em;
-            top: $interiorMarginSm; left: $interiorMarginSm;
-        }
-    }
-
     .gl-plot-wrapper-display-area-and-x-axis {
         // Holds the plot area and the X-axis only
         position: absolute;
@@ -95,6 +49,7 @@
         }
 
         .gl-plot-axis-area.gl-plot-x {
+            //@include test(green);
             top: auto;
             right: 0;
             bottom: 0;
@@ -108,7 +63,7 @@
 	.gl-plot-axis-area {
 		position: absolute;
 		&.gl-plot-y {
-			top: nth($plotDisplayArea, 1);
+			top: $plotLegendH + $interiorMargin;
 			right: auto;
 			bottom: nth($plotDisplayArea, 3);
 			left: 0;
@@ -203,6 +158,17 @@
 		}
 	}
 
+	.gl-plot-legend {
+		position: absolute;
+		top: 0;
+		right: 0;
+		bottom: auto;
+		left: 0;
+		height: $plotLegendH;
+		overflow-x: hidden;
+		overflow-y: auto;
+	}
+
 	/****************************** Limits and Out-of-Bounds data */
 
 	.l-limit-bar,
@@ -269,6 +235,39 @@
     border: 1px solid $colorPlotAreaBorder;
 }
 
+.gl-plot-legend,
+.legend {
+	.plot-legend-item,
+	.legend-item {
+		display: inline-block;
+		margin-right: $interiorMarginLg;
+		margin-bottom: $interiorMarginSm;
+		span {
+			vertical-align: middle;
+		}
+		.plot-color-swatch,
+		.color-swatch {
+			border-radius: 2px;
+			display: inline-block;
+			height: $plotSwatchD;
+			width: $plotSwatchD;
+		}
+	}
+}
+
+.gl-plot-legend {
+	.plot-legend-item {
+		border-radius: $smallCr;
+		line-height: 1.5em;
+		padding: 0px $itemPadLR;
+		.plot-color-swatch {
+			border: 1px solid $colorBodyBg;
+			height: $plotSwatchD + 1;
+			width: $plotSwatchD + 1;
+		}
+	}
+}
+
 .tick {
 	position: absolute;
 	border: 0 $colorPlotHash solid;

platform/commonUI/general/res/sass/search/_search.scss

@@ -34,7 +34,7 @@
 		$iconEdgeM: 4px;
 		$iconD: $treeSearchInputBarH - ($iconEdgeM*2);
         @extend .icon-magnify;
-		font-size: 0.8rem;
+		font-size: 0.8em;
 		position: relative;
 
 		.search-input {
@@ -60,7 +60,7 @@
 			position: relative;
 			width: 100%;
 			padding-left: $iconD + $interiorMargin !important;
-			padding-right: $iconD + $interiorMargin !important;
+			padding-right: ($iconD * 2) + ($interiorMargin * 2) !important;
 
 			// Make work for mct-control textfield
 			input {
@@ -82,7 +82,8 @@
 		}
 
 		.clear-input {
-			right: $interiorMargin;
+            // Hiding for now with addition of Cancel button
+			right: $iconD + $interiorMargin;
 
 			// Icon is visible only when there is text input
             visibility: hidden;
@@ -97,25 +98,16 @@
 			}
 		}
 
-        &.search-filter-by-type {
-            .search-input {
-                padding-right: ($iconD * 2) + ($interiorMargin * 2) !important; // Allow room for menu-icon
-            }
-            .menu-icon {
-                // 'v' invoke menu icon for filtering by type
-                font-size: 0.8em;
-                padding-right: $iconEdgeM;
-                right: $iconEdgeM;
-                text-align: right;
-                &:hover {
-                    color: pullForward($colorInputIcon, 10%);
-                }
-            }
-            .clear-input {
-                right: $iconD + $interiorMargin;
-            }
-
-        }
+		.menu-icon {
+            // 'v' invoke menu icon
+			font-size: 0.8em;
+			padding-right: $iconEdgeM;
+			right: $iconEdgeM;
+			text-align: right;
+			&:hover {
+				color: pullForward($colorInputIcon, 10%);
+			}
+		}
 
 		.search-menu-holder {
 			float: right;

platform/commonUI/general/res/sass/tree/_tree.scss

@@ -23,7 +23,7 @@
 ul.tree {
     @include menuUlReset();
     @include user-select(none);
-    > li {
+    li {
         display: block;
         position: relative;
     }
@@ -53,10 +53,12 @@ ul.tree {
     .view-control {
         color: $colorItemTreeVC;
         margin-right: $interiorMargin;
+        height: 100%;
+        line-height: inherit;
         width: $treeVCW;
-        &:before { display: block; }
-        &.no-children {
-            &:before { display: none; }
+        &:before { display: none; }
+        &.has-children {
+            &:before { display: block; }
         }
     }
 

platform/commonUI/general/res/sass/user-environ/_layout.scss

@@ -81,16 +81,14 @@
         @include absPosDefault(0);// New status bar design
         top: auto;
         height: $ueFooterH;
-        line-height: $ueFooterH - ($interiorMargin * 2);
-        background: $colorStatusBarBg;
-        color: lighten($colorBodyBg, 30%);
-        font-size: .7rem;
-        .status-holder {
+
+        mct-indicators { display: block; }
+        
+        .indicator-holder {
             box-sizing: border-box;
             @include absPosDefault($interiorMargin);
             @include ellipsize();
             right: 120px;
-            text-transform: uppercase;
             z-index: 1;
         }
         .app-logo {
@@ -105,6 +103,14 @@
     }
 }
 
+.s-status-bar {
+    background: $colorStatusBarBg;
+    color: lighten($colorBodyBg, 30%);
+    font-size: .7rem;
+    line-height: $ueFooterH - ($interiorMargin * 2);
+    text-transform: uppercase;
+}
+
 .edit-mode {
     // Old edit mode
     .split-layout {

platform/commonUI/general/res/templates/angular-indicator.html

@@ -20,14 +20,12 @@
  at runtime from the About dialog for additional information.
 -->
 <!-- DO NOT ADD SPACES BETWEEN THE SPANS - IT ADDS WHITE SPACE!! -->
-<div class='status block'
+<div class='l-indicator s-indicator s-indicator-status-{{ngModel.getGlyphClass()}}'
 	 title="{{ngModel.getDescription()}}"
 	 ng-click='ngModel.configure()'
-	 ng-show="ngModel.getText().length > 0">
-	<span class="status-indicator {{ngModel.getCssClass()}}"></span><span class="label"
-		  ng-class='ngModel.getTextClass()'>
+	 ng-show="ngModel.getText().length > 0"
+     ng-class="ngModel.getCssClass()">
+	<span class="label" ng-class='ngModel.getTextClass()'>
 		{{ngModel.getText()}}
-        <a class="s-button icon-gear" ng-if="ngModel.configure"></a>
-	</span><span class="count">
 	</span>
 </div>

platform/commonUI/general/res/templates/bottombar.html

@@ -19,14 +19,9 @@
  this source code distribution or the Licensing information page available
  at runtime from the About dialog for additional information.
 -->
-<div class='abs bottom-bar ue-bottom-bar mobile-disable-select' ng-controller="BottomBarController as bar">
-    <div id='status' class='status-holder'>
-        <mct-include ng-repeat="indicator in bar.getIndicators()"
-                     ng-model="indicator.ngModel"
-                     key="indicator.template"
-                     class="status-block-holder"
-                     ng-class='indicator.ngModel.getGlyphClass()'>
-        </mct-include>
+<div class='abs bottom-bar ue-bottom-bar s-status-bar mobile-disable-select'>
+    <div id='status' class='indicator-holder'>
+        <mct-indicators></mct-indicators>
     </div>
     <mct-include key="'message-banner'"></mct-include>
     <mct-include key="'about-logo'"></mct-include>

platform/commonUI/general/src/controllers/BottomBarController.js

@@ -1,59 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2017, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-define(
-    [],
-    function () {
-
-        /**
-         * Controller for the bottombar template. Exposes
-         * available indicators (of extension category "indicators")
-         * @memberof platform/commonUI/general
-         * @constructor
-         */
-        function BottomBarController(indicators) {
-            // Utility function used to make indicators presentable
-            // for display.
-            function present(Indicator) {
-                return {
-                    template: Indicator.template || "indicator",
-                    ngModel: typeof Indicator === 'function' ?
-                            new Indicator() : Indicator
-                };
-            }
-
-            this.indicators = indicators.map(present);
-        }
-
-        /**
-         * Get all indicators to display.
-         * @returns {Indicator[]} all indicators
-         *          to display in the bottom bar.
-         * @memberof platform/commonUI/general.BottomBarController#
-         */
-        BottomBarController.prototype.getIndicators = function () {
-            return this.indicators;
-        };
-
-        return BottomBarController;
-    }
-);

platform/commonUI/general/src/directives/MCTIndicators.js

@@ -20,21 +20,23 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 
-define([
-    './Region'
-], function (
-    Region
-) {
-
-    var PlotBrowseRegion = new Region({
-        name: "plot-options",
-        title: "Plot Options",
-        modes: ['browse'],
-        content: {
-            key: "plot-options-browse"
+define(
+    [],
+    function () {
+        function MCTIndicators(openmct) {
+            return {
+                restrict: "E",
+                link: function link(scope, element) {
+                    openmct.indicators.allIndicatorElements().then(function (elements) {
+                        elements.forEach(function (indicatorElement) {
+                            element.append(indicatorElement);
+                        });
+                    });
+                }
+            };
         }
-    });
 
-    return PlotBrowseRegion;
+        return MCTIndicators;
 
-});
+    }
+);

platform/commonUI/general/src/ui/TreeNodeView.js

@@ -83,9 +83,9 @@ define([
         this.activeObject = domainObject;
 
         if (domainObject && domainObject.hasCapability('composition')) {
-            $(this.toggleView.elements()).removeClass('no-children');
+            $(this.toggleView.elements()).addClass('has-children');
         } else {
-            $(this.toggleView.elements()).addClass('no-children');
+            $(this.toggleView.elements()).removeClass('has-children');
         }
 
         if (domainObject && domainObject.hasCapability('status')) {

platform/commonUI/general/test/controllers/BottomBarControllerSpec.js

@@ -1,76 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2017, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-define(
-    ["../../src/controllers/BottomBarController"],
-    function (BottomBarController) {
-
-        describe("The bottom bar controller", function () {
-            var testIndicators,
-                testIndicatorA,
-                testIndicatorB,
-                testIndicatorC,
-                mockIndicator,
-                controller;
-
-            beforeEach(function () {
-                mockIndicator = jasmine.createSpyObj(
-                    "indicator",
-                    ["getGlyph", "getCssClass", "getText"]
-                );
-
-                testIndicatorA = {};
-                testIndicatorB = function () {
-                    return mockIndicator;
-                };
-                testIndicatorC = { template: "someTemplate" };
-
-                testIndicators = [
-                    testIndicatorA,
-                    testIndicatorB,
-                    testIndicatorC
-                ];
-
-                controller = new BottomBarController(testIndicators);
-            });
-
-            it("exposes one indicator description per extension", function () {
-                expect(controller.getIndicators().length)
-                    .toEqual(testIndicators.length);
-            });
-
-            it("uses template field provided, or its own default", function () {
-                // "indicator" is the default;
-                // only testIndicatorC overrides this.
-                var indicators = controller.getIndicators();
-                expect(indicators[0].template).toEqual("indicator");
-                expect(indicators[1].template).toEqual("indicator");
-                expect(indicators[2].template).toEqual("someTemplate");
-            });
-
-            it("instantiates indicators given as constructors", function () {
-                // testIndicatorB constructs to mockIndicator
-                expect(controller.getIndicators()[1].ngModel).toBe(mockIndicator);
-            });
-        });
-    }
-);

platform/commonUI/notification/res/notification-indicator.html

@@ -1,9 +1,7 @@
 <!-- DO NOT ADD SPACES BETWEEN THE SPANS - IT ADDS WHITE SPACE!! -->
-<a ng-click="showNotificationsList()" ng-show="notifications.length > 0" class="status block"
-      ng-class="highest.severity"
+<a ng-click="showNotificationsList()" ng-show="notifications.length > 0" class="l-indicator s-indicator s-indicator-status-{{highest.severity}} icon-bell"
       ng-controller="NotificationIndicatorController">
-    <span class="status-indicator icon-bell"></span><span class="label">
-      {{notifications.length}} Notifications
+    <span class="label">
+        {{notifications.length}} Notification<span ng-show="notifications.length > 1">s</span>
     </span><span class="count">{{notifications.length}}</span>
-
 </a>

platform/commonUI/themes/espresso/res/sass/_constants.scss

@@ -55,7 +55,7 @@ $colorTransLucBg: #666; // Used as a visual blocking element over variable backg
 
 // Foundation Colors
 $colorAlt1: #ffc700;
-$colorAlert: #ff3c00;
+$colorAlert: #ff6600;
 $colorWarningHi: #cc0000;
 $colorWarningLo: #ff9900;
 $colorDiagnostic: #a4b442;
@@ -114,10 +114,10 @@ $colorInspectorSectionHeaderFg: pullForward($colorInspectorBg, 40%);
 
 // Status colors, mainly used for messaging and item ancillary symbols
 $colorStatusFg: #ccc;
-$colorStatusDefault: #ccc;
+$colorStatusDefault: #999;
 $colorStatusInfo: $colorInfo;
 $colorStatusAlert: $colorAlert;
-$colorStatusError: #d4585c;
+$colorStatusError: #ff3300;
 $colorStatusAvailable: $colorKey;
 $colorStatusBtnBg: $colorBtnBg;
 $colorProgressBarOuter: rgba(#000, 0.1);
@@ -181,8 +181,6 @@ $colorPlotHash: $colorTick;
 $stylePlotHash: dashed;
 $colorPlotAreaBorder: $colorInteriorBorder;
 $colorPlotLabelFg: pushBack($colorPlotFg, 20%);
-$legendCollapsedNameMaxW: 50%;
-$legendHoverValueBg: rgba($colorBodyFg, 0.1);
 
 // Tree
 $colorItemTreeHoverBg: pullForward($colorBodyBg, $hoverRatioPercent);

platform/commonUI/themes/snow/res/sass/_constants.scss

@@ -181,8 +181,6 @@ $colorPlotHash: $colorTick;
 $stylePlotHash: dashed;
 $colorPlotAreaBorder: $colorInteriorBorder;
 $colorPlotLabelFg: pushBack($colorPlotFg, 20%);
-$legendCollapsedNameMaxW: 50%;
-$legendHoverValueBg: rgba($colorBodyFg, 0.2);
 
 // Tree
 $colorItemTreeHoverBg: pullForward($colorBodyBg, $hoverRatioPercent);

platform/features/clock/bundle.js

@@ -55,7 +55,6 @@ define([
     timerTemplate,
     legacyRegistry
 ) {
-
     legacyRegistry.register("platform/features/clock", {
         "name": "Clocks/Timers",
         "descriptions": "Domain objects for displaying current & relative times.",
@@ -86,11 +85,6 @@ define([
                         "CLOCK_INDICATOR_FORMAT"
                     ],
                     "priority": "preferred"
-                },
-                {
-                    "implementation": FollowIndicator,
-                    "depends": ["timerService"],
-                    "priority": "fallback"
                 }
             ],
             "services": [
@@ -305,6 +299,10 @@ define([
                     }
                 }
             ],
+            "runs": [{
+                "implementation": FollowIndicator,
+                "depends": ["openmct", "timerService"]
+            }],
             "licenses": [
                 {
                     "name": "moment-duration-format",

platform/features/clock/src/indicators/ClockIndicator.js

@@ -45,11 +45,11 @@ define(
         }
 
         ClockIndicator.prototype.getGlyphClass = function () {
-            return "no-collapse float-right subdued";
+            return "subdued";
         };
 
         ClockIndicator.prototype.getCssClass = function () {
-            return "icon-clock";
+            return "icon-clock no-collapse float-right";
         };
 
         ClockIndicator.prototype.getText = function () {

platform/features/clock/src/indicators/FollowIndicator.js

@@ -1,5 +1,5 @@
 /*****************************************************************************
- * Open MCT, Copyright (c) 2009-2016, United States Government
+ * Open MCT, Copyright (c) 2009-2018, United States Government
  * as represented by the Administrator of the National Aeronautics and Space
  * Administration. All rights reserved.
  *
@@ -20,38 +20,32 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 
-define(
-    ['moment'],
-    function (moment) {
-        var NO_TIMER = "No timer being followed";
+define([], function () {
 
-        /**
-         * Indicator that displays the active timer, as well as its
-         * current state.
-         * @implements {Indicator}
-         * @memberof platform/features/clock
-         */
-        function FollowIndicator(timerService) {
-            this.timerService = timerService;
+    /**
+     * Indicator that displays the active timer, as well as its
+     * current state.
+     * @memberof platform/features/clock
+     */
+    return function installFollowIndicator(openmct, timerService) {
+        var indicator = openmct.indicators.simpleIndicator();
+        var timer = timerService.getTimer();
+        setIndicatorStatus(timer);
+
+        function setIndicatorStatus(newTimer) {
+            if (newTimer !== undefined) {
+                indicator.iconClass('icon-timer');
+                indicator.statusClass('s-status-ok');
+                indicator.text('Following timer ' + newTimer.name);
+            } else {
+                indicator.iconClass('icon-timer');
+                indicator.statusClass('');
+                indicator.text('No timer being followed');
+            }
         }
 
-        FollowIndicator.prototype.getGlyphClass = function () {
-            return "";
-        };
+        timerService.on('change', setIndicatorStatus);
 
-        FollowIndicator.prototype.getCssClass = function () {
-            return (this.timerService.getTimer()) ? "icon-timer s-status-ok" : "icon-timer";
-        };
-
-        FollowIndicator.prototype.getText = function () {
-            var timer = this.timerService.getTimer();
-            return timer ? ('Following timer ' + timer.name) : NO_TIMER;
-        };
-
-        FollowIndicator.prototype.getDescription = function () {
-            return "";
-        };
-
-        return FollowIndicator;
-    }
-);
+        openmct.indicators.add(indicator);
+    };
+});

platform/features/clock/src/services/TimerService.js

@@ -44,7 +44,7 @@ define(['EventEmitter'], function (EventEmitter) {
      */
     TimerService.prototype.setTimer = function (timer) {
         this.timer = timer;
-        this.emit('change');
+        this.emit('change', timer);
 
         if (this.stopObserving) {
             this.stopObserving();

platform/features/clock/test/indicators/FollowIndicatorSpec.js

@@ -1,5 +1,5 @@
 /*****************************************************************************
- * Open MCT, Copyright (c) 2009-2016, United States Government
+ * Open MCT, Copyright (c) 2009-2018, United States Government
  * as represented by the Administrator of the National Aeronautics and Space
  * Administration. All rights reserved.
  *
@@ -20,39 +20,77 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 
-define(["../../src/indicators/FollowIndicator"], function (FollowIndicator) {
-    var TIMER_SERVICE_METHODS =
-        ['setTimer', 'getTimer', 'clearTimer', 'on', 'off'];
-
+define([
+    "../../src/indicators/FollowIndicator",
+    "../../src/services/TimerService",
+    "../../../../../src/MCT",
+    'zepto'
+], function (
+    FollowIndicator,
+    TimerService,
+    MCT,
+    $
+) {
     describe("The timer-following indicator", function () {
-        var mockTimerService;
-        var indicator;
+        var timerService;
+        var openmct;
 
         beforeEach(function () {
-            mockTimerService =
-                jasmine.createSpyObj('timerService', TIMER_SERVICE_METHODS);
-            indicator = new FollowIndicator(mockTimerService);
+            openmct = new MCT();
+            timerService = new TimerService(openmct);
+            spyOn(openmct.indicators, "add");
         });
 
-        it("implements the Indicator interface", function () {
-            expect(indicator.getGlyphClass()).toEqual(jasmine.any(String));
-            expect(indicator.getCssClass()).toEqual(jasmine.any(String));
-            expect(indicator.getText()).toEqual(jasmine.any(String));
-            expect(indicator.getDescription()).toEqual(jasmine.any(String));
+        it("adds an indicator when installed", function () {
+            FollowIndicator(openmct, timerService);
+            expect(openmct.indicators.add).toHaveBeenCalled();
+        });
+
+        it("indicates that no timer is being followed", function () {
+            FollowIndicator(openmct, timerService);
+            var simpleIndicator = openmct.indicators.add.mostRecentCall.args[0];
+            var element = simpleIndicator.element;
+            var text = $('.indicator-text', element).text().trim();
+            expect(text).toEqual('No timer being followed');
         });
 
         describe("when a timer is set", function () {
             var testObject;
+            var simpleIndicator;
 
             beforeEach(function () {
-                testObject = { name: "some timer!" };
-                mockTimerService.getTimer.andReturn(testObject);
+                testObject = {
+                    identifier: {
+                        namespace: 'namespace',
+                        key: 'key'
+                    },
+                    name: "some timer!"
+                };
+                timerService.setTimer(testObject);
+                FollowIndicator(openmct, timerService);
+                simpleIndicator = openmct.indicators.add.mostRecentCall.args[0];
             });
 
             it("displays the timer's name", function () {
-                expect(indicator.getText().indexOf(testObject.name))
-                    .not.toEqual(-1);
+                var element = simpleIndicator.element;
+                var text = $('.indicator-text', element).text().trim();
+                expect(text).toEqual('Following timer ' + testObject.name);
             });
+
+            it("displays the timer's name when it changes", function () {
+                var secondTimer = {
+                    identifier: {
+                        namespace: 'namespace',
+                        key: 'key2'
+                    },
+                    name: "Some other timer"
+                };
+                var element = simpleIndicator.element;
+                timerService.setTimer(secondTimer);
+                var text = $('.indicator-text', element).text().trim();
+                expect(text).toEqual('Following timer ' + secondTimer.name);
+            });
+
         });
     });
 });

platform/features/layout/bundle.js

@@ -337,6 +337,46 @@ define([
                             "conversion": "number[]"
                         }
                     ]
+                },
+                {
+                    "key": "telemetry.panel",
+                    "name": "Telemetry Panel",
+                    "cssClass": "icon-telemetry-panel",
+                    "description": "A panel for collecting telemetry elements.",
+                    "priority": 899,
+                    "delegates": [
+                        "telemetry"
+                    ],
+                    "features": "creation",
+                    "contains": [
+                        {
+                            "has": "telemetry"
+                        }
+                    ],
+                    "model": {
+                        "composition": []
+                    },
+                    "properties": [
+                        {
+                            "name": "Layout Grid",
+                            "control": "composite",
+                            "items": [
+                                {
+                                    "name": "Horizontal grid (px)",
+                                    "control": "textfield",
+                                    "cssClass": "l-input-sm l-numeric"
+                                },
+                                {
+                                    "name": "Vertical grid (px)",
+                                    "control": "textfield",
+                                    "cssClass": "l-input-sm l-numeric"
+                                }
+                            ],
+                            "pattern": "^(\\d*[1-9]\\d*)?$",
+                            "property": "layoutGrid",
+                            "conversion": "number[]"
+                        }
+                    ]
                 }
             ]
         }

platform/features/layout/src/FixedController.js

@@ -272,7 +272,7 @@ define(
                     self.resizeHandles = self.generateDragHandles(self.selectedElementProxy);
                 } else {
                     // Make fixed view selectable if it's not already.
-                    if (!self.fixedViewSelectable && selectable.length === 1) {
+                    if (!self.fixedViewSelectable) {
                         self.fixedViewSelectable = true;
                         selection.context.viewProxy = new FixedProxy(addElement, $q, dialogService);
                         self.openmct.selection.select(selection);
@@ -373,10 +373,10 @@ define(
          */
         FixedController.prototype.updateView = function (telemetryObject, datum) {
             var metadata = this.openmct.telemetry.getMetadata(telemetryObject);
-            var valueMetadata = this.chooseValueMetadataToDisplay(metadata);
-            var formattedTelemetryValue = this.getFormattedTelemetryValueForKey(valueMetadata, datum);
+            var telemetryKeyToDisplay = this.chooseTelemetryKeyToDisplay(metadata);
+            var formattedTelemetryValue = this.getFormattedTelemetryValueForKey(telemetryKeyToDisplay, datum, metadata);
             var limitEvaluator = this.openmct.telemetry.limitEvaluator(telemetryObject);
-            var alarm = limitEvaluator && limitEvaluator.evaluate(datum, valueMetadata);
+            var alarm = limitEvaluator && limitEvaluator.evaluate(datum, telemetryKeyToDisplay);
 
             this.setDisplayedValue(
                 telemetryObject,
@@ -389,28 +389,29 @@ define(
         /**
          * @private
          */
-        FixedController.prototype.getFormattedTelemetryValueForKey = function (valueMetadata, datum) {
+        FixedController.prototype.getFormattedTelemetryValueForKey = function (telemetryKeyToDisplay, datum, metadata) {
+            var valueMetadata = metadata.value(telemetryKeyToDisplay);
             var formatter = this.openmct.telemetry.getValueFormatter(valueMetadata);
 
-            return formatter.format(datum);
+            return formatter.format(datum[valueMetadata.key]);
         };
 
         /**
          * @private
          */
-        FixedController.prototype.chooseValueMetadataToDisplay = function (metadata) {
+        FixedController.prototype.chooseTelemetryKeyToDisplay = function (metadata) {
             // If there is a range value, show that preferentially
-            var valueMetadata = metadata.valuesForHints(['range'])[0];
+            var telemetryKeyToDisplay = metadata.valuesForHints(['range'])[0];
 
             // If no range is defined, default to the highest priority non time-domain data.
-            if (valueMetadata === undefined) {
+            if (telemetryKeyToDisplay === undefined) {
                 var valuesOrderedByPriority = metadata.values();
-                valueMetadata = valuesOrderedByPriority.filter(function (values) {
-                    return !(values.hints.domain);
+                telemetryKeyToDisplay = valuesOrderedByPriority.filter(function (valueMetadata) {
+                    return !(valueMetadata.hints.domain);
                 })[0];
             }
 
-            return valueMetadata;
+            return telemetryKeyToDisplay.source;
         };
 
         /**

platform/features/layout/src/MCTTriggerModal.js

@@ -38,10 +38,6 @@ define([
 '       </div>' +
 '    </div>';
 
-    var NEW_NOTEBOOK_BUTTON_TEMPLATE = '<a class="s-button labeled icon-notebook new-notebook-entry" title="New Notebook Entry">' +
-    '<span class="title-label">New Notebook Entry</span>' +
-    '</a>';
-
     /**
      * MCT Trigger Modal is intended for use in only one location: inside the
      * object-header to allow views in a layout to be popped out in a modal.
@@ -78,28 +74,9 @@ define([
                 closeButton,
                 doneButton,
                 blocker,
-                overlayContainer,
-                notebookButtonEl,
-                notebookButton,
-                actions = $scope.domainObject.getCapability('action'),
-                notebookAction = actions.getActions({'key': 'notebook-new-entry'});
-
-            if (notebookAction) {
-                if (notebookAction.length > 0) {
-                    notebookButtonEl = document.createElement('div');
-                    $(notebookButtonEl).addClass('notebook-button-container');
-                    notebookButtonEl.innerHTML = NEW_NOTEBOOK_BUTTON_TEMPLATE;
-                    notebookButton = frame.querySelector('.object-browse-bar .right');
-                    notebookButton.prepend(notebookButtonEl);
-                    // $(frame.querySelector('.object-holder')).addClass('container-notebook');
-                    notebookButton.addEventListener('click', function () {
-                        notebookAction[0].perform();
-                    });
-                }
-            }
+                overlayContainer;
 
             function openOverlay() {
-
                 // Remove frame classes from being applied in a non-frame context
                 $(frame).removeClass('frame frame-template');
                 overlay = document.createElement('div');
@@ -132,11 +109,7 @@ define([
                 overlay = undefined;
             }
 
-            toggleOverlay = function (event) {
-                if (event) {
-                    event.stopPropagation();
-                }
-
+            toggleOverlay = function () {
                 if (!isOpen) {
                     openOverlay();
                     isOpen = true;

platform/features/layout/test/FixedControllerSpec.js

@@ -106,8 +106,8 @@ define(
                     'telemetryFormatter',
                     ['format']
                 );
-                mockFormatter.format.andCallFake(function (valueMetadata) {
-                    return "Formatted " + valueMetadata.value;
+                mockFormatter.format.andCallFake(function (value) {
+                    return "Formatted " + value;
                 });
 
                 mockDomainObject = jasmine.createSpyObj(
@@ -697,7 +697,7 @@ define(
                             source: 'range'
                         }
                     ]);
-                    var key = controller.chooseValueMetadataToDisplay(mockMetadata).source;
+                    var key = controller.chooseTelemetryKeyToDisplay(mockMetadata);
                     expect(key).toEqual('range');
                 });
 
@@ -719,7 +719,7 @@ define(
                             }
                         }
                     ]);
-                    var key = controller.chooseValueMetadataToDisplay(mockMetadata).source;
+                    var key = controller.chooseTelemetryKeyToDisplay(mockMetadata);
                     expect(key).toEqual('image');
                 });
 

platform/features/layout/test/MCTTriggerModalSpec.js

@@ -52,12 +52,6 @@ define([
 
         beforeEach(function () {
             $scope = jasmine.createSpyObj('$scope', ['$on']);
-            $scope.domainObject = { getCapability: function () {
-                return { getActions: function () {
-
-                }};
-            }};
-
             $element = jasmine.createSpyObj('$element', [
                 'parent',
                 'remove',

platform/features/notebook/bundle.js

@@ -1,314 +0,0 @@
-define([
-    "legacyRegistry",
-    "./src/controllers/NotebookController",
-    "./src/controllers/NewEntryController",
-    "./src/controllers/SelectSnapshotController",
-    "./src/controllers/LayoutNotebookController",
-    "./src/directives/MCTSnapshot",
-    "../layout/src/MCTTriggerModal",
-    "./src/directives/EntryDnd",
-    "./src/actions/ViewSnapshot",
-    "./src/actions/AnnotateSnapshot",
-    "./src/actions/RemoveEmbed",
-    "./src/actions/CreateSnapshot",
-    "./src/actions/RemoveSnapshot",
-    "./src/actions/NewEntryContextual",
-    "./src/capabilities/NotebookCapability",
-    "./src/policies/CompositionPolicy",
-    "./src/policies/ViewPolicy",
-    "text!./res/templates/layoutNotebook.html",
-    "text!./res/templates/notebook.html",
-    "text!./res/templates/entry.html",
-    "text!./res/templates/annotation.html",
-    "text!./res/templates/notifications.html",
-    "text!../layout/res/templates/frame.html",
-    "text!./res/templates/controls/embedControl.html",
-    "text!./res/templates/controls/snapSelect.html"
-], function (
-    legacyRegistry,
-    NotebookController,
-    NewEntryController,
-    SelectSnapshotController,
-    LayoutNotebookController,
-    MCTSnapshot,
-    MCTModalNotebook,
-    MCTEntryDnd,
-    ViewSnapshotAction,
-    AnnotateSnapshotAction,
-    RemoveEmbedAction,
-    CreateSnapshotAction,
-    RemoveSnapshotAction,
-    newEntryAction,
-    NotebookCapability,
-    CompositionPolicy,
-    ViewPolicy,
-    layoutNotebookTemplate,
-    notebookTemplate,
-    entryTemplate,
-    annotationTemplate,
-    notificationsTemplate,
-    frameTemplate,
-    embedControlTemplate,
-    snapSelectTemplate
-) {
-    legacyRegistry.register("platform/features/notebook", {
-        "name": "Notebook Plugin",
-        "description": "Create and save timestamped notes with embedded object snapshots.",
-        "extensions":
-        {
-            "types": [
-            {
-                "key": "notebook",
-                "name": "Notebook",
-                "cssClass": "icon-notebook",
-                "description": "Create and save timestamped notes with embedded object snapshots.",
-                "features": ["creation"],
-                "model": {
-                      "entries": [],
-                      "composition": [],
-                      "entryTypes": []
-                  }
-            }
-          ],
-            "views": [
-            {
-                "key": "notebook.view",
-                "type": "notebook",
-                "cssClass": "icon-notebook",
-                "name": "notebook",
-                "template": notebookTemplate,
-                "editable": false,
-                "uses": [
-                      "composition",
-                      "action"
-                  ],
-                "gestures": [
-                    "drop"
-                ]
-            }
-          ],
-            "controllers": [
-             {
-                 "key": "NotebookController",
-                 "implementation": NotebookController,
-                 "depends": ["$scope",
-                             "dialogService",
-                             "popupService",
-                             "agentService",
-                             "objectService",
-                             "navigationService",
-                             "now",
-                             "actionService",
-                             "$timeout",
-                             "$element",
-                             "$sce"
-                             ]
-             },
-             {
-                 "key": "NewEntryController",
-                 "implementation": NewEntryController,
-                 "depends": ["$scope",
-                              "$rootScope"
-                             ]
-             },
-             {
-                 "key": "selectSnapshotController",
-                 "implementation": SelectSnapshotController,
-                 "depends": ["$scope",
-                              "$rootScope"
-                             ]
-             },
-             {
-                 "key": "LayoutNotebookController",
-                 "implementation": LayoutNotebookController,
-                 "depends": ["$scope"]
-             }
-           ],
-            "representations": [
-                {
-                    "key": "draggedEntry",
-                    "template": entryTemplate
-                },
-                {
-                    "key": "frameLayoutNotebook",
-                    "template": frameTemplate
-                }
-            ],
-            "templates": [
-                {
-                    "key": "annotate-snapshot",
-                    "template": annotationTemplate
-                },
-                {
-                    "key": "notificationTemplate",
-                    "template": notificationsTemplate
-                }
-            ],
-            "directives": [
-                {
-                    "key": "mctSnapshot",
-                    "implementation": MCTSnapshot,
-                    "depends": [
-                        "$rootScope",
-                        "$document",
-                        "exportImageService",
-                        "dialogService",
-                        "notificationService"
-                    ]
-                },
-                {
-                    "key": "mctEntryDnd",
-                    "implementation": MCTEntryDnd,
-                    "depends": [
-                        "$rootScope",
-                        "$compile",
-                        "dndService",
-                        "typeService",
-                        "notificationService"
-                    ]
-                },
-                 {
-                    "key": "mctModalNotebook",
-                    "implementation": MCTModalNotebook,
-                    "depends": [
-                        "$document"
-                    ]
-                }
-            ],
-            "actions": [
-                {
-                    "key": "view-snapshot",
-                    "implementation": ViewSnapshotAction,
-                    "name": "View Snapshot",
-                    "description": "View the large image in a modal",
-                    "category": "embed",
-                    "depends": [
-                      "$compile"
-                    ]
-                },
-                {
-                    "key": "annotate-snapshot",
-                    "implementation": AnnotateSnapshotAction,
-                    "name": "Annotate Snapshot",
-                    "cssClass": "icon-pencil labeled",
-                    "description": "Annotate embed's snapshot",
-                    "category": "embed",
-                    "depends": [
-                      "dialogService",
-                      "dndService",
-                      "$rootScope"
-                    ]
-                },
-
-                {
-                    "key": "remove-embed",
-                    "implementation": RemoveEmbedAction,
-                    "name": "Remove...",
-                    "cssClass": "icon-trash labeled",
-                    "description": "Remove this embed",
-                    "category": [
-                        "embed",
-                        "embed-no-snap"
-                    ],
-                    "depends": [
-                      "dialogService"
-                    ]
-                },
-                {
-                    "key": "remove-snapshot",
-                    "implementation": RemoveSnapshotAction,
-                    "name": "Remove Snapshot",
-                    "cssClass": "icon-trash labeled",
-                    "description": "Remove Snapshot of the embed",
-                    "category": "embed",
-                    "depends": [
-                      "dialogService"
-                    ]
-                },
-                {
-                    "key": "create-snapshot",
-                    "implementation": CreateSnapshotAction,
-                    "name": "Create Snapshot",
-                    "description": "Create a snapshot for the embed",
-                    "category": "embed-no-snap",
-                    "priority": "preferred",
-                    "depends": [
-                      "$compile"
-                    ]
-                },
-                {
-                    "key": "notebook-new-entry",
-                    "implementation": newEntryAction,
-                    "name": "New Notebook Entry",
-                    "cssClass": "icon-notebook labeled",
-                    "description": "Add a new entry",
-                    "category": [
-                        "contextual",
-                         "view-control"
-                    ],
-                    "depends": [
-                      "$compile",
-                      "$rootScope",
-                      "dialogService",
-                      "notificationService",
-                      "linkService"
-                    ],
-                    "priority": "preferred"
-                }
-            ],
-            "licenses": [
-                {
-                    "name": "painterro",
-                    "version": "4.1.0",
-                    "author": "Mike Bostock",
-                    "description": "D3 (or D3.js) is a JavaScript library for visualizing data using web standards. D3 helps you bring data to life using SVG, Canvas and HTML. D3 combines powerful visualization and interaction techniques with a data-driven approach to DOM manipulation, giving you the full capabilities of modern browsers and the freedom to design the right visual interface for your data.",
-                    "website": "https://d3js.org/",
-                    "copyright": "Copyright 2010-2016 Mike Bostock",
-                    "license": "BSD-3-Clause",
-                    "link": "https://github.com/d3/d3/blob/master/LICENSE"
-                }
-            ],
-            "capabilities": [
-                {
-                    "key": "notebook",
-                    "name": "Notebook Capability",
-                    "description": "Provides a capability for looking for a notebook domain object",
-                    "implementation": NotebookCapability,
-                    "depends": [
-                        "typeService"
-                    ]
-                }
-            ],
-            "policies": [
-                {
-                    "category": "composition",
-                    "implementation": CompositionPolicy,
-                    "message": "Objects of this type cannot contain objects of that type."
-                }
-            ],
-            "controls": [
-              {
-                  "key": "embed-control",
-                  "template": embedControlTemplate
-              },
-               {
-                  "key": "snapshot-select",
-                  "template":  snapSelectTemplate
-              }
-            ],
-            "stylesheets": [
-                {
-                    "stylesheetUrl": "css/notebook.css"
-                },
-                {
-                    "stylesheetUrl": "css/notebook-espresso.css",
-                    "theme": "espresso"
-                },
-                {
-                    "stylesheetUrl": "css/notebook-snow.css",
-                    "theme": "snow"
-                }
-          ]
-        }
-    });
-});

platform/features/notebook/res/sass/_notebook-base.scss

@@ -1,271 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2016, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-.w-notebook {
-    font-size: 0.8rem;
-    overflow: hidden;
-    position: absolute;
-    top: 0px;
-    right: 0px;
-    bottom: 0px;
-    left: 0px;
-    width: auto;
-    height: auto;
-}
-
-.l-notebook-drag-area {
-    padding: 10px;
-    font-style: italic;
-    cursor: pointer;
-    &:before { margin-right: 7px !important; }
-    .label {
-        @include ellipsize();
-    }
-}
-
-.frame {
-   .icon-notebook {
-        margin-right: 5px;
-    } 
-}
-
-.overlay.l-dialog .title{
-    white-space: normal;
-}
-
-.w-notebook-entries {
-    //@include test($a: 0.1);
-    padding-right: $interiorMarginSm;
-    position: relative;
-    overflow-x: hidden;
-    overflow-y: scroll;
-    .t-entries-list {
-    }
-}
-
-.l-notebook-entry {
-    $p: $interiorMarginSm;
-    box-sizing: border-box;
-    margin-bottom: $p;
-    padding: $p $interiorMargin;
-
-    .s-notebook-entry-time,
-    .s-notebook-entry-text,
-    .notebook-entry-delete {
-        padding-top: $p;
-        padding-bottom: $p;
-    }
-
-    .s-notebook-entry-time {
-        border: 1px solid transparent; // Needed to maintain vertical alignment with s-notebook-entry-text
-    }
-
-    .l-notebook-entry-content{
-        .s-notebook-entry-text {
-            // Contenteditable div that holds text
-            min-height: 24px; // Needed in Firefox when field is blank
-        }
-        .entry-embeds{
-            flex-wrap: wrap;
-        }
-        .snap-thumb {
-            cursor: pointer;
-        }
-    }
-}
-
-.l-entry-embed {
-    $m: $interiorMarginSm;
-    position: relative;
-    margin: $m $m 0 0;
-    padding: $interiorMarginSm;
-
-    &.has-snapshot {
-        &:before {
-            position: absolute;
-            text-shadow: rgba(black, 0.7) 0 1px 5px;
-            z-index: 2;
-        }
-    }
-    .snap-thumb {
-        $d: 50px;
-        width: $d;
-        height: $d;
-        border-radius: 5px;
-        overflow: hidden;
-        img {
-            height: 100%;
-            width: 100%;
-        }
-    }
-
-    .embed-info {
-        margin-left: $interiorMargin;
-        .embed-title {
-            font-weight: bold;
-        }
-    }
-}
-
-.t-contents,
-.snap-annotation {
-    // Todo: don't write this to t-contents, add a l- class
-    overflow: hidden;
-}
-
-.notebook-filters {
-    .select {
-        margin-left: $interiorMargin;
-    }
-}
-
-/********************************************* MOBILE */
-@include phonePortrait() {
-    body.phone {
-        .w-notebook-entry-time-and-content {
-            flex-direction: column !important;
-        }
-        .s-notebook-entry-time,
-        .notebook-entry-delete {
-            padding-top: 0;
-            padding-bottom: 0;
-        }
-    }
-}
-
-/********************************************* PAINTERRO OVERRIDES */
-.annotation-dialog .abs.editor {
-    border-radius: 0;
-}
-
-#snap-annotation {
-    display: flex;
-    flex-direction: column;
-    position: absolute;
-    top: 0; right: 0; bottom: 0; left: 0;
-}
-
-#snap-annotation-wrapper,
-#snap-annotation-bar {
-    position: relative;
-    top: auto; right: auto; bottom: auto; left: auto;
-}
-
-#snap-annotation-wrapper {
-    order: 2;
-    flex: 10 0 auto;
-}
-
-#snap-annotation-bar {
-    order: 1;
-    flex: 0 0 auto;
-    height: auto;
-    background-color: transparent !important;
-    margin-bottom: $interiorMargin;
-
-    > div,
-    > div > span,
-    .ptro-icon-btn,
-    .ptro-named-btn,
-    .ptro-color-btn,
-    .ptro-bordered-btn,
-    .ptro-tool-ctl-name,
-    .ptro-color-btn,
-    .tool-controls,
-    .ptro-input {
-        // Lot of resets for crappy CSS in Painterro
-        &:first-child { margin-left: 0 !important; }
-        $h: $btnToolbarH;
-        display: inline-block;
-        font-family: inherit;
-        font-size: auto;
-        height: $h !important;
-        margin: 0 0 0 5px;
-        position: relative;
-        width: auto !important;
-        line-height: $h !important;
-        top: auto; right: auto; bottom: auto; left: auto;
-        vertical-align: top;
-    }
-
-    .ptro-tool-ctl-name {
-        border-radius: 0;
-        background: none;
-        top: auto;
-        font-family: inherit;
-        padding: 0;
-    }
-
-
-    .ptro-color-btn { width: $btnToolbarH !important; }
-
-    .ptro-icon-btn,
-    .ptro-named-btn {
-        // .s-button class is added via JS in AnnotateSnapshot.js
-        i {
-            font-size: 1.25em !important;
-        }
-    }
-
-    .tool-controls .ptro-btn-color-checkers-bar,
-    .ptro-info {
-        display: none;
-    }
-}
-
-/********************************************* New Notebook Entry from Large View overlay */
-.notebook-button-container {
-    //margin-right: $interiorMargin; // TODO: change to apply margin-left to view switcher button in Large View
-}
-
-/********************************************* NO IDEA WHAT THERE ARE APPLYING TO */
-.context-available {
-    outline: none;
-}
-
-.menu-element.menu-view{
-    z-index: 999;
-}
-
-.overlay.l-dialog .abs.editor{
-    padding-right: 0;
-}
-
-/*
-.overlay.l-dialog .outer-holder.annotation-dialog{
-    width: 90%;
-    height: 90%;
-}
-*/
-
-/*
-.snap-annotation-wrapper{
-    padding-top: 40px;
-}
-
-
-.t-console {
-    // Temp console-like reporting element
-    max-height: 200px;
-    box-sizing: border-box;
-    padding: 5px;
-}
-*/

platform/features/notebook/res/sass/_notebook-thematic.scss

@@ -1,76 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2017, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-.l-notebook-drag-area {
-    border: 1px dashed rgba($colorKey, 0.7);
-    border-radius: $controlCr;
-    color: rgba($colorBodyFg, 0.7);
-    &:hover {
-        background: rgba($colorKey, 0.2);
-        color: $colorBodyFg;
-    }
-    &.drag-active{
-        border-color: $colorKey;
-    }
-}
-
-.s-notebook-entry {
-    background-color: rgba($colorBodyFg, 0.1);
-    border-radius: $basicCr;
-
-    &:hover {
-        background-color: rgba($colorBodyFg, 0.2);
-    }
-
-    .s-notebook-entry-time {
-        color: rgba($colorBodyFg, 0.5);
-    }
-}
-
-.l-entry-embed {
-    border-radius: $controlCr;
-    background-color: rgba($colorBodyFg, 0.1);
-    &.has-snapshot {
-        &:before {
-            color: $colorBodyFg;
-        }
-    }
-}
-
-.overlay.snapshot {
-    // Applied in overlay when taking a snapshot
-    background: $colorBodyBg;
-}
-
-.s-snapshot-datetime {
-    color: rgba($colorBodyFg, 0.4);
-    font-size: 0.8em;
-}
-
-.snap-thumb {
-    border: 1px solid $colorInteriorBorder;
-}
-
-/********************************************* PAINTERRO OVERRIDES */
-.ptro-wrapper {
-    background: rgba($colorBodyBg, 0.3) !important;
-}

platform/features/notebook/res/sass/notebook-espresso.scss

@@ -1,30 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2017, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-$output-bourbon-deprecation-warnings: false;
-@import "bourbon";
-
-@import "../../../../commonUI/general/res/sass/constants";
-@import "../../../../commonUI/general/res/sass/mixins";
-@import "../../../../commonUI/general/res/sass/glyphs";
-@import "../../../../commonUI/themes/espresso/res/sass/constants";
-@import "../../../../commonUI/themes/espresso/res/sass/mixins";
-@import "notebook-thematic";

platform/features/notebook/res/sass/notebook-snow.scss

@@ -1,30 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2017, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-$output-bourbon-deprecation-warnings: false;
-@import "bourbon";
-
-@import "../../../../commonUI/general/res/sass/constants";
-@import "../../../../commonUI/general/res/sass/mixins";
-@import "../../../../commonUI/general/res/sass/glyphs";
-@import "../../../../commonUI/themes/snow/res/sass/constants";
-@import "../../../../commonUI/themes/snow/res/sass/mixins";
-@import "notebook-thematic";

platform/features/notebook/res/sass/notebook.scss

@@ -1,28 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2015, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-$output-bourbon-deprecation-warnings: false;
-@import "bourbon";
-@import "../../../../commonUI/general/res/sass/constants";
-@import "../../../../commonUI/general/res/sass/mixins";
-@import "../../../../commonUI/general/res/sass/mobile/constants";
-@import "../../../../commonUI/general/res/sass/mobile/mixins";
-@import "notebook-base";

platform/features/notebook/res/templates/annotation.html

@@ -1,2 +0,0 @@
-<div class="snap-annotation" id="snap-annotation" ng-init="ngModel.tracker()">
-</div>

platform/features/notebook/res/templates/controls/embedControl.html

@@ -1,51 +0,0 @@
-<!--
- Open MCT, Copyright (c) 2009-2016, United States Government
- as represented by the Administrator of the National Aeronautics and Space
- Administration. All rights reserved.
-
- Open MCT is licensed under the Apache License, Version 2.0 (the
- "License"); you may not use this file except in compliance with the License.
- You may obtain a copy of the License at
- http://www.apache.org/licenses/LICENSE-2.0.
-
- Unless required by applicable law or agreed to in writing, software
- distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- License for the specific language governing permissions and limitations
- under the License.
-
- Open MCT includes source code licensed under additional open source
- licenses. See the Open Source Licenses file (LICENSES.md) included with
- this source code distribution or the Licensing information page available
- at runtime from the About dialog for additional information.
--->
-<!--
-This element appears in the overlay dialog when initiating a new Notebook Entry from a view's Notebook button -->
-<div class='form-control'>
-    <ng-form name="mctControl">
-        <div class='fields' ng-controller="NewEntryController">
-            <div class="l-flex-row new-notebook-entry-embed l-entry-embed {{cssClass}}"
-                 ng-class="{ 'has-snapshot' : snapToggle }">
-                <div class="holder flex-elem snap-thumb"
-                    ng-if="snapToggle">
-                    <img ng-src="{{snapshot.src}}" alt="{{snapshot.modified}}">
-                </div>
-
-                <div class="holder flex-elem embed-info">
-                    <div class="embed-title">{{objectName}}</div>
-                    <div class="embed-date"
-                         ng-if="snapToggle">{{snapshot.modified| date:'yyyy-MM-dd HH:mm:ss'}}</div>
-                </div>
-
-                <div class="holder flex-elem annotate-new"
-                     ng-if="snapToggle">
-                    <a class="s-button flex-elem icon-pencil "
-                       title="Annotate this snapshot"
-                       ng-click="annotateSnapshot()">
-                        <span class="title-label">Annotate</span>
-                    </a>
-                </div>
-            </div>
-        </div>
-    </ng-form>
-</div>

platform/features/notebook/res/templates/controls/snapSelect.html

@@ -1,30 +0,0 @@
-<!--
- Open MCT, Copyright (c) 2014-2017, United States Government
- as represented by the Administrator of the National Aeronautics and Space
- Administration. All rights reserved.
-
- Open MCT is licensed under the Apache License, Version 2.0 (the
- "License"); you may not use this file except in compliance with the License.
- You may obtain a copy of the License at
- http://www.apache.org/licenses/LICENSE-2.0.
-
- Unless required by applicable law or agreed to in writing, software
- distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- License for the specific language governing permissions and limitations
- under the License.
-
- Open MCT includes source code licensed under additional open source
- licenses. See the Open Source Licenses file (LICENSES.md) included with
- this source code distribution or the Licensing information page available
- at runtime from the About dialog for additional information.
--->
-<div class='form-control select' ng-controller="selectSnapshotController">
-    <select
-            ng-model="selectModel"
-            ng-options="opt.value as opt.name for opt in options"
-            ng-required="ngRequired"
-            name="mctControl">
-        <!-- <option value="" ng-show="!ngModel[field]">- Select One -</option> -->
-    </select>
-</div>

platform/features/notebook/res/templates/entry.html

@@ -1,38 +0,0 @@
-<!--
- Open MCT, Copyright (c) 2014-2017, United States Government
- as represented by the Administrator of the National Aeronautics and Space
- Administration. All rights reserved.
-
- Open MCT is licensed under the Apache License, Version 2.0 (the
- "License"); you may not use this file except in compliance with the License.
- You may obtain a copy of the License at
- http://www.apache.org/licenses/LICENSE-2.0.
-
- Unless required by applicable law or agreed to in writing, software
- distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- License for the specific language governing permissions and limitations
- under the License.
-
- Open MCT includes source code licensed under additional open source
- licenses. See the Open Source Licenses file (LICENSES.md) included with
- this source code distribution or the Licensing information page available
- at runtime from the About dialog for additional information.
--->
-<div class="frame snap-frame frame-template t-frame-inner abs t-object-type-{{ representation.selected.key }}">
-    <div class="abs object-browse-bar l-flex-row">
-        <div class="btn-bar right l-flex-row flex-elem flex-justify-end flex-fixed">
-            <mct-representation
-                    key="'switcher'"
-                    ng-model="representation"
-                    mct-object="domainObject">
-            </mct-representation>
-        </div>
-    </div>
-    <div class="abs object-holder" data-entry = "{{parameters.entry}}" data-embed = "{{parameters.embed}}" mct-snapshot ng-if="representation.selected.key">
-        <mct-representation
-                key="representation.selected.key"
-                mct-object="representation.selected.key && domainObject">
-        </mct-representation>
-    </div>
-</div>

platform/features/notebook/res/templates/frameLayoutNotebook.html

@@ -1,54 +0,0 @@
-<!--
- Open MCT, Copyright (c) 2014-2017, United States Government
- as represented by the Administrator of the National Aeronautics and Space
- Administration. All rights reserved.
-
- Open MCT is licensed under the Apache License, Version 2.0 (the
- "License"); you may not use this file except in compliance with the License.
- You may obtain a copy of the License at
- http://www.apache.org/licenses/LICENSE-2.0.
-
- Unless required by applicable law or agreed to in writing, software
- distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- License for the specific language governing permissions and limitations
- under the License.
-
- Open MCT includes source code licensed under additional open source
- licenses. See the Open Source Licenses file (LICENSES.md) included with
- this source code distribution or the Licensing information page available
- at runtime from the About dialog for additional information.
--->
-<div class="frame frame-template t-frame-inner abs t-object-type-{{ representation.selected.key }}">
-    <div class="abs object-browse-bar l-flex-row">
-        <div class="left flex-elem l-flex-row grows">
-            <mct-representation
-                    key="'object-header-frame'"
-                    mct-object="domainObject"
-                    class="l-flex-row flex-elem object-header grows">
-            </mct-representation>
-        </div>
-        <div class="btn-bar right l-flex-row flex-elem flex-justify-end flex-fixed">
-            <a class="s-button icon-notebook"
-               title="New Notebook Entry"
-               ng-if="parameters"
-               ng-click="ngModel()">
-            </a>
-            <mct-representation
-                    key="'switcher'"
-                    ng-model="representation"
-                    mct-object="domainObject">
-            </mct-representation>
-            <a class="s-button icon-expand t-btn-view-large"
-               title="View large"
-               mct-modal-notebook>
-            </a>
-        </div>
-    </div>
-    <div class="abs object-holder">
-        <mct-representation
-                key="representation.selected.key"
-                mct-object="representation.selected.key && domainObject">
-        </mct-representation>
-    </div>
-</div>

platform/features/notebook/res/templates/layoutNotebook.html

@@ -1,84 +0,0 @@
-<!--
- Open MCT, Copyright (c) 2014-2017, United States Government
- as represented by the Administrator of the National Aeronautics and Space
- Administration. All rights reserved.
-
- Open MCT is licensed under the Apache License, Version 2.0 (the
- "License"); you may not use this file except in compliance with the License.
- You may obtain a copy of the License at
- http://www.apache.org/licenses/LICENSE-2.0.
-
- Unless required by applicable law or agreed to in writing, software
- distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- License for the specific language governing permissions and limitations
- under the License.
-
- Open MCT includes source code licensed under additional open source
- licenses. See the Open Source Licenses file (LICENSES.md) included with
- this source code distribution or the Licensing information page available
- at runtime from the About dialog for additional information.
--->
-
-<div class="abs l-layout"
-     ng-controller="LayoutController as controller"
-     ng-click="controller.clearSelection()">
-
-    <!-- Background grid -->
-    <div class="l-grid-holder" ng-click="controller.clearSelection()">
-        <div class="l-grid l-grid-x"
-             ng-if="!controller.getGridSize()[0] < 3"
-             ng-style="{ 'background-size': controller.getGridSize() [0] + 'px 100%' }"></div>
-        <div class="l-grid l-grid-y"
-             ng-if="!controller.getGridSize()[1] < 3"
-             ng-style="{ 'background-size': '100% ' + controller.getGridSize() [1] + 'px' }"></div>
-    </div>
-
-    <div class='abs frame t-frame-outer child-frame panel s-selectable s-moveable s-hover-border'
-         ng-class="{ 'no-frame': !controller.hasFrame(childObject), 's-selected':controller.selected(childObject) }"
-         ng-repeat="childObject in composition"
-         ng-click="controller.select($event, childObject.getId())"
-         ng-style="controller.getFrameStyle(childObject.getId())">
-
-         <div ng-controller="LayoutNotebookController as controller">
-            <mct-representation key="'frameLayoutNotebook'"
-                            class="t-rep-frame holder contents abs"
-                            parameters = "hasNotebookAction"
-                            ng-model="newNotebook"
-                            mct-object="childObject">
-            </mct-representation>
-         </div>
-        
-        <!-- Drag handles -->
-        <span class="abs t-edit-handle-holder s-hover-border" ng-if="controller.selected(childObject)">
-            <span class="edit-handle edit-move"
-                  mct-drag-down="controller.startDrag(childObject.getId(), [1,1], [0,0])"
-                  mct-drag="controller.continueDrag(delta)"
-                  mct-drag-up="controller.endDrag()">
-            </span>
-
-            <span class="edit-corner edit-resize-nw"
-                  mct-drag-down="controller.startDrag(childObject.getId(), [1,1], [-1,-1])"
-                  mct-drag="controller.continueDrag(delta)"
-                  mct-drag-up="controller.endDrag()">
-            </span>
-            <span class="edit-corner edit-resize-ne"
-                  mct-drag-down="controller.startDrag(childObject.getId(), [0,1], [1,-1])"
-                  mct-drag="controller.continueDrag(delta)"
-                  mct-drag-up="controller.endDrag()">
-            </span>
-            <span class="edit-corner edit-resize-sw"
-                  mct-drag-down="controller.startDrag(childObject.getId(), [1,0], [-1,1])"
-                  mct-drag="controller.continueDrag(delta)"
-                  mct-drag-up="controller.endDrag()">
-            </span>
-            <span class="edit-corner edit-resize-se"
-                  mct-drag-down="controller.startDrag(childObject.getId(), [0,0], [1,1])"
-                  mct-drag="controller.continueDrag(delta)"
-                  mct-drag-up="controller.endDrag()">
-            </span>
-        </span>
-
-    </div>
-
-</div>

platform/features/notebook/res/templates/notebook.html

@@ -1,124 +0,0 @@
-<div ng-controller="NotebookController as controller" class="mct-notebook w-notebook l-flex-col">
-    <div class="l-notebook-head holder l-flex-row flex-elem">
-        <div class="l-flex-row holder grows holder-search">
-            <div class="search-bar flex-elem l-flex-row grows"
-                 ng-class="{ holder: !(entrySearch === '' || entrySearch === undefined) }">
-                <div class="holder flex-elem grows">
-                    <input class="search-input"
-                           type="text" tabindex="10000"
-                           ng-model="entrySearch"
-                           ng-keyup="controller.search()"/>
-                    <a class="clear-icon clear-input icon-x-in-circle"
-                       ng-class="{show: !(entrySearch === '' || entrySearch === undefined)}"
-                       ng-click="entrySearch = ''; controller.search()"></a>
-                </div>
-            </div>
-        </div>
-
-        <div class="notebook-filters right l-flex-row flex-elem grows flex-justify-end">
-            <div class="select">
-                <select ng-model="showTime">
-                    <option value="0" selected="selected">Show all</option>
-                    <option value="1">Last hour</option>
-                    <option value="8">Last 8 hours</option>
-                    <option value="24">Last 24 hours</option>
-                </select>
-            </div>
-            <div class="select">
-                <select ng-model="sortEntries">
-                    <option value="-createdOn" selected="selected">Newest first</option>
-                    <option value="createdOn">Oldest first</option>
-                </select>
-            </div>
-        </div>
-    </div>
-
-    <!--  drag area -->
-    <div class="holder flex-elem l-flex-row icon-plus labeled l-notebook-drag-area" ng-click="newEntry($event)"
-         id="newEntry" mct-entry-dnd>
-        <span class="label">To start a new entry, click here or drag and drop any object</span>
-    </div>
-
-    <!-- entries -->
-    <div class="holder flex-elem grows w-notebook-entries t-entries-list" ng-mouseover="handleActive()">
-        <ul>
-            <li class="l-flex-row has-local-controls l-notebook-entry s-notebook-entry"
-                id="{{'entry_'+ entry.id}}"
-                ng-if="hoursFilter(showTime,entry.createdOn)"
-                ng-repeat="entry in model.entries | filter:entrySearch | orderBy: sortEntries track by $index"
-                ng-init="$last && finished(model.entries)"
-                mct-entry-dnd>
-                <div class="holder flex-elem l-flex-row grows w-notebook-entry-time-and-content" ng-click="selectContentEditable($event)">
-                    <div class="holder flex-elem s-notebook-entry-time">
-                        <span>{{entry.createdOn | date:'yyyy-MM-dd'}}</span>
-                        <span>{{entry.createdOn | date:'HH:mm:ss'}}</span>
-                    </div>
-                    <div class="holder flex-elem l-flex-col grows l-notebook-entry-content">
-                        <div contenteditable="true"
-                             ng-blur="textBlur($event, entry.id)"
-                             ng-focus="textFocus($event, entry.id)"
-                             ng-model="entry.text"
-                             placeholder="Enter text here"
-                             class="flex-elem s-input-inline t-notebook-entry-input s-notebook-entry-text"
-                             ng-bind-html="trustedHtml(entry.text)">
-                        </div>
-                        <!-- embeds -->
-                        <div class="flex-elem entry-embeds l-flex-row">
-                            <div class="l-flex-row l-entry-embed {{embed.cssClass}}"
-                                 ng-repeat="embed in entry.embeds track by $index"
-                                 ng-class="{ 'has-snapshot' : embed.snapshot }"
-                                 id="{{embed.id}}">
-                                <div class="snap-thumb"
-                                     ng-if="embed.snapshot"
-                                     ng-click="viewSnapshot($event,embed.snapshot.src,embed.id,entry.createdOn,this,embed)">
-                                    <img ng-src="{{embed.snapshot.src}}" src="//:0" alt="{{embed.id}}">
-                                </div>
-                                <div class="embed-info l-flex-col">
-                                    <div class="embed-title object-header">
-                                        <a ng-click='navigate($event,embed.type)'>{{embed.name}}</a>
-                                        <a class='context-available' ng-click='openMenu($event,embed.type)'></a>
-                                    </div>
-                                    <div class="hide-menu" ng-show="false">
-                                        <div class="menu-element context-menu-wrapper mobile-disable-select">
-                                            <div class="menu context-menu">
-                                                <ul>
-                                                    <li ng-repeat="menu in menuEmbed"
-                                                        ng-click="menu.perform($event,embed.snapshot.src,embed.id,entry.createdOn,this,embed)"
-                                                        title="{{menu.getMetadata().description}}"
-                                                        class="{{menu.getMetadata().cssClass}}"
-                                                        ng-if="embed.snapshot">
-                                                        {{menu.getMetadata().name}}
-                                                    </li>
-                                                    <li ng-repeat="menu in menuEmbedNoSnap"
-                                                        ng-click="menu.perform($event,embed.snapshot.src,embed.id,entry.createdOn,this)"
-                                                        title="{{menu.getMetadata().description}}"
-                                                        class="{{menu.getMetadata().cssClass}}"
-                                                        ng-if="!embed.snapshot">
-                                                        {{menu.getMetadata().name}}
-                                                    </li>
-                                                    <li ng-repeat="menu in embedActions"
-                                                        ng-click="menu.perform()"
-                                                        title="{{menu.name}}"
-                                                        class="{{menu.cssClass}}">
-                                                        {{menu.name}}
-                                                    </li>
-                                                </ul>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="embed-date"
-                                         ng-if="embed.snapshot">{{embed.id| date:'yyyy-MM-dd HH:mm:ss'}}
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-                <!-- delete entry -->
-                <div class="holder flex-elem local-control notebook-entry-delete">
-                    <a class="s-icon-button icon-trash" id={{entry.id}} title="Delete Entry" ng-click="deleteEntry($event)"></a>
-                </div>
-            </li>
-        </ul>
-    </div>
-</div>

platform/features/notebook/res/templates/notifications.html

@@ -1,8 +0,0 @@
-<span class="status block">
-    <!-- DO NOT ADD SPACES BETWEEN THE SPANS - IT ADDS WHITE SPACE!! -->
-    <span class="status-indicator icon-bell"></span>
-    <span class="label">
-        Notifications
-    </span>
-    <span class="count"></span>
-</span>

platform/features/notebook/src/actions/AnnotateSnapshot.js

@@ -1,125 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2017, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-/**
- * Module defining viewSnapshot (Originally NewWindowAction). Created by vwoeltje on 11/18/14.
- */
-define(
-    ["painterro", "zepto"],
-    function (Painterro, $) {
-
-        var ANNOTATION_STRUCT = {
-            title: "Annotate Snapshot",
-            template: "annotate-snapshot",
-            options: [{
-                name: "OK",
-                key: "ok",
-                description: "save annotation"
-            },
-            {
-                name: "Cancel",
-                key: "cancel",
-                description: "cancel editing"
-            }]
-        };
-
-        function AnnotateSnapshot(dialogService,dndService,$rootScope,context) {
-            context = context || {};
-
-            // Choose the object to be opened into a new tab
-            this.domainObject = context.selectedObject || context.domainObject;
-            this.dialogService = dialogService;
-            this.dndService = dndService;
-            this.$rootScope = $rootScope;
-        }
-
-
-
-
-        AnnotateSnapshot.prototype.perform = function ($event,snapshot,embedId,entryId,$scope) {
-
-            var DOMAIN_OBJECT = this.domainObject;
-            var ROOTSCOPE = this.$rootScope;
-
-            this.dialogService.getUserChoice(ANNOTATION_STRUCT)
-                        .then(saveNotes);
-
-            var painterro;
-
-            var tracker = function () {
-                $(document.body).find('.l-dialog .outer-holder').addClass('annotation-dialog');
-                painterro = Painterro({
-                    id: 'snap-annotation',
-                    activeColor: '#ff0000',
-                    activeColorAlpha: 1.0,
-                    activeFillColor: '#fff',
-                    activeFillColorAlpha: 0.0,
-                    backgroundFillColor: '#000',
-                    backgroundFillColorAlpha: 0.0,
-                    defaultFontSize: 16,
-                    defaultLineWidth: 2,
-                    defaultTool: 'ellipse',
-                    hiddenTools: ['save', 'open', 'close', 'eraser', 'pixelize', 'rotate', 'settings', 'scale'],
-                    toolbarPosition: 'top',
-                    // colorScheme: {
-                    //     main: '#333',
-                    //     control: '#ffcc00'
-                    // },
-                    saveHandler: function (image, done) {
-                        if (entryId && embedId) {
-                            var elementPos = DOMAIN_OBJECT.model.entries.map(function (x) {
-                                return x.createdOn;
-                            }).indexOf(entryId);
-                            var entryEmbeds = DOMAIN_OBJECT.model.entries[elementPos].embeds;
-                            var embedPos = entryEmbeds.map(function (x) {
-                                return x.id;
-                            }).indexOf(embedId);
-                            $scope.saveSnap(image.asBlob(), embedPos, elementPos);
-                        }else {
-                            ROOTSCOPE.snapshot = {'src': image.asDataURL('image/png'),
-                                                  'modified': Date.now()};
-                        }
-
-                        done(true);
-                    }
-                }).show(snapshot);
-                $(document.body).find('.ptro-icon-btn').addClass('s-button');
-                $(document.body).find('.ptro-input').addClass('s-button');
-            };
-
-            ANNOTATION_STRUCT.model = {'tracker': tracker};
-
-
-
-            function saveNotes(param) {
-                if (param === 'ok') {
-                    painterro.save();
-                }else {
-                    ROOTSCOPE.snapshot = "annotationCancelled";
-                }
-            }
-
-        };
-
-        return AnnotateSnapshot;
-    }
-);

platform/features/notebook/src/actions/CreateSnapshot.js

@@ -1,65 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2017, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-define(
-    [],
-    function () {
-
-        var SNAPSHOT_TEMPLATE = '<mct-representation key="\'draggedEntry\'"' +
-                                    'parameters="{entry:entryId,embed:embedId}"' +
-                                    'class="t-rep-frame holder"' +
-                                    'mct-object="selObj">' +
-                                '</mct-representation>';
-
-        function CreateSnapshot($compile,context) {
-            context = context || {};
-            this.domainObject = context.selectedObject || context.domainObject;
-            this.context = context;
-            this.$compile = $compile;
-        }
-
-
-        CreateSnapshot.prototype.perform = function ($event,snapshot,embedId,entryId,$scope) {
-            var compile = this.$compile;
-            var model = this.domainObject.model;
-            var elementPos = model.entries.map(function (x) {
-                return x.createdOn;
-            }).indexOf(entryId);
-            var entryEmbeds = model.entries[elementPos].embeds;
-            var embedPos = entryEmbeds.map(function (x) {
-                return x.id;
-            }).indexOf(embedId);
-            var embedType = entryEmbeds[embedPos].type;
-
-            $scope.getDomainObj(embedType).then(function (resp) {
-                if (entryId >= 0 && embedId >= 0) {
-                    $scope.selObj = resp[embedType];
-                    $scope.entryId = elementPos;
-                    $scope.embedId = embedPos;
-                    compile(SNAPSHOT_TEMPLATE)($scope);
-                }
-            });
-        };
-
-        return CreateSnapshot;
-    }
-);

platform/features/notebook/src/actions/NewEntryContextual.js

@@ -1,195 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2017, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-define(
-    [],
-    function () {
-
-        var SNAPSHOT_TEMPLATE = '<mct-representation key="\'draggedEntry\'"' +
-                                    'class="t-rep-frame holder"' +
-                                    'mct-object="selObj">' +
-                                '</mct-representation>';
-
-        var NEW_TASK_FORM = {
-            name: "Create a Notebook Entry",
-            hint: "Please select one Notebook",
-            sections: [{
-                rows: [{
-                    name: 'Entry',
-                    key: 'entry',
-                    control: 'textarea',
-                    required: true,
-                    "cssClass": "l-textarea-sm"
-                },
-                {
-                    name: 'Embed Type',
-                    key: 'withSnapshot',
-                    control: 'snapshot-select',
-                    "options": [
-                        {
-                            "name": "Link and Snapshot",
-                            "value": true
-                        },
-                        {
-                            "name": "Link only",
-                            "value": false
-                        }
-                    ]
-                },
-                {
-                    name: 'Embed',
-                    key: 'embedObject',
-                    control: 'embed-control'
-                },
-                {
-                    name: 'Save in Notebook',
-                    key: 'saveNotebook',
-                    control: 'locator',
-                    validate: validateLocation
-                }]
-            }]
-        };
-
-        function NewEntryContextual($compile,$rootScope,dialogService,notificationService,linkService,context) {
-            context = context || {};
-            this.domainObject = context.selectedObject || context.domainObject;
-            this.dialogService = dialogService;
-            this.notificationService = notificationService;
-            this.linkService = linkService;
-            this.$rootScope = $rootScope;
-            this.$compile = $compile;
-        }
-
-        function validateLocation(newParentObj) {
-            return newParentObj.model.type === 'notebook';
-        }
-
-
-        NewEntryContextual.prototype.perform = function () {
-
-            var self = this;
-            var domainObj = this.domainObject;
-            var notification = this.notificationService;
-            var dialogService = this.dialogService;
-            var rootScope = this.$rootScope;
-            rootScope.newEntryText = '';
-            // Create the overlay element and add it to the document's body
-            this.$rootScope.selObj = domainObj;
-            this.$rootScope.selValue = "";
-            var newScope = rootScope.$new();
-            newScope.selObj = domainObj;
-            newScope.selValue = "";
-            this.$compile(SNAPSHOT_TEMPLATE)(newScope);
-            //newScope.$destroy();
-
-            this.$rootScope.$watch("snapshot", setSnapshot);
-
-            function setSnapshot(value) {
-                if (value === "annotationCancelled") {
-                    rootScope.snapshot = rootScope.lastValue;
-                    rootScope.lastValue = '';
-                }else if (value && value !== rootScope.lastValue) {
-                    var overlayModel = {
-                        title: NEW_TASK_FORM.name,
-                        message: NEW_TASK_FORM.message,
-                        structure: NEW_TASK_FORM,
-                        value: {'entry': rootScope.newEntryText || ""}
-                    };
-
-                    rootScope.currentDialog = overlayModel;
-
-                    dialogService.getDialogResponse(
-                        "overlay-dialog",
-                        overlayModel,
-                        function () {
-                            return overlayModel.value;
-                        }
-                    ).then(addNewEntry);
-
-                    rootScope.lastValue = value;
-                }
-            }
-
-            function addNewEntry(options) {
-                options.selectedModel = options.embedObject.getModel();
-                options.cssClass = options.embedObject.getCapability('type').typeDef.cssClass;
-                if (self.$rootScope.snapshot) {
-                    options.snapshot = self.$rootScope.snapshot;
-                    self.$rootScope.snapshot = undefined;
-                }else {
-                    options.snapshot = undefined;
-                }
-
-                if (!options.withSnapshot) {
-                    options.snapshot = '';
-                }
-
-                createSnap(options);
-            }
-
-            function createSnap(options) {
-                options.saveNotebook.useCapability('mutation', function (model) {
-                    var entries = model.entries;
-                    var lastEntry = entries[entries.length - 1];
-                    var date = Date.now();
-
-                    if (lastEntry === undefined || lastEntry.text || lastEntry.embeds) {
-                        model.entries.push({
-                            'id': date,
-                            'createdOn': date,
-                            'text': options.entry,
-                            'embeds': [{'type': options.embedObject.getId(),
-                                       'id': '' + date,
-                                       'cssClass': options.cssClass,
-                                       'name': options.selectedModel.name,
-                                       'snapshot': options.snapshot
-                                     }]
-                        });
-                    }else {
-                        model.entries[entries.length - 1] = {
-                            'id': date,
-                            'createdOn': date,
-                            'text': options.entry,
-                            'embeds': [{'type': options.embedObject.getId(),
-                                       'id': '' + date,
-                                       'cssClass': options.cssClass,
-                                       'name': options.selectedModel.name,
-                                       'snapshot': options.snapshot
-                                     }]
-                        };
-                    }
-                });
-
-                notification.info({
-                    title: "Notebook Entry created"
-                });
-            }
-        };
-
-        NewEntryContextual.appliesTo = function (context) {
-            var domainObject = context.domainObject;
-            return domainObject && domainObject.hasCapability("notebook") &&
-                domainObject.getCapability("notebook").isNotebook();
-        };
-
-        return NewEntryContextual;
-    }
-);

platform/features/notebook/src/actions/RemoveEmbed.js

@@ -1,72 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2017, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-define(
-    [],
-    function () {
-
-        function RemoveEmbed(dialogService,context) {
-            context = context || {};
-
-            this.domainObject = context.selectedObject || context.domainObject;
-            this.dialogService = dialogService;
-        }
-
-
-        RemoveEmbed.prototype.perform = function ($event,snapshot,embedId,entryId) {
-            var DOMAIN_OBJ = this.domainObject;
-            var errorDialog = this.dialogService.showBlockingMessage({
-                severity: "error",
-                title: "This action will permanently delete this Embed. Do you want to continue?",
-                minimized: true, // want the notification to be minimized initially (don't show banner)
-                options: [{
-                    label: "OK",
-                    callback: function () {
-                        errorDialog.dismiss();
-                        remove();
-                    }
-                },{
-                    label: "Cancel",
-                    callback: function () {
-                        errorDialog.dismiss();
-                    }
-                }]
-            });
-
-            function remove() {
-                DOMAIN_OBJ.useCapability('mutation', function (model) {
-                    var elementPos = model.entries.map(function (x) {
-                        return x.createdOn;
-                    }).indexOf(entryId);
-                    var entryEmbeds = model.entries[elementPos].embeds;
-                    var embedPos = entryEmbeds.map(function (x) {
-                        return x.id;
-                    }).indexOf(embedId);
-                    model.entries[elementPos].embeds.splice(embedPos, 1);
-                });
-            }
-
-        };
-
-        return RemoveEmbed;
-    }
-);

platform/features/notebook/src/actions/RemoveSnapshot.js

@@ -1,74 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2017, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-define(
-    [],
-    function () {
-
-        function RemoveSnapshot(dialogService,context) {
-            context = context || {};
-
-            this.domainObject = context.selectedObject || context.domainObject;
-            this.dialogService = dialogService;
-        }
-
-
-
-        RemoveSnapshot.prototype.perform = function ($event,snapshot,embedId,entryId) {
-
-            var DOMAIN_OBJ = this.domainObject;
-            var errorDialog = this.dialogService.showBlockingMessage({
-                severity: "error",
-                title: "This action will permanently delete this Snapshot. Do you want to continue?",
-                minimized: true, // want the notification to be minimized initially (don't show banner)
-                options: [{
-                    label: "OK",
-                    callback: function () {
-                        errorDialog.dismiss();
-                        remove();
-                    }
-                },{
-                    label: "Cancel",
-                    callback: function () {
-                        errorDialog.dismiss();
-                    }
-                }]
-            });
-
-            function remove() {
-                DOMAIN_OBJ.useCapability('mutation', function (model) {
-                    var elementPos = model.entries.map(function (x) {
-                        return x.createdOn;
-                    }).indexOf(entryId);
-                    var entryEmbeds = model.entries[elementPos].embeds;
-                    var embedPos = entryEmbeds.map(function (x) {
-                        return x.id;
-                    }).indexOf(embedId);
-                    model.entries[elementPos].embeds[embedPos].snapshot = "";
-                });
-            }
-
-        };
-
-        return RemoveSnapshot;
-    }
-);

platform/features/notebook/src/actions/ViewSnapshot.js

@@ -1,164 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2017, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-/**
- * Module defining ViewSnapshot
- */
-define(
-    ['zepto'],
-    function ($) {
-
-        var OVERLAY_TEMPLATE = '' +
-        '    <div class="abs blocker"></div>' +
-        '    <div class="abs outer-holder">' +
-        '       <a class="close icon-x-in-circle"></a>' +
-        '       <div class="abs inner-holder l-flex-col">' +
-        '           <div class="t-contents flex-elem holder grows"></div>' +
-        '           <div class="bottom-bar flex-elem holder">' +
-        '               <a class="t-done s-button major">Done</a>' +
-        '           </div>' +
-        '       </div>' +
-        '    </div>';
-
-        var toggleOverlay,
-            overlay,
-            closeButton,
-            doneButton,
-            blocker,
-            overlayContainer,
-            imgHolder,
-            img,
-            annotateButton,
-            annotateImg;
-
-        function ViewSnapshot($compile,context) {
-            context = context || {};
-
-            this.$compile = $compile;
-        }
-
-        function openOverlay(url,header) {
-            overlay = document.createElement('div');
-            $(overlay).addClass('abs overlay l-large-view');
-            overlay.innerHTML = OVERLAY_TEMPLATE;
-            overlayContainer = overlay.querySelector('.t-contents');
-            closeButton = overlay.querySelector('a.close');
-            closeButton.addEventListener('click', toggleOverlay);
-            doneButton = overlay.querySelector('a.t-done');
-            doneButton.addEventListener('click', toggleOverlay);
-            blocker = overlay.querySelector('.abs.blocker');
-            blocker.addEventListener('click', toggleOverlay);
-            annotateButton = header.querySelector('a.icon-pencil');
-            annotateButton.addEventListener('click', annotateImg);
-            document.body.appendChild(overlay);
-            img = document.createElement('div');
-            $(img).addClass('abs object-holder t-image-holder s-image-holder');
-            img.innerHTML = '<div class="image-main s-image-main" style="background-image: url(' + url + ');"></div>';
-            overlayContainer.appendChild(header);
-            overlayContainer.appendChild(img);
-        }
-
-        function closeOverlay() {
-            overlayContainer.removeChild(img);
-            document.body.removeChild(overlay);
-            closeButton.removeEventListener('click', toggleOverlay);
-            closeButton = undefined;
-            doneButton.removeEventListener('click', toggleOverlay);
-            doneButton = undefined;
-            blocker.removeEventListener('click', toggleOverlay);
-            blocker = undefined;
-            overlayContainer = undefined;
-            overlay = undefined;
-            img = undefined;
-        }
-
-        function headerTemplate() {
-            var template = '<div class="t-snapshot abs l-view-header">' +
-                                '<div class="abs object-browse-bar l-flex-row">' +
-                                    '<div class="left flex-elem l-flex-row grows">' +
-                                        '<div class="object-header flex-elem l-flex-row grows">' +
-                                            '<div class="type-icon flex-elem embed-icon holder" ng-class="cssClass"></div>' +
-                                            '<div class="title-label flex-elem holder flex-can-shrink">{{entryName}}</div>' +
-                                            '<a class="context-available flex-elem holder" ng-click="openMenu($event,embedType)""></a>' +
-                                            '<div class="hide-menu" ng-show="false">' +
-                                                '<div class="menu-element menu-view context-menu-wrapper mobile-disable-select">' +
-                                                    '<div class="menu context-menu">' +
-                                                        '<ul>' +
-                                                            '<li ng-repeat="menu in embedActions"' +
-                                                                'ng-click="menu.perform()"' +
-                                                                'title="{{menu.name}}"' +
-                                                                'class="{{menu.cssClass}}">' +
-                                                                '{{menu.name}}' +
-                                                            '</li>' +
-                                                        '</ul>' +
-                                                    '</div>' +
-                                                '</div>' +
-                                            '</div>' +
-                                        '</div><!-- closes object-header -->' +
-                                    '</div><!-- closes left -->' +
-                                    '<div class="btn-bar right l-flex-row flex-elem flex-justify-end flex-fixed">' +
-                                        '<div class="flex-elem holder flex-can-shrink s-snapshot-datetime">' +
-                                        'SNAPSHOT {{snapDate | date:\'yyyy-MM-dd HH:mm:ss\'}}' +
-                                        '</div>' +
-                                        '<a class="s-button icon-pencil" title="Annotate">' +
-                                            '<span class="title-label">Annotate</span>' +
-                                        '</a>' +
-                                    '</div><!-- closes right -->' +
-                                '</div><!-- closes object-browse-bar -->' +
-                            '</div><!-- closes t-snapshot -->';
-            return template;
-        }
-
-
-        ViewSnapshot.prototype.perform = function ($event,snapshot,embedId,entryId,$scope,embed) {
-            var isOpen = false;
-
-            // Create the overlay element and add it to the document's body
-            $scope.cssClass = embed.cssClass;
-            $scope.embedType = embed.type;
-            $scope.entryName = embed.name;
-            $scope.snapDate = +embedId;
-            var element = this.$compile(headerTemplate())($scope);
-
-            var annotateAction = $scope.action.getActions({category: 'embed'})[1];
-
-            toggleOverlay = function () {
-                if (!isOpen) {
-                    openOverlay(snapshot, element[0]);
-                    isOpen = true;
-                } else {
-                    closeOverlay();
-                    isOpen = false;
-                }
-            };
-
-            annotateImg = function () {
-                closeOverlay();
-                annotateAction.perform($event, snapshot, embedId, entryId, $scope);
-            };
-
-            toggleOverlay();
-        };
-
-        return ViewSnapshot;
-    }
-);

platform/features/notebook/src/controllers/LayoutNotebookController.js

@@ -1,54 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2017, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-/**
- * This bundle implements object types and associated views for
- * display-building.
- */
-define(
-    [],
-    function () {
-
-        /**
-         * The LayoutNotebookController is responsible for supporting the
-         * notebook feature creation on theLayout view.
-         **/
-
-        function LayoutNotebookController($scope) {
-            $scope.hasNotebookAction = undefined;
-
-            $scope.newNotebook = undefined;
-
-            var actions = $scope.domainObject.getCapability('action');
-            var notebookAction = actions.getActions({'key': 'notebook-new-entry'});
-            if (notebookAction.length > 0) {
-                $scope.hasNotebookAction = true;
-                $scope.newNotebook = function () {
-                    notebookAction[0].perform();
-                };
-            }
-        }
-
-        return LayoutNotebookController;
-    }
-);
-

platform/features/notebook/src/controllers/NewEntryController.js

@@ -1,66 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2017, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-/**
- * Module defining NewEntryController. */
-define(
-    [],
-    function () {
-
-        function NewEntryController($scope,$rootScope) {
-
-            $scope.snapshot = undefined;
-            $scope.snapToggle = true;
-            $scope.entryText = '';
-            var annotateAction = $rootScope.selObj.getCapability('action').getActions(
-                                                                            {category: 'embed'})[1];
-
-            $scope.$parent.$parent.ngModel[$scope.$parent.$parent.field] = $rootScope.selObj;
-            $scope.objectName = $rootScope.selObj.getModel().name;
-            $scope.cssClass = $rootScope.selObj.getCapability('type').typeDef.cssClass;
-
-            $scope.annotateSnapshot = function ($event) {
-                if ($rootScope.currentDialog.value) {
-                    $rootScope.newEntryText = $scope.$parent.$parent.ngModel.entry;
-                    $rootScope.currentDialog.cancel();
-                    annotateAction.perform($event, $rootScope.snapshot.src);
-                    $rootScope.currentDialog = undefined;
-                }
-            };
-
-            function updateSnapshot(img) {
-                $scope.snapshot = img;
-            }
-            // Update set of actions whenever the action capability
-            // changes or becomes available.
-            $rootScope.$watch("snapshot", updateSnapshot);
-
-            $rootScope.$watch("selValue", toggleEmbed);
-
-            function toggleEmbed(value) {
-                $scope.snapToggle = value;
-            }
-        }
-
-        return NewEntryController;
-    }
-);

platform/features/notebook/src/controllers/NotebookController.js

@@ -1,400 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2017, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
- /*-- main controller file, here is the core functionality of the notebook plugin --*/
-
-define(
-    ['zepto'],
-    function ($) {
-
-
-        function NotebookController(
-                $scope,
-                dialogService,
-                popupService,
-                agentService,
-                objectService,
-                navigationService,
-                now,
-                actionService,
-                $timeout,
-                $element,
-                $sce
-        ) {
-
-            $scope.entriesEl = $(document.body).find('.t-entries-list');
-            $scope.sortEntries = '-createdOn';
-            $scope.showTime = "0";
-            $scope.editEntry = false;
-            $scope.entrySearch = '';
-            $scope.entryTypes = [];
-            $scope.embedActions = [];
-            $scope.currentEntryValue = '';
-
-            /*--seconds in an hour--*/
-
-            var SECONDS_IN_AN_HOUR  = 60 * 60 * 1000;
-
-            this.scope = $scope;
-
-            $scope.hoursFilter = function (hours,entryTime) {
-                if (+hours) {
-                    return entryTime > (Date.now() - SECONDS_IN_AN_HOUR * (+hours));
-                }else {
-                    return true;
-                }
-            };
-
-            $scope.scrollToTop = function () {
-                var entriesContainer = $scope.entriesEl.parent();
-                entriesContainer[0].scrollTop = 0;
-            };
-
-            $scope.findEntryEl = function (entryId) {
-                var element = $($scope.entriesEl).find('#entry_' + entryId);
-
-                if (element[0]) {
-                    return element.find("[contenteditable='true']");
-                } else {
-                    return $($scope.entriesEl.children().children()[0]).find("[contenteditable='true']");
-                }
-            };
-
-            $scope.findEntryPositionById = function (id) {
-                var foundId = -1;
-
-                $scope.domainObject.model.entries.forEach(function (element, index) {
-                    if (element.id === id) {
-                        foundId = index;
-                        return;
-                    }
-                });
-
-                return foundId;
-            };
-
-            $scope.newEntry = function ($event) {
-                $scope.scrollToTop();
-
-                var entries = $scope.domainObject.model.entries,
-                    lastEntry = entries[entries.length - 1],
-                    id = Date.now();
-
-                if (lastEntry === undefined || lastEntry.text || lastEntry.embeds) {
-                    var createdEntry = {'id': id, 'createdOn': id};
-
-                    $scope.domainObject.useCapability('mutation', function (model) {
-                        model.entries.push(createdEntry);
-                    });
-                } else {
-                    $scope.findEntryEl(lastEntry.id).focus();
-
-                    $scope.domainObject.useCapability('mutation', function (model) {
-                        model.entries[entries.length - 1].createdOn = id;
-                    });
-                }
-                $scope.entrySearch = '';
-            };
-
-
-            $scope.deleteEntry = function ($event) {
-                var delId = +$event.currentTarget.id;
-                var errorDialog = dialogService.showBlockingMessage({
-                    severity: "error",
-                    title: "This action will permanently delete this Notebook entry. Do you want to continue?",
-                    minimized: true, // want the notification to be minimized initially (don't show banner)
-                    options: [{
-                        label: "OK",
-                        callback: function () {
-                            errorDialog.dismiss();
-                            var elementPos = $scope.findEntryPositionById(delId);
-
-                            if (elementPos !== -1) {
-                                $scope.domainObject.useCapability('mutation', function (model) {
-                                    model.entries.splice(elementPos, 1);
-                                });
-                            } else {
-                                window.console.log('delete error');
-                            }
-
-                        }
-                    },{
-                        label: "Cancel",
-                        callback: function () {
-                            errorDialog.dismiss();
-                        }
-                    }]
-                });
-            };
-
-            function setCaretToEndOfContenteditable(contentEditableElement) {
-                var range,selection;
-                if (document.createRange) {
-                    range = document.createRange();//Create a range (a range is a like the selection but invisible)
-                    range.selectNodeContents(contentEditableElement);//Select the entire contents of the element with the range
-                    range.collapse(false);//collapse the range to the end point. false means collapse to end rather than the start
-                    selection = window.getSelection();//get the selection object (allows you to change selection)
-                    selection.removeAllRanges();//remove any selections already made
-                    selection.addRange(range);//make the range you have just created the visible selection
-                }
-            }
-
-            $scope.selectContentEditable = function ($event) {
-                var child = $($event.srcElement).children()[0];
-
-                if (child) {
-                    $($event.srcElement).children()[0].focus();
-                }
-            };
-
-            $scope.textFocus = function ($event, entryId) {
-                if ($event.srcElement && $event.srcElement.innerText) {
-                    /*
-                     On focus, if the currentTarget isn't blank, set the global currentEntryValue = the
-                     content of the current focus. This will be used at blur to determine if the
-                     current entry has been modified or not.
-                     Not sure this is right, would think we'd always want to set curEntVal even if blank
-                     */
-                    $scope.currentEntryValue = $event.srcElement.innerText;
-                    setCaretToEndOfContenteditable($event.srcElement);
-                } else {
-                    $event.target.innerText = '';
-                }
-            };
-
-            //On text blur(when focus is removed)
-            $scope.textBlur = function ($event, entryId) {
-                // entryId is the unique numeric based on the original createdOn
-                if ($event.target && $event.target.innerText !== "") {
-                    var elementPos = $scope.findEntryPositionById(+entryId);
-                    
-                    // If the text of an entry has been changed, then update the text and the modifiedOn numeric
-                    // Otherwise, don't do anything
-                    if ($scope.currentEntryValue !== $event.target.innerText) {
-                        $scope.domainObject.useCapability('mutation', function (model) {
-                            model.entries[elementPos].text = $event.target.innerText;
-                            model.entries[elementPos].modified = Date.now();
-                        });
-                    }
-                }
-            };
-
-            $scope.finished = function (model) {
-                var lastEntry = model[model.length - 1];
-
-                if (!lastEntry.text) {
-                    $scope.findEntryEl(lastEntry.id).focus();
-                }
-            };
-
-            $scope.handleActive = function () {
-                var newEntry = $scope.entriesEl.find('.active');
-                if (newEntry) {
-                    newEntry.removeClass('active');
-                }
-            };
-
-
-            $scope.clearSearch = function () {
-                $scope.entrySearch = '';
-            };
-
-            $scope.viewSnapshot = function ($event,snapshot,embedId,entryId,$innerScope,domainObject) {
-                var viewAction = $scope.action.getActions({category: 'embed'})[0];
-                viewAction.perform($event, snapshot, embedId, entryId, $innerScope, domainObject);
-            };
-
-
-            $scope.parseText = function (text) {
-                if (text) {
-                    return text.split(/\r\n|\r|\n/gi);
-                }
-            };
-
-            //parse text and add line breaks where needed
-            $scope.trustedHtml = function (text) {
-                if (text) {
-                    return $sce.trustAsHtml(this.parseText(text).join('<br>'));
-                }
-            };
-
-            $scope.renderImage = function (img) {
-                return URL.createObjectURL(img);
-            };
-
-            $scope.getDomainObj = function (id) {
-                return objectService.getObjects([id]);
-            };
-
-            function refreshComp(change) {
-                if (change && change.length) {
-                    change[0].getCapability('action').getActions({key: 'remove'})[0].perform();
-                }
-            }
-
-            $scope.actionToMenuOption = function (action) {
-                return {
-                    key: action.getMetadata().key,
-                    name: action.getMetadata().name,
-                    cssClass: action.getMetadata().cssClass,
-                    perform: action.perform
-                };
-            };
-
-            // Maintain all "conclude-editing" and "save" actions in the
-            // present context.
-            function updateActions() {
-                $scope.menuEmbed = $scope.action ?
-                        $scope.action.getActions({category: 'embed'}) :
-                        [];
-
-                $scope.menuEmbedNoSnap = $scope.action ?
-                        $scope.action.getActions({category: 'embed-no-snap'}) :
-                        [];
-
-                $scope.menuActions = $scope.action ?
-                        $scope.action.getActions({key: 'window'}) :
-                        [];
-            }
-
-            // Update set of actions whenever the action capability
-            // changes or becomes available.
-            $scope.$watch("action", updateActions);
-
-            $scope.navigate = function ($event,embedType) {
-                if ($event) {
-                    $event.preventDefault();
-                }
-                $scope.getDomainObj(embedType).then(function (resp) {
-                    navigationService.setNavigation(resp[embedType]);
-                });
-            };
-
-            $scope.saveSnap = function (url,embedPos,entryPos) {
-                var snapshot = false;
-                if (url) {
-                    if (embedPos !== -1 && entryPos !== -1) {
-                        var reader = new window.FileReader();
-                        reader.readAsDataURL(url);
-                        reader.onloadend = function () {
-                            snapshot = reader.result;
-                            $scope.domainObject.useCapability('mutation', function (model) {
-                                if (model.entries[entryPos]) {
-                                    model.entries[entryPos].embeds[embedPos].snapshot = {
-                                        'src': snapshot,
-                                        'type': url.type,
-                                        'size': url.size,
-                                        'modified': Date.now()
-                                    };
-                                    model.entries[entryPos].embeds[embedPos].id = Date.now();
-                                }
-                            });
-                        };
-                    }
-                }else {
-                    $scope.domainObject.useCapability('mutation', function (model) {
-                        model.entries[entryPos].embeds[embedPos].snapshot = snapshot;
-                    });
-                }
-            };
-
-            /*---popups menu embeds----*/
-
-            function getEmbedActions(embedType) {
-                if (!$scope.embedActions.length) {
-                    $scope.getDomainObj(embedType).then(function (resp) {
-                        $scope.embedActions = [];
-                        $scope.embedActions.push($scope.actionToMenuOption(
-                                                    $scope.action.getActions({key: 'window',selectedObject: resp[embedType]})[0]
-                                              ));
-                        $scope.embedActions.push({
-                                                key: 'navigate',
-                                                name: 'Go to Original',
-                                                cssClass: '',
-                                                perform: function () {
-                                                    $scope.navigate('', embedType);
-                                                }
-                                            });
-                    });
-                }
-            }
-
-            $scope.openMenu = function ($event,embedType) {
-                $event.preventDefault();
-
-                getEmbedActions(embedType);
-
-                var body = $(document).find('body'),
-                    initiatingEvent = agentService.isMobile() ?
-                            'touchstart' : 'mousedown',
-                    dismissExistingMenu,
-                    menu,
-                    popup;
-
-                var container = $($event.currentTarget).parent().parent();
-
-                menu = container.find('.menu-element');
-
-                // Remove the context menu
-                function dismiss() {
-                    container.find('.hide-menu').append(menu);
-                    body.off("mousedown", dismiss);
-                    dismissExistingMenu = undefined;
-                    $scope.embedActions = [];
-                }
-
-                // Dismiss any menu which was already showing
-                if (dismissExistingMenu) {
-                    dismissExistingMenu();
-                }
-
-                // ...and record the presence of this menu.
-                dismissExistingMenu = dismiss;
-
-                popup = popupService.display(menu, [$event.pageX,$event.pageY], {
-                    marginX: 0,
-                    marginY: -50
-                });
-
-                // Stop propagation so that clicks or touches on the menu do not close the menu
-                menu.on(initiatingEvent, function (event) {
-                    event.stopPropagation();
-                    $timeout(dismiss, 300);
-                });
-
-                // Dismiss the menu when body is clicked/touched elsewhere
-                // ('mousedown' because 'click' breaks left-click context menus)
-                // ('touchstart' because 'touch' breaks context menus up)
-                body.on(initiatingEvent, dismiss);
-
-            };
-
-
-            $scope.$watchCollection("composition", refreshComp);
-
-
-            $scope.$on('$destroy', function () {});
-
-        }
-
-        return NotebookController;
-    });

platform/features/notebook/src/directives/EntryDnd.js

@@ -1,138 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2016, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-define(['zepto'], function ($) {
-    var SNAPSHOT_TEMPLATE = '<mct-representation key="\'draggedEntry\'"' +
-                                    'parameters="{entry:entryId,embed:embedId}"' +
-                                    'class="t-rep-frame holder"' +
-                                    'mct-object="selObj">' +
-                                '</mct-representation>';
-
-    function EntryDnd($rootScope,$compile,dndService,typeService,notificationService) {
-
-        function link($scope, $element) {
-
-            function drop(e) {
-                var selectedObject = dndService.getData('mct-domain-object');
-                var selectedModel = selectedObject.getModel();
-                var cssClass = selectedObject.getCapability('type').typeDef.cssClass;
-                var entryId = -1;
-                var embedId = -1;
-                $scope.clearSearch();
-                if ($element[0].id === 'newEntry') {
-                    entryId = $scope.domainObject.model.entries.length;
-                    embedId = 0;
-                    var lastEntry = $scope.domainObject.model.entries[entryId - 1];
-                    if (lastEntry === undefined || lastEntry.text || lastEntry.embeds) {
-                        $scope.domainObject.useCapability('mutation', function (model) {
-                            model.entries.push({'createdOn': +Date.now(),
-                                                'id': +Date.now(),
-                                                'embeds': [{'type': selectedObject.getId(),
-                                                       'id': '' + Date.now(),
-                                                       'cssClass': cssClass,
-                                                       'name': selectedModel.name,
-                                                       'snapshot': ''
-                                                     }]
-                                            });
-                        });
-                    }else {
-                        $scope.domainObject.useCapability('mutation', function (model) {
-                            model.entries[entryId - 1] =
-                                                    {'createdOn': +Date.now(),
-                                                     'embeds': [{'type': selectedObject.getId(),
-                                                                'id': '' + Date.now(),
-                                                                'cssClass': cssClass,
-                                                                'name': selectedModel.name,
-                                                                'snapshot': ''
-                                                               }]
-                                                    };
-                        });
-                    }
-
-                    $scope.scrollToTop();
-                    notificationService.info({
-                        title: "Notebook Entry created"
-                    });
-
-                }else {
-                    entryId = $scope.findEntryPositionById(Number($element[0].id.replace('entry_', '')));
-
-                    if (!$scope.domainObject.model.entries[entryId].embeds) {
-                        $scope.domainObject.model.entries[entryId].embeds = [];
-                    }
-
-                    $scope.domainObject.useCapability('mutation', function (model) {
-                        model.entries[entryId].embeds.push({'type': selectedObject.getId(),
-                                                                          'id': '' + Date.now(),
-                                                                          'cssClass': cssClass,
-                                                                          'name': selectedModel.name,
-                                                                          'snapshot': ''
-                                                                        });
-                    });
-
-                    embedId = $scope.domainObject.model.entries[entryId].embeds.length - 1;
-
-                    if (selectedObject) {
-                        e.preventDefault();
-
-                    }
-                }
-
-                if (entryId >= 0 && embedId >= 0) {
-                    $scope.selObj = selectedObject;
-                    $scope.entryId = entryId;
-                    $scope.embedId = embedId;
-                    $compile(SNAPSHOT_TEMPLATE)($scope);
-                }
-
-                if ($(e.currentTarget).hasClass('drag-active')) {
-                    $(e.currentTarget).removeClass('drag-active');
-                }
-
-            }
-
-            function dragover(e) {
-                if (!$(e.currentTarget).hasClass('drag-active')) {
-                    $(e.currentTarget).addClass('drag-active');
-                }
-            }
-
-            // Listen for the drop itself
-            $element.on('dragover', dragover);
-            $element.on('drop', drop);
-
-
-            $scope.$on('$destroy', function () {
-                $element.off('dragover', dragover);
-                $element.off('drop', drop);
-            });
-        }
-
-        return {
-            restrict: 'A',
-            link: link
-        };
-    }
-
-    return EntryDnd;
-
-});

platform/features/notebook/src/directives/MCTModalNotebook.js

@@ -1,166 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2016, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-define([
-    'zepto'
-], function (
-    $
-) {
-
-    var OVERLAY_TEMPLATE = '' +
-'    <div class="abs blocker"></div>' +
-'    <div class="abs outer-holder">' +
-'       <a class="close icon-x-in-circle"></a>' +
-'       <div class="abs inner-holder l-flex-col">' +
-'           <div class="t-contents flex-elem holder grows"></div>' +
-'           <div class="bottom-bar flex-elem holder">' +
-'               <a class="t-done s-button major">Done</a>' +
-'           </div>' +
-'       </div>' +
-'    </div>';
-
-    var NEW_NOTEBOOK_BUTTON_TEMPLATE = '<a class="s-button labeled icon-notebook new-notebook-entry" title="New Notebook Entry">' +
-                                    '<span class="title-label">New Notebook Entry</span>' +
-                                '</a>';
-
-    /**
-     * MCT Trigger Modal is intended for use in only one location: inside the
-     * object-header to allow views in a layout to be popped out in a modal.
-     * Users can close the modal and go back to normal, and everything generally
-     * just works fine.
-     *
-     * This code is sensitive to how our html is constructed-- particularly with
-     * how it locates the the container of an element in a layout. However, it
-     * should be able to handle slight relocations so long as it is always a
-     * descendent of a `.frame` element.
-     */
-    function MCTModalNotebook($document) {
-        var document = $document[0];
-
-        function link($scope, $element) {
-            var frame = $element.parent();
-
-            for (var i = 0; i < 10; i++) {
-                if (frame.hasClass('frame')) {
-                    break;
-                }
-                frame = frame.parent();
-            }
-            if (!frame.hasClass('frame')) {
-                $element.remove();
-                return;
-            }
-
-            frame = frame[0];
-            var layoutContainer = frame.parentElement,
-                isOpen = false,
-                toggleOverlay,
-                overlay,
-                closeButton,
-                doneButton,
-                notebookButton,
-                blocker,
-                overlayContainer,
-                notebookButtonEl;
-
-            function openOverlay() {
-                // Remove frame classes from being applied in a non-frame context
-                $(frame).removeClass('frame frame-template');
-                overlay = document.createElement('div');
-                $(overlay).addClass('abs overlay l-large-view');
-                overlay.innerHTML = OVERLAY_TEMPLATE;
-                overlayContainer = overlay.querySelector('.t-contents');
-                closeButton = overlay.querySelector('a.close');
-                closeButton.addEventListener('click', toggleOverlay);
-                doneButton = overlay.querySelector('a.t-done');
-                doneButton.addEventListener('click', toggleOverlay);
-                blocker = overlay.querySelector('.abs.blocker');
-                blocker.addEventListener('click', toggleOverlay);
-                document.body.appendChild(overlay);
-                layoutContainer.removeChild(frame);
-                overlayContainer.appendChild(frame);
-
-                //verify if there is a new notebook entry action
-                var actions = $scope.domainObject.getCapability('action');
-                var notebookAction = actions.getActions({'key': 'notebook-new-entry'});
-                if (notebookAction.length > 0) {
-                    notebookButtonEl = document.createElement('div');
-                    $(notebookButtonEl).addClass('notebook-button-container');
-                    notebookButtonEl.innerHTML = NEW_NOTEBOOK_BUTTON_TEMPLATE;
-                    notebookButton = frame.querySelector('.object-browse-bar .right');
-                    notebookButton.prepend(notebookButtonEl);
-                    // $(frame.querySelector('.object-holder')).addClass('container-notebook');
-                    notebookButton.addEventListener('click', function () {
-                        notebookAction[0].perform();
-                    });
-                }
-
-            }
-
-            function closeOverlay() {
-                $(frame).addClass('frame frame-template');
-                overlayContainer.removeChild(frame);
-                layoutContainer.appendChild(frame);
-                document.body.removeChild(overlay);
-                closeButton.removeEventListener('click', toggleOverlay);
-                closeButton = undefined;
-                doneButton.removeEventListener('click', toggleOverlay);
-                doneButton = undefined;
-                blocker.removeEventListener('click', toggleOverlay);
-                blocker = undefined;
-                overlayContainer = undefined;
-                overlay = undefined;
-
-
-                if (notebookButton) {
-                    notebookButton.removeChild(notebookButtonEl);
-                }
-
-            }
-
-            toggleOverlay = function (event) {
-                event.stopPropagation();
-
-                if (!isOpen) {
-                    openOverlay();
-                    isOpen = true;
-                } else {
-                    closeOverlay();
-                    isOpen = false;
-                }
-            };
-
-            $element.on('click', toggleOverlay);
-            $scope.$on('$destroy', function () {
-                $element.off('click', toggleOverlay);
-            });
-        }
-
-        return {
-            restrict: 'A',
-            link: link
-        };
-    }
-
-    return MCTModalNotebook;
-
-});

platform/features/notebook/src/directives/MCTSnapshot.js

@@ -1,130 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2016, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-define(['zepto', 'dom-to-image'], function ($) {
-    /**
-
-     */
-    function MCTSnapshot($rootScope,$document,exportImageService,dialogService,notificationService) {
-        var document = $document[0];
-
-        function link($scope, $element,$attrs) {
-            var element = $element[0];
-            var layoutContainer = element.parentElement,
-                toggleOverlay,
-                makeImg,
-                saveImg,
-                snapshot = document.createElement('div');
-
-            function openOverlay() {
-                // Remove frame classes from being applied in a non-frame context
-                $(snapshot).addClass('abs overlay l-large-view snapshot');
-                snapshot.appendChild(element);
-                document.body.appendChild(snapshot);
-            }
-
-            function closeOverlay() {
-                if (snapshot) {
-                    snapshot.removeChild(element);
-                    layoutContainer.remove();
-                }
-                document.body.removeChild(snapshot);
-                snapshot = undefined;
-                $element.remove();
-            }
-
-            toggleOverlay = function () {
-                openOverlay();
-                makeImg(element);
-            };
-
-            makeImg = function (el) {
-                var scope = $scope;
-                var dialog = dialogService.showBlockingMessage({
-                        title: "Saving...",
-                        hint: "Taking Snapshot...",
-                        unknownProgress: true,
-                        severity: "info",
-                        delay: true
-                    });
-                window.setTimeout(function () {
-                    window.domtoimage.toBlob(el).then(function (img) {    
-
-                        if (img) {
-                            if (dialog) {
-                                dialog.dismiss();
-                            }
-                            if ($element[0].dataset.entry && $element[0].dataset.embed) {
-                                saveImg(img, +$element[0].dataset.entry, +$element[0].dataset.embed);
-                                closeOverlay();
-                            } else {
-                                var reader = new window.FileReader();
-                                reader.readAsDataURL(img);
-                                reader.onloadend = function () {
-                                        $($element[0]).attr("data-snapshot", reader.result);
-                                        $rootScope.snapshot = {'src': reader.result,
-                                                                 'type': img.type,
-                                                                 'size': img.size,
-                                                                 'modified': Date.now()
-                                                              };
-                                        closeOverlay(false);
-                                        scope.$destroy();
-                                    };
-
-                            }
-
-                        } else {
-                            dialog.dismiss();
-                        }
-
-                    }, function (error) {
-                        if (dialog) {
-                            dialog.dismiss();
-                        }
-                        closeOverlay();
-                    });
-                }, 500);
-            };
-
-            saveImg = function (url,entryId,embedId) {
-                $scope.$parent.$parent.$parent.saveSnap(url, embedId, entryId);
-            };
-
-            if ($(document.body).find('.overlay.snapshot').length === 0) {
-                toggleOverlay();
-            }
-
-            $scope.$on('$destroy', function () {
-                $element.off('click', toggleOverlay);
-                $element.remove();
-            });
-        }
-
-        return {
-            restrict: 'A',
-            link: link
-        };
-    }
-
-    return MCTSnapshot;
-
-});

platform/features/notebook/src/policies/CompositionPolicy.js

@@ -1,44 +0,0 @@
-/******************************************************************************
- * Open MCT, Copyright (c) 2014-2017, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-/**
- * This bundle implements "containment" rules, which determine which objects
- * can be contained within a notebook.
- */
-define(
-    [],
-    function () {
-        function CompositionPolicy() {
-        }
-
-        CompositionPolicy.prototype.allow = function (parent, child) {
-            var parentDef = parent.getCapability('type').getName();
-
-            if (parentDef === 'Notebook' && child.getCapability('status').list().length) {
-                return false;
-            }
-            return true;
-        };
-
-        return CompositionPolicy;
-    }
-);

platform/features/notebook/src/policies/ViewPolicy.js

@@ -1,40 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2017, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-define(
-    function () {
-
-        function ViewPolicy() {
-        }
-
-        ViewPolicy.prototype.allow = function (view, domainObject) {
-            // if (view.key === 'layout') {
-            //     return false;
-            // }
-
-            return true;
-        };
-
-        return ViewPolicy;
-    }
-);
-

platform/features/plot/README.md

@@ -0,0 +1,37 @@
+# Plot README
+
+## Chart 
+
+The `mct-chart` directive is used to support drawing of simple charts. It is 
+present to support the Plot view, and its functionality is limited to the 
+functionality that is relevant for that view.
+
+This directive is used at the element level and takes one attribute, `draw` 
+which is an Angular expression which will should evaluate to a drawing object. 
+This drawing object should contain the following properties:
+
+* `dimensions`: The size, in logical coordinates, of the chart area. A 
+two-element array or numbers. 
+* `origin`: The position, in logical coordinates, of the lower-left corner of 
+the chart area. A two-element array or numbers. 
+* `lines`: An array of lines (e.g. as a plot line) to draw, where each line is 
+expressed as an object containing: 
+    * `buffer`: A Float32Array containing points in the line, in logical 
+    coordinates, in sequential x,y pairs. 
+    * `color`: The color of the line, as a four-element RGBA array, where 
+    each element is a number in the range of 0.0-1.0. 
+    * `points`: The number of points in the line. 
+* `boxes`: An array of rectangles to draw in the chart area. Each is an object 
+containing: 
+    * `start`: The first corner of the rectangle, as a two-element array of 
+    numbers, in logical coordinates. 
+    * `end`: The opposite corner of the rectangle, as a two-element array of 
+    numbers, in logical coordinates. color : The color of the line, as a 
+    four-element RGBA array, where each element is a number in the range of 
+    0.0-1.0. 
+
+While `mct-chart` is intended to support plots specifically, it does perform 
+some useful management of canvas objects (e.g. choosing between WebGL and Canvas 
+2D APIs for drawing based on browser support) so its usage is recommended when 
+its supported drawing primitives are sufficient for other charting tasks. 
+ 

platform/features/plot/bundle.js

@@ -0,0 +1,157 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2017, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+
+define([
+    "./src/MCTChart",
+    "./src/PlotController",
+    "./src/policies/PlotViewPolicy",
+    "./src/PlotOptionsController",
+    "./src/services/ExportImageService",
+    "text!./res/templates/plot.html",
+    "text!./res/templates/plot-options-browse.html",
+    'legacyRegistry'
+], function (
+    MCTChart,
+    PlotController,
+    PlotViewPolicy,
+    PlotOptionsController,
+    exportImageService,
+    plotTemplate,
+    plotOptionsBrowseTemplate,
+    legacyRegistry
+) {
+
+    legacyRegistry.register("platform/features/plot", {
+        "name": "Plot view for telemetry",
+        "extensions": {
+            "views": [
+                {
+                    "name": "Plot",
+                    "key": "plot",
+                    "cssClass": "icon-sine",
+                    "template": plotTemplate,
+                    "needs": [
+                        "telemetry"
+                    ],
+                    "priority": "preferred",
+                    "delegation": true
+                }
+            ],
+            "directives": [
+                {
+                    "key": "mctChart",
+                    "implementation": MCTChart,
+                    "depends": [
+                        "$interval",
+                        "$log"
+                    ]
+                }
+            ],
+            "controllers": [
+                {
+                    "key": "PlotController",
+                    "implementation": PlotController,
+                    "depends": [
+                        "$scope",
+                        "$element",
+                        "exportImageService",
+                        "telemetryFormatter",
+                        "telemetryHandler",
+                        "throttle",
+                        "PLOT_FIXED_DURATION",
+                        "openmct"
+                    ]
+                },
+                {
+                    "key": "PlotOptionsController",
+                    "implementation": PlotOptionsController,
+                    "depends": [
+                        "$scope"
+                    ]
+                }
+            ],
+            "services": [
+                {
+                    "key": "exportImageService",
+                    "implementation": exportImageService,
+                    "depends": [
+                        "$q",
+                        "$timeout",
+                        "$log",
+                        "EXPORT_IMAGE_TIMEOUT"
+                    ]
+
+                }
+            ],
+            "constants": [
+                {
+                    "key": "PLOT_FIXED_DURATION",
+                    "value": 900000,
+                    "priority": "fallback",
+                    "comment": "Fifteen minutes."
+                },
+                {
+                    "key": "EXPORT_IMAGE_TIMEOUT",
+                    "value": 500,
+                    "priority": "fallback"
+                }
+            ],
+            "policies": [
+                {
+                    "category": "view",
+                    "implementation": PlotViewPolicy,
+                    "depends": [
+                        "openmct"
+                    ]
+                }
+            ],
+            "representations": [
+                {
+                    "key": "plot-options-browse",
+                    "template": plotOptionsBrowseTemplate
+                }
+            ],
+            "licenses": [
+                {
+                    "name": "FileSaver.js",
+                    "version": "0.0.2",
+                    "author": "Eli Grey",
+                    "description": "File download initiator (for file exports)",
+                    "website": "https://github.com/eligrey/FileSaver.js/",
+                    "copyright": "Copyright © 2015 Eli Grey.",
+                    "license": "license-mit",
+                    "link": "https://github.com/eligrey/FileSaver.js/blob/master/LICENSE.md"
+                },
+                {
+                    "name": "html2canvas",
+                    "version": "0.4.1",
+                    "author": "Niklas von Hertzen",
+                    "description": "JavaScript HTML renderer",
+                    "website": "https://github.com/niklasvh/html2canvas",
+                    "copyright": "Copyright © 2012 Niklas von Hertzen.",
+                    "license": "license-mit",
+                    "link": "https://github.com/niklasvh/html2canvas/blob/master/LICENSE"
+                }
+            ]
+        }
+    });
+});

platform/features/plot/res/templates/plot-options-browse.html

@@ -0,0 +1,70 @@
+<!--
+ Open MCT, Copyright (c) 2014-2017, United States Government
+ as represented by the Administrator of the National Aeronautics and Space
+ Administration. All rights reserved.
+
+ Open MCT is licensed under the Apache License, Version 2.0 (the
+ "License"); you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+ http://www.apache.org/licenses/LICENSE-2.0.
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ License for the specific language governing permissions and limitations
+ under the License.
+
+ Open MCT includes source code licensed under additional open source
+ licenses. See the Open Source Licenses file (LICENSES.md) included with
+ this source code distribution or the Licensing information page available
+ at runtime from the About dialog for additional information.
+-->
+<div ng-controller="PlotOptionsController" class="flex-elem grows l-inspector-part">
+    <em class="t-inspector-part-header" title="Display properties for this object">Plot Options</em>
+    <mct-form
+            ng-model="configuration.plot.xAxis"
+            structure="xAxisForm"
+            name="xAxisFormState"
+            class="flex-elem l-flex-row no-margin">
+    </mct-form>
+    <mct-form
+            ng-model="configuration.plot.yAxis"
+            structure="yAxisForm"
+            name="yAxisFormState"
+            class="flex-elem l-flex-row no-margin">
+    </mct-form>
+    <div class="form">
+        <div class="section-header ng-binding ng-scope">
+            Plot Series
+        </div>
+        <ul class="first flex-elem grows vscroll">
+            <ul class="tree">
+                <li ng-repeat="child in children">
+                    <span ng-controller="ToggleController as toggle">
+                        <span ng-controller="TreeNodeController as treeNode">
+                            <span class="tree-item menus-to-left">
+                                <span
+                                    class='ui-symbol view-control flex-elem has-children'
+                                    ng-class="{ expanded: toggle.isActive() }"
+                                    ng-click="toggle.toggle(); treeNode.trackExpansion()">
+                                </span>
+                                <mct-representation
+                                    class="rep-object-label"
+                                    key="'label'"
+                                    mct-object="child">
+                                </mct-representation>
+                            </span>
+                        </span>
+                        <mct-form
+                            ng-class="{hidden: !toggle.isActive()}"
+                            ng-model="configuration.plot.series[$index]"
+                            structure="plotSeriesForm"
+                            name="plotOptionsState"
+                            class="flex-elem l-flex-row">
+                        </mct-form>
+                    </span>
+                </li>
+            </ul>
+        </ul>
+    </div>
+</div>

platform/features/plot/res/templates/plot.html

@@ -0,0 +1,165 @@
+<!--
+ Open MCT, Copyright (c) 2014-2017, United States Government
+ as represented by the Administrator of the National Aeronautics and Space
+ Administration. All rights reserved.
+
+ Open MCT is licensed under the Apache License, Version 2.0 (the
+ "License"); you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+ http://www.apache.org/licenses/LICENSE-2.0.
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ License for the specific language governing permissions and limitations
+ under the License.
+
+ Open MCT includes source code licensed under additional open source
+ licenses. See the Open Source Licenses file (LICENSES.md) included with
+ this source code distribution or the Licensing information page available
+ at runtime from the About dialog for additional information.
+-->
+<span ng-controller="PlotController as plot"
+      class="abs holder holder-plot has-control-bar">
+    <div class="l-control-bar" ng-show="!plot.hideExportButtons">
+         <span class="l-btn-set">
+            <a class="s-button t-export labeled icon-download"
+               ng-click="plot.exportPNG()"
+               title="Export This View's Data as PNG">
+                PNG
+            </a>
+            <a class="s-button t-export labeled"
+               ng-click="plot.exportJPG()"
+               title="Export This View's Data as JPG">
+                JPG
+            </a>
+        </span>
+    </div>
+    <div class="l-view-section">
+        <div class="gl-plot"
+             ng-style="{ height: 100 / plot.getSubPlots().length + '%'}"
+             ng-repeat="subplot in plot.getSubPlots()">
+            <div class="gl-plot-legend">
+                <span class='plot-legend-item'
+                        ng-repeat="telemetryObject in subplot.getTelemetryObjects()"
+                        ng-class="plot.getLegendClass(telemetryObject)">
+                    <span class='plot-color-swatch'
+                          ng-style="{ 'background-color': plot.getColor($index) }">
+                    </span>
+                    <span class='title-label'>{{telemetryObject.getModel().name}}</span>
+                </span>
+            </div>
+
+            <div class="gl-plot-axis-area gl-plot-y">
+                <div class="gl-plot-label gl-plot-y-label">
+                    {{axes[1].active.name}}
+                </div>
+                <div ng-repeat="tick in subplot.getRangeTicks()"
+                     class="gl-plot-tick gl-plot-y-tick-label"
+                     ng-style="{ bottom: (100 * $index / (subplot.getRangeTicks().length - 1)) + '%' }">
+                    {{tick.label | reverse}}
+                </div>
+                <div class="gl-plot-y-options gl-plot-local-controls"
+                     ng-if="axes[1].options.length > 1">
+                    <div class='form-control shell select'>
+                        <select class="form-control input shell"
+                                ng-model="axes[1].active"
+                                ng-options="option.name for option in axes[1].options">
+                        </select>
+                    </div>
+                </div>
+            </div>
+
+            <div class="gl-plot-wrapper-display-area-and-x-axis">
+                <mct-include key="'time-of-interest'"
+                             class="l-toi-holder show-val"
+                             ng-if="toiPerc"
+                             ng-class="{ 'pinned': toiPinned, 'val-to-left': toiPerc > 80 }"
+                             ng-style="{'left': toiPerc + '%'}"></mct-include>
+
+                <div class="gl-plot-coords"
+                     ng-if="subplot.isHovering() && subplot.getHoverCoordinates()">
+                    {{subplot.getHoverCoordinates()}}
+                </div>
+
+                <div class="gl-plot-display-area"
+                     ng-mouseenter="subplot.isHovering(true);"
+                     ng-mouseleave="subplot.isHovering(false)"
+                     ng-class="{ loading: plot.isRequestPending() }">
+
+                    <!-- Out-of-bounds data indicators -->
+                    <!-- ng-show is temporarily hard-coded in next element -->
+                    <div ng-show="false" class="l-oob-data l-oob-data-up"></div>
+                    <div ng-show="false" class="l-oob-data l-oob-data-dwn"></div>
+                    <div class="gl-plot-hash hash-v"
+                         ng-repeat="tick in subplot.getDomainTicks()"
+                         ng-style="{ left: (100 * $index / (subplot.getDomainTicks().length - 1)) + '%', height: '100%' }"
+                         ng-show="$index > 0 && $index < (subplot.getDomainTicks().length - 1)">
+                    </div>
+                    <div class="gl-plot-hash hash-h"
+                         ng-repeat="tick in subplot.getRangeTicks()"
+                         ng-style="{ bottom: (100 * $index / (subplot.getRangeTicks().length - 1)) + '%', width: '100%' }"
+                         ng-show="$index > 0 && $index < (subplot.getRangeTicks().length - 1)">
+                    </div>
+                    <mct-chart draw="subplot.getDrawingObject()"
+                               ng-if="subplot.getTelemetryObjects().length > 0"
+                               ng-mousemove="subplot.hover($event)"
+                               mct-drag="subplot.continueDrag($event)"
+                               mct-drag-down="subplot.startDrag($event)"
+                               mct-drag-up="subplot.endDrag($event); plot.update()">
+                    </mct-chart>
+                    <!-- TODO: Move into correct position; make part of group; infer from set of actions -->
+                    <div class="l-local-controls gl-plot-local-controls t-plot-display-controls"
+                         ng-if="$first">
+                        <a class="s-button icon-arrow-left"
+                           ng-click="plot.stepBackPanZoom()"
+                           ng-show="plot.isZoomed()"
+                           title="Restore previous pan/zoom">
+                        </a>
+                        <a class="s-button icon-arrows-out"
+                           ng-click="plot.unzoom()"
+                           ng-show="plot.isZoomed()"
+                           title="Reset pan/zoom">
+                        </a>
+                        <div class="menu-element s-menu-button menus-to-left {{plot.getMode().cssClass}}"
+                             ng-if="plot.getModeOptions().length > 1"
+                             ng-controller="ClickAwayController as toggle">
+                            <span class="l-click-area" ng-click="toggle.toggle()"></span>
+                            <span>{{plot.getMode().name}}</span>
+                            <div class="menu" ng-show="toggle.isActive()">
+                                <ul>
+                                    <li ng-repeat="option in plot.getModeOptions()"
+                                        ng-click="plot.setMode(option); toggle.setState(false)"
+                                        class="{{option.cssClass}}">
+                                        {{option.name}}
+                                    </li>
+                                </ul>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div ng-if="$last" class="gl-plot-axis-area gl-plot-x">
+                    <div ng-repeat="tick in subplot.getDomainTicks()"
+                         class="gl-plot-tick gl-plot-x-tick-label"
+                         ng-show="$index > 0 && $index < (subplot.getDomainTicks().length - 1)"
+                         ng-style="{ left: (100 * $index / (subplot.getDomainTicks().length - 1)) + '%' }">
+                        {{tick.label | reverse}}
+                    </div>
+                    <div class="gl-plot-label gl-plot-x-label">
+                        {{axes[0].active.name}}
+                    </div>
+                    <div class="gl-plot-x-options gl-plot-local-controls"
+                         ng-if="axes[0].options.length > 1">
+                        <div class='form-control shell select'>
+                            <select class="form-control input shell"
+                                    ng-model="axes[0].active"
+                                    ng-options="option.name for option in axes[0].options">
+                            </select>
+                        </div>
+                    </div>
+
+                </div>
+            </div>
+        </div>
+    </div>
+</span>

platform/features/plot/src/Canvas2DChart.js

@@ -0,0 +1,117 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2017, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+
+define(
+    [],
+    function () {
+
+        /**
+         * Create a new chart which uses Canvas's 2D API for rendering.
+         *
+         * @memberof platform/features/plot
+         * @constructor
+         * @implements {platform/features/plot.Chart}
+         * @param {CanvasElement} canvas the canvas object to render upon
+         * @throws {Error} an error is thrown if Canvas's 2D API is unavailable.
+         */
+        function Canvas2DChart(canvas) {
+            this.canvas = canvas;
+            this.c2d = canvas.getContext('2d');
+            this.width = canvas.width;
+            this.height = canvas.height;
+            this.dimensions = [this.width, this.height];
+            this.origin = [0, 0];
+
+            if (!this.c2d) {
+                throw new Error("Canvas 2d API unavailable.");
+            }
+        }
+
+        // Convert from logical to physical x coordinates
+        Canvas2DChart.prototype.x = function (v) {
+            return ((v - this.origin[0]) / this.dimensions[0]) * this.width;
+        };
+
+        // Convert from logical to physical y coordinates
+        Canvas2DChart.prototype.y = function (v) {
+            return this.height -
+                ((v - this.origin[1]) / this.dimensions[1]) * this.height;
+        };
+
+        // Set the color to be used for drawing operations
+        Canvas2DChart.prototype.setColor = function (color) {
+            var mappedColor = color.map(function (c, i) {
+                return i < 3 ? Math.floor(c * 255) : (c);
+            }).join(',');
+            this.c2d.strokeStyle = "rgba(" + mappedColor + ")";
+            this.c2d.fillStyle = "rgba(" + mappedColor + ")";
+        };
+
+
+        Canvas2DChart.prototype.clear = function () {
+            var canvas = this.canvas;
+            this.width = canvas.width;
+            this.height = canvas.height;
+            this.c2d.clearRect(0, 0, this.width, this.height);
+        };
+
+        Canvas2DChart.prototype.setDimensions = function (newDimensions, newOrigin) {
+            this.dimensions = newDimensions;
+            this.origin = newOrigin;
+        };
+
+        Canvas2DChart.prototype.drawLine = function (buf, color, points) {
+            var i;
+
+            this.setColor(color);
+
+            // Configure context to draw two-pixel-thick lines
+            this.c2d.lineWidth = 2;
+
+            // Start a new path...
+            if (buf.length > 1) {
+                this.c2d.beginPath();
+                this.c2d.moveTo(this.x(buf[0]), this.y(buf[1]));
+            }
+
+            // ...and add points to it...
+            for (i = 2; i < points * 2; i = i + 2) {
+                this.c2d.lineTo(this.x(buf[i]), this.y(buf[i + 1]));
+            }
+
+            // ...before finally drawing it.
+            this.c2d.stroke();
+        };
+
+        Canvas2DChart.prototype.drawSquare = function (min, max, color) {
+            var x1 = this.x(min[0]),
+                y1 = this.y(min[1]),
+                w = this.x(max[0]) - x1,
+                h = this.y(max[1]) - y1;
+
+            this.setColor(color);
+            this.c2d.fillRect(x1, y1, w, h);
+        };
+
+        return Canvas2DChart;
+    }
+);

platform/features/plot/src/GLChart.js

@@ -0,0 +1,160 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2017, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+
+/**
+ * Module defining GLPlot. Created by vwoeltje on 11/12/14.
+ */
+define(
+    [],
+    function () {
+
+        // WebGL shader sources (for drawing plain colors)
+        var FRAGMENT_SHADER = [
+                "precision mediump float;",
+                "uniform vec4 uColor;",
+                "void main(void) {",
+                "gl_FragColor = uColor;",
+                "}"
+            ].join('\n'),
+            VERTEX_SHADER = [
+                "attribute vec2 aVertexPosition;",
+                "uniform vec2 uDimensions;",
+                "uniform vec2 uOrigin;",
+                "void main(void) {",
+                "gl_Position = vec4(2.0 * ((aVertexPosition - uOrigin) / uDimensions) - vec2(1,1), 0, 1);",
+                "}"
+            ].join('\n');
+
+        /**
+         * Create a new chart which uses WebGL for rendering.
+         *
+         * @memberof platform/features/plot
+         * @constructor
+         * @implements {platform/features/plot.Chart}
+         * @param {CanvasElement} canvas the canvas object to render upon
+         * @throws {Error} an error is thrown if WebGL is unavailable.
+         */
+        function GLChart(canvas) {
+            var gl = canvas.getContext("webgl", { preserveDrawingBuffer: true }) ||
+                    canvas.getContext("experimental-webgl", { preserveDrawingBuffer: true }),
+                vertexShader,
+                fragmentShader,
+                program,
+                aVertexPosition,
+                uColor,
+                uDimensions,
+                uOrigin;
+
+            // Ensure a context was actually available before proceeding
+            if (!gl) {
+                throw new Error("WebGL unavailable.");
+            }
+
+            // Initialize shaders
+            vertexShader = gl.createShader(gl.VERTEX_SHADER);
+            gl.shaderSource(vertexShader, VERTEX_SHADER);
+            gl.compileShader(vertexShader);
+            fragmentShader = gl.createShader(gl.FRAGMENT_SHADER);
+            gl.shaderSource(fragmentShader, FRAGMENT_SHADER);
+            gl.compileShader(fragmentShader);
+
+            // Assemble vertex/fragment shaders into programs
+            program = gl.createProgram();
+            gl.attachShader(program, vertexShader);
+            gl.attachShader(program, fragmentShader);
+            gl.linkProgram(program);
+            gl.useProgram(program);
+
+            // Get locations for attribs/uniforms from the
+            // shader programs (to pass values into shaders at draw-time)
+            aVertexPosition = gl.getAttribLocation(program, "aVertexPosition");
+            uColor = gl.getUniformLocation(program, "uColor");
+            uDimensions = gl.getUniformLocation(program, "uDimensions");
+            uOrigin = gl.getUniformLocation(program, "uOrigin");
+            gl.enableVertexAttribArray(aVertexPosition);
+
+            // Create a buffer to holds points which will be drawn
+            this.buffer = gl.createBuffer();
+
+            // Use a line width of 2.0 for legibility
+            gl.lineWidth(2.0);
+
+            // Enable blending, for smoothness
+            gl.enable(gl.BLEND);
+            gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);
+
+            this.gl = gl;
+            this.aVertexPosition = aVertexPosition;
+            this.uColor = uColor;
+            this.uDimensions = uDimensions;
+            this.uOrigin = uOrigin;
+        }
+
+        // Utility function to handle drawing of a buffer;
+        // drawType will determine whether this is a box, line, etc.
+        GLChart.prototype.doDraw = function (drawType, buf, color, points) {
+            var gl = this.gl;
+            gl.bindBuffer(gl.ARRAY_BUFFER, this.buffer);
+            gl.bufferData(gl.ARRAY_BUFFER, buf, gl.DYNAMIC_DRAW);
+            gl.vertexAttribPointer(this.aVertexPosition, 2, gl.FLOAT, false, 0, 0);
+            gl.uniform4fv(this.uColor, color);
+            gl.drawArrays(drawType, 0, points);
+        };
+
+        GLChart.prototype.clear = function () {
+            var gl = this.gl;
+
+            // Set the viewport size; note that we use the width/height
+            // that our WebGL context reports, which may be lower
+            // resolution than the canvas we requested.
+            gl.viewport(
+                0,
+                0,
+                gl.drawingBufferWidth,
+                gl.drawingBufferHeight
+            );
+            gl.clear(gl.COLOR_BUFFER_BIT + gl.DEPTH_BUFFER_BIT);
+        };
+
+
+        GLChart.prototype.setDimensions = function (dimensions, origin) {
+            var gl = this.gl;
+            if (dimensions && dimensions.length > 0 &&
+                origin && origin.length > 0) {
+                gl.uniform2fv(this.uDimensions, dimensions);
+                gl.uniform2fv(this.uOrigin, origin);
+            }
+        };
+
+        GLChart.prototype.drawLine = function (buf, color, points) {
+            this.doDraw(this.gl.LINE_STRIP, buf, color, points);
+        };
+
+        GLChart.prototype.drawSquare = function (min, max, color) {
+            this.doDraw(this.gl.TRIANGLE_FAN, new Float32Array(
+                min.concat([min[0], max[1]]).concat(max).concat([max[0], min[1]])
+            ), color, 4);
+        };
+
+        return GLChart;
+    }
+);