openmct/platform/framework
Pete Richards 1bb1330cba Squashed commit of the following:
commit 5aad2e6863
Author: charlesh88 <charlesh88@gmail.com>
Date:   Thu Aug 30 14:34:44 2018 -0700

    Code trimming / cleanup

    - pane tweaks;

commit 139e5ab184
Author: charlesh88 <charlesh88@gmail.com>
Date:   Thu Aug 30 13:50:26 2018 -0700

    Code trimming / cleanup

    - pane tweaks;

commit e3bb387139
Author: charlesh88 <charlesh88@gmail.com>
Date:   Thu Aug 30 13:38:35 2018 -0700

    Code trimming / cleanup

    - pane, Layout;

commit 6edaea0889
Author: charlesh88 <charlesh88@gmail.com>
Date:   Thu Aug 30 12:57:21 2018 -0700

    Collapse button new design and styling WIP

    - Also begin code cleanups;

commit bd8fab3726
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 29 18:04:47 2018 -0700

    Vertical pane resizing fixed

    - Vertical pane styling with significant fixes;

commit cf89e8a86f
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 29 16:52:53 2018 -0700

    Vertical pane resizing fixed

    - Vertical pane styling with significant fixes;

commit b3ad4c4c14
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 29 15:58:12 2018 -0700

    Vertical pane resizing fixed! Kind of...

    - pane__contents at 100% height is causing problems, fix this.
    - Normalized scss var names $splitterBtn*;
    - Added --reacts to pane to allow setting of proper flex attribs;

commit 49cead8cc6
Author: charlesh88 <charlesh88@gmail.com>
Date:   Tue Aug 28 19:07:23 2018 -0700

    WIP fixing vertical pane drag problem, still broken

    - Converting from flex-basis back to width / height;
    - Make inspector-adapter target proper holder;
    - Added --resizing class to allow user-select: none while dragging;
    - Added mixins for browser prefixing;

commit c6ff381cf0
Author: charlesh88 <charlesh88@gmail.com>
Date:   Tue Aug 28 14:56:50 2018 -0700

    New design for pane collapse buttons

    - Pane padding normalized;

commit 7cfbfe3d96
Author: charlesh88 <charlesh88@gmail.com>
Date:   Tue Aug 28 10:27:05 2018 -0700

    CSS sanding, panes and Inspector

    - Pane padding;
    - Inspector min-width;

commit 7d7eeff462
Author: charlesh88 <charlesh88@gmail.com>
Date:   Tue Aug 28 10:01:02 2018 -0700

    Pane transitions

    - Fixed pane transitions;

commit cf160c27e9
Author: charlesh88 <charlesh88@gmail.com>
Date:   Tue Aug 28 09:09:49 2018 -0700

    Splitter styling WIP

    - Hover styling

commit 022126ca21
Author: charlesh88 <charlesh88@gmail.com>
Date:   Mon Aug 27 21:18:14 2018 -0700

    Tree styling WIP

    - Mobile styling;
    - Increased hit area for desktop and mobile on tree item;
    - Added button mixin;
    - Fixed scrolling for tree in tree pane;

commit 3f1e649526
Author: charlesh88 <charlesh88@gmail.com>
Date:   Fri Aug 24 14:47:22 2018 -0700

    Drag collapse WIP

commit f9b764bb64
Author: charlesh88 <charlesh88@gmail.com>
Date:   Thu Aug 23 16:02:02 2018 -0700

    Significant changes to splitter handle and button approach

    - WIP!;
    - WIP on drag to collapse;

commit a1d9c11e82
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 22 17:55:21 2018 -0700

    Pane refactor styles WIP

    - WIP converting from width/height to flex-basis;

commit b65cca277e
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 22 17:54:34 2018 -0700

    Pane refactor styles WIP

    - WIP converting from width/height to flex-basis;

commit 3e71204529
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 22 17:51:07 2018 -0700

    Pane refactor styles WIP

    - Pane transitions;
    - TODO: convert from width/height to flex-basis;

commit b070cc27f4
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 22 10:21:14 2018 -0700

    Mobile styles WIP

    - Mobile layout mostly done;
    - Pane transitions;

commit 2ee7a77a86
Author: charlesh88 <charlesh88@gmail.com>
Date:   Tue Aug 21 15:56:12 2018 -0700

    Refinements to view control in tree

    - Changed state eval to use 'enabled', removed v-if;

commit 3a2439cd16
Author: charlesh88 <charlesh88@gmail.com>
Date:   Tue Aug 21 15:53:34 2018 -0700

    Mobile styles, VERY WIP

    WARNING: DON'T PULL!!
    - Mobile in progress;

commit 4e0dcb68bf
Author: charlesh88 <charlesh88@gmail.com>
Date:   Tue Aug 21 11:45:22 2018 -0700

    Markup / scss refactor mobile styles WIP

    - Layout, panes mobile styling WIP

commit 02afd44dd1
Author: charlesh88 <charlesh88@gmail.com>
Date:   Tue Aug 21 11:44:05 2018 -0700

    Markup / scss refactor styles WIP

    - Moved glyph constants into _constants to avoid multiple loads of
    glyph classes;

commit 703abe36c9
Author: Pete Richards <peter.l.richards@nasa.gov>
Date:   Mon Aug 20 13:20:58 2018 -0700

    tree loads composition

    Expose legacy types in new API

    tree navigation

commit 80a185440b
Merge: 93196379a 8378dfa61
Author: charlesh88 <charlesh88@gmail.com>
Date:   Fri Aug 17 18:00:04 2018 -0700

    Merge branch 'core-vue-bootstrap' of https://github.com/nasa/openmct into core-vue-bootstrap

commit 93196379aa
Author: charlesh88 <charlesh88@gmail.com>
Date:   Fri Aug 17 17:59:43 2018 -0700

    Pane padding WIP

    - Adding resize handle direction to l-pane element;

commit bea135a221
Author: charlesh88 <charlesh88@gmail.com>
Date:   Fri Aug 17 17:48:20 2018 -0700

    Inspector styling

    - Moved legacy CSS as needed into MctInspector component;

commit 8378dfa613
Author: Pete Richards <peter.l.richards@nasa.gov>
Date:   Fri Aug 17 17:31:12 2018 -0700

    Recursive tree items

commit e4420c17c6
Author: charlesh88 <charlesh88@gmail.com>
Date:   Fri Aug 17 17:02:20 2018 -0700

    Sanding and shimming on legacy CSS

    - Jury-rigging to temporarily display some views: imagery, tables
    - Code style normalization in _global.scss;

commit 5aa2be9761
Author: charlesh88 <charlesh88@gmail.com>
Date:   Fri Aug 17 16:22:54 2018 -0700

    Bring in legacy CSS

    - Legacy styles from old _global.scss moved into section of new
    _global file;
    - Most UI elements are working
    - TODO: fix Inspector grid

commit 8d4734ef5b
Author: charlesh88 <charlesh88@gmail.com>
Date:   Fri Aug 17 15:17:22 2018 -0700

    Remove commented CSS

commit e641aa6949
Author: charlesh88 <charlesh88@gmail.com>
Date:   Fri Aug 17 14:37:13 2018 -0700

    Main container and scroll-bar styling

commit c3262de1b7
Author: charlesh88 <charlesh88@gmail.com>
Date:   Fri Aug 17 14:14:01 2018 -0700

    Add status bar

commit 8addfb886e
Merge: e6be02fb8 4203dbf8e
Author: charlesh88 <charlesh88@gmail.com>
Date:   Fri Aug 17 13:52:11 2018 -0700

    Merge branch 'core-vue-bootstrap' of https://github.com/nasa/openmct into core-vue-bootstrap

commit e6be02fb8d
Author: charlesh88 <charlesh88@gmail.com>
Date:   Fri Aug 17 13:51:53 2018 -0700

    Splitter refinements / mixin fix

    - Splitter with resize grippy;
    - Fixed @background-image mixins;

commit 4203dbf8e1
Author: Pete Richards <peter.l.richards@nasa.gov>
Date:   Fri Aug 17 13:46:38 2018 -0700

    Replace angular route with custom router

commit 5a07f0d2b5
Merge: e6b22cbcb 63f22c3f2
Author: charlesh88 <charlesh88@gmail.com>
Date:   Fri Aug 17 09:39:45 2018 -0700

    Merge branch 'core-vue-bootstrap' of https://github.com/nasa/openmct into core-vue-bootstrap

commit e6b22cbcbe
Author: charlesh88 <charlesh88@gmail.com>
Date:   Fri Aug 17 09:39:33 2018 -0700

    Markup / scss refactor WIP

    - Significant reorg of splitter CSS to reduce specificity;
    - Splitter enhancements for collapsed state;

commit 63f22c3f21
Author: Pete Richards <peter.l.richards@nasa.gov>
Date:   Fri Aug 17 09:32:29 2018 -0700

    remove extraneous files

commit 17cf0cf1e6
Author: Pete Richards <peter.l.richards@nasa.gov>
Date:   Thu Aug 16 12:43:10 2018 -0700

    Render main and inspector using angular

commit 233c17e75b
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 15 18:05:44 2018 -0700

    Markup / scss refactor WIP

    - Scroll on tree;
    - Class renaming pane > l-pane;
    - Refinements to collapsed state, WIP

commit 1eaa568e04
Merge: 82dd8e22e 3957fd619
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 15 17:28:45 2018 -0700

    Markup / scss refactor WIP

    - Merge latest from Pete

commit 82dd8e22e7
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 15 17:26:45 2018 -0700

    Markup / scss refactor WIP

    - Inspector styling - very WIP!

commit 3957fd619a
Author: Pete Richards <peter.l.richards@nasa.gov>
Date:   Wed Aug 15 16:47:48 2018 -0700

    Tidy pane js

commit 91eefbfa7b
Author: Pete Richards <peter.l.richards@nasa.gov>
Date:   Wed Aug 15 16:44:02 2018 -0700

    Pane cleanup

commit 5deff887fc
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 15 16:25:35 2018 -0700

    Markup / scss refactor WIP

    - Added disabled property to viewControl;
    - Margin for elements in main panes;
    - Main search input styled for --major;

commit 6708c79754
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 15 14:34:54 2018 -0700

    Markup / scss refactor WIP

    - Fix modifiers to correctly use '--';
    - Fix icon element in search input to disallow shrinking;

commit 7c83db11ad
Merge: e24852bb8 43f978e18
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 15 13:58:43 2018 -0700

    Merge branch 'core-vue-bootstrap' of https://github.com/nasa/openmct into core-vue-bootstrap

commit e24852bb83
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 15 13:57:27 2018 -0700

    Markup / scss refactor WIP

    - Tree item styling

commit 43f978e185
Author: Pete Richards <peter.l.richards@nasa.gov>
Date:   Wed Aug 15 13:52:34 2018 -0700

    Use multipane instead of splitter

commit f67f03af47
Author: Pete Richards <peter.l.richards@nasa.gov>
Date:   Wed Aug 15 12:43:32 2018 -0700

    new multipane

commit f6b90caaff
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 15 10:41:46 2018 -0700

    Markup / scss refactor WIP

    - Added view-control component

commit 4c5baf183a
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 15 10:38:26 2018 -0700

    Markup / scss refactor WIP

    - Added sass-base.scss to make it easier for SFC's to
    include needed SASS vars, mixins, etc. with a single import;
    - Cleaned up indention in Layout.vue;

commit b2d12f95ee
Author: charlesh88 <charlesh88@gmail.com>
Date:   Tue Aug 14 23:24:45 2018 -0700

    Markup / scss refactor WIP

    - Fix transition of magnify glass icon

commit 4449994ca4
Author: charlesh88 <charlesh88@gmail.com>
Date:   Tue Aug 14 17:31:47 2018 -0700

    Markup / scss refactor WIP

    - Added code comments

commit 84fde4bd34
Author: charlesh88 <charlesh88@gmail.com>
Date:   Tue Aug 14 17:29:50 2018 -0700

    Markup / scss refactor WIP

    - Search input dynamic behavior

commit 9424f9f49e
Author: charlesh88 <charlesh88@gmail.com>
Date:   Tue Aug 14 11:28:25 2018 -0700

    Markup / scss refactor WIP

    - Search input styling and dynamics WIP;

commit dfc02cdf25
Author: charlesh88 <charlesh88@gmail.com>
Date:   Mon Aug 13 15:34:29 2018 -0700

    Markup / scss refactor WIP

    - Add input-related styling;
    - Cleanup scss in various files;
    - Move search into own component;
    - Refine padding approach in pane-tree;

commit 94a3e9e798
Author: charlesh88 <charlesh88@gmail.com>
Date:   Mon Aug 13 14:36:41 2018 -0700

    Markup / scss refactor WIP

    - Add collapse buttons to splitter;

commit d35aed2d62
Author: charlesh88 <charlesh88@gmail.com>
Date:   Fri Aug 10 18:45:37 2018 -0700

    Markup / scss refactor WIP

    - Add some initial theme files; pull back from theme "override"
    approach;
    - Splitters refined;
    - Style cleanups;

commit 32cdecebce
Author: charlesh88 <charlesh88@gmail.com>
Date:   Fri Aug 10 14:53:16 2018 -0700

    Markup / scss refactor WIP

    - Markup and components corrected;
    - Stubbed in snow theme file;

commit f811318d18
Author: charlesh88 <charlesh88@gmail.com>
Date:   Thu Aug 9 16:02:22 2018 -0700

    Markup / scss refactor WIP

    - Add normalize.min to styles-new;
    - Factor components to be more standalone, very WIP;

commit 4d9b7fe3e4
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 8 18:06:11 2018 -0700

    Markup / scss refactor WIP

    - Add timestamp to webpack build

commit dd93653306
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 8 18:03:00 2018 -0700

    Markup / scss refactor WIP

    - Use MctTree component with passed properties;
    - MctTree markup and CSS ported from codepen;

commit 84430d34b1
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 8 17:39:26 2018 -0700

    Markup / scss refactor WIP

    - Add new splitter component with passed properties;

commit 50be483421
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 8 16:04:41 2018 -0700

    Markup / scss refactor WIP

    - Mixins file added;
    - Markup and -shell CSS from codepen brought over;

commit fe2667285e
Merge: c7bd7d97d 5219f5394
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 8 15:15:21 2018 -0700

    Merge branch 'core-vue-bootstrap' of https://github.com/nasa/openmct into core-vue-bootstrap

commit 5219f5394e
Author: Pete Richards <peter.l.richards@nasa.gov>
Date:   Wed Aug 8 15:13:28 2018 -0700

    Add alias for styles directory

commit c7bd7d97dc
Merge: 0a7c16031 ab18bb348
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 8 13:55:44 2018 -0700

    Merge branch 'core-vue-bootstrap' of https://github.com/nasa/openmct into core-vue-bootstrap

commit ab18bb3484
Author: Pete Richards <peter.l.richards@nasa.gov>
Date:   Wed Aug 8 13:48:27 2018 -0700

    Revert "temporarily use file loader for live-reload via plugin"

    This reverts commit 2f54f404c2.

commit 9c0d5f7dbf
Author: Pete Richards <peter.l.richards@nasa.gov>
Date:   Wed Aug 8 13:48:17 2018 -0700

    Enable HMR in dev server

commit 0a7c160315
Author: charlesh88 <charlesh88@gmail.com>
Date:   Wed Aug 8 11:26:03 2018 -0700

    Markup / scss refactor WIP

    - Symbol fonts and glyphs files;
    - Constants, global, etc. in progress;

commit 0fa09e31a6
Author: Pete Richards <peter.l.richards@nasa.gov>
Date:   Wed Aug 8 10:30:11 2018 -0700

    WIP new styles

commit 2f54f404c2
Author: Pete Richards <peter.l.richards@nasa.gov>
Date:   Wed Aug 8 10:29:23 2018 -0700

    temporarily use file loader for live-reload via plugin

commit 279e0bf29d
Author: Pete Richards <peter.l.richards@nasa.gov>
Date:   Tue Aug 7 14:59:04 2018 -0700

    Beginning of new layout code.

    Really basic 5 component setup.
2018-08-31 12:03:15 -07:00
..
src Squashed commit of the following: 2018-08-31 12:03:15 -07:00
test Build refactor to webpack (#2139) 2018-08-07 14:47:50 -07:00
bundle.js [Copyright] Update copyright year across platform code references 2018-05-14 15:46:17 -07:00
README.md [Licenses] Update copyright year to 2017 2017-04-05 14:52:46 -07:00

Framework-level components for Open MCT. This is Angular and Require, with an extra layer to mediate between them and act as an extension mechanism to allow plug-ins to be introduced declaratively.

Usage

This section needs to be written. For now, refer to implementation notes and examples in example/builtins, example/extensions, and example/composite.

Circular dependencies

The framework layer (like Angular itself) does not support circular dependencies among extensions. Generally, circular dependencies can be avoided by refactoring; for instance, a dependency-less intermediary can be added by two parties which depend upon one another, and both can depend upon this intermediary while one abandons its dependency to the other (the intermediary must then provide the functionality that was needed in the abandoned dependency.)

In some cases this refactoring is non-obvious or ineffective (for instance, when a service component depends upon the whole.) In these cases, Angular's $injector may be used to break the declaration-time dependency, by allowing retrieval of the dependency at use-time instead. (This is essentially the same solution as above, where $injector acts as an application-global generalized intermediary.)

Implementation Notes

The framework layer is responsible for performing a four-stage initialization process. These stages are:

  1. Loading definitions. JSON declarations are loaded for all bundles which will constitute the application, and wrapped in a useful API for subsequent stages. Sources in src/load
  2. Resolving extensions. Any scripts which provide implementations for extensions exposed by bundles are loaded, using Require. Sources in src/resolve
  3. Registering extensions. Resolved extensions are registered with Angular, such that they can be used by the application at run-time. This stage includes both registration of Angular built-ins (directives, controllers, routes, constants, and services) as well as registration of non-Angular extensions. Sources in src/register
  4. Bootstrapping. JSON declarations are loaded for all bundles which will constitute the application, and wrapped in a useful API for subsequent stages. Sources in src/bootstrap

Additionally, the framework layer takes responsibility for initializing other application state. Currently this simply means adding Promise to the global namespace if it is not defined.

Load stage

Using Angular's $http, the list of installed bundles is loaded from bundles.json; then, each bundle's declaration (its path + bundle.json) is loaded. These are wrapped by Bundle objects, and the extensions they expose are wrapped by Extension objects; this is only to provide a useful API for subsequent stages.

A bundle is a set of related extensions; an extension is an individual unit of the application that is meant to be used by other pieces of the application.

Resolution stage

Some, but not all, individual extensions have corresponding scripts. These are referred to by the implementation field in their extension definition. The implementation name should not include the bundle path, or the name of the source folder; these will be pre-pended by the framework during this stage. The implementation name should include a .js extension.

Bundles may utilize third-party libraries, and may wish to expose these such that other bundles may use them. Require JS may need special configuration to recognize and utilize third-party libraries, and when exposing a third-party library it may be desirable to do so under a short name (to avoid long relative paths.) Such configuration is performed during the resolution stage, immediately before implementations are loaded. Any configuration properties from a bundle's definition (bundle.json) will be used to perform this configuration; these configuration should take the same form as needed to populate a require.config call. At present, only shim and paths options are supported; any paths will be prepended with the bundle's library path (the bundle's lib folder, by default; this directory name can be overridden by specifying a libraries property in bundles.json.)

An extension is resolved by loading its implementing script, if one has been declared. If none is declared, the extension's raw definition is used instead. To ensure that extensions look similar regardless of whether or not an implementation is present, all key-value pairs from the definition are copied to the loaded implementation (if one has been loaded.)

Registration stage

Following implementation resolution, extensions are registered by Angular. How this registration occurs depends on whether or not there is built in support for the category of extension being registered.

  • For built-in extension types (recognized by Angular), these are registered with the application module. These categories are directives, controllers, services, constants, and routes.
  • For composite services, extensions of category components are passed to the service compositor, which builds up a dependency graph among the components such that their fully-wired whole is exposed as a single service.
  • For general extensions, the resolved extensions are assembled into a list, with Angular-level dependencies are declared, and the full set is exposed as a single Angular "service."

Priority order

Within each category, registration occurs in priority order. An extension's priority may be specified as a priority property in its extension definition; this may be a number, or a symbolic string. Extensions are registered in reverse numeric order (highest-priority first), and symbolic strings are mapped to the numeric values as follows:

  • fallback: Negative infinity. Used for extensions that are not intended for use (that is, they are meant to be overridden) but are present as an option of last resort.
  • default: -100. Used for extensions that are expected to be overridden, but need a useful default.
  • none: 0. Also used if no priority is specified, or if an unknown or malformed priority is specified.
  • optional: 100. Used for extensions that are meant to be used, but may be overridden.
  • preferred: 1000. Used for extensions that are specifically intended to be used, but still may be overridden in principle.
  • mandatory: Positive infinity. Used when an extension should definitely not be overridden.

These symbolic names are chosen to reflect usage where many extensions may satisfy a given usage, but only one may be used; in this case, as a convention it should be the lowest-ordered (highest-priority) extensions available. In other cases, a full set (or multi-element subset) of extensions may be desired, with a specific ordering; in these cases, it is preferable to specify priority numerically when declaring extensions, and to understand that extensions will be sorted according to these conventions when using them.

Composite services

Composite services are assumed to follow a provider-aggregator-decorator pattern where:

  • Providers have dependencies as usual, and expose the API associated with the service they compose. Providers are full service implementations in-and-of-themselves.
  • Aggregators have dependencies as usual plus one additional dependency, which will be satisfied by the array of all providers registered of that type of service. Implementations are assumed to include an extra argument (after what they declare in depends) to receive this array. Aggregators make multiple providers appear as one.
  • Decorators have dependencies as usual plus one additional dependency, which will be satisfied by either an aggregator (if one is present), the latest provider (if no aggregator is present), or another decorator (if multiple decorators are present.) As with aggregators, an additional argument should be accepted by the implementation to receive this. Decorators modify or augment the behavior of a service, but do not provide its core functionality.
  • All of the above must be declared with a provides property, which indicates which type of service they compose. Providers will only be paired with aggregators of matching types, and so on. The value of this property is also the name of the service that is ultimately registered with Angular to represent the composite service as a whole.

The service compositor handles this in five steps:

  1. All providers are registered.
  2. Arrays of providers are registered.
  3. All aggregators are registered (with dependencies to the arrays registered in the previous step.)
  4. All decorators are registered (with dependencies on the most recent components of matching types.)
  5. Full composite services are registered (essentially aliasing back to the latest component registered of a given type.)

Throughout these steps, components are registered with Angular using generated names like typeService[decorator#11]. It is technically possible to reference these dependencies elsewhere but that is not the intent. Rather, the resulting composed service should be referred to as typeService (or, more generally, the value matched from the provides field of the paired service components.)

General extensions

Similar to composite services, each individual general extension gets registered using a generated name, like types[extension#0]. These are not intended to be referenced directly; instead, they are declared dependencies of the full list of general extensions of a given category. This list of extensions is registered with a square-brackets suffix, like types[]; this is intended to be declared as a dependency by non-framework code.