Compare commits

..

81 Commits

Author SHA1 Message Date
Henry
6299ed6e9e #279 removed extra text 2015-11-25 11:26:35 -08:00
Henry
64a7647ec3 #279 Added search filter support to elements pool 2015-11-25 11:20:58 -08:00
Henry
c211f413aa [New Edit Mode] Add Elements pool to New Edit Mode #279 2015-11-25 10:40:37 -08:00
Henry
7849803a5d Fixed cancel and drop-initiated edit 2015-11-20 14:00:29 -08:00
Henry
4f0f9e4104 Merge branch 'open-status-tracking' into open278 2015-11-20 11:28:06 -08:00
Henry
e6054b8252 #287 - modified to use s-status-editing, but CSS needed 2015-11-20 11:23:34 -08:00
Henry
a864c172d5 [Edit Mode Prototype] #278 Added visual indication of edit 2015-11-20 10:07:58 -08:00
Henry
10a44c026c [Edit Mode] Visual indication of object being edited #278 2015-11-19 18:45:18 -08:00
Henry
9631d95a52 Merge remote-tracking branch 'origin/open-status-tracking' into open278-proto 2015-11-19 15:13:10 -08:00
Henry
4ea757faa5 Adding support for object status 2015-11-19 15:12:43 -08:00
Henry
50d83eaffb Merge remote-tracking branch 'origin/open278' into open278-proto 2015-11-19 14:50:01 -08:00
Henry
30e6980dc6 Merge branch 'master' into open199 2015-11-19 14:29:32 -08:00
Henry
19d2970e0e Merge in "create button initiates edit mode" 2015-11-19 14:13:28 -08:00
Henry
a04b3f8a4b enabled toolbar in edit mode 2015-11-19 14:01:38 -08:00
Henry
b06a38da2f Fixed incorrect case 2015-11-19 13:17:14 -08:00
Henry
f45e236281 #286 Fixed issues with composition not surviving through create wizard 2015-11-19 13:11:01 -08:00
Henry
2e2b18eaa5 [Edit Mode Prototype] Create button initiates edit-mode immediately #286 2015-11-19 10:33:44 -08:00
Charles Hacskaylo
ee86209166 Merge branch 'open278' of https://github.com/nasa/openmctweb into open278 2015-11-18 17:29:18 -08:00
Charles Hacskaylo
9f5729dbbc Merge remote-tracking branch 'github/master' into open278 2015-11-18 17:28:31 -08:00
Charles Hacskaylo
de9e41818b [Frontend] File cleanup
open #199
open #278
Comments and empty CSS classes removed;
2015-11-18 17:27:56 -08:00
Charles Hacskaylo
3478f9d861 [Frontend] File cleanup
open #199
open #279
Comments and empty CSS classes removed;
2015-11-18 17:15:13 -08:00
Charles Hacskaylo
558ad94b91 [Frontend] Synced theme constants
open #199
open #279
Theme constants files needed to be synced
to facilitate more efficient comparison;
2015-11-18 17:06:18 -08:00
Charles Hacskaylo
c2e26b3555 [Frontend] Fixed magnify glass in search input
open #199
open #278
Fixed z-indexing problem in :before elements
in search input (magnify glass, etc.);
2015-11-18 16:48:13 -08:00
Charles Hacskaylo
c5c166c790 [Frontend] Refinements to active edit styles
open #199
open #278
Picking up missed rendered CSS;
2015-11-18 16:47:36 -08:00
Charles Hacskaylo
cc7df05a43 [Frontend] Refinements to active edit styles
open #199
open #278
Styling finalized for tree/search items;
Mods to pulse mixins;
Colors for both themes finessed and finalized;
2015-11-18 16:46:56 -08:00
Charles Hacskaylo
b9cd26aaf6 [Frontend] Styling for tree item when its being edited
open #278
Work in progress
2015-11-17 16:04:41 -08:00
Charles Hacskaylo
5882278f98 Bringing in latest NEM work from open199-meet-open279 2015-11-17 15:26:11 -08:00
Henry
2251a0c1e9 https://github.com/nasa/openmctweb/issues/287 2015-11-17 15:01:13 -08:00
Henry
ba669f1395 Merge branch 'open316' into open199 2015-11-17 14:31:06 -08:00
Henry
b27b60aedc Merge branch 'master' into open199 2015-11-17 14:30:57 -08:00
Charles Hacskaylo
90c06cfc97 [Frontend] Style tweaks for edit mode
open #199
Added bg color in edit area when edit mode
is active; Added to-do for ng-init in
object-inspector.html;
Ready for integration into open199;
2015-11-17 12:44:14 -08:00
Charles Hacskaylo
ec4c5864dc [Frontend] Style tweaks for edit mode
open #199
Added bg color in edit area when edit mode
is active;
2015-11-17 12:35:44 -08:00
Charles Hacskaylo
3ff275c853 [Frontend] Sanding and shimming styles for Elements pool
open #199
open #279
Also tweaked bg color of text inputs;
2015-11-17 12:20:14 -08:00
Henry
cd3bdf4f81 Change to navigate by location change 2015-11-16 17:45:31 -08:00
Charles Hacskaylo
a8d563975a [Frontend] Refinements to Inspector elements, search inputs
open #199
open #279
Treeview indent removed;
Significant refactoring of search classes to generalize
approach to search inputs;
2015-11-16 17:20:15 -08:00
Charles Hacskaylo
966e993c5d [Frontend] Merge work in open279 into open199
open #199
open #279
Fixed margin problem in mobile with
object-browse-bar element;
2015-11-16 15:20:43 -08:00
Charles Hacskaylo
9b5d894949 [Frontend] Merge work in open279 into open199
open #199
open #279
Last commit didn't fully take...
Integrated inspector changes from open279 into
new edit mode work from open199; _layout.scss
had a bit of difficult conflict resolution but seems
good at this point...
2015-11-16 15:08:22 -08:00
Charles Hacskaylo
5dd15e3b20 [Frontend] Merge work in open279 into open199
open #199
open #279
Integrated inspector changes from open279 into
new edit mode work from open199; _layout.scss
had a bit of difficult conflict resolution but seems
good at this point...
2015-11-16 15:05:44 -08:00
Henry
d961b41253 removed static buttons 2015-11-12 17:18:41 -08:00
Henry
564a822423 Fixed saving 2015-11-12 17:05:43 -08:00
Henry
51abd1fadf Merge branch 'open199d' into open199 2015-11-12 14:23:15 -08:00
Charles Hacskaylo
1ceb6d2d96 [Frontend] Fixed scrolling view
open #199
open #293
open #201
Removed fixed-header class from table markup;
(cherry picked from commit 6c4bdca)
2015-11-12 13:24:28 -08:00
Henry
93171230e3 restoring toolbar 2015-11-12 11:13:54 -08:00
Henry
5fdef59f3b Merge branch 'open199d' into open199c 2015-11-12 10:23:36 -08:00
Henry
16c3229a84 Telemetry Panels now created correctly 2015-11-12 10:22:37 -08:00
Charles Hacskaylo
1058648e76 [Frontend] Fixed plot display
open #199
open #293
Added .abs to plot.html to allow plot
to layout properly when viewed in
main view area;
Removed .test class from time-controller;
2015-11-12 09:06:17 -08:00
Charles Hacskaylo
5b325a9698 Merge remote-tracking branch 'github/open199c' into open199d 2015-11-12 08:06:12 -08:00
Henry
f0e293a513 Virtual panels working again with refactored code 2015-11-11 14:59:00 -08:00
Henry
5f8d13672f Reverted model modified hack 2015-11-11 11:58:15 -08:00
Henry
4c0a79116a Added refresh check for editability 2015-11-11 11:52:30 -08:00
Henry
aa5734d023 merged 2015-11-11 10:21:17 -08:00
Henry
ba8c2b8468 Fixed buttons not appearing on edit mode click 2015-11-10 22:10:43 -08:00
Henry
5a2f073975 commented out extraeneous span 2015-11-10 20:43:31 -08:00
Henry
1d0af0b3b6 Drop Gesture 2015-11-10 20:27:04 -08:00
Charles Hacskaylo
6d2fe9d7eb [Frontend] Misc CSS and markup updates, converting to flex
open #199
IN-PROGRESS
IMPORTANT: plots are not laying out correctly,
need to figure out why
2015-11-10 18:33:58 -08:00
Charles Hacskaylo
08ecf00916 [Frontend] Misc CSS updates to clean up layout
open #199
IN-PROGRESS
Testing with Time Controller visible;
2015-11-10 17:14:12 -08:00
Charles Hacskaylo
9f3c353ab4 [Frontend] Updated markup to use latest flexbox classes
open #199
2015-11-10 16:30:49 -08:00
Henry
e3cac49c4b Fixed UUID import 2015-11-10 16:26:04 -08:00
Charles Hacskaylo
59ea2ea361 Grabbing recompiled CSS files 2015-11-10 16:14:34 -08:00
Charles Hacskaylo
608df8f7b8 Merging in latest github master; resolved conflicts 2015-11-10 16:13:46 -08:00
Charles Hacskaylo
d712a79ba4 [Frontend] Allow Inspector to utilize split pane during editing
open #279
IN-PROGRESS
Split pane markup added to object-inspector.html;
Tweaks to layout CSS;
2015-11-10 14:40:14 -08:00
Andrew Henry
8fb6ab61ba Fixed folders 2015-10-28 14:56:34 -07:00
Andrew Henry
929f06e6c1 Working on folders 2015-10-28 13:35:52 -07:00
Andrew Henry
e9e6ddd791 Trying to fix drop on folders 2015-10-28 13:01:45 -07:00
Andrew Henry
2539e4008f Improved handling of virtual panels 2015-10-28 12:53:50 -07:00
Henry
3e7264d6b8 Initial implementation of virtual panel 2015-10-27 17:38:31 -07:00
Henry
19bdf743fc Added save/cancel 2015-10-26 14:14:56 -07:00
Henry
296d9f5acd Temporarily disable test 2015-10-22 11:38:30 -07:00
Henry
7468c0e150 Deploy to heroku 2015-10-22 11:30:06 -07:00
Henry
0fb9f3731a Edit mode and cancel buttons work 2015-10-22 10:09:09 -07:00
Henry
fdfb524eef Fixed scope of editMode variable 2015-10-21 12:06:11 -07:00
Henry
ef250f58de Marged style updates 2015-10-21 12:01:59 -07:00
Henry
15ed91f651 Added save buttons 2015-10-21 11:54:35 -07:00
Charles Hacskaylo
074254a513 Frontend] Styling for New Edit Mode
open #198
Minor tweak to placeholder init content;
2015-10-21 11:38:03 -07:00
Charles Hacskaylo
4c84789d5d Frontend] Styling for New Edit Mode
open #198
.l-flex styles refined;
Animation refinement;
.s-btn default vertical-align = top;
.tool-bar style tweaked;
Added title-label back into edit-action-buttons.html;
2015-10-21 11:35:36 -07:00
Andrew Henry
92573b817f Added drag to enable edit mode 2015-10-20 21:03:36 -07:00
Charles Hacskaylo
5382cca435 [Frontend] Styling for New Edit Mode
open #198
In-progress styling of toolbar elements;
Revamped edit-action-buttons.html to use only icons;
2015-10-20 15:43:53 -07:00
Charles Hacskaylo
15c1bf20ab [Frontend] Styling for New Edit Mode
open #198
Refined CSS classing and animation timing;
2015-10-20 14:41:02 -07:00
Charles Hacskaylo
685dd2114d [Frontend] Styling for New Edit Mode
open #198
Added Save and Cancel buttons;
Additional transition styling;
tool-bar styles refined;
2015-10-20 14:11:59 -07:00
Charles Hacskaylo
6e30a25a6f [Frontend] Added new glyph
prod-uisymbols
Added e612 Save icon;
2015-10-20 12:44:09 -07:00
Charles Hacskaylo
42fa5bfd7e [Frontend] Initial styles for New Edit Mode
open #198
Refactored elems in browse-object.html to use
flex layout;
New flex-row and flex-col general CSS classes;
New pulseBorder animation mixin;
2015-10-20 11:39:28 -07:00
208 changed files with 3794 additions and 12539 deletions

View File

@@ -291,7 +291,7 @@ checklist.)
1. Changes address original issue?
2. Unit tests included and/or updated with changes?
3. Command line build passes?
4. Changes have been smoke-tested?
4. Expect to pass code review?
### Reviewer Checklist

View File

@@ -16,16 +16,14 @@
"platform/execution",
"platform/telemetry",
"platform/features/clock",
"platform/features/events",
"platform/features/imagery",
"platform/features/layout",
"platform/features/pages",
"platform/features/plot",
"platform/features/scrolling",
"platform/features/timeline",
"platform/features/events",
"platform/forms",
"platform/identity",
"platform/persistence/aggregator",
"platform/persistence/local",
"platform/persistence/queue",
"platform/policy",

View File

@@ -1,3 +1,6 @@
test:
override:
- exit 0
deployment:
production:
branch: master
@@ -5,7 +8,7 @@ deployment:
- ./build-docs.sh
- git push git@heroku.com:openmctweb-demo.git $CIRCLE_SHA1:refs/heads/master
openmctweb-staging-un:
branch: search
branch: open199
heroku:
appname: openmctweb-staging-un
openmctweb-staging-deux:

View File

@@ -106,7 +106,7 @@ GLOBAL.window = GLOBAL.window || GLOBAL; // nomnoml expects window to be define
}
// Convert from Github-flavored Markdown to HTML
function gfmifier(renderTOC) {
function gfmifier() {
var transform = new stream.Transform({ objectMode: true }),
markdown = "";
transform._transform = function (chunk, encoding, done) {
@@ -114,11 +114,9 @@ GLOBAL.window = GLOBAL.window || GLOBAL; // nomnoml expects window to be define
done();
};
transform._flush = function (done) {
if (renderTOC){
// Prepend table of contents
markdown =
[ TOC_HEAD, toc(markdown).content, "", markdown ].join("\n");
}
// Prepend table of contents
markdown =
[ TOC_HEAD, toc(markdown).content, "", markdown ].join("\n");
this.push(header);
this.push(marked(markdown));
this.push(footer);
@@ -170,16 +168,13 @@ GLOBAL.window = GLOBAL.window || GLOBAL; // nomnoml expects window to be define
var destination = file.replace(options['in'], options.out)
.replace(/md$/, "html"),
destPath = path.dirname(destination),
prefix = path.basename(destination).replace(/\.html$/, ""),
//Determine whether TOC should be rendered for this file based
//on regex provided as command line option
renderTOC = file.match(options['suppress-toc'] || "") === null;
prefix = path.basename(destination).replace(/\.html$/, "");
mkdirp(destPath, function (err) {
fs.createReadStream(file, { encoding: 'utf8' })
.pipe(split())
.pipe(nomnomlifier(destPath, prefix))
.pipe(gfmifier(renderTOC))
.pipe(gfmifier())
.pipe(fs.createWriteStream(destination, {
encoding: 'utf8'
}));

View File

@@ -1,3 +0,0 @@
Design proposals:
* [API Redesign](proposals/APIRedesign.md)

View File

@@ -1,338 +0,0 @@
# API Refactoring
This document summarizes a path toward implementing API changes
from the [API Redesign](../proposals/APIRedesign.md) for Open MCT Web
v1.0.0.
# Goals
These plans are intended to minimize:
* Waste; avoid allocating effort to temporary changes.
* Downtime; avoid making changes in large increments that blocks
delivery of new features for substantial periods of time.
* Risk; ensure that changes can be validated quickly, avoid putting
large effort into changes that have not been validated.
# Plan
```nomnoml
#comment: This diagram is in nomnoml syntax and should be rendered.
#comment: See https://github.com/nasa/openmctweb/issues/264#issuecomment-167166471
[<start> Start]->[<state> Imperative bundle registration]
[<state> Imperative bundle registration]->[<state> Build and packaging]
[<state> Imperative bundle registration]->[<state> Refactor API]
[<state> Build and packaging |
[<start> Start]->[<state> Incorporate a build step]
[<state> Incorporate a build step |
[<start> Start]->[<state> Choose package manager]
[<start> Start]->[<state> Choose build system]
[<state> Choose build system]<->[<state> Choose package manager]
[<state> Choose package manager]->[<state> Implement]
[<state> Choose build system]->[<state> Implement]
[<state> Implement]->[<end> End]
]->[<state> Separate repositories]
[<state> Separate repositories]->[<end> End]
]->[<state> Release candidacy]
[<start> Start]->[<state> Design registration API]
[<state> Design registration API |
[<start> Start]->[<state> Decide on role of Angular]
[<state> Decide on role of Angular]->[<state> Design API]
[<state> Design API]->[<choice> Passes review?]
[<choice> Passes review?] no ->[<state> Design API]
[<choice> Passes review?]-> yes [<end> End]
]->[<state> Refactor API]
[<state> Refactor API |
[<start> Start]->[<state> Imperative extension registration]
[<state> Imperative extension registration]->[<state> Refactor individual extensions]
[<state> Refactor individual extensions |
[<start> Start]->[<state> Prioritize]
[<state> Prioritize]->[<choice> Sufficient value added?]
[<choice> Sufficient value added?] no ->[<end> End]
[<choice> Sufficient value added?] yes ->[<state> Design]
[<state> Design]->[<choice> Passes review?]
[<choice> Passes review?] no ->[<state> Design]
[<choice> Passes review?]-> yes [<state> Implement]
[<state> Implement]->[<end> End]
]->[<state> Remove legacy bundle support]
[<state> Remove legacy bundle support]->[<end> End]
]->[<state> Release candidacy]
[<state> Release candidacy |
[<start> Start]->[<state> Verify |
[<start> Start]->[<choice> API well-documented?]
[<start> Start]->[<choice> API well-tested?]
[<choice> API well-documented?]-> no [<state> Write documentation]
[<choice> API well-documented?] yes ->[<end> End]
[<state> Write documentation]->[<choice> API well-documented?]
[<choice> API well-tested?]-> no [<state> Write test cases]
[<choice> API well-tested?]-> yes [<end> End]
[<state> Write test cases]->[<choice> API well-tested?]
]
[<start> Start]->[<state> Validate |
[<start> Start]->[<choice> Passes review?]
[<start> Start]->[<state> Use internally]
[<state> Use internally]->[<choice> Proves useful?]
[<choice> Passes review?]-> no [<state> Address feedback]
[<state> Address feedback]->[<choice> Passes review?]
[<choice> Passes review?] yes -> [<end> End]
[<choice> Proves useful?] yes -> [<end> End]
[<choice> Proves useful?] no -> [<state> Fix problems]
[<state> Fix problems]->[<state> Use internally]
]
[<state> Validate]->[<end> End]
[<state> Verify]->[<end> End]
]->[<state> Release]
[<state> Release]->[<end> End]
```
## Step 1. Imperative bundle registration
Register whole bundles imperatively, using their current format.
For example, in each bundle add a `bundle.js` file:
```js
define([
'mctRegistry',
'json!bundle.json'
], function (mctRegistry, bundle) {
mctRegistry.install(bundle, "path/to/bundle");
});
```
Where `mctRegistry.install` is placeholder API that wires into the
existing bundle registration mechanisms. The main point of entry
would need to be adapted to clearly depend on these bundles
(in the require sense of a dependency), and the framework layer
would need to implement and integrate with this transitional
API.
Benefits:
* Achieves an API Redesign goal with minimal immediate effort.
* Conversion to an imperative syntax may be trivially automated.
* Minimal change; reuse existing bundle definitions, primarily.
* Allows early validation of switch to imperative; unforeseen
consequences of the change may be detected at this point.
* Allows implementation effort to progress in parallel with decisions
about API changes, including fundamental ones such as the role of
Angular. May act in some sense as a prototype to inform those
decisions.
* Creates a location (framework layer) where subsequent changes to
the manner in which extensions are registered may be centralized.
When there is a one-to-one correspondence between the existing
form of an extension and its post-refactor form, adapters can be
written here to defer the task of making changes ubiquitously
throughout bundles, allowing for earlier validation and
verification of those changes, and avoiding ubiquitous changes
which might require us to go dark. (Mitigates
["greenfield paradox"](http://stepaheadsoftware.blogspot.com/2012/09/greenfield-or-refactor-legacy-code-base.html);
want to add value with new API but don't want to discard value
of tested/proven legacy codebase.)
Detriments:
* Requires transitional API to be implemented/supported; this is
waste. May mitigate this by time-bounding the effort put into
this step to ensure that waste is minimal.
Note that API changes at this point do not meaningfully reflect
the desired 1.0.0 API, so no API reviews are necessary.
## Step 2. Incorporate a build step
After the previous step is completed, there should be a
straightforward dependency graph among AMD modules, and an
imperative (albeit transitional) API allowing for other plugins
to register themselves. This should allow for a build step to
be included in a straightforward fashion.
Some goals for this build step:
* Compile (and, preferably, optimize/minify) Open MCT Web
sources into a single `.js` file.
* It is desirable to do the same for HTML sources, but
may wish to defer this until a subsequent refactoring
step if appropriate.
* Provide non-code assets in a format that can be reused by
derivative projects in a straightforward fashion.
Should also consider which dependency/packaging manager should
be used by dependent projects to obtain Open MCT Web. Approaches
include:
1. Plain `npm`. Dependents then declare their dependency with
`npm` and utilize built sources and assets in a documented
fashion. (Note that there are
[documented challenges](http://blog.npmjs.org/post/101775448305/npm-and-front-end-packaging)
in using `npm` in this fashion.)
2. Build with `npm`, but recommend dependents install using
`bower`, as this is intended for front-end development. This may
require checking in built products, however, which
we wish to avoid (this could be solved by maintaining
a separate repository for built products.)
In all cases, there is a related question of which build system
to use for asset generation/management and compilation/minification/etc.
1. [`webpack`](https://webpack.github.io/)
is well-suited in principle, as it is specifically
designed for modules with non-JS dependencies. However,
there may be limitations and/or undesired behavior here
(for instance, CSS dependencies get in-lined as style tags,
removing our ability to control ordering) so it may
2. `gulp` or `grunt`. Commonplace, but both still require
non-trivial coding and/or configuration in order to produce
appropriate build artifacts.
3. [Just `npm`](http://blog.keithcirkel.co.uk/how-to-use-npm-as-a-build-tool/).
Reduces the amount of tooling being used, but may introduce
some complexity (e.g. custom scripts) to the build process,
and may reduce portability.
## Step 3. Separate repositories
Refactor existing applications built on Open MCT Web such that they
are no longer forks, but instead separate projects with a dependency
on the built artifacts from Step 2.
Note that this is achievable already using `bower` (see `warp-bower`
branch at http://developer.nasa.gov/mct/warp for an example.)
However, changes involved in switching to an imperative API and
introducing a build process may change (and should simplify) the
approach used to utilize Open MCT Web as a dependency, so these
changes should be introduced first.
## Step 4. Design registration API
Design the registration API that will replace declarative extension
categories and extensions (including Angular built-ins and composite
services.)
This may occur in parallel with implementation steps.
It will be necessary
to have a decision about the role of Angular at this point; are extensions
registered via provider configuration (Angular), or directly in some
exposed registry?
Success criteria here should be based on peer review. Scope of peer
review should be based on perceived risk/uncertainty surrounding
proposed changes, to avoid waste; may wish to limit this review to
the internal team. (The extent to which external
feedback is available is limited, but there is an inherent timeliness
to external review; need to balance this.)
Benefits:
* Solves the "general case" early, allowing for early validation.
Note that in specific cases, it may be desirable to refactor some
current "extension category" in a manner that will not appear as
registries, _or_ to locate these in different
namespaces, _or_ to remove/replace certain categories entirely.
This work is deferred intentionally to allow for a solution of the
general case.
## Step 5. Imperative extension registration
Register individual extensions imperatively, implementing API changes
from the previous step. At this stage, _usage_ of the API may be confined
to a transitional adapter in the framework layer; bundles may continue
to utilize the transitional API for registering extensions in the
legacy format.
An important, ongoing sub-task here will be to discover and define dependencies
among bundles. Composite services and extension categories are presently
"implicit"; after the API redesign, these will become "explicit", insofar
as some specific component will be responsible for creating any registries.
As such, "bundles" which _use_ specific registries will need to have an
enforceable dependency (e.g. require) upon those "bundles" which
_declare_ those registries.
## Step 6. Refactor individual extensions
Refactor individual extension categories and/or services that have
been identified as needing changes. This includes, but is not
necessarily limited to:
* Views/Representations/Templates (refactored into "components.")
* Capabilities (refactored into "roles", potentially.)
* Telemetry (from `TelemetrySeries` to `TelemetryService`.)
Changes should be made one category at a time (either serially
or separately in parallel) and should involve a tight cycle of:
1. Prioritization/reprioritization; highest-value API improvements
should be done first.
2. Design.
3. Review. Refactoring individual extensions will require significant
effort (likely the most significant effort in the process) so changes
should be validated early to minimize risk/waste.
4. Implementation. These changes will not have a one-to-one relationship
with existing extensions, so changes cannot be centralized; usages
will need to be updated across all "bundles" instead of centralized
in a legacy adapter. If changes are of sufficient complexity, some
planning should be done to spread out the changes incrementally.
By necessity, these changes may break functionality in applications
built using Open MCT Web. On a case-by-case basis, should consider
providing temporary "legacy support" to allow downstream updates
to occur as a separate task; the relevant trade here is between
waste/effort required to maintain legacy support, versus the
downtime which may be introduced by making these changes simultaneously
across several repositories.
## Step 7. Remove legacy bundle support
Update bundles to remove any usages of legacy support for bundles
(including that used by dependent projects.) Then, remove legacy
support from Open MCT Web.
## Step 8. Release candidacy
Once API changes are complete, Open MCT Web should enter a release
candidacy cycle. Important things to look at here:
* Are changes really complete?
* Are they sufficiently documented?
* Are they sufficiently tested?
* Are changes really sufficient?
* Do reviewers think they are usable?
* Does the development team find them useful in practice? This
will require calendar time to ascertain; should allocate time
for this, particularly in alignment with the sprint/release
cycle.
* Has learning curve been measurably decreased? Comparing a to-do
list tutorial to [other examples(http://todomvc.com/) could
provide an empirical basis to this. How much code is required?
How much explanation is required? How many dependencies must
be installed before initial setup?
* Does the API offer sufficient power to implement the extensions we
anticipate?
* Any open API-related issues which should block a 1.0.0 release?
Any problems identified during release candidacy will require
subsequent design changes and planning.
## Step 9. Release
Once API changes have been verified and validated, proceed
with release, including:
* Tagging as version 1.0.0 (at an appropriate time in the
sprint/release cycle.)
* Close any open issues which have been resolved (or made obsolete)
by API changes.

File diff suppressed because it is too large Load Diff

View File

@@ -1,251 +0,0 @@
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
**Table of Contents** *generated with [DocToc](https://github.com/thlorenz/doctoc)*
- [Reducing interface depth (the bundle.json version)](#reducing-interface-depth-the-bundlejson-version)
- [Imperitive component registries](#imperitive-component-registries)
- [Get rid of "extension category" concept.](#get-rid-of-extension-category-concept)
- [Reduce number and depth of extension points](#reduce-number-and-depth-of-extension-points)
- [Composite services should not be the default](#composite-services-should-not-be-the-default)
- [Get rid of views, representations, and templates.](#get-rid-of-views-representations-and-templates)
- [Reducing interface depth (The angular discussion)](#reducing-interface-depth-the-angular-discussion)
- [More angular: for all services](#more-angular-for-all-services)
- [Less angular: only for views](#less-angular-only-for-views)
- [Standard packaging and build system](#standard-packaging-and-build-system)
- [Use systemjs for module loading](#use-systemjs-for-module-loading)
- [Use gulp or grunt for standard tooling](#use-gulp-or-grunt-for-standard-tooling)
- [Package openmctweb as single versioned file.](#package-openmctweb-as-single-versioned-file)
- [Misc Improvements](#misc-improvements)
- [Refresh on navigation](#refresh-on-navigation)
- [Move persistence adapter to promise rejection.](#move-persistence-adapter-to-promise-rejection)
- [Remove bulk requests from providers](#remove-bulk-requests-from-providers)
- [Notes on current API proposals:](#notes-on-current-api-proposals)
- [[1] Footnote: The angular debacle](#1-footnote-the-angular-debacle)
- ["Do or do not, there is no try"](#do-or-do-not-there-is-no-try)
- [A lack of commitment](#a-lack-of-commitment)
- [Commitment is good!](#commitment-is-good)
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
# Reducing interface depth (the bundle.json version)
## Imperitive component registries
Transition component registries to javascript, get rid of bundle.json and bundles.json. Prescribe a method for application configuration, but allow flexibility in how application configuration is defined.
Register components in an imperitive fashion, see angularApp.factory, angularApp.controller, etc. Alternatively, implement our own application object with new registries and it's own form of registering objects.
## Get rid of "extension category" concept.
The concept of an "extension category" is itself an extraneous concept-- an extra layer of interface depth, an extra thing to learn before you can say "hello world". Extension points should be clearly supported and documented with whatever interfaces make sense. Developers who wish to add something that is conceptually equivalent to an extension category can do so directly, in the manner that suites their needs, without us forcing a common method on them.
## Reduce number and depth of extension points
Clearly specify supported extension points (e.g. persistence, model providers, telemetry providers, routes, time systems), but don't claim that the system has a clear and perfect repeatable solution for unknown extension types. New extension categories can be implemented in whatever way makes sense, without prescribing "the one and only system for managing extensions".
The underlying problem here is we are predicting needs for extension points where none exist-- if we try and design the extension system before we know how it is used, we design the wrong thing and have to rewrite it later.
## Composite services should not be the default
Understanding composite services, and describing services as composite services can confuse developers. Aggregators are implemented once and forgotten, while decorators tend to be hacky, brittle solutions that are generally needed to avoid circular imports. While composite services are a useful construct, it reduces interface depth to implement them as registries + typed providers.
You can write a provider (provides "thing x" for "inputs y") with a simple interface. A provider has two or more methods:
* a method which takes "inputs y" and returns True if it knows how to provide "thing x", false otherwise.
* one or more methods which provide "thing x" for objects of "inputs y".
Actually checking whether a provider can respond to a request before asking it to do work allows for faster failure and clearer errors when no providers match the request.
## Get rid of views, representations, and templates.
Templates are an implementation detail that should be handled by module loaders. Views and representations become "components," and a new concept, "routes", is used to exposing specific views to end users.
`components` - building blocks for views, have clear inputs and outputs, and can be coupled to other components when it makes sense. (e.g. parent-child components such as menu and menu item), but should have ZERO knowledge of our data models or telemetry apis. They should define data models that enable them to do their job well while still being easy to test.
`routes` - a view type for a given domain object, e.g. a plot, table, display layout, etc. Can be described as "whatever shows in the main screen when you are viewing an object." Handle loading of data from a domain object and passing that data to the view components. Routes should support editing as it makes sense in their own context.
To facilitate testing:
* routes should be testable without having to test the actual view.
* components should be independently testable with zero knowledge of our data models or telemetry APIs.
Component code should be organized side by side, such as:
```
app
|- components
|- productDetail
| |- productDetail.js
| |- productDetail.css
| |- productDetail.html
| |- productDetailSpec.js
|- productList
|- checkout
|- wishlist
```
Components are not always reusable, and we shouldn't be overly concerned with making them so. If components are heavily reused, they should either be moved to a platform feature (e.g. notifications, indicators), or broken off as an external dependency (e.g. publish mct-plot as mct-plot.js).
# Reducing interface depth (The angular discussion)
Two options here: use more angular, use less angular. Wrapping angular methods does not reduce interface depth and must be avoided.
The primary issue with angular is duplications of concerns-- both angular and the openmctweb platform implement the same tools side by side and it can be hard to comprehend-- it increases interface depth. For other concerns, see footnotes[1].
Wrapping angular methods for non-view related code is confusing to developers because of the random constraints angular places on these items-- developers ultimately have to understand both angular DI and our framework. For example, it's not possible to name the topic service "topicService" because angular expects Services to be implemented by Providers, which is different than our expectation.
To reduce interface depth, we can replace our own provider and registry patterns with angular patterns, or we can only utilize angular view logic, and only use our own DI patterns.
## More angular: for all services
Increasing our commitment to angular would mean using more of the angular factorys, services, etc, and less of our home grown tools. We'd implement our services and extension points as angular providers, and make them configurable via app.config.
As an example, registering a specific type of model provider in angular would look like:
```javascript
mct.provider('model', modelProvider() { /* implementation */});
mct.config(['modelProvider', function (modelProvider) {
modelProvider.providers.push(RootModelProvider);
}]);
```
## Less angular: only for views
If we wish to use less angular, I would recommend discontinuing use of all angular components that are not view related-- services, factories, $http, etc, and implementing them in our own paradigm. Otherwise, we end up with layered interfaces-- one of the goals we would like to avoid.
# Standard packaging and build system
Standardize the packaging and build system, and completely separate the core platform from deployments. Prescribe a starting point for deployments, but allow flexibility.
## Use systemjs for module loading
Allow developers to use whatever module loading system they'd like to use, while still supporting all standard cases. We should also use this system for loading assets (css, scss, html templates), which makes it easier to implement a single file deployment using standard build tooling.
## Use gulp or grunt for standard tooling
Using gulp or grunt as a task runner would bring us in line with standard web developer workflows and help standardize rendering, deployment, and packaging. Additional tools can be added to the workflow at low cost, simplifying the set up of developer environments.
Gulp and grunt provide useful developer tooling such as live reload, automatic scss/less/etc compiliation, and ease of extensibility for standard production build processes. They're key in decoupling code.
## Package openmctweb as single versioned file.
Deployments should depend on a specific version of openmctweb, but otherwise be allowed to have their own deployment and development toolsets.
Customizations and deployments of openmctweb should not use the same build tooling as the core platform; instead they should be free to use their own build tools as they wish. (We would provide a template for an application, based on our experience with warp-for-rp and vista)
Installation and utilization of openmctweb should be as simple as downloading the js file, including it in your own html page, and then initializing an app and running it. If a developer would prefer, they could use bower or npm to handle installation.
Then, if we're using imperative methods for extending the application we can use the following for basic customization:
```html
<script src="//localhost/openmctweb.js"></script>
<script>
// can configure from object
var myApp = new OpenMCTWeb({
persitence: {
providers: [
{
type: 'elastic',
uri: 'http://someElasticHost/'
} // ...
]
}
});
// alternative configurations
myApp.persistence.addProvider(MyPersistenceAdapter);
myApp.model.addProvider(someProviderObject);
// Removing via method
myApp.persistence.removeProvider('some method for removing functionality');
// directly mutating providers
myApp.persistence.providers = [ThisProviderStandsAlone];
//
myApp.run();
</script>
```
This packaging reduces the complexity of managing multiple deployed versions, and also allows us to provide users with incredibly simple tutorials-- they can use whatever tooling they like. For instance, a hello world tutorial may take the option of "exposing a new object in the tree".
```javascript
var myApp = new OpenMCTWeb();
myApp.roots.addRoot({
id: 'myRoot',
name: 'Hello World!',
});
myApp.routes.setDefault('myRoot');
myApp.run();
```
# Misc Improvements
## Refresh on navigation
In cases where navigation events change the entire screen, we should be using routes and location changes to navigate between objects. We should be using href for all navigation events.
At the same time, navigating should refresh state of every visible object. A properly configured persistence store will handle caching with standard cache headers and 304 not modified responses, which will provide good performance of object reloads, while helping us ensure that objects are always in sync between clients.
View state (say, the expanded tree nodes) should not be tied to caching of data-- it should be something we intentionally persist and restore with each navigation. Data (such as object definitions) should be reloaded from server as necessary to restore state.
## Move persistence adapter to promise rejection.
Simple: reject on fail, resolve on success.
## Remove bulk requests from providers
Aggregators can request multiple things at once, but individual providers should only have to implement handling at the level of a single request. Each provider can implement it's own internal batching, but it should support making requests at a finer level of detail.
Excessive wrapping of code with $q.all causes additional digest cycles and decreased performance.
For example, instead of every telemetry provider responding to a given telemetry request, aggregators should route each request to the first provider that can fulfill that request.
# Notes on current API proposals:
* [RequireJS for Dependency Injection](https://github.com/nasa/openmctweb/blob/api-redesign/docs/src/design/proposals/APIRedesign.md#requirejs-as-dependency-injector): requires other topics to be discussed first.
* [Arbitrary HTML Views](https://github.com/nasa/openmctweb/blob/api-redesign/docs/src/design/proposals/APIRedesign.md#arbitrary-html-views): think there is a place for it, requires other topics to be discussed first.
* [Wrap Angular Services](https://github.com/nasa/openmctweb/blob/api-redesign/docs/src/design/proposals/APIRedesign.md#wrap-angular-services): No, this is bad.
* [Bundle definitions in Javascript](https://github.com/nasa/openmctweb/blob/api-redesign/docs/src/design/proposals/APIRedesign.md#bundle-declarations-in-javascript): Points to a solution, but ultimately requires more discussion.
* [pass around a dependency injector](https://github.com/nasa/openmctweb/blob/api-redesign/docs/src/design/proposals/APIRedesign.md#pass-around-a-dependency-injector): No.
* [remove partial constructors](https://github.com/nasa/openmctweb/blob/api-redesign/docs/src/design/proposals/APIRedesign.md#remove-partial-constructors): Yes, this should be superseded by another proposal though. The entire concept was a messy solution to dependency injection issues caused by declarative syntax.
* [Rename views to applications](https://github.com/nasa/openmctweb/blob/api-redesign/docs/src/design/proposals/APIRedesign.md#rename-views-to-applications): Points to a problem that needs to be solved but I think the name is bad.
* [Provide classes for extensions](https://github.com/nasa/openmctweb/blob/api-redesign/docs/src/design/proposals/APIRedesign.md#provide-classes-for-extensions): Yes, in specific places
* [Normalize naming conventions](https://github.com/nasa/openmctweb/blob/api-redesign/docs/src/design/proposals/APIRedesign.md#normalize-naming-conventions): Yes.
* [Expose no third-party APIs](https://github.com/nasa/openmctweb/blob/api-redesign/docs/src/design/proposals/APIRedesign.md#expose-no-third-party-apis): Completely disagree, points to a real problem with poor angular integration.
* [Register Extensions as Instances instead of Constructors](https://github.com/nasa/openmctweb/blob/api-redesign/docs/src/design/proposals/APIRedesign.md#register-extensions-as-instances-instead-of-constructors): Superseded by the fact that we should not hope to implement a generic construct.
* [Remove capability delegation](https://github.com/nasa/openmctweb/blob/api-redesign/docs/src/design/proposals/APIRedesign.md#remove-capability-delegation): Yes.
* [Nomenclature Change](https://github.com/nasa/openmctweb/blob/api-redesign/docs/src/design/proposals/APIRedesign.md#nomenclature-change): Yes, hope to discuss the implications of this more clearly in other proposals.
* [Capabilities as mixins](https://github.com/nasa/openmctweb/blob/api-redesign/docs/src/design/proposals/APIRedesign.md#capabilities-as-mixins): Yes.
* [Remove appliesTo methods](https://github.com/nasa/openmctweb/blob/api-redesign/docs/src/design/proposals/APIRedesign.md#remove-applies-to-methods): No-- I think some level of this is necessary. I think a more holistic approach to policy is needed. it's a rather complicated system.
* [Revise telemetry API](https://github.com/nasa/openmctweb/blob/api-redesign/docs/src/design/proposals/APIRedesign.md#revise-telemetry-api): If we can rough out and agree to the specifics, then Yes. Needs discussion.
* [Allow composite services to fail gracefully](https://github.com/nasa/openmctweb/blob/api-redesign/docs/src/design/proposals/APIRedesign.md#allow-composite-services-to-fail-gracefully): No. As mentioned above, I think composite services themselves should be eliminated for a more purpose bound tool.
* [Plugins as angular modules](https://github.com/nasa/openmctweb/blob/api-redesign/docs/src/design/proposals/APIRedesign.md#plugins-as-angular-modules): Should we decide to embrace Angular completely, I would support this. Otherwise, no.
* [Contextual Injection](https://github.com/nasa/openmctweb/blob/api-redesign/docs/src/design/proposals/APIRedesign.md#contextual-injection): No, don't see a need.
* [Add New Abstractions for Actions](https://github.com/nasa/openmctweb/blob/api-redesign/docs/src/design/proposals/APIRedesign.md#add-new-abstractions-for-actions): Worth a discussion.
* [Add gesture handlers](https://github.com/nasa/openmctweb/blob/api-redesign/docs/src/design/proposals/APIRedesign.md#add-gesture-handlers): Yes if we can agree on details. We need a platform implementation that is easy to use, but we should not reinvent the wheel.
# [1] Footnote: The angular debacle
## "Do or do not, there is no try"
A commonly voiced concern of embracing angular is the possibility of becoming dependent on a third party framework. This concern is itself detrimental-- if we're afraid of becoming dependent on a third party framework, then we will do a bad job of using the framework, and inevitably will want to stop using it.
If we're using a framework, we need to use it fully, or not use it at all.
## A lack of commitment
A number of the concerns we heard from developers and interns can be attributed to the tenuous relationship between the OpenMCTWeb platform and angular. We claimed to be angular, but we weren't really angular. Instead, we are caught between our incomplete framework paradigm and the angular paradigm. In many cases we reinvented the wheel or worked around functionality that angular provides, and ended up in a more confusing state.
## Commitment is good!
We could just be an application that is built with angular.
An application that is modular and extensible not because it reinvents tools for providing modularity and extensibility, but because it reuses existing tools for modularity and extensibility.
There are benefits to buying into the angular paradigm: shift documentation burden to external project, engage a larger talent pool available both as voluntary open source contributors and as experienced developers for hire, and gain access to an ecosystem of tools that we can use to increase the speed of development.
There are negatives too: Angular is a monolith, it has performance concerns, and an unclear future. If we can't live with it, we should look at alternatives.

View File

@@ -1,164 +0,0 @@
# Imperative Plugins
This is a design proposal for handling
[bundle declarations in JavaScript](
APIRedesign.md#bundle-declarations-in-javascript).
## Developer Use Cases
Developers will want to use bundles/plugins to (in rough order
of occurrence):
1. Add new extension instances.
2. Use existing services
3. Add new service implementations.
4. Decorate service implementations.
5. Decorate extension instances.
6. Add new types of services.
7. Add new extension categories.
Notably, bullets 4 and 5 above are currently handled implicitly,
which has been cited as a source of confusion.
## Interfaces
Two base classes may be used to satisfy these use cases:
* The `CompositeServiceFactory` provides composite service instances.
Decorators may be added; the approach used for compositing may be
modified; and individual services may be registered to support compositing.
* The `ExtensionRegistry` allows for the simpler case where what is desired
is an array of all instances of some kind of thing within the system.
Note that additional developer use cases may be supported by using the
more general-purpose `Registry`
```nomnoml
[Factory.<T, V>
|
- factoryFn : function (V) : T
|
+ decorate(decoratorFn : function (T, V) : T, options? : RegistrationOptions)
]-:>[function (V) : T]
[RegistrationOptions |
+ priority : number or string
]
[Registry.<T, V>
|
- compositorFn : function (Array.<T>) : V
|
+ register(item : T, options? : RegistrationOptions)
+ composite(compositorFn : function (Array.<T>) : V, options? : RegistrationOptions)
]-:>[Factory.<V, Void>]
[Factory.<V, Void>]-:>[Factory.<T, V>]
[ExtensionRegistry.<T>]-:>[Registry.<T, Array.<T>>]
[Registry.<T, Array.<T>>]-:>[Registry.<T, V>]
[CompositeServiceFactory.<T>]-:>[Registry.<T, T>]
[Registry.<T, T>]-:>[Registry.<T, V>]
```
## Examples
### 1. Add new extension instances.
```js
// Instance-style registration
mct.types.register(new mct.Type({
key: "timeline",
name: "Timeline",
description: "A container for activities ordered in time."
});
// Factory-style registration
mct.actions.register(function (domainObject) {
return new RemoveAction(domainObject);
}, { priority: 200 });
```
### 2. Use existing services
```js
mct.actions.register(function (domainObject) {
var dialogService = mct.ui.dialogServiceFactory();
return new PropertiesAction(dialogService, domainObject);
});
```
### 3. Add new service implementations
```js
// Instance-style registration
mct.persistenceServiceFactory.register(new LocalPersistenceService());
// Factory-style registration
mct.persistenceServiceFactory.register(function () {
var $http = angular.injector(['ng']).get('$http');
return new LocalPersistenceService($http);
});
```
### 4. Decorate service implementations
```js
mct.modelServiceFactory.decorate(function (modelService) {
return new CachingModelDecorator(modelService);
}, { priority: 100 });
```
### 5. Decorate extension instances
```js
mct.capabilities.decorate(function (capabilities) {
return capabilities.map(decorateIfApplicable);
});
```
This use case is not well-supported by these API changes. The most
common case for decoration is capabilities, which are under reconsideration;
should consider handling decoration of capabilities in a different way.
### 6. Add new types of services
```js
myModule.myServiceFactory = new mct.CompositeServiceFactory();
// In cases where a custom composition strategy is desired
myModule.myServiceFactory.composite(function (services) {
return new MyServiceCompositor(services);
});
```
### 7. Add new extension categories.
```js
myModule.hamburgers = new mct.ExtensionRegistry();
```
## Evaluation
### Benefits
* Encourages separation of registration from declaration (individual
components are decoupled from the manner in which they are added
to the architecture.)
* Minimizes "magic." Dependencies are acquired, managed, and exposed
using plain-old-JavaScript without any dependency injector present
to obfuscate what is happening.
* Offers comparable expressive power to existing APIs; can still
extend the behavior of platform components in a variety of ways.
* Does not force or limit formalisms to use;
### Detriments
* Does not encourage separation of dependency acquisition from
declaration; that is, it would be quite natural using this API
to acquire references to services during the constructor call
to an extension or service. But, passing these in as constructor
arguments is preferred (to separate implementation from architecture.)
* Adds (negligible?) boilerplate relative to declarative syntax.
* Relies on factories, increasing number of interfaces to be concerned
with.

View File

@@ -1,138 +0,0 @@
# Roles
Roles are presented as an alternative formulation to capabilities
(dynamic behavior associated with individual domain objects.)
Specific goals here:
* Dependencies of individual scripts should be clear.
* Domain objects should be able to selectively exhibit a wide
variety of behaviors.
## Developer Use Cases
1. Checking for the existence of behavior.
2. Using behavior.
3. Augmenting existing behaviors.
4. Overriding existing behaviors.
5. Adding new behaviors.
## Overview of Proposed Solution
Remove `getCapability` from domain objects; add roles as external
services which can be applied to domain objects.
## Interfaces
```nomnoml
[Factory.<T, V>
|
- factoryFn : function (V) : T
|
+ decorate(decoratorFn : function (T, V) : T, options? : RegistrationOptions)
]-:>[function (V) : T]
[RegistrationOptions |
+ priority : number or string
]<:-[RoleOptions |
+ validate : function (DomainObject) : boolean
]
[Role.<T> |
+ validate(domainObject : DomainObject) : boolean
+ decorate(decoratorFn : function (T, V) : T, options? : RoleOptions)
]-:>[Factory.<T, DomainObject>]
[Factory.<T, DomainObject>]-:>[Factory.<T, V>]
```
## Examples
### 1. Checking for the existence of behavior
```js
function PlotViewPolicy(telemetryRole) {
this.telemetryRole = telemetryRole;
}
PlotViewPolicy.prototype.allow = function (view, domainObject) {
return this.telemetryRole.validate(domainObject);
};
```
### 2. Using behavior
```js
PropertiesAction.prototype.perform = function () {
var mutation = this.mutationRole(this.domainObject);
return this.showDialog.then(function (newModel) {
return mutation.mutate(function () {
return newModel;
});
});
};
```
### 3. Augmenting existing behaviors
```js
// Non-Angular style
mct.roles.persistenceRole.decorate(function (persistence) {
return new DecoratedPersistence(persistence);
});
// Angular style
myModule.decorate('persistenceRole', ['$delegate', function ($delegate) {
return new DecoratedPersistence(persistence);
}]);
```
### 4. Overriding existing behaviors
```js
// Non-Angular style
mct.roles.persistenceRole.decorate(function (persistence, domainObject) {
return domainObject.getModel().type === 'someType' ?
new DifferentPersistence(domainObject) :
persistence;
}, {
validate: function (domainObject, next) {
return domainObject.getModel().type === 'someType' || next();
}
});
```
### 5. Adding new behaviors
```js
function FooRole() {
mct.Role.apply(this, [function (domainObject) {
return new Foo(domainObject);
}]);
}
FooRole.prototype = Object.create(mct.Role.prototype);
FooRole.prototype.validate = function (domainObject) {
return domainObject.getModel().type === 'some-type';
};
//
myModule.roles.fooRole = new FooRole();
```
## Evaluation
### Benefits
* Simplifies/standardizes augmentation or replacement of behavior associated
with specific domain objects.
* Minimizes number of abstractions; roles are just factories.
* Clarifies dependencies; roles used must be declared/acquired in the
same manner as services.
### Detriments
* Externalizes functionality which is conceptually associated with a
domain object.
* Relies on factories, increasing number of interfaces to be concerned
with.

View File

@@ -677,40 +677,6 @@ If the provided capability has no invoke method, the return value here functions
as `getCapability` including returning `undefined` if the capability is not
exposed.
### Identifier Syntax
For most purposes, a domain object identifier can be treated as a purely
symbolic string; these are typically generated by Open MCT Web and plug-ins
should rarely be concerned with its internal structure.
A domain object identifier has one or two parts, separated by a colon.
* If two parts are present, the part before the colon refers to the space
in which the domain object resides. This may be a persistence space or
a purely symbolic space recognized by a specific model provider. The
part after the colon is the key to use when looking up the domain object
model within that space.
* If only one part is present, the domain object has no space specified,
and may presume to reside in the application-configured default space
defined by the `PERSISTENCE_SPACE` constant.
* Both the key and the space identifier may consist of any combination
of alphanumeric characters, underscores, dashes, and periods.
Some examples:
* A domain object with the identifier `foo:xyz` would have its model
loaded using key `xyz` from persistence space `foo`.
* A domain object with the identifier `bar` would have its model loaded
using key `bar` from the space identified by the `PERSISTENCE_SPACE`
constant.
```bnf
<identifier> ::= <space> ":" <key> | <key>
<space> ::= <id char>+
<key> ::= <id char>+
<id char> ::= <letter> | <digit> | "-" | "." | "_"
```
## Domain Object Actions
An `Action` is behavior that can be performed upon/using a `DomainObject`. An
@@ -941,12 +907,6 @@ look at field (see below) to determine which field in the model should be
modified.
* `ngRequired`: True if input is required.
* `ngPattern`: The pattern to match against (for text entry)
* `ngBlur`: A function that may be invoked to evaluate the expression
associated with the `ng-blur` attribute associated with the control.
* This should be called when the control has lost focus; for controls
which simply wrap or augment `input` elements, this should be fired
on `blur` events associated with those elements, while more complex
custom controls may fire this at the end of more specific interactions.
* `options`: The options for this control, as passed from the `options` property
of an individual row definition.
* `field`: Name of the field in `ngModel` which will hold the value for this
@@ -1294,22 +1254,6 @@ object, or the current view proxy.
* `all()`: Get an array of all objects in the selection state. Will include
either or both of the view proxy and selected object.
## Workers Category
The `workers` extension category allows scripts to be run as web workers
using the `workerService`.
An extension of this category has no implementation. The following properties
are supported:
* `key`: A symbolic string used to identify this worker.
* `workerUrl`: The path, relative to this bundle's `src` folder, where
this worker's source code resides.
* `shared`: Optional; a boolean flag which, if true, indicates that this
worker should be instantiated as a
[`SharedWorker`](https://developer.mozilla.org/en-US/docs/Web/API/SharedWorker/SharedWorker).
Default value is `false`.
# Directives
Open MCT Web defines several Angular directives that are intended for use both
@@ -1905,14 +1849,6 @@ the TelemetrySeries itself, in that order.
* `getSeries(domainObject)`: Get the latest `TelemetrySeries` (as resulted from
a previous `request(...)` call) available for this domain object.
### Worker Service
The `workerService` may be used to run web workers defined via the
`workers` extension category. It has the following method:
* `run(key)`: Run the worker identified by the provided `key`. Returns
a `Worker` (or `SharedWorker`, if the specified worker is defined
as a shared worker); if the `key` is unknown, returns `undefined`.
# Models
Domain object models in Open MCT Web are JavaScript objects describing the
@@ -2417,11 +2353,6 @@ default paths to reach external services are all correct.
### Configuration Constants
The following constants have global significance:
* `PERSISTENCE_SPACE`: The space in which domain objects should be persisted
(or read from) when not otherwise specified. Typically this will not need
to be overridden by other bundles, but persistence adapters may wish to
consume this constant in order to provide persistence for that space.
The following configuration constants are recognized by Open MCT Web bundles:
* Common UI elements - `platform/commonUI/general`

38
docs/src/index.html Normal file
View File

@@ -0,0 +1,38 @@
<!--
Open MCT Web, Copyright (c) 2014-2015, United States Government
as represented by the Administrator of the National Aeronautics and Space
Administration. All rights reserved.
Open MCT Web 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 Web 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.
-->
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>Open MCT Web Documentation</title>
</head>
<body class="user-environ" ng-view>
Sections:
<ul>
<li><a href="api/">API</a></li>
<li><a href="architecture/">Architecture Overview</a></li>
<li><a href="guide/">Developer Guide</a></li>
<li><a href="tutorials/">Tutorials</a></li>
<li><a href="process/">Development Process</a></li>
</ul>
</body>
</html>

View File

@@ -1,35 +0,0 @@
# Open MCT Web Documentation
## Overview
Documentation is provided to support the use and development of
Open MCT Web. It's recommended that before doing
any development with Open MCT Web you take some time to familiarize yourself
with the documentation below.
Open MCT Web provides functionality out of the box, but it's also a platform for
building rich mission operations applications based on modern web technology.
The platform is configured declaratively, and defines conventions for
building on the provided capabilities by creating modular 'bundles' that
extend the platform at a variety of extension points. The details of how to
extend the platform are provided in the following documentation.
## Sections
* The [Architecture Overview](architecture/) describes the concepts used
throughout Open MCT Web, and gives a high level overview of the platform's design.
* The [Developer's Guide](guide/) goes into more detail about how to use the
platform and the functionality that it provides.
* The [Tutorials](tutorials/) give examples of extending the platform to add
functionality,
and integrate with data sources.
* The [API](api/) document is generated from inline documentation
using [JSDoc](http://usejsdoc.org/), and describes the JavaScript objects and
functions that make up the software platform.
* Finally, the [Development Process](process/) document describes the
Open MCT Web software development cycle.

View File

@@ -1,161 +0,0 @@
# Development Cycle
Development of Open MCT Web occurs on an iterative cycle of
sprints and releases.
* A _sprint_ is three weeks in duration, and represents a
set of improvements that can be completed and tested by the
development team. Software at the end of the sprint is
"semi-stable"; it will have undergone reduced testing and may carry
defects or usability issues of lower severity, particularly if
there are workarounds.
* A _release_ occurs every four sprints. Releases are stable, and
will have undergone full acceptance testing to ensure that the
software behaves correctly and usably.
## Roles
The sprint process assumes the presence of a __project manager.__
The project manager is responsible for
making tactical decisions about what development work will be
performed, and for coordinating with stakeholders to arrive at
higher-level strategic decisions about desired functionality
and characteristics of the software, major external milestones,
and so forth.
In the absence of a dedicated project manager, this role may be rotated
among members of the development team on a per-sprint basis.
Responsibilities of the project manager including:
* Maintaining (with agreement of stakeholders) a "road map" of work
planned for future releases/sprints; this should be higher-level,
usually expressed as "themes",
with just enough specificity to gauge feasibility of plans,
relate work back to milestones, and identify longer-term
dependencies.
* Determining (with assistance from the rest of the team) which
issues to work on in a given sprint and how they shall be
assigned.
* Pre-planning subsequent sprints to ensure that all members of the
team always have a clear direction.
* Scheduling and/or ensuring adherence to
[process points](#process-points).
* Responding to changes within the sprint (shifting priorities,
new issues) and re-allocating work for the sprint as needed.
## Sprint Calendar
Certain [process points](#process-points) are regularly scheduled in
the sprint cycle.
### Sprints by Release
Allocation of work among sprints should be planned relative to release
goals and milestones. As a general guideline, higher-risk work (large
new features which may carry new defects, major refactoring, design
changes with uncertain effects on usability) should be allocated to
earlier sprints, allowing for time in later sprints to ensure stability.
| Sprint | Focus |
|:------:|:--------------------------------------------------------|
| __1__ | Prototyping, design, experimentation. |
| __2__ | New features, refinements, enhancements. |
| __3__ | Feature completion, low-risk enhancements, bug fixing. |
| __4__ | Stability & quality assurance. |
### Sprints 1-3
The first three sprints of a release are primarily centered around
development work, with regular acceptance testing in the third
week. During this third week, the top priority should be passing
acceptance testing (e.g. by resolving any blockers found); any
resources not needed for this effort should be used to begin work
for the subsequent sprint.
| Week | Mon | Tue | Wed | Thu | Fri |
|:-----:|:-------------------------:|:------:|:---:|:----------------------------:|:-----------:|
| __1__ | Sprint plan | Tag-up | | | |
| __2__ | | Tag-up | | | Code freeze |
| __3__ | Per-sprint testing | Triage | | _Per-sprint testing*_ | Ship |
&ast; If necessary.
### Sprint 4
The software must be stable at the end of the fourth sprint; because of
this, the fourth sprint is scheduled differently, with a heightened
emphasis on testing.
| Week | Mon | Tue | Wed | Thu | Fri |
|-------:|:-------------------------:|:------:|:---:|:----------------------------:|:-----------:|
| __1__ | Sprint plan | Tag-up | | | Code freeze |
| __2__ | Per-release testing | Triage | | | |
| __3__ | _Per-release testing*_ | Triage | | _Per-release testing*_ | Ship |
&ast; If necessary.
## Process Points
* __Sprint plan.__ Project manager allocates issues based on
theme(s) for sprint, then reviews with team. Each team member
should have roughly two weeks of work allocated (to allow time
in the third week for testing of work completed.)
* Project manager should also sketch out subsequent sprint so
that team may begin work for that sprint during the
third week, since testing and blocker resolution is unlikely
to require all available resources.
* __Tag-up.__ Check in and status update among development team.
May amend plan for sprint as-needed.
* __Code freeze.__ Any new work from this sprint
(features, bug fixes, enhancements) must be integrated by the
end of the second week of the sprint. After code freeze
(and until the end of the sprint) the only changes that should be
merged into the master branch should directly address issues
needed to pass acceptance testing.
* [__Per-release Testing.__](testing/plan.md#per-release-testing)
Structured testing with predefined
success criteria. No release should ship without passing
acceptance tests. Time is allocated in each sprint for subsequent
rounds of acceptance testing if issues are identified during a
prior round. Specific details of acceptance testing need to be
agreed-upon with relevant stakeholders and delivery recipients,
and should be flexible enough to allow changes to plans
(e.g. deferring delivery of some feature in order to ensure
stability of other features.) Baseline testing includes:
* [__Testathon.__](testing/plan.md#user-testing)
Multi-user testing, involving as many users as
is feasible, plus development team. Open-ended; should verify
completed work from this sprint, test exploratorily for
regressions, et cetera.
* [__Long-Duration Test.__](testing/plan.md#long-duration-testing) A
test to verify that the software remains
stable after running for longer durations. May include some
combination of automated testing and user verification (e.g.
checking to verify that software remains subjectively
responsive at conclusion of test.)
* [__Unit Testing.__](testing/plan.md#unit-testing)
Automated testing integrated into the
build. (These tests are verified to pass more often than once
per sprint, as they run before any merge to master, but still
play an important role in per-release testing.)
* [__Per-sprint Testing.__](testing/plan.md#per-sprint-testing)
Subset of Pre-release Testing
which should be performed before shipping at the end of any
sprint. Time is allocated for a second round of
Pre-release Testing if the first round is not passed.
* __Triage.__ Team reviews issues from acceptance testing and uses
success criteria to determine whether or not they should block
release, then formulates a plan to address these issues before
the next round of acceptance testing. Focus here should be on
ensuring software passes that testing in order to ship on time;
may prefer to disable malfunctioning components and fix them
in a subsequent sprint, for example.
* __Ship.__ Tag a code snapshot that has passed acceptance
testing and deploy that version. (Only true if acceptance
testing has passed by this point; if acceptance testing has not
been passed, will need to make ad hoc decisions with stakeholders,
e.g. "extend the sprint" or "defer shipment until end of next
sprint.")

View File

@@ -1,13 +1,156 @@
# Development Process
# Development Cycle
Development of Open MCT Web occurs on an iterative cycle of
sprints and releases.
* A _sprint_ is three weeks in duration, and represents a
set of improvements that can be completed and tested by the
development team. Software at the end of the sprint is
"semi-stable"; it will have undergone reduced testing and may carry
defects or usability issues of lower severity, particularly if
there are workarounds.
* A _release_ occurs every four sprints. Releases are stable, and
will have undergone full acceptance testing to ensure that the
software behaves correctly and usably.
## Roles
The sprint process assumes the presence of a __project manager.__
The project manager is responsible for
making tactical decisions about what development work will be
performed, and for coordinating with stakeholders to arrive at
higher-level strategic decisions about desired functionality
and characteristics of the software, major external milestones,
and so forth.
In the absence of a dedicated project manager, this role may be rotated
among members of the development team on a per-sprint basis.
Responsibilities of the project manager including:
* Maintaining (with agreement of stakeholders) a "road map" of work
planned for future releases/sprints; this should be higher-level,
usually expressed as "themes",
with just enough specificity to gauge feasibility of plans,
relate work back to milestones, and identify longer-term
dependencies.
* Determining (with assistance from the rest of the team) which
issues to work on in a given sprint and how they shall be
assigned.
* Pre-planning subsequent sprints to ensure that all members of the
team always have a clear direction.
* Scheduling and/or ensuring adherence to
[process points](#process-points).
* Responding to changes within the sprint (shifting priorities,
new issues) and re-allocating work for the sprint as needed.
## Sprint Calendar
Certain [process points](#process-points) are regularly scheduled in
the sprint cycle.
### Sprints by Release
Allocation of work among sprints should be planned relative to release
goals and milestones. As a general guideline, higher-risk work (large
new features which may carry new defects, major refactoring, design
changes with uncertain effects on usability) should be allocated to
earlier sprints, allowing for time in later sprints to ensure stability.
| Sprint | Focus |
|:------:|:--------------------------------------------------------|
| __1__ | Prototyping, design, experimentation. |
| __2__ | New features, refinements, enhancements. |
| __3__ | Feature completion, low-risk enhancements, bug fixing. |
| __4__ | Stability & quality assurance. |
### Sprints 1-3
The first three sprints of a release are primarily centered around
development work, with regular acceptance testing in the third
week. During this third week, the top priority should be passing
acceptance testing (e.g. by resolving any blockers found); any
resources not needed for this effort should be used to begin work
for the subsequent sprint.
| Week | Mon | Tue | Wed | Thu | Fri |
|:-----:|:-------------------------:|:------:|:---:|:----------------------------:|:-----------:|
| __1__ | Sprint plan | Tag-up | | | |
| __2__ | | Tag-up | | | Code freeze |
| __3__ | Sprint acceptance testing | Triage | | _Sprint acceptance testing*_ | Ship |
&ast; If necessary.
### Sprint 4
The software must be stable at the end of the fourth sprint; because of
this, the fourth sprint is scheduled differently, with a heightened
emphasis on testing.
| Week | Mon | Tue | Wed | Thu | Fri |
|-------:|:-------------------------:|:------:|:---:|:----------------------------:|:-----------:|
| __1__ | Sprint plan | Tag-up | | | Code freeze |
| __2__ | Acceptance testing | Triage | | | |
| __3__ | _Acceptance testing*_ | Triage | | _Acceptance testing*_ | Ship |
&ast; If necessary.
## Process Points
* __Sprint plan.__ Project manager allocates issues based on
theme(s) for sprint, then reviews with team. Each team member
should have roughly two weeks of work allocated (to allow time
in the third week for testing of work completed.)
* Project manager should also sketch out subsequent sprint so
that team may begin work for that sprint during the
third week, since testing and blocker resolution is unlikely
to require all available resources.
* __Tag-up.__ Check in and status update among development team.
May amend plan for sprint as-needed.
* __Code freeze.__ Any new work from this sprint
(features, bug fixes, enhancements) must be integrated by the
end of the second week of the sprint. After code freeze
(and until the end of the sprint) the only changes that should be
merged into the master branch should directly address issues
needed to pass acceptance testing.
* __Acceptance Testing.__ Structured testing with predefined
success criteria. No release should ship without passing
acceptance tests. Time is allocated in each sprint for subsequent
rounds of acceptance testing if issues are identified during a
prior round. Specific details of acceptance testing need to be
agreed-upon with relevant stakeholders and delivery recipients,
and should be flexible enough to allow changes to plans
(e.g. deferring delivery of some feature in order to ensure
stability of other features.) Baseline testing includes:
* __Testathon.__ Multi-user testing, involving as many users as
is feasible, plus development team. Open-ended; should verify
completed work from this sprint, test exploratorily for
regressions, et cetera.
* __24-Hour Test.__ A test to verify that the software remains
stable after running for longer durations. May include some
combination of automated testing and user verification (e.g.
checking to verify that software remains subjectively
responsive at conclusion of test.)
* __Automated Testing.__ Automated testing integrated into the
build. (These tests are verified to pass more often than once
per sprint, as they run before any merge to master, but still
play an important role in acceptance testing.)
* __Sprint Acceptance Testing.__ Subset of Acceptance Testing
which should be performed before shipping at the end of any
sprint. Time is allocated for a second round of
Sprint Acceptance Testing if the first round is not passed.
* __Triage.__ Team reviews issues from acceptance testing and uses
success criteria to determine whether or not they should block
release, then formulates a plan to address these issues before
the next round of acceptance testing. Focus here should be on
ensuring software passes that testing in order to ship on time;
may prefer to disable malfunctioning components and fix them
in a subsequent sprint, for example.
* __Ship.__ Tag a code snapshot that has passed acceptance
testing and deploy that version. (Only true if acceptance
testing has passed by this point; if acceptance testing has not
been passed, will need to make ad hoc decisions with stakeholders,
e.g. "extend the sprint" or "defer shipment until end of next
sprint.")
The process used to develop Open MCT Web is described in the following
documents:
* [Development Cycle](cycle.md): Describes how and when specific
process points are repeated during development.
* Testing is described in two documents:
* The [Test Plan](testing/plan.md) summarizes the approaches used
to test Open MCT Web.
* The [Test Procedures](testing/procedures.md) document what
specific tests are performed to verify correctness, and how
they should be carried out.

View File

@@ -1,127 +0,0 @@
# Test Plan
## Test Levels
Testing for Open MCT Web includes:
* _Smoke testing_: Brief, informal testing to verify that no major issues
or regressions are present in the software, or in specific features of
the software.
* _Unit testing_: Automated verification of the performance of individual
software components.
* _User testing_: Testing with a representative user base to verify
that application behaves usably and as specified.
* _Long-duration testing_: Testing which takes place over a long period
of time to detect issues which are not readily noticeable during
shorter test periods.
### Smoke Testing
Manual, non-rigorous testing of the software and/or specific features
of interest. Verifies that the software runs and that basic functionality
is present.
### Unit Testing
Unit tests are automated tests which exercise individual software
components. Tests are subject to code review along with the actual
implementation, to ensure that tests are applicable and useful.
Unit tests should meet
[test standards](https://github.com/nasa/openmctweb/blob/master/CONTRIBUTING.md#test-standards)
as described in the contributing guide.
### User Testing
User testing is performed at scheduled times involving target users
of the software or reasonable representatives, along with members of
the development team exercising known use cases. Users test the
software directly; the software should be configured as similarly to
its planned production configuration as is feasible without introducing
other risks (e.g. damage to data in a production instance.)
User testing will focus on the following activities:
* Verifying issues resolved since the last test session.
* Checking for regressions in areas related to recent changes.
* Using major or important features of the software,
as determined by the user.
* General "trying to break things."
During user testing, users will
[report issues](https://github.com/nasa/openmctweb/blob/master/CONTRIBUTING.md#issue-reporting)
as they are encountered.
Desired outcomes of user testing are:
* Identified software defects.
* Areas for usability improvement.
* Feature requests (particularly missed requirements.)
* Recorded issue verification.
### Long-duration Testing
Long-duration testing occurs over a twenty-four hour period. The
software is run in one or more stressing cases representative of expected
usage. After twenty-four hours, the software is evaluated for:
* Performance metrics: Have memory usage or CPU utilization increased
during this time period in unexpected or undesirable ways?
* Subjective usability: Does the software behave in the same way it did
at the start of the test? Is it as responsive?
Any defects or unexpected behavior identified during testing should be
[reported as issues](https://github.com/nasa/openmctweb/blob/master/CONTRIBUTING.md#issue-reporting)
and reviewed for severity.
## Test Performance
Tests are performed at various levels of frequency.
* _Per-merge_: Performed before any new changes are integrated into
the software.
* _Per-sprint_: Performed at the end of every [sprint](../cycle.md).
* _Per-release_: Performed at the end of every [release](../cycle.md).
### Per-merge Testing
Before changes are merged, the author of the changes must perform:
* _Smoke testing_ (both generally, and for areas which interact with
the new changes.)
* _Unit testing_ (as part of the automated build step.)
Changes are not merged until the author has affirmed that both
forms of testing have been performed successfully; this is documented
by the [Author Checklist](https://github.com/nasa/openmctweb/blob/master/CONTRIBUTING.md#author-checklist).
### Per-sprint Testing
Before a sprint is closed, the development team must additionally
perform:
* A relevant subset of [_user testing_](procedures.md#user-test-procedures)
identified by the acting [project manager](../cycle.md#roles).
* [_Long-duration testing_](procedures.md#long-duration-testng)
(specifically, for 24 hours.)
Issues are reported as a product of both forms of testing.
A sprint is not closed until both categories have been performed on
the latest snapshot of the software, _and_ no issues labelled as
["blocker"](https://github.com/nasa/openmctweb/blob/master/CONTRIBUTING.md#issue-reporting)
remain open.
### Per-release Testing
As [per-sprint testing](#per-sprint-testing), except that _user testing_
should cover all test cases, with less focus on changes from the specific
sprint or release.
Per-release testing should also include any acceptance testing steps
agreed upon with recipients of the software.
A release is not closed until both categories have been performed on
the latest snapshot of the software, _and_ no issues labelled as
["blocker" or "critical"](https://github.com/nasa/openmctweb/blob/master/CONTRIBUTING.md#issue-reporting)
remain open.

View File

@@ -1,169 +0,0 @@
# Test Procedures
## Introduction
This document is intended to be used:
* By testers, to verify that Open MCT Web behaves as specified.
* By the development team, to document new test cases and to provide
guidance on how to author these.
## Writing Procedures
### Template
Procedures for individual tests should use the following template,
adapted from [https://swehb.nasa.gov/display/7150/SWE-114]().
Property | Value
---------------|---------------------------------------------------------------
Test ID |
Relevant reqs. |
Prerequisites |
Test input |
Instructions |
Expectation |
Eval. criteria |
For multi-line descriptions, use an asterisk or similar indicator to refer
to a longer-form description below.
#### Example Procedure - Edit a Layout
Property | Value
---------------|---------------------------------------------------------------
Test ID | MCT-TEST-000X - Edit a layout
Relevant reqs. | MCT-EDIT-000Y
Prerequisites | Create a layout, as in MCT-TEST-000Z
Test input | Domain object database XYZ
Instructions | See below &ast;
Expectation | Change to editing context &dagger;
Eval. criteria | Visual inspection
&ast; Follow the following steps:
1. Verify that the created layout is currently navigated-to,
as in MCT-TEST-00ZZ.
2. Click the Edit button, identified by a pencil icon and the text "Edit"
displayed on hover.
&dagger; Right-hand viewing area should be surrounded by a dashed
blue border when a domain object is being edited.
### Guidelines
Test procedures should be written assuming minimal prior knowledge of the
application: Non-standard terms should only be used when they are documented
in [the glossary](#glossary), and shorthands used for user actions should
be accompanied by useful references to test procedures describing those
actions (when available) or descriptions in user documentation.
Test cases should be narrow in scope; if a list of steps is excessively
long (or must be written vaguely to be kept short) it should be broken
down into multiple tests which reference one another.
All requirements satisfied by Open MCT Web should be verifiable using
one or more test procedures.
## Glossary
This section will contain terms used in test procedures. This may link to
a common glossary, to avoid replication of content.
## Procedures
This section will contain specific test procedures. Presently, procedures
are placeholders describing general patterns for setting up and conducting
testing.
### User Testing Setup
These procedures describes a general pattern for setting up for user
testing. Specific deployments should customize this pattern with
relevant data and any additional steps necessary.
Property | Value
---------------|---------------------------------------------------------------
Test ID | MCT-TEST-SETUP0 - User Testing Setup
Relevant reqs. | TBD
Prerequisites | Build of relevant components
Test input | Exemplary database; exemplary telemetry data set
Instructions | See below
Expectation | Able to load application in a web browser (Google Chrome)
Eval. criteria | Visual inspection
Instructions:
1. Start telemetry server.
2. Start ElasticSearch.
3. Restore database snapshot to ElasticSearch.
4. Start telemetry playback.
5. Start HTTP server for client sources.
### User Test Procedures
Specific user test cases have not yet been authored. In their absence,
user testing is conducted by:
* Reviewing the text of issues from the issue tracker to understand the
desired behavior, and exercising this behavior in the running application.
(For instance, by following steps to reproduce from the original issue.)
* Issues which appear to be resolved should be marked as such with comments
on the original issue (e.g. "verified during user testing MM/DD/YYYY".)
* Issues which appear not to have been resolved should be reopened with an
explanation of what unexpected behavior has been observed.
* In cases where an issue appears resolved as-worded but other related
undesirable behavior is observed during testing, a new issue should be
opened, and linked to from a comment in the original issues.
* General usage of new features and/or existing features which have undergone
recent changes. Defects or problems with usability should be documented
by filing issues in the issue tracker.
* Open-ended testing to discover defects, identify usability issues, and
generate feature requests.
### Long-Duration Testing
The purpose of long-duration testing is to identify performance issues
and/or other defects which are sensitive to the amount of time the
application is kept running. (Memory leaks, for instance.)
Property | Value
---------------|---------------------------------------------------------------
Test ID | MCT-TEST-LDT0 - Long-duration Testing
Relevant reqs. | TBD
Prerequisites | MCT-TEST-SETUP0
Test input | (As for test setup.)
Instructions | See "Instructions" below &ast;
Expectation | See "Expectations" below &dagger;
Eval. criteria | Visual inspection
&ast; Instructions:
1. Start `top` or a similar tool to measure CPU usage and memory utilization.
2. Open several user-created displays (as many as would be realistically
opened during actual usage in a stressing case) in some combination of
separate tabs and windows (approximately as many tabs-per-window as
total windows.)
3. Ensure that playback data is set to run continuously for at least 24 hours
(e.g. on a loop.)
4. Record CPU usage and memory utilization.
5. In at least one tab, try some general user interface gestures and make
notes about the subjective experience of using the application. (Particularly,
the degree of responsiveness.)
6. Leave client displays open for 24 hours.
7. Record CPU usage and memory utilization again.
8. Make additional notes about the subjective experience of using the
application (again, particularly responsiveness.)
9. Check logs for any unexpected warnings or errors.
&dagger; Expectations:
* At the end of the test, CPU usage and memory usage should both be similar
to their levels at the start of the test.
* At the end of the test, subjective usage of the application should not
be observably different from the way it was at the start of the test.
(In particular, responsiveness should not decrease.)
* Logs should not contain any unexpected warnings or errors ("expected"
warnings or errors are those that have been documented and prioritized
as known issues, or those that are explained by transient conditions
external to the software, such as network outages.)

View File

@@ -1697,7 +1697,8 @@ Next, we utilize this functionality from the template:
</div>
</div>
</div>
```
'''
__tutorials/bargraph/res/templates/bargraph.html__
Here, we utilize the functions we just provided from the controller to position

View File

@@ -39,11 +39,8 @@ define(
start = Date.now();
function update() {
var now = Date.now(),
secs = (now - start) / 1000;
var secs = (Date.now() - start) / 1000;
displayed = Math.round(digests / secs);
start = now;
digests = 0;
}
function increment() {

View File

@@ -1,2 +0,0 @@
Example of using multiple persistence stores by exposing a root
object with a different space prefix.

View File

@@ -1,23 +0,0 @@
{
"extensions": {
"roots": [
{
"id": "scratch:root",
"model": {
"type": "folder",
"composition": [],
"name": "Scratchpad"
},
"priority": "preferred"
}
],
"components": [
{
"provides": "persistenceService",
"type": "provider",
"implementation": "ScratchPersistenceProvider.js",
"depends": [ "$q" ]
}
]
}
}

View File

@@ -1,79 +0,0 @@
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web 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 Web 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,window*/
define(
[],
function () {
'use strict';
/**
* The ScratchPersistenceProvider keeps JSON documents in memory
* and provides a persistence interface, but changes are lost on reload.
* @memberof example/scratchpad
* @constructor
* @implements {PersistenceService}
* @param q Angular's $q, for promises
*/
function ScratchPersistenceProvider($q) {
this.$q = $q;
this.table = {};
}
ScratchPersistenceProvider.prototype.listSpaces = function () {
return this.$q.when(['scratch']);
};
ScratchPersistenceProvider.prototype.listObjects = function (space) {
return this.$q.when(
space === 'scratch' ? Object.keys(this.table) : []
);
};
ScratchPersistenceProvider.prototype.createObject = function (space, key, value) {
if (space === 'scratch') {
this.table[key] = JSON.stringify(value);
}
return this.$q.when(space === 'scratch');
};
ScratchPersistenceProvider.prototype.readObject = function (space, key) {
return this.$q.when(
(space === 'scratch' && this.table[key]) ?
JSON.parse(this.table[key]) : undefined
);
};
ScratchPersistenceProvider.prototype.deleteObject = function (space, key, value) {
if (space === 'scratch') {
delete this.table[key];
}
return this.$q.when(space === 'scratch');
};
ScratchPersistenceProvider.prototype.updateObject =
ScratchPersistenceProvider.prototype.createObject;
return ScratchPersistenceProvider;
}
);

View File

@@ -31,7 +31,7 @@
"jshint": "jshint platform example || exit 0",
"watch": "karma start",
"jsdoc": "jsdoc -c jsdoc.json -r -d target/docs/api",
"otherdoc": "node docs/gendocs.js --in docs/src --out target/docs --suppress-toc 'docs/src/index.md|docs/src/process/index.md'",
"otherdoc": "node docs/gendocs.js --in docs/src --out target/docs",
"docs": "npm run jsdoc ; npm run otherdoc"
},
"repository": {

View File

@@ -20,6 +20,7 @@
"$scope",
"$route",
"$location",
"$q",
"objectService",
"navigationService",
"urlService"
@@ -34,7 +35,8 @@
{
"key": "BrowseObjectController",
"implementation": "BrowseObjectController.js",
"depends": [ "$scope", "$location", "$route" ]
"depends": [ "$scope", "$location", "$route", "$q",
"navigationService" ]
},
{
"key": "CreateMenuController",
@@ -62,6 +64,7 @@
{
"key": "browse-object",
"templateUrl": "templates/browse-object.html",
"gestures": ["drop"],
"uses": [ "view" ]
},
{
@@ -102,12 +105,6 @@
"implementation": "navigation/NavigationService.js"
}
],
"policies": [
{
"implementation": "creation/CreationPolicy.js",
"category": "creation"
}
],
"actions": [
{
"key": "navigate",
@@ -153,7 +150,8 @@
"provides": "actionService",
"type": "provider",
"implementation": "creation/CreateActionProvider.js",
"depends": [ "typeService", "dialogService", "creationService", "policyService" ]
"depends": ["$q", "typeService",
"navigationService"]
},
{
"key": "CreationService",

View File

@@ -19,7 +19,8 @@
this source code distribution or the Licensing information page available
at runtime from the About dialog for additional information.
-->
<div ng-controller="BrowseObjectController" class="abs l-flex-col">
<div ng-controller="BrowseObjectController" class="abs l-flex-col"
ng-class="editMode ? 'edit-mode' : 'browse-mode'">
<div class="holder flex-elem l-flex-row object-browse-bar ">
<div class="items-select left flex-elem l-flex-row grows">
<mct-representation key="'back-arrow'"
@@ -43,10 +44,11 @@
</mct-representation>
</div>
</div>
<div class="holder l-flex-col flex-elem grows l-object-wrapper">
<div class="holder l-flex-col flex-elem grows l-object-wrapper" ng-class="{ active:editMode, 'edit-main':editMode}">
<div class="holder l-flex-col flex-elem grows l-object-wrapper-inner">
<!-- Toolbar and Save/Cancel buttons -->
<div class="l-edit-controls flex-elem l-flex-row flex-align-end">
<div class="l-edit-controls flex-elem l-flex-row flex-align-end"
ng-class="{ active:editMode }">
<mct-toolbar name="mctToolbar"
structure="toolbar.structure"
ng-model="toolbar.state"

View File

@@ -20,7 +20,8 @@
at runtime from the About dialog for additional information.
-->
<div class="abs holder-all" ng-controller="BrowseController">
<div class="abs holder-all" ng-controller="BrowseController"
mct-before-unload="beforeUnloadWarning()">
<mct-include key="'topbar-browse'"></mct-include>
<div class="abs holder holder-main browse-area s-browse-area browse-wrapper"
ng-controller="PaneController as modelPaneTree"

View File

@@ -26,12 +26,16 @@
* @namespace platform/commonUI/browse
*/
define(
[],
function () {
[
'../../../representation/src/gestures/GestureConstants',
'../../edit/src/objects/EditableDomainObject'
],
function (GestureConstants, EditableDomainObject) {
"use strict";
var ROOT_ID = "ROOT",
DEFAULT_PATH = "mine";
DEFAULT_PATH = "mine",
CONFIRM_MSG = "Unsaved changes will be lost if you leave this page.";
/**
* The BrowseController is used to populate the initial scope in Browse
@@ -43,7 +47,7 @@ define(
* @memberof platform/commonUI/browse
* @constructor
*/
function BrowseController($scope, $route, $location, objectService, navigationService, urlService) {
function BrowseController($scope, $route, $location, $q, objectService, navigationService, urlService) {
var path = [ROOT_ID].concat(
($route.current.params.ids || DEFAULT_PATH).split("/")
);
@@ -64,24 +68,32 @@ define(
// urlService.urlForLocation used to adjust current
// path to new, addressed, path based on
// domainObject
$location.path(urlService.urlForLocation("browse", domainObject));
$location.path(urlService.urlForLocation("browse", domainObject.hasCapability('editor') ? domainObject.getOriginalObject() : domainObject));
}
function setSelectedObject(domainObject) {
if (domainObject !== $scope.navigatedObject && isDirty() && !confirm(CONFIRM_MSG)) {
$scope.treeModel.selectedObject = $scope.navigatedObject;
} else {
if (domainObject !== $scope.navigatedObject && $scope.navigatedObject.hasCapability('editor')){
$scope.navigatedObject.getCapability('action').perform('cancel');
}
setNavigation(domainObject);
}
}
// Callback for updating the in-scope reference to the object
// that is currently navigated-to.
function setNavigation(domainObject) {
//If the domain object has editor capability, retrieve the
// original uneditable domain object
var nonEditableObject = domainObject.hasCapability("editor") ? domainObject.getCapability("editor").getDomainObject() : domainObject;
$scope.navigatedObject = domainObject;
$scope.treeModel.selectedObject = nonEditableObject;
$scope.treeModel.selectedObject = domainObject;
navigationService.setNavigation(domainObject);
updateRoute(nonEditableObject);
updateRoute(domainObject);
}
function navigateTo(domainObject) {
// Check if an object has been navigated-to already...
// If not, or if an ID path has been explicitly set in the URL,
// navigate to the URL-specified object.
@@ -147,12 +159,25 @@ define(
selectedObject: navigationService.getNavigation()
};
function isDirty(){
var editorCapability = $scope.navigatedObject &&
$scope.navigatedObject.getCapability("editor"),
hasChanges = editorCapability && editorCapability.dirty();
return hasChanges;
}
$scope.beforeUnloadWarning = function() {
return isDirty() ?
"Unsaved changes will be lost if you leave this page." :
undefined;
}
// Listen for changes in navigation state.
navigationService.addListener(setNavigation);
// Also listen for changes which come from the tree
$scope.$watch("treeModel.selectedObject", setNavigation);
$scope.$watch("treeModel.selectedObject", setSelectedObject);
// Clean up when the scope is destroyed
$scope.$on("$destroy", function () {
navigationService.removeListener(setNavigation);

View File

@@ -22,8 +22,9 @@
/*global define,Promise*/
define(
[],
function () {
['../../../representation/src/gestures/GestureConstants',
'../../edit/src/objects/EditableDomainObject'],
function (GestureConstants, EditableDomainObject) {
"use strict";
/**
@@ -32,8 +33,10 @@ define(
* @memberof platform/commonUI/browse
* @constructor
*/
function BrowseObjectController($scope, $location, $route) {
function BrowseObjectController($scope, $location, $route, $q, navigationService) {
var navigatedObject;
function setViewForDomainObject(domainObject) {
var locationViewKey = $location.search().view;
function selectViewIfMatching(view) {
@@ -47,6 +50,9 @@ define(
((domainObject && domainObject.useCapability('view')) || [])
.forEach(selectViewIfMatching);
}
//$scope.editMode = domainObject.hasCapability('editor') ?
// true : false;
navigatedObject = domainObject;
}
function updateQueryParam(viewKey) {
@@ -67,6 +73,15 @@ define(
$scope.$watch('domainObject', setViewForDomainObject);
$scope.$watch('representation.selected.key', updateQueryParam);
$scope.cancelEditing = function() {
navigationService.setNavigation($scope.domainObject.getDomainObject());
}
$scope.doAction = function (action){
$scope[action] && $scope[action]();
}
}
return BrowseObjectController;

View File

@@ -25,8 +25,10 @@
* Module defining CreateAction. Created by vwoeltje on 11/10/14.
*/
define(
['./CreateWizard'],
function (CreateWizard) {
['./CreateWizard',
'uuid',
'../../../edit/src/objects/EditableDomainObject'],
function (CreateWizard, uuid, EditableDomainObject) {
"use strict";
/**
@@ -45,13 +47,11 @@ define(
* override this)
* @param {ActionContext} context the context in which the
* action is being performed
* @param {DialogService} dialogService the dialog service
* to use when requesting user input
* @param {CreationService} creationService the creation service,
* which handles the actual instantiation and persistence
* of the newly-created domain object
* @param {NavigationService} navigationService the navigation service,
* which handles changes in navigation. It allows the object
* being browsed/edited to be set.
*/
function CreateAction(type, parent, context, dialogService, creationService, policyService) {
function CreateAction(type, parent, context, $q, navigationService) {
this.metadata = {
key: 'create',
glyph: type.getGlyph(),
@@ -63,9 +63,8 @@ define(
this.type = type;
this.parent = parent;
this.policyService = policyService;
this.dialogService = dialogService;
this.creationService = creationService;
this.navigationService = navigationService;
this.$q = $q;
}
/**
@@ -73,45 +72,24 @@ define(
* This will prompt for user input first.
*/
CreateAction.prototype.perform = function () {
/*
Overview of steps in object creation:
var newModel = this.type.getInitialModel(),
parentObject = this.navigationService.getNavigation(),
newObject,
editableObject;
1. Show dialog
a. Prepare dialog contents
b. Invoke dialogService
2. Create new object in persistence service
a. Generate UUID
b. Store model
3. Mutate destination container
a. Get mutation capability
b. Add new id to composition
4. Persist destination container
a. ...use persistence capability.
*/
newModel.type = this.type.getKey();
newObject = parentObject.useCapability('instantiation', newModel);
editableObject = new EditableDomainObject(newObject, this.$q);
editableObject.setOriginalObject(parentObject);
editableObject.useCapability('mutation', function(model){
model.location = parentObject.getId();
});
// The wizard will handle creating the form model based
// on the type...
var wizard =
new CreateWizard(this.type, this.parent, this.policyService),
self = this;
// Create and persist the new object, based on user
// input.
function persistResult(formValue) {
var parent = wizard.getLocation(formValue),
newModel = wizard.createModel(formValue);
return self.creationService.createObject(newModel, parent);
if (newObject.hasCapability('composition') && this.type.getKey()!=='folder') {
this.navigationService.setNavigation(editableObject);
} else {
return editableObject.getCapability('action').perform('save');
}
function doNothing() {
// Create cancelled, do nothing
return false;
}
return this.dialogService.getUserInput(
wizard.getFormStructure(),
wizard.getInitialFormValue()
).then(persistResult, doNothing);
};

View File

@@ -46,11 +46,10 @@ define(
* introduced in this bundle), responsible for handling actual
* object creation.
*/
function CreateActionProvider(typeService, dialogService, creationService, policyService) {
function CreateActionProvider($q, typeService, navigationService) {
this.typeService = typeService;
this.dialogService = dialogService;
this.creationService = creationService;
this.policyService = policyService;
this.navigationService = navigationService;
this.$q = $q;
}
CreateActionProvider.prototype.getActions = function (actionContext) {
@@ -69,15 +68,14 @@ define(
// Introduce one create action per type
return this.typeService.listTypes().filter(function (type) {
return self.policyService.allow("creation", type);
return type.hasFeature("creation");
}).map(function (type) {
return new CreateAction(
type,
destination,
context,
self.dialogService,
self.creationService,
self.policyService
self.$q,
self.navigationService
);
});
};

View File

@@ -34,9 +34,9 @@ define(
* @memberof platform/commonUI/browse
* @constructor
*/
function CreateWizard(type, parent, policyService) {
function CreateWizard(type, parent, policyService, initialModel) {
this.type = type;
this.model = type.getInitialModel();
this.model = initialModel || type.getInitialModel();
this.properties = type.getProperties();
this.parent = parent;
this.policyService = policyService;

View File

@@ -50,7 +50,6 @@ define(
}
beforeEach(function () {
mockScope = jasmine.createSpyObj(
"$scope",
[ "$on", "$watch" ]
@@ -83,11 +82,11 @@ define(
);
mockDomainObject = jasmine.createSpyObj(
"domainObject",
[ "getId", "hasCapability", "getCapability", "getModel", "useCapability" ]
[ "getId", "getCapability", "getModel", "useCapability" ]
);
mockNextObject = jasmine.createSpyObj(
"nextObject",
[ "getId", "hasCapability", "getCapability", "getModel", "useCapability" ]
[ "getId", "getCapability", "getModel", "useCapability" ]
);
mockObjectService.getObjects.andReturn(mockPromise({
@@ -99,13 +98,9 @@ define(
mockDomainObject.useCapability.andReturn(mockPromise([
mockNextObject
]));
mockNextObject.useCapability.andReturn(undefined);
mockNextObject.getId.andReturn("next");
mockNextObject.hasCapability.andReturn(false);
mockDomainObject.getId.andReturn("mine");
mockDomainObject.hasCapability.andReturn(false);
controller = new BrowseController(
mockScope,

View File

@@ -33,9 +33,6 @@ define(
var mockTypeService,
mockDialogService,
mockCreationService,
mockPolicyService,
mockCreationPolicy,
mockPolicyMap = {},
mockTypes,
provider;
@@ -70,32 +67,14 @@ define(
"creationService",
[ "createObject" ]
);
mockPolicyService = jasmine.createSpyObj(
"policyService",
[ "allow" ]
);
mockTypes = [ "A", "B", "C" ].map(createMockType);
mockTypes.forEach(function(type){
mockPolicyMap[type.getName()] = true;
});
mockCreationPolicy = function(type){
return mockPolicyMap[type.getName()];
};
mockPolicyService.allow.andCallFake(function(category, type){
return category === "creation" && mockCreationPolicy(type) ? true : false;
});
mockTypeService.listTypes.andReturn(mockTypes);
provider = new CreateActionProvider(
mockTypeService,
mockDialogService,
mockCreationService,
mockPolicyService
mockCreationService
);
});
@@ -115,15 +94,15 @@ define(
it("does not expose non-creatable types", function () {
// One of the types won't have the creation feature...
mockPolicyMap[mockTypes[0].getName()] = false;
mockTypes[1].hasFeature.andReturn(false);
// ...so it should have been filtered out.
expect(provider.getActions({
key: "create",
domainObject: {}
}).length).toEqual(2);
// Make sure it was creation which was used to check
expect(mockPolicyService.allow)
.toHaveBeenCalledWith("creation", mockTypes[0]);
expect(mockTypes[1].hasFeature)
.toHaveBeenCalledWith("creation");
});
});
}

View File

@@ -1,53 +0,0 @@
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web 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 Web 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,describe,it,expect,beforeEach,jasmine*/
define(
["../../src/creation/CreationPolicy"],
function (CreationPolicy) {
"use strict";
describe("The creation policy", function () {
var mockType,
policy;
beforeEach(function () {
mockType = jasmine.createSpyObj(
'type',
['hasFeature']
);
policy = new CreationPolicy();
});
it("allows creation of types with the creation feature", function () {
mockType.hasFeature.andReturn(true);
expect(policy.allow(mockType)).toBeTruthy();
});
it("disallows creation of types without the creation feature", function () {
mockType.hasFeature.andReturn(false);
expect(policy.allow(mockType)).toBeFalsy();
});
});
}
);

View File

@@ -8,7 +8,6 @@
"creation/CreateMenuController",
"creation/CreateWizard",
"creation/CreationService",
"creation/CreationPolicy",
"creation/LocatorController",
"navigation/NavigateAction",
"navigation/NavigationService",

View File

@@ -21,6 +21,11 @@
"key": "EditPanesController",
"implementation": "controllers/EditPanesController.js",
"depends": [ "$scope" ]
},
{
"key": "ElementsController",
"implementation": "controllers/ElementsController.js",
"depends": [ "$scope" ]
}
],
"directives": [
@@ -38,7 +43,7 @@
{
"key": "edit",
"implementation": "actions/EditAction.js",
"depends": [ "$q", "navigationService", "$log" ],
"depends": [ "$location", "navigationService", "$log", "$q" ],
"description": "Edit this object.",
"category": "view-control",
"glyph": "p"
@@ -67,7 +72,9 @@
"implementation": "actions/SaveAction.js",
"name": "Save",
"description": "Save changes made to these objects.",
"depends": [ "navigationService" ],
"depends": [ "$q", "$location", "$injector", "urlService",
"navigationService", "policyService", "dialogService",
"creationService" ],
"priority": "mandatory"
},
{
@@ -76,7 +83,7 @@
"implementation": "actions/CancelAction.js",
"name": "Cancel",
"description": "Discard changes made to these objects.",
"depends": ["navigationService" ]
"depends": ["$injector", "navigationService"]
}
],
"policies": [

View File

@@ -19,16 +19,20 @@
this source code distribution or the Licensing information page available
at runtime from the About dialog for additional information.
-->
<div class="current-elements abs" style="height: 100%;">
<!--p class="hint">Drop objects here to add them...</p-->
<ul class="tree">
<li ng-repeat="containedObject in composition">
<span class="tree-item">
<mct-representation key="'label'"
mct-object="containedObject"
class="rep-object-label">
</mct-representation>
</span>
</li>
</ul>
<div ng-controller="ElementsController">
<mct-include key="'input-filter'"
class="flex-elem holder"
ng-model="filterBy">
</mct-include>
<div class="current-elements abs" style="height: 100%;">
<!--p class="hint">Drop objects here to add them...</p-->
<ul class="tree">
<li ng-repeat="containedObject in composition | filter:searchText">
<span class="tree-item">
<mct-representation key="'label'" mct-object="containedObject">
</mct-representation>
</span>
</li>
</ul>
</div>
</div>

View File

@@ -33,9 +33,10 @@ define(
* @memberof platform/commonUI/edit
* @implements {Action}
*/
function CancelAction(navigationService, context) {
function CancelAction($injector, navigationService, context) {
this.domainObject = context.domainObject;
this.navigationService = navigationService;
this.objectService = $injector.get('objectService');
}
/**
@@ -46,7 +47,7 @@ define(
*/
CancelAction.prototype.perform = function () {
var domainObject = this.domainObject,
navigationService = this.navigationService;
self = this;
// Look up the object's "editor.completion" capability;
// this is introduced by EditableDomainObject which is
@@ -62,9 +63,10 @@ define(
return editor.cancel();
}
//Return navigation state to the non-editable version of the object.
function returnToBrowse(nonEditableDomainObject) {
navigationService.setNavigation(nonEditableDomainObject);
//Discard current 'editable' object, and retrieve original
// un-edited object.
function returnToBrowse() {
return self.navigationService.setNavigation(self.domainObject.getOriginalObject());
}
return doCancel(getEditorCapability())
@@ -80,7 +82,7 @@ define(
CancelAction.appliesTo = function (context) {
var domainObject = (context || {}).domainObject;
return domainObject !== undefined &&
domainObject.getCapability('status').get('editing');
domainObject.hasCapability("editor");
};
return CancelAction;

View File

@@ -46,7 +46,7 @@ define(
* @constructor
* @implements {Action}
*/
function EditAction($q, navigationService, $log, context) {
function EditAction($location, navigationService, $log, $q, context) {
var domainObject = (context || {}).domainObject;
// We cannot enter Edit mode if we have no domain object to
@@ -63,20 +63,22 @@ define(
}
this.domainObject = domainObject;
this.$location = $location;
this.navigationService = navigationService;
this.$q = $q;
}
EditAction.prototype.createEditableObject = function(domainObject) {
return new EditableDomainObject(domainObject, this.$q);
};
/**
* Enter edit mode.
*/
EditAction.prototype.perform = function () {
this.domainObject.getCapability('status').set('editing', true);
this.navigationService.setNavigation(this.createEditableObject(this.domainObject));
var editableObject;
if (!this.domainObject.hasCapability("editor")) {
editableObject = new EditableDomainObject(this.domainObject, this.$q);
editableObject.getCapability('status').set('editing', true);
this.navigationService.setNavigation(editableObject);
}
//this.$location.path("/edit");
};
/**
@@ -87,13 +89,11 @@ define(
*/
EditAction.appliesTo = function (context) {
var domainObject = (context || {}).domainObject,
type = domainObject && domainObject.getCapability('type');
type = domainObject && domainObject.getCapability('type'),
isEditMode = domainObject && domainObject.getDomainObject ? true : false;
// Only allow creatable types to be edited, and objects that are
// not already being edited
return type
&& type.hasFeature('creation')
&& !domainObject.getCapability('status').get('editing');
// Only allow creatable types to be edited
return type && type.hasFeature('creation') && !isEditMode;
};
return EditAction;

View File

@@ -23,7 +23,8 @@
define(
function () {
['../../../browse/src/creation/CreateWizard'],
function (CreateWizard) {
'use strict';
/**
@@ -34,9 +35,26 @@ define(
* @implements {Action}
* @memberof platform/commonUI/edit
*/
function SaveAction(navigationService, context) {
function SaveAction($q, $location, $injector, urlService, navigationService, policyService, dialogService, creationService, context) {
this.domainObject = (context || {}).domainObject;
this.$location = $location;
this.injectObjectService = function(){
this.objectService = $injector.get("objectService");
}
this.urlService = urlService;
this.navigationService = navigationService;
this.policyService = policyService;
this.dialogService = dialogService;
this.creationService = creationService;
this.$q = $q;
}
SaveAction.prototype.getObjectService = function(){
// Lazily acquire object service (avoids cyclical dependency)
if (!this.objectService) {
this.injectObjectService();
}
return this.objectService;
}
/**
@@ -48,22 +66,139 @@ define(
*/
SaveAction.prototype.perform = function () {
var domainObject = this.domainObject,
navigationService = this.navigationService;
$location = this.$location,
urlService = this.urlService,
self = this;
function resolveWith(object){
return function() {return object};
}
function doWizardSave(parent) {
var context = domainObject.getCapability("context");
var wizard = new CreateWizard(domainObject.useCapability('type'), parent, self.policyService, domainObject.getModel());
function mergeObjects(fromObject, toObject){
Object.keys(fromObject).forEach(function(key) {
toObject[key] = fromObject[key];
});
}
// Create and persist the new object, based on user
// input.
function buildObjectFromInput(formValue) {
var parent = wizard.getLocation(formValue),
formModel = wizard.createModel(formValue);
formModel.location = parent.getId();
//Replace domain object model with model collected
// from user form.
domainObject.useCapability("mutation", function(){
//Replace object model with the model from the form
return formModel;
});
return domainObject;
}
function doNothing() {
// Create cancelled, do nothing
return false;
}
function getAllComposees(domainObject){
return domainObject.useCapability('composition');
}
function addComposeesToObject(object){
return function(composees){
return self.$q.all(composees.map(function (composee) {
return object.getCapability('composition').add(composee);
})).then(resolveWith(object));
}
}
/**
* Add the composees of the 'virtual' object to the
* persisted object
* @param object
* @returns {*}
*/
function composeNewObject(object){
if (self.$q.when(object.hasCapability('composition') && domainObject.hasCapability('composition'))) {
return getAllComposees(domainObject)
.then(addComposeesToObject(object))
}
}
return self.dialogService
.getUserInput(wizard.getFormStructure(), wizard.getInitialFormValue())
.then(buildObjectFromInput, doNothing)
//.then(composeNewObject)
//.then(object.getCapability("persistence"));
}
function persistObject(object){
return (object.hasCapability('editor') && object.getCapability('editor').save(true) || object.getCapability('persistence').persist())
.then(resolveWith(object));
/*
if (object.hasCapability('editor')){
return object.getCapability('editor').save(true)
.then(resolveWith(object));
} else {
return object.useCapability(persistence);
}*/
}
function fetchObject(objectId){
return self.getObjectService().getObjects([objectId]).then(function(objects){
return objects[objectId];
})
}
function getParent(object){
return fetchObject(object.getModel().location);
}
function locateObjectInParent(parent){
parent.getCapability('composition').add(domainObject.getId());
return parent;
}
// Invoke any save behavior introduced by the editor capability;
// this is introduced by EditableDomainObject which is
// used to insulate underlying objects from changes made
// during editing.
function doSave() {
return domainObject.getCapability("editor").save();
//WARNING: HACK
//This is a new 'virtual object' that has not been persisted
// yet.
if (!domainObject.getModel().persisted){
return getParent(domainObject)
.then(doWizardSave)
.then(persistObject)
.then(getParent)//Parent may have changed based
// on user selection
.then(locateObjectInParent)
.then(persistObject)
.then(function(){return fetchObject(domainObject.getId());})
} else {
return domainObject.getCapability("editor").save()
.then(resolveWith(domainObject.getOriginalObject()));
}
}
// Discard the current root view (which will be the editing
// UI, which will have been pushed atop the Browise UI.)
function returnToBrowse(nonEditableDomainObject) {
navigationService.setNavigation(nonEditableDomainObject);
// UI, which will have been pushed atop the Browse UI.)
function returnToBrowse(object) {
if (object) {
self.navigationService.setNavigation(object);
}
return object;
}
//return doSave().then(returnToBrowse);
return doSave().then(returnToBrowse);
};
@@ -76,7 +211,7 @@ define(
SaveAction.appliesTo = function (context) {
var domainObject = (context || {}).domainObject;
return domainObject !== undefined &&
domainObject.getCapability("status").get("editing");
domainObject.hasCapability("editor");
};
return SaveAction;

View File

@@ -50,7 +50,7 @@ define(
// Simply trigger refresh of in-view objects; do not
// write anything to database.
persistence.persist = function () {
return cache.markDirty(editableObject);
cache.markDirty(editableObject);
};
// Delegate refresh to the original object; this avoids refreshing

View File

@@ -80,6 +80,7 @@ define(
EditorCapability.prototype.save = function (nonrecursive) {
var domainObject = this.domainObject,
editableObject = this.editableObject,
self = this,
cache = this.cache;
// Update the underlying, "real" domain object's model
@@ -95,16 +96,11 @@ define(
return domainObject.getCapability('persistence').persist();
}
function saveChanges() {
return nonrecursive ?
resolvePromise(doMutate()).then(doPersist) :
resolvePromise(cache.saveAll());
}
editableObject.getCapability("status").set("editing", false);
return saveChanges().then(function(){
domainObject.getCapability('status').set('editing', false);
return domainObject;
});
return nonrecursive ?
resolvePromise(doMutate()).then(doPersist).then(function(){self.cancel()}) :
resolvePromise(cache.saveAll());
};
/**
@@ -116,8 +112,9 @@ define(
* @memberof platform/commonUI/edit.EditorCapability#
*/
EditorCapability.prototype.cancel = function () {
this.domainObject.getCapability('status').set('editing', false);
return resolvePromise(this.domainObject);
this.editableObject.getCapability("status").set("editing", false);
//TODO: Reset the cache as well here.
return resolvePromise(undefined);
};
/**
@@ -129,10 +126,6 @@ define(
return this.cache.dirty();
};
EditorCapability.prototype.getDomainObject = function () {
return this.domainObject;
};
return EditorCapability;
}
);

View File

@@ -19,7 +19,7 @@
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/*global define*/
/*global define,Promise*/
define(
[],
@@ -27,19 +27,20 @@ define(
"use strict";
/**
* A policy for determining whether objects of a given type can be
* created.
* The ElementsController prepares the elements view for display
*
* @constructor
* @implements {Policy}
* @memberof platform/commonUI/browse
*/
function CreationPolicy() {
function ElementsController($scope) {
function filterBy(text){
if (typeof text === 'undefined')
return $scope.searchText;
else
$scope.searchText = text;
}
$scope.filterBy = filterBy;
}
CreationPolicy.prototype.allow = function (type) {
return type.hasFeature("creation");
};
return CreationPolicy;
return ElementsController;
}
);

View File

@@ -78,7 +78,9 @@ define(
// different versions of the same editable domain object
// are not shown in different sections of the same Edit
// UI, which might thereby fall out of sync.
var cache;
var cache,
originalObject = domainObject,
cachedObject;
// Constructor for EditableDomainObject, which adheres
// to the same shared cache.
@@ -102,12 +104,22 @@ define(
capability;
};
editableObject.setOriginalObject = function(object) {
originalObject = object;
};
editableObject.getOriginalObject = function() {
return originalObject;
};
return editableObject;
}
cache = new EditableDomainObjectCache(EditableDomainObjectImpl, $q);
cachedObject = cache.getEditableObject(domainObject);
return cache.getEditableObject(domainObject);
return cachedObject;
}
return EditableDomainObject;

View File

@@ -69,7 +69,9 @@ define(
*/
EditableDomainObjectCache.prototype.getEditableObject = function (domainObject) {
var type = domainObject.getCapability('type'),
EditableDomainObject = this.EditableDomainObject;
EditableDomainObject = this.EditableDomainObject,
editableObject,
statusListener;
// Track the top-level domain object; this will have
// some special behavior for its context capability.
@@ -86,10 +88,12 @@ define(
}
// Provide an editable form of the object
return new EditableDomainObject(
editableObject = new EditableDomainObject(
domainObject,
this.cache.getCachedModel(domainObject)
);
return editableObject;
};
/**
@@ -111,7 +115,6 @@ define(
*/
EditableDomainObjectCache.prototype.markDirty = function (domainObject) {
this.dirtyObjects[domainObject.getId()] = domainObject;
return this.$q.when(true);
};
/**

View File

@@ -47,6 +47,7 @@ define(
*/
function EditRepresenter($q, $log, scope) {
var self = this;
this.scope = scope;
// Mutate and persist a new version of a domain object's model.
@@ -101,7 +102,8 @@ define(
this.key = (representation || {}).key;
// Track the represented object
this.domainObject = representedObject;
this.scope.editMode = representedObject.hasCapability("status") && representedObject.getCapability("status").get("editing");
this.scope.editMode = representedObject.hasCapability("editor");
// Ensure existing watches are released
this.destroy();
};

View File

@@ -27,11 +27,10 @@ define(
"use strict";
describe("The Cancel action", function () {
var mockDomainObject,
mockCapabilities,
var mockLocation,
mockDomainObject,
mockEditorCapability,
mockStatusCapability,
mockNavigationService,
mockUrlService,
actionContext,
action;
@@ -44,50 +43,45 @@ define(
}
beforeEach(function () {
mockLocation = jasmine.createSpyObj(
"$location",
[ "path" ]
);
mockDomainObject = jasmine.createSpyObj(
"domainObject",
[ "getCapability" ]
[ "getCapability", "hasCapability" ]
);
mockEditorCapability = jasmine.createSpyObj(
"editor",
[ "save", "cancel" ]
);
mockStatusCapability = jasmine.createSpyObj(
"status",
[ "get"]
mockUrlService = jasmine.createSpyObj(
"urlService",
["urlForLocation"]
);
mockNavigationService = jasmine.createSpyObj(
"navigationService",
["setNavigation"]
);
mockCapabilities = {
"editor": mockEditorCapability,
"status": mockStatusCapability
};
actionContext = {
domainObject: mockDomainObject
};
mockDomainObject.getCapability.andCallFake(function(capability){
return mockCapabilities[capability];
});
mockDomainObject.hasCapability.andReturn(true);
mockDomainObject.getCapability.andReturn(mockEditorCapability);
mockEditorCapability.cancel.andReturn(mockPromise(true));
mockEditorCapability.cancel.andReturn(mockPromise(mockDomainObject));
mockStatusCapability.get.andReturn(true);
action = new CancelAction( mockNavigationService, actionContext);
action = new CancelAction(mockLocation, mockUrlService, actionContext);
});
it("only applies to domain object that is being edited", function () {
it("only applies to domain object with an editor capability", function () {
expect(CancelAction.appliesTo(actionContext)).toBeTruthy();
expect(mockDomainObject.hasCapability).toHaveBeenCalledWith("editor");
mockStatusCapability.get.andReturn(false);
mockDomainObject.hasCapability.andReturn(false);
mockDomainObject.getCapability.andReturn(undefined);
expect(CancelAction.appliesTo(actionContext)).toBeFalsy();
});
it("invokes the editor capability's cancel functionality when" +
" performed", function () {
it("invokes the editor capability's save functionality when performed", function () {
// Verify precondition
expect(mockEditorCapability.cancel).not.toHaveBeenCalled();
action.perform();
@@ -101,8 +95,8 @@ define(
it("returns to browse when performed", function () {
action.perform();
expect(mockNavigationService.setNavigation).toHaveBeenCalledWith(
mockDomainObject
expect(mockLocation.path).toHaveBeenCalledWith(
mockUrlService.urlForLocation("browse", mockDomainObject)
);
});
});

View File

@@ -19,41 +19,27 @@
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/*global define,describe,it,expect,beforeEach,jasmine,spyOn*/
/*global define,describe,it,expect,beforeEach,jasmine*/
define(
[
"../../src/actions/EditAction"
],
["../../src/actions/EditAction"],
function (EditAction) {
"use strict";
describe("The Edit action", function () {
var mockNavigationService,
var mockLocation,
mockNavigationService,
mockLog,
mockDomainObject,
mockStatusCapability,
mockType,
actionContext,
mockCapabilities,
mockQ,
action;
function mockPromise(value) {
return {
then: function (callback) {
return mockPromise(callback(value));
}
};
}
beforeEach(function () {
mockStatusCapability = jasmine.createSpyObj(
"statusCapability",
[ "get", "set" ]
mockLocation = jasmine.createSpyObj(
"$location",
[ "path" ]
);
mockNavigationService = jasmine.createSpyObj(
"navigationService",
[ "setNavigation", "getNavigation" ]
@@ -64,41 +50,20 @@ define(
);
mockDomainObject = jasmine.createSpyObj(
"domainObject",
[ "getId", "getModel", "getCapability", "hasCapability" ]
[ "getId", "getModel", "getCapability" ]
);
mockType = jasmine.createSpyObj(
"type",
[ "hasFeature" ]
);
mockQ = jasmine.createSpyObj(
"q",
[ "when", "all" ]
);
mockQ.when.andReturn(function(value){
return mockPromise(value);
});
mockQ.all.andReturn(mockPromise(undefined));
mockDomainObject.getCapability.andCallFake(function(capability){
return mockCapabilities[capability];
});
mockDomainObject.getModel.andReturn({});
mockDomainObject.getId.andReturn("testId");
mockStatusCapability.get.andReturn(false);
mockDomainObject.getCapability.andReturn(mockType);
mockType.hasFeature.andReturn(true);
mockCapabilities = {
"status": mockStatusCapability,
"type": mockType
};
actionContext = { domainObject: mockDomainObject };
action = new EditAction(
mockQ,
mockLocation,
mockNavigationService,
mockLog,
actionContext
@@ -112,30 +77,15 @@ define(
expect(mockType.hasFeature).toHaveBeenCalledWith('creation');
});
it("is only applicable when domain object is not in edit mode", function () {
// Indicates whether object is in edit mode
mockStatusCapability.get.andReturn(false);
expect(EditAction.appliesTo(actionContext)).toBeTruthy();
mockStatusCapability.get.andReturn(true);
expect(EditAction.appliesTo(actionContext)).toBeFalsy();
});
it("navigates to editable domain object", function () {
spyOn(action, 'createEditableObject');
it("changes URL path to edit mode when performed", function () {
action.perform();
expect(mockNavigationService.setNavigation).toHaveBeenCalled();
expect(action.createEditableObject).toHaveBeenCalled();
expect(mockLocation.path).toHaveBeenCalledWith("/edit");
});
it("ensures that the edited object is navigated-to", function () {
var navigatedObject;
action.perform();
navigatedObject = mockNavigationService.setNavigation.mostRecentCall.args[0];
expect(navigatedObject.getId())
.toEqual(mockDomainObject.getId());
expect(navigatedObject).not.toBe(mockDomainObject);
expect(mockNavigationService.setNavigation)
.toHaveBeenCalledWith(mockDomainObject);
});
it("logs a warning if constructed when inapplicable", function () {
@@ -144,7 +94,7 @@ define(
// Should not have hit an exception...
new EditAction(
mockQ,
mockLocation,
mockNavigationService,
mockLog,
{}
@@ -154,6 +104,8 @@ define(
expect(mockLog.warn).toHaveBeenCalled();
// And should not have had other interactions
expect(mockLocation.path)
.not.toHaveBeenCalled();
expect(mockNavigationService.setNavigation)
.not.toHaveBeenCalled();
});

View File

@@ -27,11 +27,10 @@ define(
"use strict";
describe("The Save action", function () {
var mockDomainObject,
mockNavigationService,
mockStatusCapability,
var mockLocation,
mockDomainObject,
mockEditorCapability,
mockCapabilities,
mockUrlService,
actionContext,
action;
@@ -44,6 +43,10 @@ define(
}
beforeEach(function () {
mockLocation = jasmine.createSpyObj(
"$location",
[ "path" ]
);
mockDomainObject = jasmine.createSpyObj(
"domainObject",
[ "getCapability", "hasCapability" ]
@@ -52,39 +55,30 @@ define(
"editor",
[ "save", "cancel" ]
);
mockStatusCapability = jasmine.createSpyObj(
"statusCapability",
["get"]
mockUrlService = jasmine.createSpyObj(
"urlService",
["urlForLocation"]
);
mockNavigationService = jasmine.createSpyObj(
"mockNavigationService",
[ "setNavigation"]
);
mockCapabilities = {
"editor": mockEditorCapability,
"status": mockStatusCapability
};
actionContext = {
domainObject: mockDomainObject
};
mockDomainObject.hasCapability.andReturn(true);
mockDomainObject.getCapability.andCallFake(function(capability){
return mockCapabilities[capability];
});
mockDomainObject.getCapability.andReturn(mockEditorCapability);
mockEditorCapability.save.andReturn(mockPromise(true));
mockEditorCapability.save.andReturn(mockPromise(mockDomainObject));
mockStatusCapability.get.andReturn(true);
action = new SaveAction(mockNavigationService, actionContext);
action = new SaveAction(mockLocation, mockUrlService, actionContext);
});
it("only applies to domain object that is being edited", function () {
it("only applies to domain object with an editor capability", function () {
expect(SaveAction.appliesTo(actionContext)).toBeTruthy();
expect(mockDomainObject.hasCapability).toHaveBeenCalledWith("editor");
mockStatusCapability.get.andReturn(false);
mockDomainObject.hasCapability.andReturn(false);
mockDomainObject.getCapability.andReturn(undefined);
expect(SaveAction.appliesTo(actionContext)).toBeFalsy();
});
@@ -102,8 +96,8 @@ define(
it("returns to browse when performed", function () {
action.perform();
expect(mockNavigationService.setNavigation).toHaveBeenCalledWith(
mockDomainObject
expect(mockLocation.path).toHaveBeenCalledWith(
mockUrlService.urlForLocation("browse", mockDomainObject)
);
});
});

View File

@@ -31,7 +31,6 @@ define(
mockEditableObject,
mockDomainObject,
mockCache,
mockPromise,
capability;
beforeEach(function () {
@@ -51,9 +50,7 @@ define(
"cache",
[ "markDirty" ]
);
mockPromise = jasmine.createSpyObj("promise", ["then"]);
mockCache.markDirty.andReturn(mockPromise);
mockDomainObject.getCapability.andReturn(mockPersistence);
capability = new EditablePersistenceCapability(
@@ -87,10 +84,6 @@ define(
expect(mockPersistence.refresh).toHaveBeenCalled();
});
it("returns a promise from persist", function () {
expect(capability.persist().then).toEqual(jasmine.any(Function));
});
});
}
);

View File

@@ -28,8 +28,6 @@ define(
describe("The editor capability", function () {
var mockPersistence,
mockStatusCapability,
mockCapabilities,
mockEditableObject,
mockDomainObject,
mockCache,
@@ -42,14 +40,6 @@ define(
"persistence",
[ "persist" ]
);
mockStatusCapability = jasmine.createSpyObj(
"status",
[ "set" ]
);
mockCapabilities = {
"persistence":mockPersistence,
"status": mockStatusCapability
};
mockEditableObject = {
getModel: function () { return model; }
};
@@ -63,9 +53,7 @@ define(
);
mockCallback = jasmine.createSpy("callback");
mockDomainObject.getCapability.andCallFake(function(capability){
return mockCapabilities[capability];
});
mockDomainObject.getCapability.andReturn(mockPersistence);
model = { someKey: "some value", x: 42 };
@@ -108,19 +96,6 @@ define(
});
});
it("resets the editing status on successful save", function () {
capability.save().then(mockCallback);
// Wait for promise to resolve
waitsFor(function () {
return mockCallback.calls.length > 0;
}, 250);
runs(function () {
expect(mockStatusCapability.set).toHaveBeenCalledWith('editing', false);
});
});
it("has no interactions on cancel", function () {
capability.cancel().then(mockCallback);
@@ -136,19 +111,6 @@ define(
});
});
it("resets editing status on cancel", function () {
capability.cancel().then(mockCallback);
// Wait for promise to resolve
waitsFor(function () {
return mockCallback.calls.length > 0;
}, 250);
runs(function () {
expect(mockStatusCapability.set).toHaveBeenCalledWith('editing', false);
});
});
});
}

View File

@@ -32,9 +32,7 @@ define(
mockScope,
testRepresentation,
mockDomainObject,
mockStatusCapability,
mockPersistence,
mockCapabilities,
representer;
function mockPromise(value) {
@@ -59,21 +57,11 @@ define(
]);
mockPersistence =
jasmine.createSpyObj("persistence", ["persist"]);
mockStatusCapability = jasmine.createSpyObj("domainObject", [
"get"]);
mockCapabilities = {
"persistence": mockPersistence,
"status": mockStatusCapability
};
mockDomainObject.getModel.andReturn({});
mockDomainObject.hasCapability.andReturn(true);
mockDomainObject.useCapability.andReturn(true);
mockStatusCapability.get.andReturn(true);
mockDomainObject.getCapability.andCallFake(function(capability){
return mockCapabilities[capability];
});
mockDomainObject.getCapability.andReturn(mockPersistence);
representer = new EditRepresenter(mockQ, mockLog, mockScope);
representer.represent(testRepresentation, mockDomainObject);
@@ -110,14 +98,6 @@ define(
});
});
it("sets an 'editMode' flag on scope if the object is editable", function() {
expect(mockScope.editMode).toBe(true);
mockStatusCapability.get.andReturn(false);
representer.represent(testRepresentation, mockDomainObject);
expect(mockScope.editMode).toBeFalsy();
});
});
}

View File

@@ -19,10 +19,6 @@
{
"implementation": "StyleSheetLoader.js",
"depends": [ "stylesheets[]", "$document", "THEME" ]
},
{
"implementation": "UnsupportedBrowserWarning.js",
"depends": [ "notificationService", "agentService" ]
}
],
"stylesheets": [
@@ -80,7 +76,7 @@
{
"key": "TreeNodeController",
"implementation": "controllers/TreeNodeController.js",
"depends": [ "$scope", "$timeout" ]
"depends": [ "$scope", "$timeout", "navigationService" ]
},
{
"key": "ActionGroupController",
@@ -116,6 +112,10 @@
"implementation": "controllers/GetterSetterController.js",
"depends": [ "$scope" ]
},
{
"key": "SplitPaneController",
"implementation": "controllers/SplitPaneController.js"
},
{
"key": "SelectorController",
"implementation": "controllers/SelectorController.js",
@@ -225,6 +225,10 @@
"templateUrl": "templates/subtree.html",
"uses": [ "composition" ]
},
{
"key": "test",
"templateUrl": "templates/test.html"
},
{
"key": "tree-node",
"templateUrl": "templates/tree-node.html",

View File

@@ -35,23 +35,24 @@
}
}
.l-autoflow-header {
bottom: auto;
height: $headerH;
line-height: $headerH;
min-width: $colW;
.t-last-update {
overflow: hidden;
}
min-width: $colW;
span {
vertical-align: middle;
}
.s-btn.change-column-width {
@include trans-prop-nice-fade(500ms);
opacity: 0;
}
.l-filter {
display: block;
margin-right: $interiorMargin;
margin-left: $interiorMargin;
input.t-filter-input {
width: 150px;
width: 100px;
}
}
}
@@ -126,12 +127,4 @@
}
}
}
}
.frame {
&.child-frame.panel {
.autoflow .l-autoflow-header .l-filter {
display: none;
}
}
}

View File

@@ -71,7 +71,7 @@ $itemPadLR: 5px;
$treeVCW: 10px;
$treeTypeIconH: 1.4em; // was 16px
$treeTypeIconHPx: 16px;
$treeTypeIconW: 18px;
$treeTypeIconW: 20px;
$treeContextTriggerW: 20px;
// Tabular
$tabularHeaderH: 22px; //18px

View File

@@ -31,6 +31,10 @@ a.disabled {
border-bottom: 1px solid rgba(#fff, 0.3);
}
.outline {
@include boxOutline();
}
.test-stripes {
@include bgDiagonalStripes();
}

View File

@@ -73,34 +73,31 @@
}
.l-icon-alert {
display: none !important;
display: none !important; // Remove this when alerts are enabled
&:before {
color: $colorAlert;
content: "!";
}
}
// NEW!!
.t-item-icon {
// Used in grid-item.html, tree-item, inspector location, more?
@extend .ui-symbol;
@extend .icon;
display: inline-block;
line-height: normal; // This is Ok for the symbolsfont
position: relative;
.t-item-icon-glyph {
position: absolute;
}
&.l-icon-link {
.t-item-icon-glyph {
&:before {
color: $colorIconLink;
content: "\f4";
height: auto; width: auto;
position: absolute;
left: 0; top: 0; right: 0; bottom: 10%;
@include transform-origin(bottom, left);
@include transform(scale(0.3));
z-index: 2;
}
&:before {
color: $colorIconLink;
content: "\f4";
height: auto; width: auto;
position: absolute;
left: 0; top: 0; right: 0; bottom: 10%;
@include transform-origin(bottom, left);
@include transform(scale(0.3));
z-index: 2;
}
}
}

View File

@@ -97,20 +97,12 @@
}
.inspector-location {
//line-height: 180%;
.location-item {
$h: 1.2em;
@include box-sizing(border-box);
cursor: pointer;
display: inline-block;
line-height: $h;
position: relative;
padding: 2px 4px;
.t-object-label {
.t-item-icon {
height: $h;
width: 0.7rem;
}
}
&:hover {
background: $colorItemTreeHoverBg;
color: $colorItemTreeHoverFg;
@@ -125,7 +117,6 @@
display: inline-block;
font-family: symbolsfont;
font-size: 8px;
font-style: normal !important;
line-height: inherit;
margin-left: $interiorMarginSm;
width: 4px;
@@ -137,28 +128,17 @@
.tree-item {
.t-object-label {
// Elements pool is a flat list, so don't indent items.
font-size: 0.75rem;
left: 0;
.t-item-icon {
font-size: 1em;
width: 1em;
}
.t-title-label {
left: 20px + $interiorMargin;
}
}
}
}
}
}
.l-inspect {
.splitter-inspect-panel,
.split-pane-component.pane.bottom {
@include trans-prop-nice(opacity, 250ms); // Not working as desired currently; entire inspector seems to be destroyed and recreated when switching into and out of edit mode.
opacity: 0;
pointer-events: none;
}
}
.s-status-editing .l-inspect {
.location-item { pointer-events: none; }
.splitter-inspect-panel,
.split-pane-component.pane.bottom {
opacity: 1;
pointer-events: inherit;
}
}

View File

@@ -60,7 +60,6 @@
@import "overlay/overlay";
@import "mobile/overlay/overlay";
@import "tree/tree";
@import "object-label";
@import "mobile/tree";
@import "user-environ/frame";
@import "user-environ/top-bar";

View File

@@ -306,7 +306,7 @@
@include desktop {
@if $bgHov != none {
&:not(.disabled):hover {
@include background-image($bgHov);
background: $bgHov;
>.icon {
color: lighten($ic, $ltGamma);
}

View File

@@ -1,69 +0,0 @@
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web 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 Web 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.
*****************************************************************************/
// mct-representation surrounding an object-label key="'label'"
.rep-object-label {
@include flex-direction(row);
@include flex(1 1 auto);
height: inherit;
line-height: inherit;
min-width: 0;
}
.t-object-label {
.t-item-icon {
margin-right: $interiorMargin;
}
}
mct-representation {
&.s-status-pending {
.t-object-label {
.t-item-icon {
&:before {
$spinBW: 4px;
$spinD: 0;
@include spinner($spinBW);
content: "";
display: block;
position: absolute;
left: 50%;
top: 50%;
padding: 30%;
width: $spinD;
height: $spinD;
}
.t-item-icon-glyph {
display: none;
}
}
.t-title-label {
font-style: italic;
opacity: 0.6;
}
}
}
}
.selected mct-representation.s-status-pending .t-object-label .t-item-icon:before {
border-color: rgba($colorItemTreeSelectedFg, 0.25);
border-top-color: rgba($colorItemTreeSelectedFg, 1.0);
}

View File

@@ -108,7 +108,10 @@ $pad: $interiorMargin * $baseRatio;
.s-icon-btn {
@extend .ui-symbol;
// Color and styling additionally in _controls.scss
color: $colorBtnIcon;
&:hover {
color: lighten($colorBtnIcon, $ltGamma);
}
}
.mini-tab {

View File

@@ -187,8 +187,7 @@ label.checkbox.custom {
}
}
.context-available,
.s-icon-btn {
.context-available {
$c: $colorKey;
color: $c;
&:hover {

View File

@@ -37,8 +37,6 @@
}
.status.block {
$transDelay: 1.5s;
$transSpeed: .25s;
color: $colorStatusDefault;
cursor: default;
display: inline-block;
@@ -46,47 +44,13 @@
.status-indicator,
.label,
.count {
//@include test(#00ff00);
display: inline-block;
vertical-align: top;
}
&.no-icon {
.status-indicator {
display: none;
}
}
&.float-right {
float: right;
}
&.subtle {
opacity: 0.5;
}
.status-indicator {
margin-right: $interiorMarginSm;
}
&:not(.no-collapse) {
.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: 450px;
width: auto;
}
.count {
@include trans-prop-nice(max-width, $transSpeed, 0s);
opacity: 0;
}
}
}
&.ok .status-indicator,
&.info .status-indicator {
color: $colorStatusInfo;
@@ -99,11 +63,26 @@
&.error .status-indicator {
color: $colorStatusError;
}
.label {
// Max-width silliness is necessary for width transition
@include trans-prop-nice(max-width, .25s);
overflow: hidden;
max-width: 0px;
}
.count {
@include trans-prop-nice(opacity, $transSpeed, $transDelay);
@include trans-prop-nice(opacity, .25s);
font-weight: bold;
opacity: 1;
}
&:hover {
.label {
max-width: 450px;
width: auto;
}
.count {
opacity: 0;
}
}
}
/* Styles for messages and message banners */

View File

@@ -19,10 +19,8 @@
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
.s-status-editing .l-object-wrapper,
.edit-main {
// .s-status-editing .l-object-wrapper is relevant to New Edit Mode;
// .edit-main is legacy for old edit mode.
$handleD: 15px;
$cr: 5px;
.edit-corner,
@@ -94,10 +92,12 @@
}
}
.frame.child-frame.panel {
&:hover {
@include boxShdwLarge();
border-color: $colorKey;
//z-index: 2;
.view-switcher {
opacity: 1;
}

View File

@@ -1,32 +1,46 @@
.l-time-display {
$transTime: 200ms;
line-height: 140%;
// Layout
&:hover {
.l-btn.control {
opacity: 1;
}
}
.l-elem-wrapper {
position: relative;
}
.l-elem {
display: inline-block;
}
&.l-timer {
.control {
@include trans-prop-nice((width, opacity), $transTime);
line-height: inherit;
margin-right: 0;
opacity: 0;
width: 0;
}
&:hover .control {
margin-right: $interiorMargin;
opacity: 1;
width: 1em;
.l-elem.l-value {
@include trans-prop-nice(left, $transTime);
position: absolute;
left: 0;
z-index: 1;
.ui-symbol.direction {
font-size: 0.8em;
}
}
&:hover .l-elem.l-value {
left: 20px;
}
}
.value {
color: pullForward($colorBodyFg, 50%);
font-weight: 400;
.direction {
font-size: 0.8em;
}
}
// Look-and-feel
.l-elem {
.value.active,
&.value.active {
color: $colorKeyFg;
}
}
.l-btn.control {
@include trans-prop-nice-fade($transTime);
opacity: 0;
font-size: 0.65em;
vertical-align: top;
//line-height: 1em;
}
}

View File

@@ -25,6 +25,7 @@
margin: 0 0 2px 0; // Needed to avoid dropshadow from being clipped by parent containers
}
padding: 0 $interiorMargin;
overflow: hidden;
position: relative;
line-height: $formInputH;
select {

View File

@@ -24,27 +24,21 @@
100% { transform: rotate(359deg); }
}
@mixin spinner($b: 5px) {
@mixin wait-spinner2($b: 5px, $c: $colorAlt1) {
@include keyframes(rotateCentered) {
0% { @include transform(translateX(-50%) translateY(-50%) rotate(0deg)); }
100% { @include transform(translateX(-50%) translateY(-50%) rotate(359deg)); }
}
0% { transform: translateX(-50%) translateY(-50%) rotate(0deg); }
100% { transform: translateX(-50%) translateY(-50%) rotate(359deg); }
}
@include animation-name(rotateCentered);
@include animation-duration(0.5s);
@include animation-iteration-count(infinite);
@include animation-timing-function(linear);
@include transform-origin(center);
border-style: solid;
border-width: $b;
@include border-radius(100%);
}
@mixin wait-spinner2($b: 5px, $c: $colorAlt1) {
@include spinner($b);
@include box-sizing(border-box);
border-color: rgba($c, 0.25);
border-top-color: rgba($c, 1.0);
border-style: solid;
border-width: 5px;
@include border-radius(100%);
@include box-sizing(border-box);
display: block;
position: absolute;
height: 0; width: 0;

View File

@@ -31,34 +31,54 @@ $tabletItemH: floor($ueBrowseGridItemLg/3);
/************************** MOBILE TREE MENU DIMENSIONS */
$mobileTreeItemH: 35px;
$mobileTreeItemIndent: 15px;
$mobileTreeItemIndent: 20px;
$mobileTreeRightArrowW: 30px;
/************************** DEVICE WIDTHS */
// IMPORTANT! Usage assumes that ranges are mutually exclusive and have no gaps
$phoMaxW: 767px;
$tabMinW: 768px;
$tabMaxW: 1024px;
$desktopMinW: 1025px;
/************************** WINDOW DIMENSIONS FOR RWD */
$phoMaxW: 514px;
$phoMaxH: 740px;
$tabMinW: 515px;
$tabMaxW: 799px;
$tabMinH: 741px;
$tabMaxH: 1024px;
$compMinW: 800px;
$compMinH: 1025px;
/************************** MEDIA QUERIES: WINDOW CHECKS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
$screenPortrait: "(orientation: portrait)";
$screenLandscape: "(orientation: landscape)";
$screenPortrait: "screen and (orientation: portrait)";
$screenLandscape: "screen and (orientation: landscape)";
//$mobileDevice: "(max-device-width: #{$tabMaxW})";
$mobileDevice: "(max-device-width: #{$tabMaxW}) and (max-device-height: #{$tabMaxH})";
$mobileDeviceEmu: "(max-device-width: #{$tabMaxH}) and (max-device-height: #{$tabMaxW})";
$phoneCheck: "(max-device-width: #{$phoMaxW})";
$tabletCheck: "(min-device-width: #{$tabMinW}) and (max-device-width: #{$tabMaxW})";
$desktopCheck: "(min-device-width: #{$desktopMinW}) and (-webkit-min-device-pixel-ratio: 1)";
$phonePortraitCheck: "(max-width: #{$phoMaxW}) and (max-height: #{$phoMaxH})";
$phoneLandscapeCheck: "(max-height: #{$phoMaxW}) and (max-width: #{$phoMaxH})";
$tabWidPorCheck: "(min-width: #{$tabMinW}) and (max-width: #{$tabMaxW})";
$tabHeiPorCheck: "(min-height: #{$tabMinH}) and (max-height: #{$tabMaxH})";
$tabletPortraitCheck: "#{$tabWidPorCheck} and #{$tabHeiPorCheck}";
$tabWidLanCheck: "(min-height: #{$tabMinW}) and (max-height: #{$tabMaxW})";
$tabHeiLanCheck: "(min-width: #{$tabMinH}) and (max-width: #{$tabMaxH})";
$tabletLandscapeCheck: "#{$tabWidLanCheck} and #{$tabHeiLanCheck}";
$desktopPortraitCheck: "(min-device-width: #{$compMinW}) and (min-device-height: #{$compMinH})";
$desktopLandscapeCheck: "(min-device-width: #{$compMinH}) and (min-device-height: #{$compMinW})";
/************************** MEDIA QUERIES: WINDOWS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
$phonePortrait: "only screen and #{$screenPortrait} and #{$phoneCheck}";
$phoneLandscape: "only screen and #{$screenLandscape} and #{$phoneCheck}";
$phonePortrait: "#{$screenPortrait} and #{$phonePortraitCheck} and #{$mobileDevice}";
$phoneLandscape: "#{$screenLandscape} and #{$phoneLandscapeCheck} and #{$mobileDevice}";
$phoneLandscapeEmu: "#{$screenLandscape} and #{$phoneLandscapeCheck} and #{$mobileDeviceEmu}";
$tabletPortrait: "only screen and #{$screenPortrait} and #{$tabletCheck}";
$tabletLandscape: "only screen and #{$screenLandscape} and #{$tabletCheck}";
$tabletPortrait: "#{$screenPortrait} and #{$tabletPortraitCheck} and #{$mobileDevice}";
$tabletLandscape: "#{$screenLandscape} and #{$tabletLandscapeCheck} and #{$mobileDevice}";
$tabletLandscapeEmu: "#{$screenLandscape} and #{$tabletLandscapeCheck} and #{$mobileDeviceEmu}";
$desktop: "only screen and #{$desktopCheck}";
$desktopPortrait: "screen and #{$desktopPortraitCheck}";
$desktopLandscape: "screen and #{$desktopLandscapeCheck}";
/************************** DEVICE PARAMETERS FOR MENUS/REPRESENTATIONS */
$proporMenuOnly: 90%;

View File

@@ -25,7 +25,8 @@
// Phones in any orientation
@mixin phone {
@media #{$phonePortrait},
#{$phoneLandscape} {
#{$phoneLandscape},
#{$phoneLandscapeEmu} {
@content
}
}
@@ -39,7 +40,8 @@
// Phones in landscape orientation
@mixin phoneLandscape {
@media #{$phoneLandscape} {
@media #{$phoneLandscape},
#{$phoneLandscapeEmu} {
@content
}
}
@@ -47,7 +49,8 @@
// Tablets in any orientation
@mixin tablet {
@media #{$tabletPortrait},
#{$tabletLandscape} {
#{$tabletLandscape},
#{$tabletLandscapeEmu} {
@content
}
}
@@ -61,7 +64,8 @@
// Tablets in landscape orientation
@mixin tabletLandscape {
@media #{$tabletLandscape} {
@media #{$tabletLandscape},
#{$tabletLandscapeEmu} {
@content
}
}
@@ -70,8 +74,10 @@
@mixin phoneandtablet {
@media #{$phonePortrait},
#{$phoneLandscape},
#{$phoneLandscapeEmu},
#{$tabletPortrait},
#{$tabletLandscape} {
#{$tabletLandscape},
#{$tabletLandscapeEmu} {
@content
}
}
@@ -80,14 +86,17 @@
@mixin desktopandtablet {
@media #{$tabletPortrait},
#{$tabletLandscape},
#{$desktop} {
#{$tabletLandscapeEmu},
#{$desktopPortrait},
#{$desktopLandscape} {
@content
}
}
// Desktop monitors in any orientation
@mixin desktop {
@media #{$desktop} {
@media #{$desktopPortrait},
#{$desktopLandscape} {
@content
}
}

View File

@@ -30,30 +30,25 @@
}
.tree-item,
.search-result-item {
height: $mobileTreeItemH !important;
line-height: $mobileTreeItemH !important;
margin-bottom: 0px !important;
height: $mobileTreeItemH;
line-height: $mobileTreeItemH;
margin-bottom: 0px;
.view-control {
font-size: 1.2em;
margin-right: 0;
order: 2;
width: $mobileTreeItemH;
&.has-children {
&:before {
content: "\7d";
left: 50%;
@include transform(translateX(-50%) rotate(90deg));
}
&.expanded:before {
@include transform(translateX(-50%) rotate(270deg));
}
}
}
.t-object-label {
//@include test(red);
position: absolute;
font-size: 1.1em;
height: $mobileTreeItemH;
line-height: inherit;
right: 0px;
width: $mobileTreeRightArrowW;
text-align: center;
}
.label,
.t-object-label {
left: 0;
right: $mobileTreeRightArrowW + $interiorMargin; // Allows tree item name to stop prior to the arrow
line-height: inherit;
.t-item-icon.l-icon-link .t-item-icon-glyph:before {
bottom: 20%; // Shift up due to height of mobile menu items
}
}
}
}

View File

@@ -1,5 +1,5 @@
@include phone {
.search-holder {
.search {
.search-bar {
// Hide menu-icon and adjust spacing when in phone mode
.menu-icon {

View File

@@ -20,9 +20,11 @@
* at runtime from the About dialog for additional information.
*****************************************************************************/
$yBarW: 60px;
$yLabelW: 10px;
$yLabelW: auto;
$xBarH: 32px;
$legendH: 20px;
//$colorHash: rgba(white, 0.3); // MOVED INTO CONSTANTS
//$styleHash: dashed; // MOVED INTO CONSTANTS
$swatchD: 8px;
$plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBarW); // Top, right, bottom, left
@@ -34,6 +36,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
height: 100%;
.gl-plot-axis-area {
// @include test(green);
position: absolute;
&.gl-plot-x {
top: auto;
@@ -56,7 +59,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
.gl-plot-coords {
@include box-sizing(border-box);
@include border-radius($controlCr);
background: black;
background: black; //rgba($colorKey, 0.5);
color: lighten($colorBodyFg, 30%);
padding: 2px 5px;
position: absolute;
@@ -85,9 +88,11 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
.gl-plot-label,
.l-plot-label {
// @include test(yellow);
color: $colorPlotLabelFg;
position: absolute;
text-align: center;
// text-transform: uppercase;
&.gl-plot-x-label,
&.l-plot-x-label {
@@ -112,26 +117,20 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
}
}
.gl-plot-x-options,
.gl-plot-y-options {
.gl-plot-y-options {
$h: 32px;
// @include test();
position: absolute;
top: 50%;
right: auto;
bottom: auto;
left: $yLabelW + $interiorMargin;
margin-top: $h / -2;
height: auto;
min-height: $h;
z-index: 2;
width: $h;
}
.gl-plot-x-options {
top: $interiorMargin;
}
.gl-plot-y-options {
@include transform(translateY(-50%));
min-width: 150px; // Need this due to enclosure of .select
top: 50%;
left: $yLabelW + $interiorMargin * 2;
}
.gl-plot-hash {
position: absolute;
border: 0 $colorPlotHash $stylePlotHash;
@@ -215,13 +214,21 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
display: inline-block;
height: $swatchD;
width: $swatchD;
//margin-right: $interiorMarginSm;
}
&[class*='s-limit'] {
.title-label {
//color: #fff;
}
}
}
}
.gl-plot-legend {
.plot-legend-item {
//@include test();
@include border-radius($smallCr);
//color: #fff;
line-height: 1.5em;
padding: 0px $itemPadLR;
.plot-color-swatch {
@@ -243,6 +250,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
.gl-plot-tick,
.tick-label {
// @include test(red);
font-size: 0.7rem;
position: absolute;
overflow: hidden;
@@ -269,6 +277,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
}
.gl-plot-tick {
// @include test(red);
&.gl-plot-x-tick-label {
top: $interiorMargin;
}

View File

@@ -20,92 +20,33 @@
* at runtime from the About dialog for additional information.
*****************************************************************************/
.clear-icon,
.menu-icon {
cursor: pointer;
font-family: symbolsfont;
@include trans-prop-nice((opacity, color), 150ms);
}
.clear-icon {
// 'x' in circle icon
&:before {
content: '\e607';
}
}
.holder-search {
// Moved a lot of stuff in here to _filter.scss
// to generalize approach to search input controls.
$iconWidth: 20px;
$textInputHeight: 19px;
$iconEdgeM: 4px;
$iconD: $treeSearchInputBarH - ($iconEdgeM*2);
.search-bar {
$textInputHeight: 19px; // This is equal to the default value, 19px
$iconEdgeM: 4px;
$iconD: $treeSearchInputBarH - ($iconEdgeM*2);
font-size: 0.8em;
max-width: 250px;
position: relative;
.search-input {
input[type="search"] {
height: $treeSearchInputBarH;
line-height: $treeSearchInputBarH;
position: relative;
width: 100%;
padding-left: $iconD + $interiorMargin !important;
padding-right: ($iconD * 2) + ($interiorMargin * 2) !important;
}
&:before,
.clear-icon,
.menu-icon {
@include box-sizing(border-box);
color: $colorInputIcon;
height: $iconD;
width: $iconD;
line-height: $iconD;
position: absolute;
text-align: center;
top: $iconEdgeM;
}
.search-input {
position: relative;
width: 100%;
padding-left: $iconD + $interiorMargin !important;
padding-right: ($iconD * 2) + ($interiorMargin * 2) !important;
// Make work for mct-control textfield
input {
width: inherit; // was 100%
}
}
&:before {
// Magnify glass icon
content:'\4d';
font-family: symbolsfont;
left: $interiorMarginSm;
@include trans-prop-nice(color, 250ms);
pointer-events: none;
z-index: 1;
.clear-icon {
right: $iconD + $interiorMargin;
}
// Make icon lighten when hovering over search bar
&:hover:before {
color: pullForward($colorInputIcon, 10%);
}
.clear-icon {
right: $iconD + $interiorMargin;
// Icon is visible only when there is text input
visibility: hidden;
opacity: 0;
&.show {
visibility: visible;
opacity: 1;
}
&:hover {
color: pullForward($colorInputIcon, 10%);
}
}
.menu-icon {
// 'v' invoke menu icon
&:before { content: '\76'; }
@@ -128,7 +69,7 @@
}
.active-filter-display {
$s: 0.7em;
$s: 0.65em;
$p: $interiorMargin;
@include box-sizing(border-box);
line-height: 130%;
@@ -147,6 +88,7 @@
.search-results {
@include trans-prop-nice((opacity, visibility), 250ms);
margin-top: $interiorMarginLg; // Always include margin here to fend off the search input
padding-right: $interiorMargin;
.hint {
margin-bottom: $interiorMarginLg;

View File

@@ -35,35 +35,23 @@ ul.tree {
.tree-item,
.search-result-item {
$runningItemW: 0;
@extend .l-flex-row;
@include box-sizing(border-box);
@include border-radius($basicCr);
@include single-transition(background-color, 0.25s);
display: block;
font-size: 0.8rem;
height: $menuLineH;
line-height: $menuLineH;
margin-bottom: $interiorMarginSm;
padding: 0 $interiorMarginSm;
position: relative;
.view-control {
color: $colorItemTreeVC;
font-size: 0.75em;
margin-right: $interiorMargin;
height: 100%;
line-height: inherit;
display: inline-block;
margin-left: $interiorMargin;
font-size: 0.75em;
width: $treeVCW;
&.has-children {
&:before {
position: absolute;
@include trans-prop-nice(transform, 100ms);
content: "\3e";
@include transform-origin(center);
}
&.expanded:before {
@include transform(rotate(90deg));
}
}
$runningItemW: $interiorMargin + $treeVCW;
@include desktop {
&:hover {
color: $colorItemTreeVCHover !important;
@@ -71,17 +59,64 @@ ul.tree {
}
}
.label,
.t-object-label {
display: block;
@include absPosDefault();
line-height: $menuLineH;
.t-item-icon {
@include txtShdwSubtle($shdwItemTreeIcon);
font-size: $treeTypeIconH;
color: $colorItemTreeIcon;
width: $treeTypeIconW;
position: absolute;
left: $interiorMargin;
top: 50%;
width: $treeTypeIconH;
@include transform(translateY(-50%));
}
.type-icon {
//@include absPosDefault(0, false);
$d: $treeTypeIconH;
@include txtShdwSubtle($shdwItemTreeIcon);
font-size: $treeTypeIconH;
color: $colorItemTreeIcon;
left: $interiorMargin;
position: absolute;
@include verticalCenterBlock($menuLineHPx, $treeTypeIconHPx);
line-height: 100%;
right: auto; width: $treeTypeIconH;
.icon {
&.l-icon-link,
&.l-icon-alert {
position: absolute;
z-index: 2;
}
&.l-icon-alert {
$d: 8px;
@include ancillaryIcon($d, $colorAlert);
top: 1px;
right: -2px;
}
&.l-icon-link {
$d: 8px;
@include ancillaryIcon($d, $colorIconLink);
left: -3px;
bottom: 0px;
}
}
}
.title-label,
.t-title-label {
@include ellipsize();
}
@include absPosDefault();
display: block;
left: $runningItemW + ($interiorMargin * 3);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
&.selected {
@@ -91,11 +126,12 @@ ul.tree {
color: $colorItemTreeSelectedVC;
}
.t-object-label .t-item-icon {
color: $colorItemTreeSelectedFg;
color: $colorItemTreeSelectedFg; //$colorItemTreeIconHover;
}
}
&:not(.selected) {
// NOTE: [Mobile] Removed Hover on Mobile
@include desktop {
&:hover {
background: $colorItemTreeHoverBg;
@@ -107,6 +143,31 @@ ul.tree {
}
}
&.active {
// The item is being edited
background: $colorItemTreeEditingBg; //rgba($colorItemTreeSelectedBg, 0.2) !important;
pointer-events: none;
&:before {
// Pencil icon
@extend .ui-symbol;
@include pulse($dur: 1s, $opacity0: 0.25);
color: $colorItemTreeEditingFg;
content: '\70';
margin-left: $interiorMarginSm;
}
.t-object-label {
.t-item-icon,
.t-title-label {
color: $colorItemTreeEditingFg;
@include text-shadow(none);
}
.t-title-label {
font-style: italic;
}
}
.view-control, + .tree-item-subtree { display: none; }
}
&:not(.loading) {
cursor: pointer;
}
@@ -124,57 +185,9 @@ ul.tree {
}
}
mct-representation {
&.s-status-pending {
.t-object-label {
.t-item-icon {
&:before {
$spinBW: 4px;
@include spinner($spinBW);
border-color: rgba($colorItemTreeIcon, 0.25);
border-top-color: rgba($colorItemTreeIcon, 1.0);
}
.t-item-icon-glyph {
display: none;
}
}
.t-title-label {
font-style: italic;
opacity: 0.6;
}
}
}
}
.selected mct-representation.s-status-pending .t-object-label .t-item-icon:before {
border-color: rgba($colorItemTreeSelectedFg, 0.25);
border-top-color: rgba($colorItemTreeSelectedFg, 1.0);
}
.tree .s-status-editing,
.search-results .s-status-editing {
// Item is being edited
.tree-item,
.search-result-item {
background: $colorItemTreeEditingBg;
pointer-events: none;
&:before {
// Pencil icon
@extend .ui-symbol;
@include pulse($dur: 1s, $opacity0: 0.25);
color: $colorItemTreeEditingFg;
content: '\70';
margin-right: $interiorMarginSm;
}
.t-object-label {
.t-item-icon,
.t-title-label {
color: $colorItemTreeEditingFg;
@include text-shadow(none);
}
.t-title-label {
font-style: italic;
}
}
.view-control, + .tree-item-subtree { display: none; }
}
.tree-item,
.search-result-item.active {
.t-object-label {
left: $interiorMargin + $treeVCW;
}
}

View File

@@ -25,7 +25,6 @@
&.child-frame.panel {
background: $colorBodyBg;
border: 1px solid $bc;
z-index: 0; // Needed to prevent child-frame controls from showing through when another child-frame is above
&:hover {
border-color: lighten($bc, 10%);
}

View File

@@ -77,38 +77,37 @@
}
}
.ue-bottom-bar {
@include absPosDefault(0);// New status bar design
top: auto;
height: $ueFooterH;
line-height: $ueFooterH - ($interiorMargin * 2);
background: $colorFooterBg;
color: lighten($colorBodyBg, 30%);
font-size: .7rem;
.status-holder {
@include box-sizing(border-box);
@include absPosDefault($interiorMargin);
@include ellipsize();
right: 120px;
text-transform: uppercase;
z-index: 1;
}
.app-logo {
@include box-sizing(border-box);
@include absPosDefault($interiorMargin);
cursor: pointer;
left: auto;
width: $ueAppLogoW;
z-index: 2;
&.logo-openmctweb {
background: url($dirImgs + 'logo-openmctweb.svg') no-repeat center center;
}
}
}
.ue-bottom-bar {
@include absPosDefault(0);// New status bar design
top: auto;
height: $ueFooterH;
line-height: $ueFooterH - ($interiorMargin * 2);
background: $colorFooterBg;
color: lighten($colorBodyBg, 30%);
font-size: .7rem;
.status-holder {
@include box-sizing(border-box);
@include absPosDefault($interiorMargin);
@include ellipsize();
right: 120px;
text-transform: uppercase;
z-index: 1;
}
.app-logo {
@include box-sizing(border-box);
@include absPosDefault($interiorMargin);
cursor: pointer;
left: auto;
width: $ueAppLogoW;
z-index: 2;
&.logo-openmctweb {
background: url($dirImgs + 'logo-openmctweb.svg') no-repeat center center;
}
}
}
}
.edit-mode {
// Old edit mode
.split-layout {
.split-pane-component.pane.right {
width: 15%;
@@ -132,7 +131,7 @@
.primary-pane {
// Need to lift up this pane to ensure that 'collapsed' panes don't block user interactions
z-index: 4;
z-index: 2;
}
.mini-tab-icon.toggle-pane {
@@ -172,7 +171,7 @@
&.toggle-inspect.anchor-right {
right: $bodyMargin;
&:after {
content: '\e615'; // Eye icon
content: '\e615'; // e615: Crosshair icon; was e608: Info "i" icon
}
&.collapsed {
right: $interiorMargin;
@@ -197,16 +196,6 @@
right: 0;
bottom: $bodyMargin;
left: $bodyMargin;
.create-btn-holder {
&.s-status-editing {
display: none;
& + .search-holder .search-bar {
// .search-holder is adjacent sibling to .create-btn-holder
// Add right margin when create button is hidden, to make room for the collapse pane 'x' button
margin-right: $interiorMarginLg * 2;
}
}
}
}
.holder.holder-object-and-inspector {
@@ -244,14 +233,16 @@
.object-holder-main {
@extend .abs;
}
.l-edit-controls {
//@include trans-prop-nice((opacity, height), 0.25s);
border-bottom: 1px solid $colorInteriorBorder;
line-height: $ueEditToolBarH;
height: 0px;
opacity: 0;
.tool-bar {
right: $interiorMargin;
&.active {
@include pulseBorder($colorEditAreaFg, $dur: 1s, $opacity0: 0.3);
@include border-radius($controlCr);
background-color: $colorEditAreaBg;
border-color: $colorEditAreaFg;
border-width: 2px;
border-style: dotted;
.l-object-wrapper-inner {
@include absPosDefault(3px, hidden);
}
}
}
@@ -260,7 +251,19 @@
@include trans-prop-nice-resize(0.25s);
}
.l-edit-controls {
@include trans-prop-nice((opacity, height), 0.25s);
border-bottom: 1px solid $colorInteriorBorder;
line-height: $ueEditToolBarH;
height: 0px;
opacity: 0;
overflow: hidden;
&.active {
height: $ueEditToolBarH + $interiorMargin;
margin-bottom: $interiorMargin;
opacity: 1;
}
}
.object-browse-bar .s-btn,
.top-bar .buttons-main .s-btn,
@@ -282,6 +285,7 @@
/***************************************************** OBJECT BROWSE BAR */
.object-browse-bar {
// Converting to use flexbox layout
@include box-sizing(border-box);
height: $ueTopBarH;
line-height: $ueTopBarH;
@@ -289,7 +293,7 @@
.left {
padding-right: $interiorMarginLg;
.l-back:not(.s-status-editing) {
.l-back {
margin-right: $interiorMarginLg;
}
}
@@ -302,7 +306,6 @@
.splitter-treeview,
.holder-treeview-elements {
opacity: 0;
pointer-events: none;
}
}
@@ -334,7 +337,6 @@
.l-inspect,
.splitter-inspect {
opacity: 0;
pointer-events: none;
}
}
}
@@ -374,22 +376,3 @@
min-width: 200px; // Needed for nice display when primary pane is constrained severely via splitters
}
}
.s-status-editing {
.l-object-wrapper {
@include pulseBorder($colorEditAreaFg, $dur: 1s, $opacity0: 0.3);
@include border-radius($controlCr);
background-color: $colorEditAreaBg;
border-color: $colorEditAreaFg;
border-width: 2px;
border-style: dotted;
.l-object-wrapper-inner {
@include absPosDefault(3px, hidden);
}
.l-edit-controls {
height: $ueEditToolBarH + $interiorMargin;
margin-bottom: $interiorMargin;
opacity: 1;
}
}
}

View File

@@ -20,9 +20,6 @@
* at runtime from the About dialog for additional information.
*****************************************************************************/
.tool-bar {
&.btn-bar {
white-space: nowrap;
}
.l-control-group {
height: $btnToolbarH;
}

View File

@@ -46,7 +46,8 @@
.edit-mode {
.top-bar {
.buttons-main {
// Old edit mode
// background: red;
// width: 600px;
white-space: nowrap;
&.abs {
bottom: auto;

View File

@@ -0,0 +1,30 @@
<!--
Open MCT Web, Copyright (c) 2014-2015, United States Government
as represented by the Administrator of the National Aeronautics and Space
Administration. All rights reserved.
Open MCT Web 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 Web 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="SplitPaneController as splitter">
<div class="splitter" ng-style="splitter.style()"
mct-drag="splitter.move(delta.x)">
</div>
<div class='split-pane-component items pane' style="right:0;"
ng-style="splitter.style()"
ng-transclude>
</div>
</span>

View File

@@ -1,29 +1,7 @@
<!--
Open MCT Web, Copyright (c) 2014-2015, United States Government
as represented by the Administrator of the National Aeronautics and Space
Administration. All rights reserved.
Open MCT Web 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 Web 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 class="s-btn"
ng-controller="DateTimeFieldController">
<input type="text"
ng-model="textValue"
ng-blur="restoreTextValue(); ngBlur()"
ng-class="{ error: textInvalid }">
</input>
<a class="ui-symbol icon icon-calendar"
@@ -33,8 +11,8 @@
<mct-popup ng-if="picker.active">
<div mct-click-elsewhere="picker.active = false">
<mct-control key="'datetime-picker'"
ng-model="pickerModel"
field="'value'"
ng-model="ngModel"
field="field"
options="{ hours: true }">
</mct-control>
</div>

View File

@@ -20,14 +20,12 @@
at runtime from the About dialog for additional information.
-->
<div ng-controller="TimeRangeController">
<form class="l-time-range-inputs-holder"
ng-submit="updateBoundsFromForm()">
<div class="l-time-range-inputs-holder">
<span class="l-time-range-inputs-elem ui-symbol type-icon">&#x43;</span>
<span class="l-time-range-input">
<mct-control key="'datetime-field'"
structure="{ format: parameters.format }"
ng-model="formModel"
ng-blur="updateBoundsFromForm()"
ng-model="ngModel.outer"
field="'start'"
class="time-range-start">
</mct-control>
@@ -38,15 +36,12 @@
<span class="l-time-range-input" ng-controller="ToggleController as t2">
<mct-control key="'datetime-field'"
structure="{ format: parameters.format }"
ng-model="formModel"
ng-blur="updateBoundsFromForm()"
ng-model="ngModel.outer"
field="'end'"
class="time-range-end">
</mct-control>&nbsp;
</span>
<input type="submit" class="hidden">
</form>
</div>
<div class="l-time-range-slider-holder">
<div class="l-time-range-slider">

View File

@@ -20,6 +20,7 @@
at runtime from the About dialog for additional information.
-->
<!-- DO NOT ADD SPACES BETWEEN THE SPANS - IT ADDS WHITE SPACE!! -->
<!--<div ng-init="reps = [1,2,3]"></div>-->
<div class='status block'
title="{{ngModel.getDescription()}}"
ng-click='ngModel.configure()'

View File

@@ -19,9 +19,7 @@
this source code distribution or the Licensing information page available
at runtime from the About dialog for additional information.
-->
<div class="t-object-label l-flex-row flex-elem grows">
<div class="t-item-icon flex-elem" ng-class="{ 'l-icon-link':location.isLink() }">
<div class="t-item-icon-glyph">{{type.getGlyph()}}</div>
</div>
<div class='t-title-label flex-elem grows'>{{model.name}}</div>
</div>
<span class="t-object-label">
<span class="t-item-icon" ng-class="{ 'l-icon-link':location.isLink() }">{{type.getGlyph()}}</span>
<span class='t-title-label'>{{model.name}}</span>
</span>

View File

@@ -19,6 +19,7 @@
this source code distribution or the Licensing information page available
at runtime from the About dialog for additional information.
-->
<span class="l-inspect" ng-controller="ObjectInspectorController as controller">
<div ng-controller="PaneController as modelPaneEdit">
<mct-split-pane class='abs contents split-layout' anchor='bottom'>
@@ -64,8 +65,8 @@
</ul>
</div><!--/ holder-inspector -->
</div><!--/ split-pane-component -->
<mct-splitter class="splitter-inspect-panel mobile-hide"></mct-splitter>
<div class="split-pane-component pane bottom">
<mct-splitter class="splitter-inspect mobile-hide" ng-show="editMode"></mct-splitter>
<div class="split-pane-component pane bottom" ng-show="editMode">
<div class="abs holder holder-elements l-flex-col">
<em class="flex-elem">Elements</em>
<mct-representation

View File

@@ -26,18 +26,41 @@
ng-class="{selected: treeNode.isSelected()}"
>
<span
class='ui-symbol view-control flex-elem'
ng-class="{ 'has-children': model.composition !== undefined, expanded: toggle.isActive() }"
mct-device="desktop"
class='ui-symbol view-control'
ng-click="toggle.toggle(); treeNode.trackExpansion()"
ng-if="model.composition !== undefined"
>
{{toggle.isActive() ? "v" : ">"}}
</span>
<mct-representation
class="rep-object-label"
mct-device="desktop"
class="mobile-hide"
key="'label'"
mct-object="domainObject"
ng-click="treeNode.select()"
>
</mct-representation>
<mct-representation
mct-device="mobile"
class="desktop-hide"
key="'label'"
mct-object="domainObject"
ng-click="(model.composition === undefined) && treeNode.select();
toggle.toggle();
treeNode.trackExpansion();"
>
</mct-representation>
<span
mct-device="mobile"
class='ui-symbol view-control'
ng-model="ngModel"
ng-click="treeNode.select()"
>
}
</span>
</span>
<span
class="tree-item-subtree"

View File

@@ -1,64 +0,0 @@
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web 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 Web 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*/
/**
* This bundle provides various general-purpose UI elements, including
* platform styling.
* @namespace platform/commonUI/general
*/
define(
[],
function () {
"use strict";
var WARNING_TITLE = "Unsupported browser",
WARNING_DESCRIPTION = [
"This software has been developed and tested",
"using the latest Google Chrome,",
"and may be unstable in other browsers."
].join(" "),
MOBILE_BROWSER = "Safari",
DESKTOP_BROWSER = "Chrome";
/**
* Shows a warning if a user's browser is unsupported.
* @memberof platform/commonUI/general
* @constructor
* @param {NotificationService} notificationService the notification
* service
*/
function UnsupportedBrowserWarning(notificationService, agentService) {
var testToBrowser = agentService.isMobile() ?
MOBILE_BROWSER : DESKTOP_BROWSER;
if (!agentService.isBrowser(testToBrowser)) {
notificationService.alert({
title: WARNING_TITLE,
actionText: WARNING_DESCRIPTION
});
}
}
return UnsupportedBrowserWarning;
}
);

View File

@@ -53,9 +53,7 @@ define(
formatter.parse($scope.textValue) !== value) {
$scope.textValue = formatter.format(value);
$scope.textInvalid = false;
$scope.lastValidValue = $scope.textValue;
}
$scope.pickerModel = { value: value };
}
function updateFromView(textValue) {
@@ -63,17 +61,6 @@ define(
if (!$scope.textInvalid) {
$scope.ngModel[$scope.field] =
formatter.parse(textValue);
$scope.lastValidValue = $scope.textValue;
}
}
function updateFromPicker(value) {
if (value !== $scope.ngModel[$scope.field]) {
$scope.ngModel[$scope.field] = value;
updateFromModel(value);
if ($scope.ngBlur) {
$scope.ngBlur();
}
}
}
@@ -82,18 +69,10 @@ define(
updateFromModel($scope.ngModel[$scope.field]);
}
function restoreTextValue() {
$scope.textValue = $scope.lastValidValue;
updateFromView($scope.textValue);
}
$scope.restoreTextValue = restoreTextValue;
$scope.picker = { active: false };
$scope.$watch('structure.format', setFormat);
$scope.$watch('ngModel[field]', updateFromModel);
$scope.$watch('pickerModel.value', updateFromPicker);
$scope.$watch('textValue', updateFromView);
}

View File

@@ -0,0 +1,89 @@
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web 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 Web 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(
[],
function () {
"use strict";
var DEFAULT_MAXIMUM = 1000,
DEFAULT_MINIMUM = 120;
/**
* Controller for the splitter in Browse mode. Current implementation
* uses many hard-coded constants; this could be generalized.
* @memberof platform/commonUI/general
* @constructor
*/
function SplitPaneController() {
this.current = 200;
this.start = 200;
this.assigned = false;
}
/**
* Get the current position of the splitter, in pixels
* from the left edge.
* @returns {number} position of the splitter, in pixels
*/
SplitPaneController.prototype.state = function (defaultState) {
// Set the state to the desired default, if we don't have a
// "real" current state yet.
if (arguments.length > 0 && !this.assigned) {
this.current = defaultState;
this.assigned = true;
}
return this.current;
};
/**
* Begin moving the splitter; this will note the splitter's
* current position, which is necessary for correct
* interpretation of deltas provided by mct-drag.
*/
SplitPaneController.prototype.startMove = function () {
this.start = this.current;
};
/**
* Move the splitter a number of pixels to the right
* (negative numbers move the splitter to the left.)
* This movement is relative to the position of the
* splitter when startMove was last invoked.
* @param {number} delta number of pixels to move
*/
SplitPaneController.prototype.move = function (delta, minimum, maximum) {
// Ensure defaults for minimum/maximum
maximum = isNaN(maximum) ? DEFAULT_MAXIMUM : maximum;
minimum = isNaN(minimum) ? DEFAULT_MINIMUM : minimum;
// Update current splitter state
this.current = Math.min(
maximum,
Math.max(minimum, this.start + delta)
);
};
return SplitPaneController;
}
);

View File

@@ -175,13 +175,6 @@ define(
updateViewFromModel($scope.ngModel);
}
function updateFormModel() {
$scope.formModel = {
start: (($scope.ngModel || {}).outer || {}).start,
end: (($scope.ngModel || {}).outer || {}).end
};
}
function updateOuterStart(t) {
var ngModel = $scope.ngModel;
@@ -199,7 +192,6 @@ define(
ngModel.inner.end
);
updateFormModel();
updateViewForInnerSpanFromModel(ngModel);
updateTicks();
}
@@ -221,7 +213,6 @@ define(
ngModel.inner.start
);
updateFormModel();
updateViewForInnerSpanFromModel(ngModel);
updateTicks();
}
@@ -232,14 +223,6 @@ define(
updateTicks();
}
function updateBoundsFromForm() {
$scope.ngModel = $scope.ngModel || {};
$scope.ngModel.outer = {
start: $scope.formModel.start,
end: $scope.formModel.end
};
}
$scope.startLeftDrag = startLeftDrag;
$scope.startRightDrag = startRightDrag;
$scope.startMiddleDrag = startMiddleDrag;
@@ -247,13 +230,10 @@ define(
$scope.rightDrag = rightDrag;
$scope.middleDrag = middleDrag;
$scope.updateBoundsFromForm = updateBoundsFromForm;
$scope.ticks = [];
// Initialize scope to defaults
updateViewFromModel($scope.ngModel);
updateFormModel();
$scope.$watchCollection("ngModel", updateViewFromModel);
$scope.$watch("spanWidth", updateSpanWidth);

View File

@@ -204,7 +204,7 @@ define(
// And poll for position changes enforced by styles
activeInterval = $interval(function () {
getSetPosition(getSetPosition());
}, POLLING_INTERVAL, 0, false);
}, POLLING_INTERVAL, false);
// ...and stop polling when we're destroyed.
$scope.$on('$destroy', function () {

View File

@@ -1,98 +0,0 @@
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web 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 Web 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,Promise,describe,it,expect,beforeEach,waitsFor,jasmine*/
define(
["../src/UnsupportedBrowserWarning"],
function (UnsupportedBrowserWarning) {
"use strict";
var MOBILE_BROWSER = "Safari",
DESKTOP_BROWSER = "Chrome",
UNSUPPORTED_BROWSERS = [
"Firefox",
"IE",
"Opera",
"Iceweasel"
];
describe("The unsupported browser warning", function () {
var mockNotificationService,
mockAgentService,
testAgent;
function instantiateWith(browser) {
testAgent = "Mozilla/5.0 " + browser + "/12.34.56";
return new UnsupportedBrowserWarning(
mockNotificationService,
mockAgentService
);
}
beforeEach(function () {
testAgent = "chrome";
mockNotificationService = jasmine.createSpyObj(
"notificationService",
[ "alert" ]
);
mockAgentService = jasmine.createSpyObj(
"agentService",
[ "isMobile", "isBrowser" ]
);
mockAgentService.isBrowser.andCallFake(function (substr) {
substr = substr.toLowerCase();
return testAgent.toLowerCase().indexOf(substr) !== -1;
});
});
[ false, true ].forEach(function (isMobile) {
var deviceType = isMobile ? "mobile" : "desktop",
goodBrowser = isMobile ? MOBILE_BROWSER : DESKTOP_BROWSER,
badBrowsers = UNSUPPORTED_BROWSERS.concat([
isMobile ? DESKTOP_BROWSER : MOBILE_BROWSER
]);
describe("on " + deviceType + " devices", function () {
beforeEach(function () {
mockAgentService.isMobile.andReturn(isMobile);
});
it("is not shown for " + goodBrowser, function () {
instantiateWith(goodBrowser);
expect(mockNotificationService.alert)
.not.toHaveBeenCalled();
});
badBrowsers.forEach(function (badBrowser) {
it("is shown for " + badBrowser, function () {
instantiateWith(badBrowser);
expect(mockNotificationService.alert)
.toHaveBeenCalled();
});
});
});
});
});
}
);

View File

@@ -67,13 +67,21 @@ define(
mockScope.ngModel = { testField: 12321 };
mockScope.field = "testField";
mockScope.structure = { format: "someFormat" };
mockScope.ngBlur = jasmine.createSpy('blur');
controller = new DateTimeFieldController(
mockScope,
mockFormatService
);
fireWatch("ngModel[field]", mockScope.ngModel.testField);
});
it("updates models from user-entered text", function () {
var newText = "1977-05-25 17:30:00";
mockScope.textValue = newText;
fireWatch("textValue", newText);
expect(mockScope.ngModel.testField)
.toEqual(mockFormat.parse(newText));
expect(mockScope.textInvalid).toBeFalsy();
});
it("updates text from model values", function () {
@@ -83,55 +91,16 @@ define(
expect(mockScope.textValue).toEqual("1977-05-25 17:30:00");
});
describe("when valid text is entered", function () {
var newText;
beforeEach(function () {
newText = "1977-05-25 17:30:00";
mockScope.textValue = newText;
fireWatch("textValue", newText);
});
it("updates models from user-entered text", function () {
expect(mockScope.ngModel.testField)
.toEqual(mockFormat.parse(newText));
expect(mockScope.textInvalid).toBeFalsy();
});
it("does not indicate a blur event", function () {
expect(mockScope.ngBlur).not.toHaveBeenCalled();
});
});
describe("when a date is chosen via the date picker", function () {
var newValue;
beforeEach(function () {
newValue = 12345654321;
mockScope.pickerModel.value = newValue;
fireWatch("pickerModel.value", newValue);
});
it("updates models", function () {
expect(mockScope.ngModel.testField).toEqual(newValue);
});
it("fires a blur event", function () {
expect(mockScope.ngBlur).toHaveBeenCalled();
});
});
it("exposes toggle state for date-time picker", function () {
expect(mockScope.picker.active).toBe(false);
});
describe("when user input is invalid", function () {
var newText, oldText, oldValue;
var newText, oldValue;
beforeEach(function () {
newText = "Not a date";
oldValue = mockScope.ngModel.testField;
oldText = mockScope.textValue;
mockScope.textValue = newText;
fireWatch("textValue", newText);
});
@@ -147,11 +116,6 @@ define(
it("does not modify user input", function () {
expect(mockScope.textValue).toEqual(newText);
});
it("restores valid text values on request", function () {
mockScope.restoreTextValue();
expect(mockScope.textValue).toEqual(oldText);
});
});
it("does not modify valid but irregular user input", function () {

View File

@@ -22,8 +22,8 @@
/*global define,Promise,describe,it,expect,beforeEach,waitsFor,jasmine*/
define(
["../../src/controllers/DateTimePickerController", "moment"],
function (DateTimePickerController, moment) {
["../../src/controllers/DateTimePickerController"],
function (DateTimePickerController) {
"use strict";
describe("The DateTimePickerController", function () {
@@ -39,14 +39,6 @@ define(
});
}
function fireWatchCollection(expr, value) {
mockScope.$watchCollection.calls.forEach(function (call) {
if (call.args[0] === expr) {
call.args[1](value);
}
});
}
beforeEach(function () {
mockScope = jasmine.createSpyObj(
"$scope",
@@ -65,131 +57,6 @@ define(
);
});
it("updates value in model when values in scope change", function () {
mockScope.date = {
year: 1998,
month: 0,
day: 6
};
mockScope.time = {
hours: 12,
minutes: 34,
seconds: 56
};
fireWatchCollection("date", mockScope.date);
expect(mockScope.ngModel[mockScope.field])
.toEqual(moment.utc("1998-01-06 12:34:56").valueOf());
});
describe("once initialized with model state", function () {
var testTime = moment.utc("1998-01-06 12:34:56").valueOf();
beforeEach(function () {
fireWatch("ngModel[field]", testTime);
});
it("exposes date/time values in scope", function () {
expect(mockScope.date.year).toEqual(1998);
expect(mockScope.date.month).toEqual(0); // Months are zero-indexed
expect(mockScope.date.day).toEqual(6);
expect(mockScope.time.hours).toEqual(12);
expect(mockScope.time.minutes).toEqual(34);
expect(mockScope.time.seconds).toEqual(56);
});
it("provides names for time properties", function () {
Object.keys(mockScope.time).forEach(function (key) {
expect(mockScope.nameFor(key))
.toEqual(jasmine.any(String));
});
});
it("provides options for time properties", function () {
Object.keys(mockScope.time).forEach(function (key) {
expect(mockScope.optionsFor(key))
.toEqual(jasmine.any(Array));
});
});
it("exposes times to populate calendar as a table", function () {
// Verify that data structure is as expected by template
expect(mockScope.table).toEqual(jasmine.any(Array));
expect(mockScope.table[0]).toEqual(jasmine.any(Array));
expect(mockScope.table[0][0]).toEqual({
year: jasmine.any(Number),
month: jasmine.any(Number),
day: jasmine.any(Number),
dayOfYear: jasmine.any(Number)
});
});
it("contains the current date in its initial table", function () {
var matchingCell;
// Should be able to find the selected date
mockScope.table.forEach(function (row) {
row.forEach(function (cell) {
if (cell.dayOfYear === 6) {
matchingCell = cell;
}
});
});
expect(matchingCell).toEqual({
year: 1998,
month: 0,
day: 6,
dayOfYear: 6
});
});
it("allows the displayed month to be advanced", function () {
// Around the edges of the displayed calendar we
// may be in previous or subsequent month, so
// test around the middle.
var i, originalMonth = mockScope.table[2][0].month;
function mod12(month) {
return ((month % 12) + 12) % 12;
}
for (i = 1; i <= 12; i += 1) {
mockScope.changeMonth(1);
expect(mockScope.table[2][0].month)
.toEqual(mod12(originalMonth + i));
}
for (i = 11; i >= -12; i -= 1) {
mockScope.changeMonth(-1);
expect(mockScope.table[2][0].month)
.toEqual(mod12(originalMonth + i));
}
});
it("allows checking if a cell is in the current month", function () {
expect(mockScope.isInCurrentMonth(mockScope.table[2][0]))
.toBe(true);
});
it("allows cells to be selected", function () {
mockScope.select(mockScope.table[2][0]);
expect(mockScope.isSelected(mockScope.table[2][0]))
.toBe(true);
mockScope.select(mockScope.table[2][1]);
expect(mockScope.isSelected(mockScope.table[2][0]))
.toBe(false);
expect(mockScope.isSelected(mockScope.table[2][1]))
.toBe(true);
});
it("allows cells to be compared", function () {
var table = mockScope.table;
expect(mockScope.dateEquals(table[2][0], table[2][1]))
.toBe(false);
expect(mockScope.dateEquals(table[2][1], table[2][1]))
.toBe(true);
});
});
});
}

View File

@@ -0,0 +1,74 @@
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web 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 Web 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,Promise,describe,it,expect,beforeEach,waitsFor,jasmine*/
define(
["../../src/controllers/SplitPaneController"],
function (SplitPaneController) {
"use strict";
describe("The split pane controller", function () {
var controller;
beforeEach(function () {
controller = new SplitPaneController();
});
it("has an initial position", function () {
expect(controller.state() > 0).toBeTruthy();
});
it("can be moved", function () {
var initialState = controller.state();
controller.startMove();
controller.move(50);
expect(controller.state()).toEqual(initialState + 50);
});
it("clamps its position", function () {
var initialState = controller.state();
controller.startMove();
// Move some really extreme number
controller.move(-100000);
// Shouldn't have moved below 0...
expect(controller.state() > 0).toBeTruthy();
// ...but should have moved left somewhere
expect(controller.state() < initialState).toBeTruthy();
// Then do the same to the right
controller.move(100000);
// Shouldn't have moved below 0...
expect(controller.state() < 100000).toBeTruthy();
// ...but should have moved left somewhere
expect(controller.state() > initialState).toBeTruthy();
});
it("accepts a default state", function () {
// Should use default state the first time...
expect(controller.state(12321)).toEqual(12321);
// ...but not after it's been initialized
expect(controller.state(42)).toEqual(12321);
});
});
}
);

View File

@@ -91,39 +91,6 @@ define(
.toHaveBeenCalledWith("ngModel", jasmine.any(Function));
});
describe("when changes are made via form entry", function () {
beforeEach(function () {
mockScope.ngModel = {
outer: { start: DAY * 2, end: DAY * 3 },
inner: { start: DAY * 2.25, end: DAY * 2.75 }
};
mockScope.formModel = {
start: DAY * 10000,
end: DAY * 11000
};
// These watches may not exist, but Angular would fire
// them if they did.
fireWatchCollection("formModel", mockScope.formModel);
fireWatch("formModel.start", mockScope.formModel.start);
fireWatch("formModel.end", mockScope.formModel.end);
});
it("does not immediately make changes to the model", function () {
expect(mockScope.ngModel.outer.start)
.not.toEqual(mockScope.formModel.start);
expect(mockScope.ngModel.outer.end)
.not.toEqual(mockScope.formModel.end);
});
it("updates model bounds on request", function () {
mockScope.updateBoundsFromForm();
expect(mockScope.ngModel.outer.start)
.toEqual(mockScope.formModel.start);
expect(mockScope.ngModel.outer.end)
.toEqual(mockScope.formModel.end);
});
});
describe("when dragged", function () {
beforeEach(function () {
mockScope.ngModel = {

View File

@@ -34,14 +34,14 @@ define(
mockElement,
testAttrs,
mockBody,
mockPlainEl,
mockParentEl,
testRect,
mctClickElsewhere;
function testEvent(x, y) {
return {
clientX: x,
clientY: y,
pageX: x,
pageY: y,
preventDefault: jasmine.createSpy("preventDefault")
};
}
@@ -55,8 +55,8 @@ define(
jasmine.createSpyObj("element", JQLITE_METHODS);
mockBody =
jasmine.createSpyObj("body", JQLITE_METHODS);
mockPlainEl =
jasmine.createSpyObj("htmlElement", ["getBoundingClientRect"]);
mockParentEl =
jasmine.createSpyObj("parent", ["getBoundingClientRect"]);
testAttrs = {
mctClickElsewhere: "some Angular expression"
@@ -67,8 +67,6 @@ define(
width: 60,
height: 75
};
mockElement[0] = mockPlainEl;
mockPlainEl.getBoundingClientRect.andReturn(testRect);
mockDocument.find.andReturn(mockBody);
@@ -80,49 +78,6 @@ define(
expect(mctClickElsewhere.restrict).toEqual("A");
});
it("detaches listeners when destroyed", function () {
expect(mockBody.off).not.toHaveBeenCalled();
mockScope.$on.calls.forEach(function (call) {
if (call.args[0] === '$destroy') {
call.args[1]();
}
});
expect(mockBody.off).toHaveBeenCalled();
expect(mockBody.off.mostRecentCall.args)
.toEqual(mockBody.on.mostRecentCall.args);
});
it("listens for mousedown on the document's body", function () {
expect(mockBody.on)
.toHaveBeenCalledWith('mousedown', jasmine.any(Function));
});
describe("when a click occurs outside the element's bounds", function () {
beforeEach(function () {
mockBody.on.mostRecentCall.args[1](testEvent(
testRect.left + testRect.width + 10,
testRect.top + testRect.height + 10
));
});
it("triggers an evaluation of its related Angular expression", function () {
expect(mockScope.$eval)
.toHaveBeenCalledWith(testAttrs.mctClickElsewhere);
});
});
describe("when a click occurs within the element's bounds", function () {
beforeEach(function () {
mockBody.on.mostRecentCall.args[1](testEvent(
testRect.left + testRect.width / 2,
testRect.top + testRect.height / 2
));
});
it("triggers no evaluation", function () {
expect(mockScope.$eval).not.toHaveBeenCalled();
});
});
});
}

View File

@@ -1,208 +0,0 @@
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web 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 Web 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,Promise,describe,it,expect,beforeEach,waitsFor,jasmine*/
define(
["../../src/directives/MCTSplitPane"],
function (MCTSplitPane) {
'use strict';
var JQLITE_METHODS = [
'on',
'addClass',
'children',
'eq',
'toggleClass',
'css'
];
describe("The mct-split-pane directive", function () {
var mockParse,
mockLog,
mockInterval,
mockParsed,
mctSplitPane;
beforeEach(function () {
mockParse = jasmine.createSpy('$parse');
mockLog =
jasmine.createSpyObj('$log', ['warn', 'info', 'debug']);
mockInterval = jasmine.createSpy('$interval');
mockInterval.cancel = jasmine.createSpy('mockCancel');
mockParsed = jasmine.createSpy('parsed');
mockParsed.assign = jasmine.createSpy('assign');
mockParse.andReturn(mockParsed);
mctSplitPane = new MCTSplitPane(
mockParse,
mockLog,
mockInterval
);
});
it("is only applicable as an element", function () {
expect(mctSplitPane.restrict).toEqual("E");
});
describe("when its controller is applied", function () {
var mockScope,
mockElement,
testAttrs,
mockChildren,
mockFirstPane,
mockSplitter,
mockSecondPane,
controller;
function fireOn(eventType) {
mockScope.$on.calls.forEach(function (call) {
if (call.args[0] === eventType) {
call.args[1]();
}
});
}
beforeEach(function () {
mockScope =
jasmine.createSpyObj('$scope', ['$apply', '$watch', '$on']);
mockElement =
jasmine.createSpyObj('element', JQLITE_METHODS);
testAttrs = {};
mockChildren =
jasmine.createSpyObj('children', JQLITE_METHODS);
mockFirstPane =
jasmine.createSpyObj('firstPane', JQLITE_METHODS);
mockSplitter =
jasmine.createSpyObj('splitter', JQLITE_METHODS);
mockSecondPane =
jasmine.createSpyObj('secondPane', JQLITE_METHODS);
mockElement.children.andReturn(mockChildren);
mockElement[0] = {
offsetWidth: 12321,
offsetHeight: 45654
};
mockChildren.eq.andCallFake(function (i) {
return [mockFirstPane, mockSplitter, mockSecondPane][i];
});
mockFirstPane[0] = { offsetWidth: 123, offsetHeight: 456 };
mockSplitter[0] = {
nodeName: 'mct-splitter',
offsetWidth: 10,
offsetHeight: 456
};
mockSecondPane[0] = { offsetWidth: 10, offsetHeight: 456 };
mockChildren[0] = mockFirstPane[0];
mockChildren[1] = mockSplitter[0];
mockChildren[3] = mockSecondPane[0];
mockChildren.length = 3;
controller = mctSplitPane.controller[3](
mockScope,
mockElement,
testAttrs
);
});
it("sets an interval which does not trigger digests", function () {
expect(mockInterval.mostRecentCall.args[3]).toBe(false);
});
it("exposes its splitter's initial position", function () {
expect(controller.position()).toEqual(
mockFirstPane[0].offsetWidth + mockSplitter[0].offsetWidth
);
});
it("exposes the current anchoring mode", function () {
expect(controller.anchor()).toEqual({
edge : 'left',
opposite : 'right',
dimension : 'width',
orientation : 'vertical'
});
});
it("allows classes to be toggled on contained elements", function () {
controller.toggleClass('resizing');
expect(mockChildren.toggleClass)
.toHaveBeenCalledWith('resizing');
});
it("allows positions to be set", function () {
var testValue = mockChildren[0].offsetWidth + 50;
controller.position(testValue);
expect(mockFirstPane.css).toHaveBeenCalledWith(
'width',
(testValue - mockSplitter[0].offsetWidth) + 'px'
);
});
it("issues no warnings under nominal usage", function () {
expect(mockLog.warn).not.toHaveBeenCalled();
});
it("warns if no mct-splitter is present", function () {
mockSplitter[0].nodeName = "not-mct-splitter";
controller = mctSplitPane.controller[3](
mockScope,
mockElement,
testAttrs
);
expect(mockLog.warn).toHaveBeenCalled();
});
it("warns if an unknown anchor key is given", function () {
testAttrs.anchor = "middle";
controller = mctSplitPane.controller[3](
mockScope,
mockElement,
testAttrs
);
expect(mockLog.warn).toHaveBeenCalled();
});
it("updates positions on a timer", function () {
mockFirstPane[0].offsetWidth += 100;
// Should not reflect the change yet
expect(controller.position()).not.toEqual(
mockFirstPane[0].offsetWidth + mockSplitter[0].offsetWidth
);
mockInterval.mostRecentCall.args[0]();
expect(controller.position()).toEqual(
mockFirstPane[0].offsetWidth + mockSplitter[0].offsetWidth
);
});
it("cancels the active interval when scope is destroyed", function () {
expect(mockInterval.cancel).not.toHaveBeenCalled();
fireOn('$destroy');
expect(mockInterval.cancel).toHaveBeenCalled();
});
});
});
}
);

View File

@@ -1,113 +0,0 @@
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web 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 Web 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,Promise,describe,it,expect,beforeEach,waitsFor,jasmine*/
define(
["../../src/directives/MCTSplitter"],
function (MCTSplitter) {
'use strict';
describe("The mct-splitter directive", function () {
var mctSplitter;
beforeEach(function () {
mctSplitter = new MCTSplitter();
});
it("is applicable to elements", function () {
expect(mctSplitter.restrict).toEqual("E");
});
it("depends on the mct-split-pane controller", function () {
expect(mctSplitter.require).toEqual("^mctSplitPane");
});
describe("when linked", function () {
var mockScope,
mockElement,
testAttrs,
mockSplitPane;
beforeEach(function () {
mockScope = jasmine.createSpyObj(
'$scope',
[ '$on', '$watch' ]
);
mockElement = jasmine.createSpyObj(
'element',
[ 'addClass' ]
);
testAttrs = {};
mockSplitPane = jasmine.createSpyObj(
'mctSplitPane',
[ 'position', 'toggleClass', 'anchor' ]
);
mctSplitter.link(
mockScope,
mockElement,
testAttrs,
mockSplitPane
);
});
it("adds a splitter class", function () {
expect(mockElement.addClass)
.toHaveBeenCalledWith('splitter');
});
describe("and then manipulated", function () {
var testPosition;
beforeEach(function () {
testPosition = 12321;
mockSplitPane.position.andReturn(testPosition);
mockSplitPane.anchor.andReturn({
orientation: 'vertical',
reversed: false
});
mockScope.splitter.startMove();
});
it("adds a 'resizing' class", function () {
expect(mockSplitPane.toggleClass)
.toHaveBeenCalledWith('resizing');
});
it("repositions during drag", function () {
mockScope.splitter.move([ 10, 0 ]);
expect(mockSplitPane.position)
.toHaveBeenCalledWith(testPosition + 10);
});
it("removes the 'resizing' class when finished", function () {
mockSplitPane.toggleClass.reset();
mockScope.splitter.endMove();
expect(mockSplitPane.toggleClass)
.toHaveBeenCalledWith('resizing');
});
});
});
});
}
);

View File

@@ -8,6 +8,7 @@
"controllers/GetterSetterController",
"controllers/ObjectInspectorController",
"controllers/SelectorController",
"controllers/SplitPaneController",
"controllers/TimeRangeController",
"controllers/ToggleController",
"controllers/TreeNodeController",
@@ -18,11 +19,8 @@
"directives/MCTPopup",
"directives/MCTResize",
"directives/MCTScroll",
"directives/MCTSplitPane",
"directives/MCTSplitter",
"services/Popup",
"services/PopupService",
"services/UrlService",
"StyleSheetLoader",
"UnsupportedBrowserWarning"
"StyleSheetLoader"
]

Some files were not shown because too many files have changed in this diff Show More