Compare commits

...

72 Commits

Author SHA1 Message Date
slhale
cebdf24666 [Plot] Only highlight legend if multiple
Legend items will only be highlighted when
selected for inspection if there are more
than one legend item in the plot.
2015-08-28 16:22:07 -07:00
slhale
15152d26f8 [Inspector] Tree expansion does not inspect
Changed the ng-click location on the tree
node so that expanding a folder or other tree
node does not inspect that object. Clicking
on the label still inspects it though.
2015-08-28 16:14:53 -07:00
slhale
50c08a15d6 [Inspector] Inspection of Library and Elements
In edit mode, the user can now use the object
inspector to inspect the objects contained
within the Library and Elements panes.
2015-08-28 11:50:16 -07:00
slhale
8f40d7d9ee [Inspector] Inspect any descendent of layout
Clicking on any subelement of the layout,
indluding sub-sub-elements and so on, will
now inspect that element.
2015-08-28 11:33:10 -07:00
slhale
38b09fbeb1 [Inspector] Inspect subelements of layout
Clicking on something inside of a layout
both in browse and edit mode should set
that object to be inspected.
2015-08-28 11:20:06 -07:00
slhale
455f4b6bdb [Inspection] Add object inspector to edit mode
Added an additional right pane to edit mode for
the object inspector. Info of the editing object
is displayed by default. If plot legends are
clicked, those are inspected the same as in
browse mode.
2015-08-28 10:59:51 -07:00
slhale
b0b87d7fd9 [Inspector] Update controller and its tests
Update ObjectInspectorController to first look at
ngModel.inspectionObjects before defaulting back
to ngModel.selectedObject
Updated tests accordingly.
2015-08-28 10:31:44 -07:00
slhale
8c811c4a22 [Inspector] Change how inspection objects are changed
Instead of resetting the inspection objects
when a treenode is clicked, it is changed when
the view changes.
2015-08-27 16:53:13 -07:00
slhale
f1bf88fac4 [Inspector] Reorganization of scss files
Split the inspector styling out of the general
panes styling. Moved files into more appropriate
folders.
2015-08-27 16:41:11 -07:00
slhale
cf421f8b9a [Plot] Cleanup
Remove console.log statements.
Check for array existence before pushing.
2015-08-27 16:34:03 -07:00
slhale
953bd9d8fc [Inspector] Inform user of multiple selection
The object inspector now displays how many
selected items there are if there are more
than one.
2015-08-27 16:31:42 -07:00
slhale
95791d5c3a [Inspector] Select domainObject with title
The inspector object array can be reset to the
domain object by clicking the title header.
2015-08-27 16:28:13 -07:00
slhale
30cd3d0074 [Plot] Legend item selection style
Some better styling for selected legend items.
Renamed inspector/_inspector.scss to
inspector/_plot.scss to better reflect content
of the file.
2015-08-27 16:16:22 -07:00
slhale
cd4bc6c3b4 [Inspector] Update font symbols 2015-08-27 15:51:27 -07:00
slhale
4de8d91890 [Inspector] Multiple selection of plot legend items
Can now shift-click to add more than one
object to the inspector array. Does not
yet reflect in inspector itself.
2015-08-27 12:35:50 -07:00
slhale
1dd3d5214d [Plot] Highlight inspected plot legend items
Plot legend items that are being selected for
inspection are now highligted.
2015-08-27 12:10:13 -07:00
slhale
bcf6bbf627 [Inspector] Lay groundwork for multiple selection
Created a new ngModel property for inspection
which is an array. Currently the array only
holds one object at a time, but it can be
expanded in the future.
2015-08-27 11:28:27 -07:00
slhale
01f5a4886b [Plot] Make plot legend items clickable
Clicking on a plot legend item now selects
that object. Currently that means that the
view is switched to that object. (Therefore
this only has an effect on telemetry panel
plots.)
2015-08-27 11:02:40 -07:00
slhale
815b8e040e [Inspector] Merge paneModel and treeModel
Use the treeModel for what the paneModel was
previously being used for. None of the
property names conflict. This allows the
right pane to access the treeModel info.
2015-08-27 10:49:57 -07:00
slhale
a957f87f61 Merge branch 'master' into inspector 2015-08-27 10:40:43 -07:00
slhale
7b9a886beb [Inspector] Cleanup
Some more undefined checking. Changed unnecissary scope
variable into a regular one.
2015-08-26 16:31:02 -07:00
slhale
7a69bffb4a [Inspector] Add test
Added a test to the browse object controller to
regain 100% coverage. Tests initilization of
ngModel properties. #73.
2015-08-26 10:51:34 -07:00
slhale
05fb7173aa [Inpsector] Inspector icon
Change from gear to info icon. #73.
2015-08-26 10:44:11 -07:00
slhale
57d1876dd8 [Inspector] Fix inspector pane transition
Changed the pane transition so that on
pane open the inspector becomes invisible
after the pane starts opening. #73.
2015-08-26 10:43:03 -07:00
slhale
7119f6f3a1 [Inspector] Splitter drag temporarily removes transition
Dragging mct-splitter will remove a 'slide'
class from the splitter's sibling while a
drag is in process, and then replace the
'slide' class. This allows the left and right
panes to have slide transitions for open/close,
but not when the splitter is being dragged. #73.
2015-08-26 10:23:18 -07:00
slhale
86d398d8ff [Inspector] Fix location label text
Fixed the location object labels so that their
overflow text properly gets hidden, and so that
the direction arrows are aligned with the
labels. #73.
2015-08-25 16:30:57 -07:00
slhale
5cc634e946 Merge branch 'open72' into open73
Conflicts:
	platform/commonUI/general/res/css/theme-espresso.css
2015-08-25 15:02:57 -07:00
slhale
7e837c266d Merge branch 'master' of https://github.com/nasa/openmctweb into open73
Conflicts:
	platform/commonUI/browse/res/templates/browse.html
2015-08-25 14:59:13 -07:00
slhale
cd204af71c [Treeview] Compatability with search
Update to hide search bar when the pane is
closed. #72.
2015-08-25 14:55:23 -07:00
slhale
4e9348cb28 Merge branch 'master' of https://github.com/nasa/openmctweb into open72
Conflicts:
	platform/commonUI/browse/res/templates/browse.html
2015-08-25 14:52:51 -07:00
slhale
c4de3505b9 [Inspector] Location horizontal overflow
Modified location labels to have cut-off text
be indicated by ellipses when the inspection
pane width is small. #73.
2015-08-25 14:30:42 -07:00
slhale
c3e5fbf713 [Inspector] Location does not include self
Changed the object inspector's location getting
to not include the object itself in the
location, just its ancestors. #73.
2015-08-25 13:06:15 -07:00
slhale
5080b5296e [Inspector] Consistent link and nonlink style
Changed stlying on the labels for parent
lists to have more consistent styling
between the link and nonlink parents. #73.
2015-08-25 11:14:41 -07:00
slhale
7a7cabedcc [Inspector] Add hovertext and scrolling
Made the inspector capable of scrolling.
Added hovertext to the contextual and
primary location sections for some
clarification. #73.
2015-08-25 10:18:31 -07:00
slhale
33d88ecce0 [Inspector] Update tests
Updated the object inspector controller spec to test
for the different types of locations. #73.
2015-08-24 16:16:15 -07:00
slhale
70324a2198 [Inspector] Separate primary and contextual locations
The object inspector now finds both the contextual
location of the link and the primary location of
the original, if the selected object is a link. #73.
2015-08-24 15:49:57 -07:00
slhale
41198627c3 Merge branch 'master' of https://github.com/nasa/openmctweb into open72
Conflicts:
	platform/commonUI/general/res/css/theme-espresso.css
2015-08-24 13:08:48 -07:00
slhale
454b96c3c9 Merge branch 'master' of https://github.com/nasa/openmctweb into open73
Conflicts:
	platform/commonUI/general/res/css/theme-espresso.css
2015-08-24 13:06:44 -07:00
slhale
b8eaea5624 [Inspector] Add tests
Added tests for the object inspector controller.
Removed unused objectService dependency. #73.
2015-08-24 13:01:38 -07:00
slhale
d5062c74a2 [Inspector] Stlying tweak
Made titles taller so that they weren't
squished with the data.
2015-08-24 12:35:13 -07:00
slhale
d877ee3ce3 [Inspector] Use metadata capability
Instead of manually getting each entry for
the object inspector, just get the selected
object's metadata capability.
Still need to manually get the parents. #73.
2015-08-24 12:32:31 -07:00
slhale
57e3c2554d [Inspector] Pane tab button tweaks
Changed size and position slightly. Icon when
closed different.
2015-08-24 10:57:50 -07:00
slhale
67e57081f4 [Inspector] Right pane transition
Created the sliding transition for when the
object inspector pane opens or closes.
2015-08-24 10:47:14 -07:00
slhale
7715acd4d4 [Inspector] Right pane opens and closes
Added collapser button to open and close
the right pane holding the object inspector.
2015-08-24 10:24:35 -07:00
slhale
e53c419e87 [Inspector] Add shadow to link icon 2015-08-24 09:38:35 -07:00
slhale
6e8dcc6ab8 [Inspector] Fix location label heights
Made it so that the last element of the location
does not get misaligned.
Also changed the element background highlighting
and arrow size.
2015-08-24 09:26:39 -07:00
slhale
bbcb0e15c9 [Inspector] Location in tree
Added a 'location' section for the inspector panel. Its
elements are clickable labels. #73.
2015-08-21 13:19:49 -07:00
slhale
7b5f07ae45 [Inspector] Inspector style
Added stlying to the inspector. Still need to find
proper icon. #73.
2015-08-20 16:52:21 -07:00
slhale
3343475973 [Inspector] Add mct-object-inspector representation
Still having some styling issues though.
2015-08-20 16:01:08 -07:00
slhale
71207d643a [Inspector] Left pane close works again
Moved ng-class up to a parent so that the
left position would be correct relative to
the left split overall. #73.
2015-08-20 15:21:14 -07:00
slhale
d9a65a1844 [Inspector] Add right pane
Added a right pane to the page. This was done by
putting an mct-split-pane nested inside of the
existsing mct-split-pane. #73.
2015-08-20 15:11:16 -07:00
slhale
32c7cc2424 [Treeview] Cleanup order
Rearrange the sass so that classes appear in the
order that they appear in browse.html, with
correct nesting as well.
No changes to the actual UI from this.
2015-08-20 14:51:32 -07:00
slhale
dcfcfa74bb Merge branch 'master' of https://github.com/nasa/openmctweb into open72
Conflicts:
	platform/commonUI/general/res/css/theme-espresso.css
2015-08-20 13:25:39 -07:00
slhale
79529e4879 [Treeview] Open in new tab settings
When an object is opened in a new tab, the left
pane will be closed by default. Otherwise it will
be open by default. #72.
2015-08-20 13:14:57 -07:00
slhale
503c8e2f03 [Treeview] Collapse button styling
Changed color to better match topbar buttons.
Icon changes direction when pane is open vs
closed.
2015-08-20 13:02:40 -07:00
slhale
570e0f31b2 [Treeview] Rename layout to pane
To better reflect what the file is modifying
2015-08-20 12:05:48 -07:00
slhale
83c86c748c [Treeview] Remove unnecissary file
_splitter.scss merged into _layout.scss, within the
tree folder
2015-08-20 11:59:03 -07:00
slhale
4b3ca316e1 [Treeview] Update tests
For the existence of ngModel
2015-08-20 11:50:44 -07:00
slhale
3f7b874b38 [Treeview] Remove console.log 2015-08-20 11:47:16 -07:00
slhale
ed96889fce [Treeview] Fix splitter bar movement
Fixed the splitter bar so that it is now
draggable again.
2015-08-20 11:25:11 -07:00
slhale
d2bc8227c7 [Treeview] Create button and slide transition
Made the create button visible when the left
pane is closed. Added a transition between
opening and closing the pane.
2015-08-20 10:41:30 -07:00
slhale
81ece1190e [Treeview] Collapse button styling
Made smaller, with flat left side.
2015-08-20 09:19:09 -07:00
slhale
62f7ca5a0a [Treeview] Treeview collapse toggle
Clicking on the pane tab now toggles the
treeview.
2015-08-19 16:57:11 -07:00
slhale
29b1cfa890 [Treeview] Rename variable for clarity
paneModel's pane to leftPane, for clarity
once a right pane is added.
2015-08-19 16:47:12 -07:00
slhale
e44e50823e [Treeview] Treeview collapse
Clicking on the pane tab now will make the treeview
invisible, and set the width to 0. BUT, this does
not immediately move the splitter bar, though it
does go to the correct width if clicked.
Needs more work.
2015-08-19 16:44:42 -07:00
slhale
4a730f875f [Treeview] Clicking toggles model property
Clicking on the pane tab icon toggles ngModel.pane
2015-08-19 16:29:55 -07:00
slhale
8108a3b81c [Treeview] Html style 2015-08-19 16:02:49 -07:00
slhale
b8958edf72 [Treeview] Fixing errors, commits 2015-08-19 16:00:51 -07:00
slhale
2b00b71da9 [Treeview] Error fixing
Trying to get mctSplitter error to be fixed.
Reverting to an extent.
2015-08-19 15:45:17 -07:00
slhale
9c912b62d3 [Treeview] Modified left splitter
Added a 'button' (which does not work yet). It
sticks out of the splitter like a tab.
2015-08-19 15:08:27 -07:00
slhale
ffd80ed42b [Treeview] Style
Changed indentation in the html
2015-08-19 13:12:37 -07:00
slhale
8dad6a3fd5 Merge browse files from branch 'mobile' into open72 2015-08-19 13:04:11 -07:00
32 changed files with 1279 additions and 88 deletions

View File

@@ -21,7 +21,7 @@
{
"key": "BrowseObjectController",
"implementation": "BrowseObjectController.js",
"depends": [ "$scope", "$location", "$route" ]
"depends": [ "$scope", "$location", "$route", "$window" ]
},
{
"key": "CreateMenuController",

View File

@@ -20,7 +20,15 @@
at runtime from the About dialog for additional information.
-->
<span ng-controller="BrowseObjectController">
<div class="object-browse-bar bar abs">
<div class="object-browse-bar bar abs"
ng-click="ngModel.inspectionObjects = [domainObject]">
<div class="pane-tabs left"
ng-class="{inactivePane: !ngModel.leftPane, activePane: ngModel.leftPane}"
ng-click="ngModel.leftPane = !ngModel.leftPane">
</div>
<div class="items-select left abs">
<mct-representation key="'object-header'" mct-object="domainObject">
</mct-representation>
@@ -37,11 +45,19 @@
ng-model="representation">
</mct-representation>
</div>
<div class="pane-tabs right"
ng-class="{inactivePane: !ngModel.rightPane, activePane: ngModel.rightPane}"
ng-click="ngModel.rightPane = !ngModel.rightPane">
</div>
</div>
<div class='object-holder abs vscroll'>
<mct-representation key="representation.selected.key"
mct-object="representation.selected.key && domainObject">
mct-object="representation.selected.key && domainObject"
ng-model="ngModel">
</mct-representation>
</div>
</span>

View File

@@ -19,15 +19,26 @@
this source code distribution or the Licensing information page available
at runtime from the About dialog for additional information.
-->
<div content="jquery-wrapper" class="abs holder-all browse-mode">
<mct-include key="'topbar-browse'"></mct-include>
<div class="holder browse-area s-browse-area abs" ng-controller="BrowseController">
<mct-split-pane class='contents abs' anchor='left'>
<div
class='split-pane-component treeview pane left'
>
<mct-representation key="'create-button'" mct-object="navigatedObject">
<div content="jquery-wrapper"
class="abs holder-all browse-mode">
<mct-include key="'topbar-browse'">
</mct-include>
<div class="holder browse-area s-browse-area abs"
ng-controller="BrowseController">
<mct-split-pane class='contents abs'
anchor='left'>
<div class='split-pane-component treeview pane left'
ng-class='{inactive: !treeModel.leftPane}'>
<mct-representation key="'create-button'"
mct-object="navigatedObject"
ng-model="treeModel">
</mct-representation>
<div class='holder search-holder abs'
ng-class="{active: treeModel.search}">
<mct-representation key="'search'"
@@ -35,6 +46,7 @@
ng-model="treeModel">
</mct-representation>
</div>
<div class='holder tree-holder abs'
ng-hide="treeModel.search">
<mct-representation key="'tree'"
@@ -43,14 +55,48 @@
</mct-representation>
</div>
</div>
<mct-splitter></mct-splitter>
<div class='split-pane-component items pane'>
<div class='holder abs' id='content-area'>
<mct-representation mct-object="navigatedObject" key="'browse-object'">
</mct-representation>
</div>
<mct-splitter class="splitter-bar left"
ng-class="{inactive: !treeModel.leftPane}">
</mct-splitter>
<div class='split-pane-component secondary-split pane right slide'
ng-class='{leftInactive: !treeModel.leftPane}'>
<mct-split-pane class='contents abs'
anchor='right'>
<div class='split-pane-component items pane slide'
ng-class='{rightInactive: !treeModel.rightPane}'>
<div class='holder abs'
id='content-area'>
<mct-representation key="'browse-object'"
mct-object="navigatedObject"
ng-model="treeModel">
</mct-representation>
</div>
</div>
<mct-splitter class="splitter-bar right"
ng-class="{inactive: !treeModel.rightPane}">
</mct-splitter>
<div class='split-pane-component object-inspector pane right'
ng-class='{inactive: !treeModel.rightPane}'>
<div class='holder inspector-holder abs'>
<mct-representation key="'object-inspector'"
mct-object="domainObject"
ng-model="treeModel">
</mct-representation>
</div>
</div>
</mct-split-pane>
</div>
</mct-split-pane>
</div>
<mct-include key="'bottombar'"></mct-include>
<mct-include key="'bottombar'">
</mct-include>
</div>

View File

@@ -20,8 +20,10 @@
at runtime from the About dialog for additional information.
-->
<div class="menu-element wrapper" ng-controller="ClickAwayController as createController">
<div class="btn btn-menu create-btn major" ng-click="createController.toggle()">
Create
<div class="btn btn-menu create-btn major"
ng-class="{inactivePane: !ngModel.leftPane}"
ng-click="createController.toggle()">
<span>Create</span>
</div>
<div class="menu dropdown super-menu" ng-show="createController.isActive()">
<mct-representation mct-object="domainObject" key="'create-menu'">

View File

@@ -139,10 +139,14 @@ define(
});
// Provide a model for the tree to modify
// Also use this model for the left and right pane controlling
$scope.treeModel = {
selectedObject: navigationService.getNavigation()
};
// Create an array of objects which will allow for multiple selection
// for the object inspector.
$scope.inspectionObjects = [$scope.domainObject];
// Listen for changes in navigation state.
navigationService.addListener(setNavigation);
@@ -153,7 +157,6 @@ define(
$scope.$on("$destroy", function () {
navigationService.removeListener(setNavigation);
});
}
return BrowseController;

View File

@@ -32,10 +32,13 @@ define(
* @memberof platform/commonUI/browse
* @constructor
*/
function BrowseObjectController($scope, $location, $route) {
function BrowseObjectController($scope, $location, $route, $window) {
function setViewForDomainObject(domainObject) {
var locationViewKey = $location.search().view;
// Reset the inspection objects when we switch the view
$scope.ngModel.inspectionObjects = [$scope.domainObject];
function selectViewIfMatching(view) {
if (view.key === locationViewKey) {
$scope.representation = $scope.representation || {};
@@ -65,6 +68,19 @@ define(
}
}
// If there is a defined opener, assume that the window was opened
// by choosing 'Open in a new tab'
if ($window.opener) {
// The desired default for this is to have a closed left pane
$scope.ngModel.leftPane = false;
} else {
// Otherwise, start the application with an open left pane
$scope.ngModel.leftPane = true;
}
// The object inspector by default always starts closed
$scope.ngModel.rightPane = false;
$scope.$watch('domainObject', setViewForDomainObject);
$scope.$watch('representation.selected.key', updateQueryParam);
}

View File

@@ -54,6 +54,7 @@ define(
"$scope",
[ "$on", "$watch" ]
);
mockScope.ngModel = {};
mockRoute = { current: { params: {} } };
mockLocation = jasmine.createSpyObj(
"$location",

View File

@@ -31,6 +31,7 @@ define(
var mockScope,
mockLocation,
mockRoute,
mockWindow,
mockUnlisten,
controller;
@@ -48,7 +49,9 @@ define(
"$scope",
[ "$on", "$watch" ]
);
mockScope.ngModel = {};
mockRoute = { current: { params: {} } };
mockWindow = {};
mockLocation = jasmine.createSpyObj(
"$location",
[ "path", "search" ]
@@ -60,7 +63,8 @@ define(
controller = new BrowseObjectController(
mockScope,
mockLocation,
mockRoute
mockRoute,
mockWindow
);
});
@@ -97,7 +101,23 @@ define(
expect(mockScope.representation.selected)
.toEqual(testViews[1]);
});
it("sets ngModel properties on initialization", function () {
// Left pane open status depends on how the window was opened
// Case 1: undefined opener
expect(mockWindow.opener).not.toBeDefined();
expect(mockScope.ngModel.leftPane).toBeTruthy();
// Case 2: defined opener
mockWindow.opener = {};
controller = new BrowseObjectController(
mockScope,
mockLocation,
mockRoute,
mockWindow
);
expect(mockScope.ngModel.leftPane).toBeFalsy();
});
});
}
);

View File

@@ -21,49 +21,71 @@
-->
<mct-representation key="'topbar-edit'"
mct-object="domainObject"
ng-model="representation">
ng-model="representation"
ng-click="ngModel.inspectionObjects = [domainObject]">
</mct-representation>
<div class="holder edit-area abs">
<mct-split-pane class='contents abs' anchor='right'>
<div class='split-pane-component pane left edit-main'>
<mct-toolbar name="mctToolbar"
structure="toolbar.structure"
ng-model="toolbar.state">
</mct-toolbar>
<div class='holder abs object-holder work-area'>
<mct-representation key="representation.selected.key"
toolbar="toolbar"
mct-object="representation.selected.key && domainObject">
</mct-representation>
</div>
</div>
<mct-splitter></mct-splitter>
<div
class='split-pane-component pane right edit-objects menus-to-left'
ng-controller='EditPanesController as editPanes'
>
<mct-split-pane class='contents abs' anchor='bottom'>
<div
class="abs pane top accordion"
ng-controller="ToggleController as toggle"
>
<mct-container key="accordion" label="Library">
<mct-representation key="'tree'"
mct-object="editPanes.getRoot()">
<mct-split-pane class='contents abs'
anchor='right'>
<div class='split-pane-component secondary-split pane left'>
<mct-split-pane class='contents abs' anchor='right'>
<div class='split-pane-component pane left edit-main'>
<mct-toolbar name="mctToolbar"
structure="toolbar.structure"
ng-model="toolbar.state">
</mct-toolbar>
<div class='holder abs object-holder work-area'>
<mct-representation key="representation.selected.key"
toolbar="toolbar"
mct-object="representation.selected.key && domainObject"
ng-model="ngModel">
</mct-representation>
</mct-container>
</div>
</div>
<mct-splitter></mct-splitter>
<div
class="abs pane bottom accordion"
ng-controller="ToggleController as toggle"
class='split-pane-component pane right edit-objects menus-to-left'
ng-controller='EditPanesController as editPanes'
>
<mct-container key="accordion" label="Elements">
<mct-representation key="'edit-elements'" mct-object="domainObject">
</mct-representation>
</mct-container>
<mct-split-pane class='contents abs' anchor='bottom'>
<div
class="abs pane top accordion"
ng-controller="ToggleController as toggle"
>
<mct-container key="accordion" label="Library">
<mct-representation key="'tree'"
mct-object="editPanes.getRoot()"
ng-model="ngModel">
</mct-representation>
</mct-container>
</div>
<mct-splitter></mct-splitter>
<div
class="abs pane bottom accordion"
ng-controller="ToggleController as toggle"
>
<mct-container key="accordion" label="Elements">
<mct-representation key="'edit-elements'"
mct-object="domainObject"
ng-model="ngModel">
</mct-representation>
</mct-container>
</div>
</mct-split-pane>
</div>
</mct-split-pane>
</div>
<mct-splitter></mct-splitter>
<div class='split-pane-component object-inspector pane right'
ng-class='{inactive: !paneModel.rightPane}'>
<div class='holder inspector-holder abs'>
<mct-representation key="'object-inspector'"
mct-object="editPanes.getRoot()"
ng-model="ngModel">
</mct-representation>
</div>
</div>
</mct-split-pane>
</div>

View File

@@ -24,7 +24,9 @@
ng-controller="EditController as editMode"
mct-before-unload="editMode.getUnloadWarning()">
<mct-representation key="'edit-object'" mct-object="editMode.navigatedObject()">
<mct-representation key="'edit-object'"
mct-object="editMode.navigatedObject()"
ng-model="editModel">
</mct-representation>
<mct-include key="'bottombar'"></mct-include>

View File

@@ -24,7 +24,9 @@
<ul class="tree">
<li ng-repeat="containedObject in composition">
<span class="tree-item">
<mct-representation key="'label'" mct-object="containedObject">
<mct-representation key="'label'"
mct-object="containedObject"
ng-click="ngModel.inspectionObjects = [containedObject]">
</mct-representation>
</span>
</li>

View File

@@ -52,6 +52,12 @@ define(
$scope.$on("$destroy", function () {
navigationService.removeListener(setNavigation);
});
// Provide a model for edit mode
$scope.editModel = {
selectedObject: navigationService.getNavigation()
};
$scope.editModel.inspectionObjects = [$scope.editModel.selectedObject];
}
/**

View File

@@ -104,6 +104,11 @@
"key": "SelectorController",
"implementation": "controllers/SelectorController.js",
"depends": [ "objectService", "$scope" ]
},
{
"key": "ObjectInspectorController",
"implementation": "controllers/ObjectInspectorController.js",
"depends": [ "$scope", "objectService" ]
}
],
"directives": [
@@ -219,6 +224,10 @@
"key": "switcher",
"templateUrl": "templates/controls/switcher.html",
"uses": [ "view" ]
},
{
"key": "object-inspector",
"templateUrl": "templates/object-inspector.html"
}
],
"controls": [

View File

@@ -5139,3 +5139,276 @@ input[type="text"] {
.l-view-section label,
.l-view-section .inline-block {
display: inline-block; }
/*****************************************************************************
* 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.
*****************************************************************************/
/* line 31, ../sass/panes/_pane.scss */
.pane.left.inactive {
width: 0 !important;
min-width: 0 !important; }
/* line 36, ../sass/panes/_pane.scss */
.pane.left.inactive .tree-holder {
padding-right: 0; }
/* line 41, ../sass/panes/_pane.scss */
.pane.left.inactive .search-holder {
display: none; }
/* line 47, ../sass/panes/_pane.scss */
.pane.left .create-btn.major {
top: 0;
left: 0;
transition: all 0.35s; }
/* line 52, ../sass/panes/_pane.scss */
.pane.left .create-btn.major.inactivePane {
top: 0;
left: 0;
position: relative;
padding: 0;
text-align: center;
font-size: 12px;
width: 13px;
height: 16px;
line-height: 14px;
left: -11px;
top: 20px; }
/* line 70, ../sass/panes/_pane.scss */
.pane.left .create-btn.major.inactivePane span {
display: none; }
/* line 78, ../sass/panes/_pane.scss */
.splitter-bar.splitter {
opacity: 1;
transition: opacity 0.35s, visibility 0.35s;
top: 0; }
/* line 85, ../sass/panes/_pane.scss */
.splitter-bar.splitter.inactive {
visibility: hidden;
opacity: 0; }
/* line 89, ../sass/panes/_pane.scss */
.splitter-bar.splitter.inactive:before {
border-width: 0; }
/* line 97, ../sass/panes/_pane.scss */
.splitter-bar.left.splitter.inactive {
transition: opacity 0s, visibility 0s; }
/* line 106, ../sass/panes/_pane.scss */
.split-pane-component.secondary-split.pane.right.leftInactive {
left: 0 !important; }
/* line 109, ../sass/panes/_pane.scss */
.split-pane-component.secondary-split.pane.right.slide {
transition: left 0.35s; }
/* line 116, ../sass/panes/_pane.scss */
.split-pane-component.secondary-split.pane.right .split-pane-component.items.pane.rightInactive {
right: 0 !important; }
/* line 119, ../sass/panes/_pane.scss */
.split-pane-component.secondary-split.pane.right .split-pane-component.items.pane.slide {
transition: right 0.35s; }
/* line 124, ../sass/panes/_pane.scss */
.split-pane-component.secondary-split.pane.right .split-pane-component.items.pane .object-browse-bar {
position: relative; }
/* line 127, ../sass/panes/_pane.scss */
.split-pane-component.secondary-split.pane.right .split-pane-component.items.pane .object-browse-bar .pane-tabs {
position: relative;
cursor: pointer;
font-family: symbolsfont;
background-color: #595959;
width: 13px !important;
height: 16px;
line-height: 16px;
font-size: 10px;
text-align: center; }
/* line 141, ../sass/panes/_pane.scss */
.split-pane-component.secondary-split.pane.right .split-pane-component.items.pane .object-browse-bar .pane-tabs.left {
left: -12px;
top: 3px;
border-top-right-radius: 2px;
border-bottom-right-radius: 2px; }
/* line 149, ../sass/panes/_pane.scss */
.split-pane-component.secondary-split.pane.right .split-pane-component.items.pane .object-browse-bar .pane-tabs.left.inactivePane {
left: -15px; }
/* line 151, ../sass/panes/_pane.scss */
.split-pane-component.secondary-split.pane.right .split-pane-component.items.pane .object-browse-bar .pane-tabs.left.inactivePane:after {
content: 'F'; }
/* line 155, ../sass/panes/_pane.scss */
.split-pane-component.secondary-split.pane.right .split-pane-component.items.pane .object-browse-bar .pane-tabs.left.activePane:after {
content: '<'; }
/* line 161, ../sass/panes/_pane.scss */
.split-pane-component.secondary-split.pane.right .split-pane-component.items.pane .object-browse-bar .pane-tabs.right {
float: right;
right: -9px;
top: -13px;
border-top-left-radius: 2px;
border-bottom-left-radius: 2px; }
/* line 170, ../sass/panes/_pane.scss */
.split-pane-component.secondary-split.pane.right .split-pane-component.items.pane .object-browse-bar .pane-tabs.right.inactivePane {
right: -12px; }
/* line 172, ../sass/panes/_pane.scss */
.split-pane-component.secondary-split.pane.right .split-pane-component.items.pane .object-browse-bar .pane-tabs.right.inactivePane:after {
content: '\e608'; }
/* line 176, ../sass/panes/_pane.scss */
.split-pane-component.secondary-split.pane.right .split-pane-component.items.pane .object-browse-bar .pane-tabs.right.activePane:after {
content: '>'; }
/* line 184, ../sass/panes/_pane.scss */
.split-pane-component.secondary-split.pane.right .split-pane-component.items.pane .object-browse-bar .items-select {
margin-left: 10px; }
/* line 188, ../sass/panes/_pane.scss */
.split-pane-component.secondary-split.pane.right .split-pane-component.items.pane .object-browse-bar .btn-bar.right {
margin-right: 10px; }
/* line 194, ../sass/panes/_pane.scss */
.split-pane-component.secondary-split.pane.right .split-pane-component.object-inspector.pane.right {
min-width: 150px;
opacity: 1;
transition: opacity 0.175s;
transition-delay: 0.175s; }
/* line 200, ../sass/panes/_pane.scss */
.split-pane-component.secondary-split.pane.right .split-pane-component.object-inspector.pane.right.inactive {
min-width: 0 !important;
width: 0 !important;
visibility: hidden;
opacity: 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.
*****************************************************************************/
/* line 25, ../sass/inspector/_inspector.scss */
.holder.inspector-holder {
overflow-y: auto;
overflow-x: hidden; }
/* line 29, ../sass/inspector/_inspector.scss */
.holder.inspector-holder .info-icon {
color: #0099cc; }
/* line 33, ../sass/inspector/_inspector.scss */
.holder.inspector-holder .number-selected {
font-size: .8em;
padding: 6px;
background-color: #595959;
color: #a6a6a6;
border-radius: 4px;
margin-top: 4px; }
/* line 42, ../sass/inspector/_inspector.scss */
.holder.inspector-holder ul li {
font-size: 0.9em;
padding: 2px 0px;
margin: 2px 0px;
border-top: solid 1px grey; }
/* line 49, ../sass/inspector/_inspector.scss */
.holder.inspector-holder ul li:first-child {
border-top-width: 0px; }
/* line 54, ../sass/inspector/_inspector.scss */
.holder.inspector-holder ul li em {
font-weight: bold;
line-height: 1.25em; }
/* line 58, ../sass/inspector/_inspector.scss */
.holder.inspector-holder ul li em:after {
content: '\A';
white-space: pre; }
/* line 65, ../sass/inspector/_inspector.scss */
.holder.inspector-holder ul li .inspector-location {
display: inline-block;
max-width: 100%; }
/* line 69, ../sass/inspector/_inspector.scss */
.holder.inspector-holder ul li .inspector-location .label {
cursor: pointer;
display: inline-block;
white-space: nowrap;
transition: background-color 0.2s;
border-radius: 4px;
padding: 3px;
margin: 2px;
max-width: 100%;
text-overflow: ellipsis;
overflow-x: hidden; }
/* line 76, ../sass/inspector/_inspector.scss */
.holder.inspector-holder ul li .inspector-location .label:hover {
background-color: #404040; }
/* line 90, ../sass/inspector/_inspector.scss */
.holder.inspector-holder ul li .inspector-location .label .icon.type-icon {
font-size: 14px; }
/* line 93, ../sass/inspector/_inspector.scss */
.holder.inspector-holder ul li .inspector-location .label .icon.type-icon .l-icon-link {
color: #49dedb;
font-size: 6px;
margin-left: -22px;
margin-right: 9px;
text-shadow: black 0 1px 2px;
z-index: 2; }
/* line 107, ../sass/inspector/_inspector.scss */
.holder.inspector-holder ul li .inspector-location:after {
content: '>';
font-family: symbolsfont;
font-size: 8px;
position: relative;
top: -8px;
left: -4px; }
/* line 117, ../sass/inspector/_inspector.scss */
.holder.inspector-holder ul li .inspector-location:last-child:after {
content: '';
display: inline-block; }
/*****************************************************************************
* 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.
*****************************************************************************/
/* line 26, ../sass/inspector/_plot.scss */
.plot-legend-item {
cursor: pointer; }
/* line 29, ../sass/inspector/_plot.scss */
.plot-legend-item.inspected {
background-color: #005177; }
/* line 32, ../sass/inspector/_plot.scss */
.plot-legend-item.inspected.s-limit-upr-yellow:before, .plot-legend-item.inspected.s-limit-upr-red:before, .plot-legend-item.inspected.s-limit-lwr-yellow:before, .plot-legend-item.inspected.s-limit-lwr-red:before {
color: #0096dd; }

View File

@@ -83,7 +83,8 @@
<glyph unicode="&#xe604;" glyph-name="icon-tabular" d="M0 896v-192h448v256h-384c-35.2 0-64-28.8-64-64zM960 960h-384v-256h448v192c0 35.2-28.8 64-64 64zM576 576h448v-256h-448v256zM0 576h448v-256h-448v256zM0 0c0-35.2 28.8-64 64-64h384v256h-448v-192zM576-64h384c35.2 0 64 28.8 64 64v192h-448v-256z" />
<glyph unicode="&#xe605;" glyph-name="icon-calendar" d="M896 960h-768c-70.4 0-128-57.6-128-128v-768c0-70.4 57.6-128 128-128h768c70.4 0 128 57.6 128 128v768c0 70.4-57.6 128-128 128zM640 512h-256v192h256v-192zM384 448h256v-192h-256v192zM320 256h-256v192h256v-192zM320 704v-192h-256v192h256zM128 0c-17 0-33 6.6-45.2 18.8s-18.8 28.2-18.8 45.2v128h256v-192h-192zM384 0v192h256v-192h-256zM960 64c0-17-6.6-33-18.8-45.2s-28.2-18.8-45.2-18.8h-192v192h256v-128zM960 256h-256v192h256v-192zM960 512h-256v192h256v-192z" />
<glyph unicode="&#xe606;" glyph-name="icon-paint-bucket" d="M896 320c0 0-130-188-128-256 2-70.6 57.4-128 128-128s126 57.4 128 128c2 68-128 256-128 256zM449 831l0.2 64.8c0 35.4-28.4 64-63.8 64.2 0 0-0.2 0-0.2 0-35.2 0-63.8-28.6-64-63.8l-0.6-190.8-294-292.6c-50-50-12.4-215.2 112.4-340s290-162.4 340-112.4l417 423.6-447 447zM384 320c-70.6 0-128 57.4-128 128 0 47.4 25.8 89 64.4 111l-0.4-110.8c0-35.4 28.4-64 63.8-64.2 0 0 0.2 0 0.2 0 35.2 0 63.8 28.6 64 63.8l0.4 110.8c38-22.2 63.6-63.4 63.6-110.6 0-70.6-57.4-128-128-128z" />
<glyph unicode="&#xe607;" glyph-name="icon-x-in-circle" d="M512 960c-282.8 0-512-229.2-512-512s229.2-512 512-512 512 229.2 512 512-229.2 512-512 512zM832 256l-128-128-192 192-192-192-128 128 192 192-192 192 128 128 192-192 192 192 128-128-192-192 192-192z" />
<glyph unicode="&#xe607;" glyph-name="icon-x-in-circle-heavy" d="M512 960c-282.8 0-512-229.2-512-512s229.2-512 512-512 512 229.2 512 512-229.2 512-512 512zM832 256l-128-128-192 192-192-192-128 128 192 192-192 192 128 128 192-192 192 192 128-128-192-192 192-192z" />
<glyph unicode="&#xe608;" glyph-name="icon-info" d="M512 960c-282.8 0-512-229.2-512-512s229.2-512 512-512 512 229.2 512 512-229.2 512-512 512zM512 832c70.6 0 128-57.4 128-128s-57.4-128-128-128c-70.6 0-128 57.4-128 128s57.4 128 128 128zM704 128h-384v128h128v128h-128v128h320v-256h64v-128z" />
<glyph unicode="&#xe60d;" glyph-name="icon-arrows-right-left" d="M1024 448l-448-512v1024zM448 960l-448-512 448-512z" />
<glyph unicode="&#xe642;" glyph-name="icon-x" d="M384 448l-365.332-365.332c-24.89-24.89-24.89-65.62 0-90.51l37.49-37.49c24.89-24.89 65.62-24.89 90.51 0 0 0 365.332 365.332 365.332 365.332l365.332-365.332c24.89-24.89 65.62-24.89 90.51 0l37.49 37.49c24.89 24.89 24.89 65.62 0 90.51l-365.332 365.332c0 0 365.332 365.332 365.332 365.332 24.89 24.89 24.89 65.62 0 90.51l-37.49 37.49c-24.89 24.89-65.62 24.89-90.51 0 0 0-365.332-365.332-365.332-365.332l-365.332 365.332c-24.89 24.89-65.62 24.89-90.51 0l-37.49-37.49c-24.89-24.89-24.89-65.62 0-90.51 0 0 365.332-365.332 365.332-365.332z" />
</font></defs></svg>

Before

Width:  |  Height:  |  Size: 26 KiB

After

Width:  |  Height:  |  Size: 27 KiB

View File

@@ -74,3 +74,6 @@
@import "initialization";
@import "hide-non-functional";
@import "views";
@import "panes/pane";
@import "inspector/inspector";
@import "inspector/plot";

View File

@@ -0,0 +1,123 @@
/*****************************************************************************
* 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.
*****************************************************************************/
// Added by shale on 08/27/2015. Styling for the object inspector.
.holder.inspector-holder {
overflow-y: auto;
overflow-x: hidden;
.info-icon {
color: $colorKey;
}
.number-selected {
font-size: .8em;
padding: 6px;
background-color: lighten($colorBodyBg, 15%);
color: lighten($colorBodyBg, 45%);
border-radius: 4px;
margin-top: 4px;
}
ul li {
font-size: 0.9em;
// Add spacing between items
padding: 2px 0px;
margin: 2px 0px;
border-top: solid 1px grey;
&:first-child {
border-top-width: 0px;
}
// Style the titles
em {
font-weight: bold;
line-height: 1.25em;
&:after {
content: '\A';
white-space: pre;
}
}
// Style object labels
.inspector-location {
display: inline-block;
max-width: 100%;
.label {
cursor: pointer;
display: inline-block;
white-space: nowrap;
// Colors
transition: background-color 0.2s;
&:hover {
background-color: lighten($colorBodyBg, 5%);
}
// Sizing and spacing
border-radius: 4px;
padding: 3px;
margin: 2px;
// Horizontal overflow
max-width: 100%;
text-overflow: ellipsis;
overflow-x: hidden;
.icon.type-icon {
font-size: 14px;
.l-icon-link {
color: $colorIconLink;
font-size: 6px;
margin-left: -22px;
margin-right: 9px;
@include txtShdwSubtle(1);
z-index: 2;
}
}
}
// Add arrows to indicate tree heirarchy
&:after {
content: '>';
font-family: symbolsfont;
font-size: 8px;
//margin-left: -6px;
position: relative;
top: -8px;
left: -4px;
}
&:last-child:after {
content: '';
display: inline-block;
}
}
}
}

View File

@@ -0,0 +1,39 @@
/*****************************************************************************
* 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.
*****************************************************************************/
// Added by shale on 08/26/2015. Additional styling for inspection.
// Make plot legend items clickable
.plot-legend-item {
cursor: pointer;
&.inspected {
background-color: $colorKeySelectedBg;
&.s-limit-upr-yellow:before,
&.s-limit-upr-red:before,
&.s-limit-lwr-yellow:before,
&.s-limit-lwr-red:before {
color: lighten($colorKeySelectedBg, 20%);
}
}
}

View File

@@ -0,0 +1,207 @@
/*****************************************************************************
* 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.
*****************************************************************************/
// Added by shale on 08/19/2015. Styling for the collapsible left and right panes.
$transitionTime: 0.35s; // For the pane open/close
// Set the left pane (which contains the tree) to have no width to close
// (not display:none because we still need to have access to the create button)
.pane.left {
&.inactive {
width: 0 !important;
min-width: 0 !important;
// Undo the tree-holder's right padding when tree closed
.tree-holder {
padding-right: 0;
}
// Hide the search bar when the pane is closed
.search-holder {
display: none;
}
}
// When the pane is closed, move and resize the create button
.create-btn.major {
top: 0;
left: 0;
transition: all $transitionTime;
&.inactivePane {
top: 0;
left: 0;
position: relative;
padding: 0;
text-align: center;
font-size: 12px;
width: 13px;
height: 16px;
line-height: 14px;
left: -11px;
top: 20px;
// Remove 'Create' text from the button when in small mode
span {
display: none;
}
}
}
}
// Hide a splitter bar when the corresponding pane is inactive
.splitter-bar.splitter {
opacity: 1;
transition: opacity $transitionTime, visibility $transitionTime;
// Make the splitter bar vertically span to the top
top: 0;
&.inactive {
visibility: hidden;
opacity: 0;
&:before {
border-width: 0;
}
}
}
// Fade the splitter bar in when opening treeview, but immediately fade
// out when closing treeview
.splitter-bar.left.splitter {
&.inactive {
transition: opacity 0s, visibility 0s;
}
}
// The main view needs to align left when the left pane is moving around
.split-pane-component.secondary-split.pane.right {
// Sliding transition for open/close of left pane
&.leftInactive {
left: 0 !important;
}
&.slide {
transition: left $transitionTime;
}
.split-pane-component.items.pane {
// Sliding transition for open/close of right pane
&.rightInactive {
right: 0 !important;
}
&.slide {
transition: right $transitionTime;
}
// Tab buttons close to the splitter bars
.object-browse-bar {
position: relative;
.pane-tabs {
position: relative;
cursor: pointer;
font-family: symbolsfont;
background-color: darken($colorBodyFg, 25%);
width: 13px !important;
height: 16px;
line-height: 16px;
font-size: 10px;
text-align: center;
// Open and closes treeview
&.left {
left: -12px;
top: 3px;
border-top-right-radius: 2px;
border-bottom-right-radius: 2px;
// Change button icon depending on state
&.inactivePane {
left: -15px;
&:after {
content: 'F';//'>';
}
}
&.activePane:after {
content: '<';
}
}
// Open and closes object inspector
&.right {
float: right;
right: -9px;
top: -13px;
border-top-left-radius: 2px;
border-bottom-left-radius: 2px;
// Change button icon depending on state
&.inactivePane {
right: -12px;
&:after {
content: '\e608';//'G';//'<';
}
}
&.activePane:after {
content: '>';
}
}
}
// Move domain object title to the right some to make room
// for treeview collapser button
.items-select {
margin-left: 10px;
}
// Similarly move the top button bar for the object inspector
.btn-bar.right {
margin-right: 10px;
}
}
}
.split-pane-component.object-inspector.pane.right {
min-width: 150px;
opacity: 1;
transition: opacity $transitionTime/2;
transition-delay: $transitionTime/2;
&.inactive {
min-width: 0 !important;
width: 0 !important;
visibility: hidden;
opacity: 0;
}
}
}

View File

@@ -0,0 +1,64 @@
<!--
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="ObjectInspectorController as controller">
<span class="ui-symbol info-icon">
&#xe608;
</span>
<div class="number-selected"
ng-if="ngModel.inspectionObjects.length > 1">
{{ngModel.inspectionObjects.length}} items selected
</div>
<ul>
<li ng-repeat="data in metadata">
<em>{{ data.name }}</em>
{{ data.value }}
</li>
<li ng-if="contextutalParents.length > 0">
<em title="The location of this linked object.">
Contextual Location
</em>
<span class="inspector-location"
ng-repeat="parent in contextutalParents">
<mct-representation key="'label'"
mct-object="parent"
ng-model="ngModel"
ng-click="ngModel.selectedObject = parent">
</mct-representation>
</span>
</li>
<li ng-if="primaryParents.length > 0">
<em title="The location of the object that this was linked from.">
Primary Location
</em>
<span class="inspector-location"
ng-repeat="parent in primaryParents">
<mct-representation key="'label'"
mct-object="parent"
ng-model="ngModel"
ng-click="ngModel.selectedObject = parent">
</mct-representation>
</span>
</li>
</ul>
</span>

View File

@@ -21,10 +21,8 @@
-->
<span ng-controller="ToggleController as toggle">
<span ng-controller="TreeNodeController as treeNode">
<span
class="tree-item menus-to-left"
ng-class="{selected: treeNode.isSelected()}"
>
<span class="tree-item menus-to-left"
ng-class="{selected: treeNode.isSelected()}">
<span
class='ui-symbol view-control'
ng-click="toggle.toggle(); treeNode.trackExpansion()"
@@ -32,12 +30,10 @@
>
{{toggle.isActive() ? "v" : ">"}}
</span>
<mct-representation
key="'label'"
mct-object="domainObject"
ng-model="ngModel"
ng-click="ngModel.selectedObject = domainObject"
>
<mct-representation key="'label'"
mct-object="domainObject"
ng-model="ngModel"
ng-click="ngModel.selectedObject = domainObject; ngModel.inspectionObjects = [domainObject]">
</mct-representation>
</span>
<span

View File

@@ -0,0 +1,151 @@
/*****************************************************************************
* 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*/
/**
* Module defining ObjectInspectorController. Created by shale on 08/21/2015.
*/
define(
[],
function () {
"use strict";
/**
* The ObjectInspectorController gets and formats the data for
* the inspector display
*
* @constructor
*/
function ObjectInspectorController($scope, objectService) {
$scope.primaryParents = [];
$scope.contextutalParents = [];
// Gets an array of the contextual parents/anscestors of the (first) inspected object
function getContextualPath() {
var currentObj,
currentParent,
parents = [];
if ($scope.ngModel && $scope.ngModel.inspectionObjects && $scope.ngModel.inspectionObjects[0]) {
currentObj = $scope.ngModel.inspectionObjects[0];
} else {
// Fallback for if the inspection objects are not defined is the selected object
currentObj = $scope.ngModel && $scope.ngModel.selectedObject;
}
currentParent = currentObj &&
currentObj.hasCapability('context') &&
currentObj.getCapability('context').getParent();
// Loop while this has a parent that is not the root object
while (currentParent && currentParent.getModel().type !== 'root' &&
currentParent.hasCapability('context')) {
// Record this object
parents.unshift(currentParent);
// Get the next one up the tree
currentObj = currentParent;
currentParent = currentObj.getCapability('context').getParent();
}
$scope.contextutalParents = parents;
}
// Gets an array of the parents/anscestors of the (first) inspected object's
// primary location (locational of original non-link)
function getPrimaryPath(current) {
var location;
// If this the the initial call of this recursive function
if (!current) {
// Set the object we are looking at
if ($scope.ngModel && $scope.ngModel.inspectionObjects && $scope.ngModel.inspectionObjects[0]) {
current = $scope.ngModel.inspectionObjects[0];
} else {
// Fallback for if the inspection objects are not defined is the selected object
current = $scope.ngModel && $scope.ngModel.selectedObject;
}
// And reset the parents array
$scope.primaryParents = [];
}
location = current.getModel().location;
if (location && location !== 'root') {
objectService.getObjects([location]).then(function (obj) {
var next = obj[location];
$scope.primaryParents.unshift(next);
getPrimaryPath(next);
});
}
}
// Gets the metadata for the selected object
function getMetadata() {
if ($scope.ngModel &&
$scope.ngModel.inspectionObjects &&
$scope.ngModel.inspectionObjects[0] &&
$scope.ngModel.inspectionObjects[0].hasCapability('metadata')) {
// Get metadata from the inspected object
$scope.metadata = $scope.ngModel.inspectionObjects[0].useCapability('metadata');
} else {
// Fallback for if the inspection objects are not defined is the selected object
$scope.metadata = $scope.ngModel && $scope.ngModel.selectedObject &&
$scope.ngModel.selectedObject.hasCapability('metadata') &&
$scope.ngModel.selectedObject.useCapability('metadata');
}
}
$scope.$watch('ngModel.inspectionObjects', function () {
var isLink;
if ($scope && $scope.ngModel &&
$scope.ngModel.inspectionObjects &&
$scope.ngModel.inspectionObjects[0]) {
isLink = $scope.ngModel.inspectionObjects[0].hasCapability('location') &&
$scope.ngModel.inspectionObjects[0].getCapability('location').isLink();
} else {
// Fallback for if the inspection objects are not defined is the selected object
isLink = $scope && $scope.ngModel &&
$scope.ngModel.selectedObject &&
$scope.ngModel.selectedObject.hasCapability('location') &&
$scope.ngModel.selectedObject.getCapability('location').isLink();
}
if (isLink) {
getPrimaryPath();
getContextualPath();
} else {
$scope.primaryParents = [];
getContextualPath();
}
getMetadata();
});
}
return ObjectInspectorController;
}
);

View File

@@ -29,7 +29,8 @@ define(
// Pixel width to allocate for the splitter itself
var SPLITTER_TEMPLATE = "<div class='abs'" +
"mct-drag-down=\"splitter.startMove()\" " +
"mct-drag=\"splitter.move(delta)\"></div>",
"mct-drag=\"splitter.move(delta)\" " +
"mct-drag-up=\"splitter.endMove()\"></div>",
OFFSETS_BY_EDGE = {
left: "offsetLeft",
right: "offsetRight",
@@ -44,7 +45,8 @@ define(
*/
function MCTSplitter() {
function link(scope, element, attrs, mctSplitPane) {
var initialPosition;
var initialPosition,
slideElement;
element.addClass("splitter");
@@ -55,8 +57,24 @@ define(
scope.splitter = {
// Begin moving this splitter
startMove: function () {
var splitter = element[0];
var splitter = element[0],
children = element.parent().children(),
i, j;
// Set initial position
initialPosition = mctSplitPane.position();
// Remove sliding class from sibling element so no delay in pane movement
for (i = 0; i < children.length; i += 1) {
for (j = 0; j < children[i].classList.length; j += 1) {
if (children[i].classList[j] === 'slide') {
// Store the element that had the sliding class so
// we can replace it later
slideElement = children[i];
children[i].classList.remove('slide');
}
}
}
},
// Handle user changes to splitter position
move: function (delta) {
@@ -64,9 +82,13 @@ define(
index = anchor.orientation === "vertical" ? 0 : 1,
pixelDelta = delta[index] *
(anchor.reversed ? -1 : 1);
// Update the position of this splitter
mctSplitPane.position(initialPosition + pixelDelta);
},
// Replace sliding class
endMove: function () {
slideElement.classList.add('slide');
}
};
}

View File

@@ -0,0 +1,136 @@
/*****************************************************************************
* 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*/
/**
* Created by shale on 08/24/2015.
*/
define(
["../../src/controllers/ObjectInspectorController"],
function (ObjectInspectorController) {
"use strict";
describe("The object inspector controller ", function () {
var mockScope,
mockObjectService,
mockPromise,
mockDomainObject,
mockContextCapability,
mockLocationCapability,
controller,
treePosCounter = 0;
beforeEach(function () {
mockScope = jasmine.createSpyObj(
"$scope",
[ "$watch" ]
);
mockScope.ngModel = {};
mockScope.ngModel.selectedObject = 'mock selected object';
mockScope.ngModel.inspectionObjects = [];
mockObjectService = jasmine.createSpyObj(
"objectService",
[ "getObjects" ]
);
mockPromise = jasmine.createSpyObj(
"promise",
[ "then" ]
);
mockObjectService.getObjects.andReturn(mockPromise);
mockDomainObject = jasmine.createSpyObj(
"domainObject",
[ "hasCapability", "getCapability", "useCapability", "getModel" ]
);
mockDomainObject.getModel.andCallFake(function () {
// Simulate having a tree by making it take iterations to reach root
if (treePosCounter > 5) {
return {location: 'somewhere', type: 'root'};
} else {
treePosCounter += 1;
return {location: 'somewhere', type: 'something'};
}
});
mockDomainObject.hasCapability.andReturn(true);
mockContextCapability = jasmine.createSpyObj(
"context capability",
[ "getParent" ]
);
mockLocationCapability = jasmine.createSpyObj(
"location capability",
[ "isLink" ]
);
mockDomainObject.getCapability.andCallFake(function (param) {
if (param === 'location') {
return mockLocationCapability;
} else if (param === 'context') {
return mockContextCapability;
}
});
mockContextCapability.getParent.andReturn(mockDomainObject);
controller = new ObjectInspectorController(mockScope, mockObjectService);
// Change the inspected object to trigger the watch call
mockScope.ngModel.inspectionObjects[0] = mockDomainObject;
});
it("watches for changes to the inspection objects", function () {
expect(mockScope.$watch).toHaveBeenCalledWith('ngModel.inspectionObjects', jasmine.any(Function));
});
it("looks for contextual parent objects", function () {
mockScope.$watch.mostRecentCall.args[1]();
expect(mockContextCapability.getParent).toHaveBeenCalled();
});
it("looks for primary parent objects if it is a link", function () {
mockLocationCapability.isLink.andReturn(true);
mockScope.$watch.mostRecentCall.args[1]();
expect(mockDomainObject.getModel).toHaveBeenCalled();
expect(mockObjectService.getObjects).toHaveBeenCalled();
mockPromise.then.mostRecentCall.args[0]({'somewhere': mockDomainObject});
});
it("gets metadata", function () {
mockScope.$watch.mostRecentCall.args[1]();
expect(mockDomainObject.useCapability).toHaveBeenCalledWith('metadata');
});
it("falls back on the selected object if there are no inspection objects", function () {
mockDomainObject.useCapability.reset();
mockScope.ngModel.selectedObject = mockDomainObject;
mockScope.ngModel.inspectionObjects = undefined;
expect(mockScope.$watch).toHaveBeenCalledWith('ngModel.inspectionObjects', jasmine.any(Function));
mockLocationCapability.isLink.andReturn(true);
mockScope.$watch.mostRecentCall.args[1]();
expect(mockDomainObject.useCapability).toHaveBeenCalled();
});
});
}
);

View File

@@ -4,6 +4,7 @@
"controllers/ClickAwayController",
"controllers/ContextMenuController",
"controllers/GetterSetterController",
"controllers/ObjectInspectorController",
"controllers/SelectorController",
"controllers/SplitPaneController",
"controllers/ToggleController",

View File

@@ -35,7 +35,8 @@
</div>
<div class="abs object-holder">
<mct-representation key="representation.selected.key"
mct-object="representation.selected.key && domainObject">
mct-object="representation.selected.key && domainObject"
ng-model="ngModel">
</mct-representation>
</div>
</div>

View File

@@ -20,15 +20,18 @@
at runtime from the About dialog for additional information.
-->
<div style="width: 100%; height: 100%;"
ng-controller="LayoutController as controller">
ng-controller="LayoutController as controller"
ng-mousedown="ngModel.inspectionObjects = [domainObject]">
<div class='frame child-frame panel abs'
ng-repeat="childObject in composition"
ng-style="controller.getFrameStyle(childObject.getId())">
ng-style="controller.getFrameStyle(childObject.getId())"
ng-mousedown="ngModel.inspectionObjects = [childObject]; $event.stopPropagation()">
<div class="frame child-frame holder contents abs">
<mct-representation key="'frame'"
mct-object="childObject">
mct-object="childObject"
ng-model="ngModel">
</mct-representation>
</div>

View File

@@ -27,11 +27,10 @@
ng-repeat="subplot in plot.getSubPlots()">
<div class="gl-plot-legend">
<!-- ng-class is temporarily hard-coded in next element -->
<span
class='plot-legend-item'
ng-repeat="telemetryObject in subplot.getTelemetryObjects()"
ng-class="plot.getLegendClass(telemetryObject)"
>
<span class='plot-legend-item'
ng-repeat="telemetryObject in subplot.getTelemetryObjects()"
ng-click="plot.setInspection($event, telemetryObject)"
ng-class="[plot.getLegendClass(telemetryObject), plot.getInspectedClass(telemetryObject)]">
<span class='plot-color-swatch'
ng-style="{ 'background-color': plot.getColor($index) }">
</span>

View File

@@ -164,7 +164,35 @@ define(
handle = undefined;
}
}
// Determines if the legend item is being inspected. If so, the class
// is 'inspected' -- unless that is the only legend item for the plot
function getInspectedClass(telemetryObject) {
if ($scope.ngModel &&
$scope.ngModel.inspectionObjects &&
$scope.ngModel.inspectionObjects.indexOf(telemetryObject) !== -1 &&
self.modeOptions.getModeHandler().getSubPlots()[0].telemetryObjects.length > 1) {
return "inspected";
}
}
this.getInspectedClass = getInspectedClass;
//
function setInspectionObjects(event, telemetryObject) {
if (event.shiftKey) {
// This was a shift-click, so we want multiple selection
if ($scope.ngModel.inspectionObjects.length > 0) {
$scope.ngModel.inspectionObjects.push(telemetryObject);
} else {
$scope.ngModel.inspectionObjects = [telemetryObject];
}
} else {
// Otherwise replace the old set of inspection objects with this
$scope.ngModel.inspectionObjects = [telemetryObject];
}
}
this.setInspection = setInspectionObjects;
this.modeOptions = new PlotModeOptions([], subPlotFactory);
this.updateValues = updateValues;
@@ -179,7 +207,6 @@ define(
// Unsubscribe when the plot is destroyed
$scope.$on("$destroy", releaseSubscription);
}
/**