alihan/openmct
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'master' into warp135b

Browse Source
This commit is contained in:
Victor Woeltjen
2016-03-07 15:21:28 -08:00
parent 273cf1c14f ff5f37dfbe
commit b7a44a7557
219 changed files with 6946 additions and 19041 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
platform/commonUI/about/bundle.js
View File

@@ -26,12 +26,26 @@ define([
"./src/LogoController",
"./src/AboutController",
"./src/LicenseController",
"text!./res/templates/app-logo.html",
"text!./res/templates/about-logo.html",
"text!./res/templates/overlay-about.html",
"text!./res/templates/license-apache.html",
"text!./res/templates/license-mit.html",
"text!./res/templates/licenses.html",
"text!./res/templates/licenses-export-md.html",
'legacyRegistry'
], function (
aboutDialogTemplate,
LogoController,
AboutController,
LicenseController,
appLogoTemplate,
aboutLogoTemplate,
overlayAboutTemplate,
licenseApacheTemplate,
licenseMitTemplate,
licensesTemplate,
licensesExportMdTemplate,
legacyRegistry
) {
"use strict";
@@ -43,12 +57,12 @@ define([
{
"key": "app-logo",
"priority": "optional",
"templateUrl": "templates/app-logo.html"
"template": appLogoTemplate
},
{
"key": "about-logo",
"priority": "preferred",
"templateUrl": "templates/about-logo.html"
"template": aboutLogoTemplate
},
{
"key": "about-dialog",
@@ -56,15 +70,15 @@ define([
},
{
"key": "overlay-about",
"templateUrl": "templates/overlay-about.html"
"template": overlayAboutTemplate
},
{
"key": "license-apache",
"templateUrl": "templates/license-apache.html"
"template": licenseApacheTemplate
},
{
"key": "license-mit",
"templateUrl": "templates/license-mit.html"
"template": licenseMitTemplate
}
],
"controllers": [
@@ -156,11 +170,11 @@ define([
"routes": [
{
"when": "/licenses",
"templateUrl": "templates/licenses.html"
"template": licensesTemplate
},
{
"when": "/licenses-md",
"templateUrl": "templates/licenses-export-md.html"
"template": licensesExportMdTemplate
}
]
}

6
platform/commonUI/about/res/templates/about-dialog.html
View File

@@ -20,11 +20,7 @@
at runtime from the About dialog for additional information.
-->
<div class="abs t-about l-about t-about-openmctweb s-about" ng-controller = "AboutController as about">
<div class="l-logo-holder s-logo-holder">
<div class="l-logo s-logo s-logo-nasa"></div>
<div class="l-logo l-logo-app s-logo s-logo-openmctweb"></div>
</div>
<div class="l-splash s-splash"></div>
<div class="s-text l-content">
<h1 class="l-title s-title">OpenMCT Web</h1>
<div class="l-description s-description">

75
platform/commonUI/browse/bundle.js
View File

@@ -37,6 +37,18 @@ define([
"./src/creation/AddActionProvider",
"./src/creation/CreationService",
"./src/windowing/WindowTitler",
"text!./res/templates/browse.html",
"text!./res/templates/create/locator.html",
"text!./res/templates/browse-object.html",
"text!./res/templates/create/create-button.html",
"text!./res/templates/create/create-menu.html",
"text!./res/templates/items/grid-item.html",
"text!./res/templates/browse/object-header.html",
"text!./res/templates/menu-arrow.html",
"text!./res/templates/back-arrow.html",
"text!./res/templates/items/items.html",
"text!./res/templates/browse/object-properties.html",
"text!./res/templates/browse/inspector-region.html",
'legacyRegistry'
], function (
BrowseController,
@@ -54,6 +66,18 @@ define([
AddActionProvider,
CreationService,
WindowTitler,
browseTemplate,
locatorTemplate,
browseObjectTemplate,
createButtonTemplate,
createMenuTemplate,
gridItemTemplate,
objectHeaderTemplate,
menuArrowTemplate,
backArrowTemplate,
itemsTemplate,
objectPropertiesTemplate,
inspectorRegionTemplate,
legacyRegistry
) {
"use strict";
@@ -63,15 +87,22 @@ define([
"routes": [
{
"when": "/browse/:ids*",
"templateUrl": "templates/browse.html",
"template": browseTemplate,
"reloadOnSearch": false
},
{
"when": "",
"templateUrl": "templates/browse.html",
"template": browseTemplate,
"reloadOnSearch": false
}
],
"constants": [
{
"key": "DEFAULT_PATH",
"value": "mine",
"priority": "fallback"
}
],
"controllers": [
{
"key": "BrowseController",
@@ -80,10 +111,12 @@ define([
"$scope",
"$route",
"$location",
"$q",
"$window",
"objectService",
"navigationService",
"urlService"
"urlService",
"policyService",
"DEFAULT_PATH"
]
},
{
@@ -102,9 +135,7 @@ define([
"depends": [
"$scope",
"$location",
"$route",
"$q",
"navigationService"
"$route"
]
},
{
@@ -134,13 +165,17 @@ define([
"controls": [
{
"key": "locator",
"templateUrl": "templates/create/locator.html"
"template": locatorTemplate
}
],
"representations": [
{
"key": "view-object",
"templateUrl": "templates/view-object.html"
},
{
"key": "browse-object",
"templateUrl": "templates/browse-object.html",
"template": browseObjectTemplate,
"gestures": [
"drop"
],
@@ -150,18 +185,18 @@ define([
},
{
"key": "create-button",
"templateUrl": "templates/create/create-button.html"
"template": createButtonTemplate
},
{
"key": "create-menu",
"templateUrl": "templates/create/create-menu.html",
"template": createMenuTemplate,
"uses": [
"action"
]
},
{
"key": "grid-item",
"templateUrl": "templates/items/grid-item.html",
"template": gridItemTemplate,
"uses": [
"type",
"action",
@@ -174,14 +209,14 @@ define([
},
{
"key": "object-header",
"templateUrl": "templates/browse/object-header.html",
"template": objectHeaderTemplate,
"uses": [
"type"
]
},
{
"key": "menu-arrow",
"templateUrl": "templates/menu-arrow.html",
"template": menuArrowTemplate,
"uses": [
"action"
],
@@ -194,7 +229,15 @@ define([
"uses": [
"context"
],
"templateUrl": "templates/back-arrow.html"
"template": backArrowTemplate
},
{
"key": "object-properties",
"template": objectPropertiesTemplate
},
{
"key": "inspector-region",
"template": inspectorRegionTemplate
}
],
"services": [
@@ -250,7 +293,7 @@ define([
"name": "Items",
"glyph": "9",
"description": "Grid of available items",
"templateUrl": "templates/items/items.html",
"template": itemsTemplate,
"uses": [
"composition"
],

23
platform/commonUI/browse/res/templates/browse-object.html
View File

@@ -44,14 +44,9 @@
</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-inner">
<div ng-if="isEditable" 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">
<mct-toolbar name="mctToolbar"
structure="toolbar.structure"
ng-model="toolbar.state"
class="flex-elem grows">
</mct-toolbar>
<mct-representation key="'edit-action-buttons'"
mct-object="domainObject"
class='flex-elem conclude-editing'>
@@ -63,6 +58,20 @@
class="abs flex-elem grows object-holder-main scroll"
toolbar="toolbar">
</mct-representation>
</div><!--/ l-object-wrapper-inner -->
</div>
<div ng-if="!isEditable" 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">
<mct-representation key="'edit-action-buttons'"
mct-object="domainObject"
class='flex-elem conclude-editing'>
</mct-representation>
</div>
<mct-representation key="representation.selected.key"
mct-object="representation.selected.key && domainObject"
class="abs flex-elem grows object-holder-main scroll">
</mct-representation>
</div>
</div>
</div>

2
platform/commonUI/browse/res/templates/browse.html
View File

@@ -63,7 +63,7 @@
<mct-split-pane class='l-object-and-inspector contents abs' anchor='right'>
<div class='split-pane-component t-object pane primary-pane left'>
<mct-representation mct-object="navigatedObject"
key="'browse-object'"
key="'view-object'"
class="abs holder holder-object">
</mct-representation>
</div>

18
platform/commonUI/edit/res/templates/edit.html → platform/commonUI/browse/res/templates/browse/inspector-region.html
View File

@@ -19,14 +19,12 @@
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 edit-mode"
ng-controller="EditController as editMode"
mct-before-unload="editMode.getUnloadWarning()">
<mct-representation key="'edit-object'" mct-object="editMode.navigatedObject()">
</mct-representation>
<mct-include key="'bottombar'"></mct-include>
<div ng-controller="InspectorController">
<div ng-repeat="region in regions">
<mct-representation
key="region.content.key"
mct-object="domainObject"
ng-model="ngModel">
</mct-representation>
</div>
</div>

60
platform/commonUI/browse/res/templates/browse/object-properties.html Normal file
View File

@@ -0,0 +1,60 @@
<!--
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.
-->
<div ng-controller="ObjectInspectorController as controller">
<ul class="flex-elem grows l-inspector-part">
<li>
<em class="t-inspector-part-header">Properties</em>
<div class="inspector-properties"
ng-repeat="data in metadata"
ng-class="{ first:$index === 0 }">
<div class="label">{{ data.name }}</div>
<div class="value">{{ data.value }}</div>
</div>
</li>
<li ng-if="contextutalParents.length > 0">
<em class="t-inspector-part-header" title="The location of this linked object.">Location</em>
<span class="inspector-location"
ng-repeat="parent in contextutalParents"
ng-class="{ last:($index + 1) === contextualParents.length }">
<mct-representation key="'label'"
mct-object="parent"
ng-model="ngModel"
ng-click="ngModel.selectedObject = parent"
class="location-item">
</mct-representation>
</span>
</li>
<li ng-if="primaryParents.length > 0">
<em class="t-inspector-part-header" title="The location of the original object that this was linked from.">Original Location</em>
<span class="inspector-location"
ng-repeat="parent in primaryParents"
ng-class="{ last:($index + 1) === primaryParents.length }">
<mct-representation key="'label'"
mct-object="parent"
ng-model="ngModel"
ng-click="ngModel.selectedObject = parent"
class="location-item">
</mct-representation>
</span>
</li>
</ul>
</div>

33
platform/commonUI/browse/res/templates/view-object.html Normal file
View File

@@ -0,0 +1,33 @@
<!--
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.
-->
<!--
A representation that allows the 'View' region of an object view to change
dynamically (eg. between browse and edit modes). Values correspond to a
representation key, and currently defaults to 'browse-object'.
In the case of edit, the EditRepresenter will change this to editable
representation of the object as needed.
-->
<mct-representation mct-object="domainObject"
key="viewObjectTemplate || 'browse-object'"
class="abs holder holder-object">
</mct-representation>

71
platform/commonUI/browse/src/BrowseController.js
View File

@@ -27,15 +27,12 @@
*/
define(
[
'../../../representation/src/gestures/GestureConstants',
'../../edit/src/objects/EditableDomainObject'
'../../../representation/src/gestures/GestureConstants'
],
function (GestureConstants, EditableDomainObject) {
function (GestureConstants) {
"use strict";
var ROOT_ID = "ROOT",
DEFAULT_PATH = "mine",
CONFIRM_MSG = "Unsaved changes will be lost if you leave this page.";
var ROOT_ID = "ROOT";
/**
* The BrowseController is used to populate the initial scope in Browse
@@ -47,18 +44,21 @@ define(
* @memberof platform/commonUI/browse
* @constructor
*/
function BrowseController($scope, $route, $location, $q, objectService, navigationService, urlService) {
function BrowseController(
$scope,
$route,
$location,
$window,
objectService,
navigationService,
urlService,
policyService,
defaultPath
) {
var path = [ROOT_ID].concat(
($route.current.params.ids || DEFAULT_PATH).split("/")
($route.current.params.ids || defaultPath).split("/")
);
function isDirty(){
var editorCapability = $scope.navigatedObject &&
$scope.navigatedObject.getCapability("editor"),
hasChanges = editorCapability && editorCapability.dirty();
return hasChanges;
}
function updateRoute(domainObject) {
var priorRoute = $route.current,
// Act as if params HADN'T changed to avoid page reload
@@ -75,31 +75,35 @@ define(
// urlService.urlForLocation used to adjust current
// path to new, addressed, path based on
// domainObject
$location.path(urlService.urlForLocation("browse",
domainObject.hasCapability('editor') ?
domainObject.getOriginalObject() : domainObject));
$location.path(urlService.urlForLocation("browse", domainObject));
}
// Callback for updating the in-scope reference to the object
// that is currently navigated-to.
function setNavigation(domainObject) {
var navigationAllowed = true;
if (domainObject === $scope.navigatedObject){
//do nothing;
return;
}
if (isDirty() && !confirm(CONFIRM_MSG)) {
$scope.treeModel.selectedObject = $scope.navigatedObject;
navigationService.setNavigation($scope.navigatedObject);
} else {
if ($scope.navigatedObject && $scope.navigatedObject.hasCapability("editor")){
$scope.navigatedObject.getCapability("editor").cancel();
}
policyService.allow("navigation", $scope.navigatedObject, domainObject, function(message){
navigationAllowed = $window.confirm(message + "\r\n\r\n" +
" Are you sure you want to continue?");
});
if (navigationAllowed) {
$scope.navigatedObject = domainObject;
$scope.treeModel.selectedObject = domainObject;
navigationService.setNavigation(domainObject);
updateRoute(domainObject);
} else {
//If navigation was unsuccessful (ie. blocked), reset
// the selected object in the tree to the currently
// navigated object
$scope.treeModel.selectedObject = $scope.navigatedObject ;
}
}
@@ -143,6 +147,12 @@ define(
} else {
doNavigate(nextObject, index + 1);
}
} else if (index === 1 && c.length > 0) {
// Roots are in a top-level container that we don't
// want to be selected, so if we couldn't find an
// object at the path we wanted, at least select
// one of its children.
navigateTo(c[c.length - 1]);
} else {
// Couldn't find the next element of the path
// so navigate to the last path object we did find
@@ -170,18 +180,13 @@ define(
selectedObject: navigationService.getNavigation()
};
$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
// Also listen for changes which come from the tree. Changes in
// the tree will trigger a change in browse navigation state.
$scope.$watch("treeModel.selectedObject", setNavigation);
// Clean up when the scope is destroyed
$scope.$on("$destroy", function () {
navigationService.removeListener(setNavigation);

18
platform/commonUI/browse/src/BrowseObjectController.js
View File

@@ -22,11 +22,8 @@
/*global define,Promise*/
define(
[
'../../../representation/src/gestures/GestureConstants',
'../../edit/src/objects/EditableDomainObject'
],
function (GestureConstants, EditableDomainObject) {
[],
function () {
"use strict";
/**
@@ -35,7 +32,7 @@ define(
* @memberof platform/commonUI/browse
* @constructor
*/
function BrowseObjectController($scope, $location, $route, $q, navigationService) {
function BrowseObjectController($scope, $location, $route) {
var navigatedObject;
function setViewForDomainObject(domainObject) {
@@ -57,10 +54,9 @@ define(
function updateQueryParam(viewKey) {
var unlisten,
priorRoute = $route.current,
isEditMode = $scope.domainObject && $scope.domainObject.hasCapability('editor');
priorRoute = $route.current;
if (viewKey && !isEditMode) {
if (viewKey) {
$location.search('view', viewKey);
unlisten = $scope.$on('$locationChangeSuccess', function () {
// Checks path to make sure /browse/ is at front
@@ -76,10 +72,6 @@ define(
$scope.$watch('domainObject', setViewForDomainObject);
$scope.$watch('representation.selected.key', updateQueryParam);
$scope.cancelEditing = function() {
navigationService.setNavigation($scope.domainObject.getDomainObject());
};
$scope.doAction = function (action){
return $scope[action] && $scope[action]();
};

69
platform/commonUI/browse/src/InspectorRegion.js Normal file
View File

@@ -0,0 +1,69 @@
/*****************************************************************************
* 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(
[
'../../regions/src/Region'
],
function (Region) {
"use strict";
/**
* Defines the a default Inspector region. Captured in a class to
* allow for modular extension and customization of regions based on
* the typical case.
* @memberOf platform/commonUI/regions
* @constructor
*/
function InspectorRegion() {
Region.call(this, {'name': 'Inspector'});
this.buildRegion();
}
InspectorRegion.prototype = Object.create(Region.prototype);
InspectorRegion.prototype.constructor = Region;
/**
* @private
*/
InspectorRegion.prototype.buildRegion = function() {
var metadataRegion = {
name: 'metadata',
title: 'Metadata Region',
// Which modes should the region part be visible in? If
// nothing provided here, then assumed that part is visible
// in both. The visibility or otherwise of a region part
// should be decided by a policy. In this case, 'modes' is a
// shortcut that is used by the EditableRegionPolicy.
modes: ['browse', 'edit'],
content: {
key: 'object-properties'
}
};
this.addRegion(new Region(metadataRegion), 0);
};
return InspectorRegion;
}
);

1
platform/commonUI/browse/src/navigation/NavigationService.js
View File

@@ -59,6 +59,7 @@ define(
callback(value);
});
}
return true;
};
/**

131
platform/commonUI/browse/test/BrowseControllerSpec.js
View File

@@ -29,8 +29,7 @@ define(
function (BrowseController) {
"use strict";
//TODO: Disabled for NEM Beta
xdescribe("The browse controller", function () {
describe("The browse controller", function () {
var mockScope,
mockRoute,
mockLocation,
@@ -40,6 +39,9 @@ define(
mockUrlService,
mockDomainObject,
mockNextObject,
mockWindow,
mockPolicyService,
testDefaultRoot,
controller;
function mockPromise(value) {
@@ -50,7 +52,32 @@ define(
};
}
function instantiateController() {
controller = new BrowseController(
mockScope,
mockRoute,
mockLocation,
mockWindow,
mockObjectService,
mockNavigationService,
mockUrlService,
mockPolicyService,
testDefaultRoot
);
}
beforeEach(function () {
mockWindow = jasmine.createSpyObj('$window', [
"confirm"
]);
mockWindow.confirm.andReturn(true);
mockPolicyService = jasmine.createSpyObj('policyService', [
'allow'
]);
testDefaultRoot = "some-root-level-domain-object";
mockScope = jasmine.createSpyObj(
"$scope",
[ "$on", "$watch" ]
@@ -101,41 +128,28 @@ define(
]));
mockNextObject.useCapability.andReturn(undefined);
mockNextObject.getId.andReturn("next");
mockDomainObject.getId.andReturn("mine");
mockDomainObject.getId.andReturn(testDefaultRoot);
controller = new BrowseController(
mockScope,
mockRoute,
mockLocation,
mockObjectService,
mockNavigationService,
mockUrlService
);
instantiateController();
});
it("uses composition to set the navigated object, if there is none", function () {
controller = new BrowseController(
mockScope,
mockRoute,
mockLocation,
mockObjectService,
mockNavigationService,
mockUrlService
);
instantiateController();
expect(mockNavigationService.setNavigation)
.toHaveBeenCalledWith(mockDomainObject);
});
it("navigates to a root-level object, even when default path is not found", function () {
mockDomainObject.getId
.andReturn("something-other-than-the-" + testDefaultRoot);
instantiateController();
expect(mockNavigationService.setNavigation)
.toHaveBeenCalledWith(mockDomainObject);
});
it("does not try to override navigation", function () {
mockNavigationService.getNavigation.andReturn(mockDomainObject);
controller = new BrowseController(
mockScope,
mockRoute,
mockLocation,
mockObjectService,
mockNavigationService,
mockUrlService
);
instantiateController();
expect(mockScope.navigatedObject).toBe(mockDomainObject);
});
@@ -162,14 +176,8 @@ define(
});
it("uses route parameters to choose initially-navigated object", function () {
mockRoute.current.params.ids = "mine/next";
controller = new BrowseController(
mockScope,
mockRoute,
mockLocation,
mockObjectService,
mockNavigationService
);
mockRoute.current.params.ids = testDefaultRoot + "/next";
instantiateController();
expect(mockScope.navigatedObject).toBe(mockNextObject);
expect(mockNavigationService.setNavigation)
.toHaveBeenCalledWith(mockNextObject);
@@ -179,14 +187,8 @@ define(
// Idea here is that if we get a bad path of IDs,
// browse controller should traverse down it until
// it hits an invalid ID.
mockRoute.current.params.ids = "mine/junk";
controller = new BrowseController(
mockScope,
mockRoute,
mockLocation,
mockObjectService,
mockNavigationService
);
mockRoute.current.params.ids = testDefaultRoot + "/junk";
instantiateController();
expect(mockScope.navigatedObject).toBe(mockDomainObject);
expect(mockNavigationService.setNavigation)
.toHaveBeenCalledWith(mockDomainObject);
@@ -196,14 +198,8 @@ define(
// Idea here is that if we get a path which passes
// through an object without a composition, browse controller
// should stop at it since remaining IDs cannot be loaded.
mockRoute.current.params.ids = "mine/next/junk";
controller = new BrowseController(
mockScope,
mockRoute,
mockLocation,
mockObjectService,
mockNavigationService
);
mockRoute.current.params.ids = testDefaultRoot + "/next/junk";
instantiateController();
expect(mockScope.navigatedObject).toBe(mockNextObject);
expect(mockNavigationService.setNavigation)
.toHaveBeenCalledWith(mockNextObject);
@@ -230,7 +226,10 @@ define(
// prior to setting $route.current
mockLocation.path.andReturn("/browse/");
mockNavigationService.setNavigation.andReturn(true);
// Exercise the Angular workaround
mockNavigationService.addListener.mostRecentCall.args[0]();
mockScope.$on.mostRecentCall.args[1]();
expect(mockUnlisten).toHaveBeenCalled();
@@ -241,6 +240,36 @@ define(
);
});
it("after successful navigation event sets the selected tree " +
"object", function () {
mockScope.navigatedObject = mockDomainObject;
mockNavigationService.setNavigation.andReturn(true);
//Simulate a change in selected tree object
mockScope.treeModel = {selectedObject: mockDomainObject};
mockScope.$watch.mostRecentCall.args[1](mockNextObject);
expect(mockScope.treeModel.selectedObject).toBe(mockNextObject);
expect(mockScope.treeModel.selectedObject).not.toBe(mockDomainObject);
});
it("after failed navigation event resets the selected tree" +
" object", function () {
mockScope.navigatedObject = mockDomainObject;
mockWindow.confirm.andReturn(false);
mockPolicyService.allow.andCallFake(function(category, object, context, callback){
callback("unsaved changes");
return false;
});
//Simulate a change in selected tree object
mockScope.treeModel = {selectedObject: mockDomainObject};
mockScope.$watch.mostRecentCall.args[1](mockNextObject);
expect(mockScope.treeModel.selectedObject).not.toBe(mockNextObject);
expect(mockScope.treeModel.selectedObject).toBe(mockDomainObject);
});
});
}
);

45
platform/commonUI/browse/test/InspectorRegionSpec.js Normal file
View File

@@ -0,0 +1,45 @@
/*****************************************************************************
* 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*/
/**
* MCTIncudeSpec. Created by vwoeltje on 11/6/14.
*/
define(
["../src/InspectorRegion"],
function (InspectorRegion) {
"use strict";
describe("The inspector region", function () {
var inspectorRegion;
beforeEach(function () {
inspectorRegion = new InspectorRegion();
});
it("creates default region parts", function () {
expect(inspectorRegion.regions.length).toBe(1);
});
});
}
);

2
platform/commonUI/browse/test/navigation/NavigationServiceSpec.js
View File

@@ -86,4 +86,4 @@ define(
});
}
);
);

28
platform/commonUI/dialog/bundle.js
View File

@@ -24,10 +24,24 @@
define([
"./src/DialogService",
"./src/OverlayService",
"text!./res/templates/overlay-dialog.html",
"text!./res/templates/overlay-options.html",
"text!./res/templates/dialog.html",
"text!./res/templates/overlay-blocking-message.html",
"text!./res/templates/message.html",
"text!./res/templates/overlay-message-list.html",
"text!./res/templates/overlay.html",
'legacyRegistry'
], function (
DialogService,
OverlayService,
overlayDialogTemplate,
overlayOptionsTemplate,
dialogTemplate,
overlayBlockingMessageTemplate,
messageTemplate,
overlayMessageListTemplate,
overlayTemplate,
legacyRegistry
) {
"use strict";
@@ -57,33 +71,33 @@ define([
"templates": [
{
"key": "overlay-dialog",
"templateUrl": "templates/overlay-dialog.html"
"template": overlayDialogTemplate
},
{
"key": "overlay-options",
"templateUrl": "templates/overlay-options.html"
"template": overlayOptionsTemplate
},
{
"key": "form-dialog",
"templateUrl": "templates/dialog.html"
"template": dialogTemplate
},
{
"key": "overlay-blocking-message",
"templateUrl": "templates/overlay-blocking-message.html"
"template": overlayBlockingMessageTemplate
},
{
"key": "message",
"templateUrl": "templates/message.html"
"template": messageTemplate
},
{
"key": "overlay-message-list",
"templateUrl": "templates/overlay-message-list.html"
"template": overlayMessageListTemplate
}
],
"containers": [
{
"key": "overlay",
"templateUrl": "templates/overlay.html"
"template": overlayTemplate
}
]
}

4
platform/commonUI/dialog/res/templates/overlay-message-list.html
View File

@@ -6,7 +6,9 @@
</div>
</div>
<div class="abs message-body">
<mct-include ng-repeat="msg in ngModel.dialog.messages | orderBy: '-'" key="'message'" ng-model="msg"></mct-include>
<mct-include
ng-repeat="msg in ngModel.dialog.messages | orderBy: '-'"
key="'message'" ng-model="msg.model"></mct-include>
</div>
<div class="abs bottom-bar">
<a ng-repeat="dialogAction in ngModel.dialog.actions"

66
platform/commonUI/edit/bundle.js
View File

@@ -22,10 +22,10 @@
/*global define*/
define([
"./src/controllers/EditController",
"./src/controllers/EditActionController",
"./src/controllers/EditPanesController",
"./src/controllers/ElementsController",
"./src/controllers/EditObjectController",
"./src/directives/MCTBeforeUnload",
"./src/actions/LinkAction",
"./src/actions/EditAction",
@@ -34,14 +34,20 @@ define([
"./src/actions/SaveAction",
"./src/actions/CancelAction",
"./src/policies/EditActionPolicy",
"./src/policies/EditNavigationPolicy",
"./src/representers/EditRepresenter",
"./src/representers/EditToolbarRepresenter",
"text!./res/templates/library.html",
"text!./res/templates/edit-object.html",
"text!./res/templates/edit-action-buttons.html",
"text!./res/templates/elements.html",
"text!./res/templates/topbar-edit.html",
'legacyRegistry'
], function (
EditController,
EditActionController,
EditPanesController,
ElementsController,
EditObjectController,
MCTBeforeUnload,
LinkAction,
EditAction,
@@ -50,30 +56,21 @@ define([
SaveAction,
CancelAction,
EditActionPolicy,
EditNavigationPolicy,
EditRepresenter,
EditToolbarRepresenter,
libraryTemplate,
editObjectTemplate,
editActionButtonsTemplate,
elementsTemplate,
topbarEditTemplate,
legacyRegistry
) {
"use strict";
legacyRegistry.register("platform/commonUI/edit", {
"extensions": {
"routes": [
{
"when": "/edit",
"templateUrl": "templates/edit.html"
}
],
"controllers": [
{
"key": "EditController",
"implementation": EditController,
"depends": [
"$scope",
"$q",
"navigationService"
]
},
{
"key": "EditActionController",
"implementation": EditActionController,
@@ -94,6 +91,15 @@ define([
"depends": [
"$scope"
]
},
{
"key": "EditObjectController",
"implementation": EditObjectController,
"depends": [
"$scope",
"$location",
"policyService"
]
}
],
"directives": [
@@ -156,14 +162,11 @@ define([
"name": "Save",
"description": "Save changes made to these objects.",
"depends": [
"$q",
"$location",
"$injector",
"urlService",
"navigationService",
"policyService",
"dialogService",
"creationService"
"creationService",
"copyService"
],
"priority": "mandatory"
},
@@ -183,32 +186,41 @@ define([
{
"category": "action",
"implementation": EditActionPolicy
},
{
"category": "navigation",
"message": "There are unsaved changes.",
"implementation": EditNavigationPolicy
}
],
"templates": [
{
"key": "edit-library",
"templateUrl": "templates/library.html"
"template": libraryTemplate
}
],
"representations": [
{
"key": "edit-object",
"templateUrl": "templates/edit-object.html",
"template": editObjectTemplate,
"uses": [
"view"
],
"gestures": [
"drop"
]
},
{
"key": "edit-action-buttons",
"templateUrl": "templates/edit-action-buttons.html",
"template": editActionButtonsTemplate,
"uses": [
"action"
]
},
{
"key": "edit-elements",
"templateUrl": "templates/elements.html",
"template": elementsTemplate,
"uses": [
"composition"
],
@@ -218,7 +230,7 @@ define([
},
{
"key": "topbar-edit",
"templateUrl": "templates/topbar-edit.html"
"template": topbarEditTemplate
}
],
"representers": [

87
platform/commonUI/edit/res/templates/edit-object.html
View File

@@ -19,50 +19,51 @@
this source code distribution or the Licensing information page available
at runtime from the About dialog for additional information.
-->
<mct-representation key="'topbar-edit'"
mct-object="domainObject"
ng-model="representation">
</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>
<mct-representation key="representation.selected.key"
toolbar="toolbar"
mct-object="representation.selected.key && domainObject"
class="holder abs object-holder work-area">
<div class="abs l-flex-col" ng-controller="EditObjectController as EditObjectController">
<div mct-before-unload="EditObjectController.getUnloadWarning()"
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'"
mct-object="domainObject"
class="flex-elem l-back"></mct-representation>
<mct-representation key="'object-header'"
mct-object="domainObject"
class="l-flex-row flex-elem grows object-header">
</mct-representation>
</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-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">
</mct-representation>
</mct-container>
</div>
</mct-split-pane>
<div class="btn-bar right l-flex-row flex-elem flex-justify-end flex-fixed">
<mct-representation key="'switcher'"
mct-object="domainObject"
ng-model="representation">
</mct-representation>
<!-- Temporarily, on mobile, the action buttons are hidden-->
<mct-representation key="'action-group'"
mct-object="domainObject"
parameters="{ category: 'view-control' }"
class="mobile-hide">
</mct-representation>
</div>
</mct-split-pane>
</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-inner">
<!-- Toolbar and Save/Cancel buttons -->
<div class="l-edit-controls flex-elem l-flex-row flex-align-end">
<mct-toolbar name="mctToolbar"
structure="toolbar.structure"
ng-model="toolbar.state"
class="flex-elem grows">
</mct-toolbar>
<mct-representation key="'edit-action-buttons'"
mct-object="domainObject"
class='flex-elem conclude-editing'>
</mct-representation>
</div>
<mct-representation key="representation.selected.key"
mct-object="representation.selected.key && domainObject"
class="abs flex-elem grows object-holder-main scroll"
toolbar="toolbar">
</mct-representation>
</div><!--/ l-object-wrapper-inner -->
</div>
</div>

23
platform/commonUI/edit/src/actions/EditAction.js
View File

@@ -72,13 +72,26 @@ define(
* Enter edit mode.
*/
EditAction.prototype.perform = function () {
var editableObject;
var self = this;
if (!this.domainObject.hasCapability("editor")) {
editableObject = new EditableDomainObject(this.domainObject, this.$q);
editableObject.getCapability('status').set('editing', true);
this.navigationService.setNavigation(editableObject);
//TODO: This is only necessary because the drop gesture is
// wrapping the object itself, need to refactor this later.
// All responsibility for switching into edit mode should be
// in the edit action, and not duplicated in the gesture
this.domainObject = new EditableDomainObject(this.domainObject, this.$q);
}
//this.$location.path("/edit");
this.navigationService.setNavigation(this.domainObject);
this.domainObject.getCapability('status').set('editing', true);
//Register a listener to automatically cancel this edit action
//if the user navigates away from this object.
function cancelEditing(navigatedTo){
if (!navigatedTo || navigatedTo.getId() !== self.domainObject.getId()) {
self.domainObject.getCapability('editor').cancel();
self.navigationService.removeListener(cancelEditing);
}
}
this.navigationService.addListener(cancelEditing);
};
/**

80
platform/commonUI/edit/src/actions/SaveAction.js
View File

@@ -36,18 +36,22 @@ define(
* @implements {Action}
* @memberof platform/commonUI/edit
*/
function SaveAction($q, $location, $injector, urlService, navigationService, policyService, dialogService, creationService, context) {
function SaveAction(
$injector,
policyService,
dialogService,
creationService,
copyService,
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;
this.copyService = copyService;
}
SaveAction.prototype.getObjectService = function(){
@@ -67,35 +71,29 @@ define(
*/
SaveAction.prototype.perform = function () {
var domainObject = this.domainObject,
$location = this.$location,
urlService = this.urlService,
copyService = this.copyService,
self = this;
function resolveWith(object){
return function() {
return function () {
return object;
};
}
function doWizardSave(parent) {
var context = domainObject.getCapability("context"),
wizard = new CreateWizard(domainObject, parent, self.policyService);
wizard = new CreateWizard(
domainObject,
parent,
self.policyService
);
return self.dialogService
.getUserInput(wizard.getFormStructure(true), wizard.getInitialFormValue())
.then(function(formValue){
return wizard.populateObjectFromInput(formValue, domainObject);
});
}
function persistObject(object){
//Persist first to mark dirty
return object.getCapability('persistence').persist().then(function(){
//then save permanently
return object.getCapability('editor').save();
});
.getUserInput(
wizard.getFormStructure(true),
wizard.getInitialFormValue()
)
.then(wizard.populateObjectFromInput.bind(wizard));
}
function fetchObject(objectId){
@@ -108,16 +106,18 @@ define(
return fetchObject(object.getModel().location);
}
function locateObjectInParent(parent){
parent.getCapability('composition').add(domainObject.getId());
return parent.getCapability('persistence').persist().then(function() {
return parent;
});
function allowClone(objectToClone) {
return (objectToClone.getId() === domainObject.getId()) ||
objectToClone.getCapability('location').isOriginal();
}
function doNothing() {
// Create cancelled, do nothing
return false;
function cloneIntoParent(parent) {
return copyService.perform(domainObject, parent, allowClone);
}
function cancelEditingAfterClone(clonedObject) {
return domainObject.getCapability("editor").cancel()
.then(resolveWith(clonedObject));
}
// Invoke any save behavior introduced by the editor capability;
@@ -127,17 +127,13 @@ define(
function doSave() {
//This is a new 'virtual object' that has not been persisted
// yet.
if (!domainObject.getModel().persisted){
if (domainObject.getModel().persisted === undefined){
return getParent(domainObject)
.then(doWizardSave)
.then(persistObject)
.then(getParent)//Parent may have changed based
// on user selection
.then(locateObjectInParent)
.then(function(){
return fetchObject(domainObject.getId());
})
.catch(doNothing);
.then(doWizardSave)
.then(getParent)
.then(cloneIntoParent)
.then(cancelEditingAfterClone)
.catch(resolveWith(false));
} else {
return domainObject.getCapability("editor").save()
.then(resolveWith(domainObject.getOriginalObject()));
@@ -148,7 +144,7 @@ define(
// UI, which will have been pushed atop the Browse UI.)
function returnToBrowse(object) {
if (object) {
self.navigationService.setNavigation(object);
object.getCapability("action").perform("navigate");
}
return object;
}

3
platform/commonUI/edit/src/capabilities/EditorCapability.js
View File

@@ -124,8 +124,7 @@ define(
*/
EditorCapability.prototype.cancel = function () {
this.editableObject.getCapability("status").set("editing", false);
//TODO: Reset the cache as well here.
this.cache.markClean(this.editableObject);
this.cache.markClean();
return resolvePromise(undefined);
};

71
platform/commonUI/edit/src/controllers/EditController.js → platform/commonUI/edit/src/controllers/EditObjectController.js
View File

@@ -26,41 +26,45 @@
* @namespace platform/commonUI/edit
*/
define(
["../objects/EditableDomainObject"],
function (EditableDomainObject) {
[],
function () {
"use strict";
/**
* Controller which is responsible for populating the scope for
* Edit mode; introduces an editable version of the currently
* navigated domain object into the scope.
* Edit mode
* @memberof platform/commonUI/edit
* @constructor
*/
function EditController($scope, $q, navigationService) {
var self = this;
function EditObjectController($scope, $location, policyService) {
this.scope = $scope;
this.policyService = policyService;
function setNavigation(domainObject) {
// Wrap the domain object such that all mutation is
// confined to edit mode (until Save)
self.navigatedDomainObject =
domainObject && new EditableDomainObject(domainObject, $q);
var navigatedObject;
function setViewForDomainObject(domainObject) {
var locationViewKey = $location.search().view;
function selectViewIfMatching(view) {
if (view.key === locationViewKey) {
$scope.representation = $scope.representation || {};
$scope.representation.selected = view;
}
}
if (locationViewKey) {
((domainObject && domainObject.useCapability('view')) || [])
.forEach(selectViewIfMatching);
}
navigatedObject = domainObject;
}
setNavigation(navigationService.getNavigation());
navigationService.addListener(setNavigation);
$scope.$on("$destroy", function () {
navigationService.removeListener(setNavigation);
});
}
$scope.$watch('domainObject', setViewForDomainObject);
/**
* Get the domain object which is navigated-to.
* @returns {DomainObject} the domain object that is navigated-to
*/
EditController.prototype.navigatedObject = function () {
return this.navigatedDomainObject;
};
$scope.doAction = function (action){
return $scope[action] && $scope[action]();
};
}
/**
* Get the warning to show if the user attempts to navigate
@@ -68,17 +72,18 @@ define(
* @returns {string} the warning to show, or undefined if
* there are no unsaved changes
*/
EditController.prototype.getUnloadWarning = function () {
var navigatedObject = this.navigatedDomainObject,
editorCapability = navigatedObject &&
navigatedObject.getCapability("editor"),
hasChanges = editorCapability && editorCapability.dirty();
EditObjectController.prototype.getUnloadWarning = function () {
var navigatedObject = this.scope.domainObject,
policyMessage;
this.policyService.allow("navigation", navigatedObject, undefined, function(message) {
policyMessage = message;
});
return policyMessage;
return hasChanges ?
"Unsaved changes will be lost if you leave this page." :
undefined;
};
return EditController;
return EditObjectController;
}
);

9
platform/commonUI/edit/src/objects/EditableDomainObjectCache.js
View File

@@ -126,7 +126,14 @@ define(
* @param {DomainObject} domainObject the domain object
*/
EditableDomainObjectCache.prototype.markClean = function (domainObject) {
delete this.dirtyObjects[domainObject.getId()];
var self = this;
if (!domainObject) {
Object.keys(this.dirtyObjects).forEach(function(key) {
delete self.dirtyObjects[key];
});
} else {
delete this.dirtyObjects[domainObject.getId()];
}
};
/**

67
platform/commonUI/edit/src/policies/EditNavigationPolicy.js Normal file
View File

@@ -0,0 +1,67 @@
/*****************************************************************************
* 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";
/**
* Policy controlling whether navigation events should proceed
* when object is being edited.
* @memberof platform/commonUI/edit
* @constructor
* @implements {Policy.<Action, ActionContext>}
*/
function EditNavigationPolicy(policyService) {
this.policyService = policyService;
}
/**
* @private
*/
EditNavigationPolicy.prototype.isDirty = function(domainObject) {
var navigatedObject = domainObject,
editorCapability = navigatedObject &&
navigatedObject.getCapability("editor"),
statusCapability = navigatedObject &&
navigatedObject.getCapability("status");
return statusCapability && statusCapability.get('editing')
&& editorCapability && editorCapability.dirty();
};
/**
* Allow navigation if an object is not dirty, or if the user elects
* to proceed anyway.
* @param currentNavigation
* @returns {boolean|*} true if the object model is clean; or if
* it's dirty and the user wishes to proceed anyway.
*/
EditNavigationPolicy.prototype.allow = function (currentNavigation) {
return !this.isDirty(currentNavigation);
};
return EditNavigationPolicy;
}
);

34
platform/commonUI/edit/src/representers/EditRepresenter.js
View File

@@ -49,6 +49,7 @@ define(
var self = this;
this.scope = scope;
this.listenHandle = undefined;
// Mutate and persist a new version of a domain object's model.
function doPersist(model) {
@@ -100,22 +101,53 @@ define(
// Place the "commit" method in the scope
scope.commit = commit;
scope.setEditable = setEditable;
// Clean up when the scope is destroyed
scope.$on("$destroy", function () {
self.destroy();
});
}
// Handle a specific representation of a specific domain object
EditRepresenter.prototype.represent = function represent(representation, representedObject) {
var scope = this.scope,
self = this;
// Track the key, to know which view configuration to save to.
this.key = (representation || {}).key;
// Track the represented object
this.domainObject = representedObject;
this.scope.isEditable = representedObject.getCapability('status').get('editing');
// Ensure existing watches are released
this.destroy();
function setEditing(){
scope.viewObjectTemplate = 'edit-object';
}
/**
* Listen for changes in object state. If the object becomes
* editable then change the view and inspector regions
* object representation accordingly
*/
this.listenHandle = this.domainObject.getCapability('status').listen(function(statuses){
if (statuses.indexOf('editing')!=-1){
setEditing();
} else {
delete scope.viewObjectTemplate;
}
});
if (representedObject.getCapability('status').get('editing')){
setEditing();
}
};
// Respond to the destruction of the current representation.
EditRepresenter.prototype.destroy = function destroy() {
// Nothing to clean up
return this.listenHandle && this.listenHandle();
};
return EditRepresenter;

126
platform/commonUI/edit/test/controllers/EditControllerSpec.js
View File

@@ -22,102 +22,110 @@
/*global define,describe,it,expect,beforeEach,jasmine*/
define(
["../../src/controllers/EditController"],
function (EditController) {
["../../src/controllers/EditObjectController"],
function (EditObjectController) {
"use strict";
describe("The Edit mode controller", function () {
var mockScope,
mockQ,
mockNavigationService,
mockObject,
mockType,
mockLocation,
mockStatusCapability,
mockCapabilities,
mockPolicyService,
controller;
// Utility function; look for a $watch on scope and fire it
function fireWatch(expr, value) {
mockScope.$watch.calls.forEach(function (call) {
if (call.args[0] === expr) {
call.args[1](value);
}
});
}
beforeEach(function () {
mockPolicyService = jasmine.createSpyObj(
"policyService",
[
"allow"
]
);
mockScope = jasmine.createSpyObj(
"$scope",
[ "$on" ]
);
mockQ = jasmine.createSpyObj('$q', ['when', 'all']);
mockNavigationService = jasmine.createSpyObj(
"navigationService",
[ "getNavigation", "addListener", "removeListener" ]
[ "$on", "$watch" ]
);
mockObject = jasmine.createSpyObj(
"domainObject",
[ "getId", "getModel", "getCapability", "hasCapability" ]
[ "getId", "getModel", "getCapability", "hasCapability", "useCapability" ]
);
mockType = jasmine.createSpyObj(
"type",
[ "hasFeature" ]
);
mockStatusCapability = jasmine.createSpyObj('statusCapability',
["get"]
);
mockCapabilities = {
"type" : mockType,
"status": mockStatusCapability
};
mockLocation = jasmine.createSpyObj('$location',
["search"]
);
mockLocation.search.andReturn({"view": "fixed"});
mockNavigationService.getNavigation.andReturn(mockObject);
mockObject.getId.andReturn("test");
mockObject.getModel.andReturn({ name: "Test object" });
mockObject.getCapability.andCallFake(function (key) {
return key === 'type' && mockType;
return mockCapabilities[key];
});
mockType.hasFeature.andReturn(true);
controller = new EditController(
mockScope.domainObject = mockObject;
controller = new EditObjectController(
mockScope,
mockQ,
mockNavigationService
mockLocation,
mockPolicyService
);
});
it("exposes the currently-navigated object", function () {
expect(controller.navigatedObject()).toBeDefined();
expect(controller.navigatedObject().getId()).toEqual("test");
});
it("adds an editor capability to the navigated object", function () {
// Should provide an editor capability...
expect(controller.navigatedObject().getCapability("editor"))
.toBeDefined();
// Shouldn't have been the mock capability we provided
expect(controller.navigatedObject().getCapability("editor"))
.not.toEqual(mockType);
});
it("detaches its navigation listener when destroyed", function () {
var navCallback = mockNavigationService
.addListener.mostRecentCall.args[0];
expect(mockScope.$on).toHaveBeenCalledWith(
"$destroy",
jasmine.any(Function)
);
// Verify precondition
expect(mockNavigationService.removeListener)
.not.toHaveBeenCalled();
// Trigger destroy
mockScope.$on.mostRecentCall.args[1]();
// Listener should have been removed
expect(mockNavigationService.removeListener)
.toHaveBeenCalledWith(navCallback);
});
it("exposes a warning message for unload", function () {
var obj = controller.navigatedObject(),
mockEditor = jasmine.createSpyObj('editor', ['dirty']);
var obj = mockObject,
errorMessage = "Unsaved changes";
// Normally, should be undefined
expect(controller.getUnloadWarning()).toBeUndefined();
// Override the object's editor capability, make it look
// like there are unsaved changes.
obj.getCapability = jasmine.createSpy();
obj.getCapability.andReturn(mockEditor);
mockEditor.dirty.andReturn(true);
// Override the policy service to prevent navigation
mockPolicyService.allow.andCallFake(function(category, object, context, callback){
callback(errorMessage);
});
// Should have some warning message here now
expect(controller.getUnloadWarning()).toEqual(jasmine.any(String));
expect(controller.getUnloadWarning()).toEqual(errorMessage);
});
it("sets the active view from query parameters", function () {
var testViews = [
{ key: 'abc' },
{ key: 'def', someKey: 'some value' },
{ key: 'xyz' }
];
mockObject.useCapability.andCallFake(function (c) {
return (c === 'view') && testViews;
});
mockLocation.search.andReturn({ view: 'def' });
fireWatch('domainObject', mockObject);
expect(mockScope.representation.selected)
.toEqual(testViews[1]);
});
});

28
platform/commonUI/edit/test/representers/EditRepresenterSpec.js
View File

@@ -33,6 +33,8 @@ define(
testRepresentation,
mockDomainObject,
mockPersistence,
mockStatusCapability,
mockCapabilities,
representer;
function mockPromise(value) {
@@ -46,7 +48,7 @@ define(
beforeEach(function () {
mockQ = { when: mockPromise };
mockLog = jasmine.createSpyObj("$log", ["info", "debug"]);
mockScope = jasmine.createSpyObj("$scope", ["$watch"]);
mockScope = jasmine.createSpyObj("$scope", ["$watch", "$on"]);
testRepresentation = { key: "test" };
mockDomainObject = jasmine.createSpyObj("domainObject", [
"getId",
@@ -57,11 +59,20 @@ define(
]);
mockPersistence =
jasmine.createSpyObj("persistence", ["persist"]);
mockStatusCapability =
jasmine.createSpyObj("statusCapability", ["get", "listen"]);
mockStatusCapability.get.andReturn(false);
mockCapabilities = {
'persistence': mockPersistence,
'status': mockStatusCapability
};
mockDomainObject.getModel.andReturn({});
mockDomainObject.hasCapability.andReturn(true);
mockDomainObject.useCapability.andReturn(true);
mockDomainObject.getCapability.andReturn(mockPersistence);
mockDomainObject.getCapability.andCallFake(function(capability){
return mockCapabilities[capability];
});
representer = new EditRepresenter(mockQ, mockLog, mockScope);
representer.represent(testRepresentation, mockDomainObject);
@@ -71,6 +82,17 @@ define(
expect(mockScope.commit).toEqual(jasmine.any(Function));
});
it("Sets edit view template on edit mode", function () {
mockStatusCapability.listen.mostRecentCall.args[0](['editing']);
expect(mockScope.viewObjectTemplate).toEqual('edit-object');
});
it("Cleans up listeners on scope destroy", function () {
representer.listenHandle = jasmine.createSpy('listen');
mockScope.$on.mostRecentCall.args[1]();
expect(representer.listenHandle).toHaveBeenCalled();
});
it("mutates and persists upon observed changes", function () {
mockScope.model = { someKey: "some value" };
mockScope.configuration = { someConfiguration: "something" };
@@ -101,4 +123,4 @@ define(
});
}
);
);

92
platform/commonUI/general/bundle.js
View File

@@ -24,6 +24,7 @@
define([
"./src/services/UrlService",
"./src/services/PopupService",
"./src/SplashScreenManager",
"./src/StyleSheetLoader",
"./src/UnsupportedBrowserWarning",
"./src/controllers/TimeRangeController",
@@ -48,10 +49,30 @@ define([
"./src/directives/MCTScroll",
"./src/directives/MCTSplitPane",
"./src/directives/MCTSplitter",
"text!./res/templates/bottombar.html",
"text!./res/templates/controls/action-button.html",
"text!./res/templates/controls/input-filter.html",
"text!./res/templates/indicator.html",
"text!./res/templates/message-banner.html",
"text!./res/templates/progress-bar.html",
"text!./res/templates/controls/time-controller.html",
"text!./res/templates/containers/accordion.html",
"text!./res/templates/subtree.html",
"text!./res/templates/tree.html",
"text!./res/templates/tree-node.html",
"text!./res/templates/label.html",
"text!./res/templates/controls/action-group.html",
"text!./res/templates/menu/context-menu.html",
"text!./res/templates/controls/switcher.html",
"text!./res/templates/object-inspector.html",
"text!./res/templates/controls/selector.html",
"text!./res/templates/controls/datetime-picker.html",
"text!./res/templates/controls/datetime-field.html",
'legacyRegistry'
], function (
UrlService,
PopupService,
SplashScreenManager,
StyleSheetLoader,
UnsupportedBrowserWarning,
TimeRangeController,
@@ -76,6 +97,25 @@ define([
MCTScroll,
MCTSplitPane,
MCTSplitter,
bottombarTemplate,
actionButtonTemplate,
inputFilterTemplate,
indicatorTemplate,
messageBannerTemplate,
progressBarTemplate,
timeControllerTemplate,
accordionTemplate,
subtreeTemplate,
treeTemplate,
treeNodeTemplate,
labelTemplate,
actionGroupTemplate,
contextMenuTemplate,
switcherTemplate,
objectInspectorTemplate,
selectorTemplate,
datetimePickerTemplate,
datetimeFieldTemplate,
legacyRegistry
) {
"use strict";
@@ -117,6 +157,12 @@ define([
"notificationService",
"agentService"
]
},
{
"implementation": SplashScreenManager,
"depends": [
"$document"
]
}
],
"filters": [
@@ -129,36 +175,40 @@ define([
{
"stylesheetUrl": "css/normalize.min.css",
"priority": "mandatory"
},
{
"stylesheetUrl": "css/reset.css",
"priority": "mandatory"
}
],
"templates": [
{
"key": "bottombar",
"templateUrl": "templates/bottombar.html"
"template": bottombarTemplate
},
{
"key": "action-button",
"templateUrl": "templates/controls/action-button.html"
"template": actionButtonTemplate
},
{
"key": "input-filter",
"templateUrl": "templates/controls/input-filter.html"
"template": inputFilterTemplate
},
{
"key": "indicator",
"templateUrl": "templates/indicator.html"
"template": indicatorTemplate
},
{
"key": "message-banner",
"templateUrl": "templates/message-banner.html"
"template": messageBannerTemplate
},
{
"key": "progress-bar",
"templateUrl": "templates/progress-bar.html"
"template": progressBarTemplate
},
{
"key": "time-controller",
"templateUrl": "templates/controls/time-controller.html"
"template": timeControllerTemplate
}
],
"controllers": [
@@ -367,7 +417,7 @@ define([
"containers": [
{
"key": "accordion",
"templateUrl": "templates/containers/accordion.html",
"template": accordionTemplate,
"attributes": [
"label"
]
@@ -376,7 +426,7 @@ define([
"representations": [
{
"key": "tree",
"templateUrl": "templates/subtree.html",
"template": subtreeTemplate,
"uses": [
"composition"
],
@@ -385,25 +435,25 @@ define([
},
{
"key": "tree",
"templateUrl": "templates/tree.html"
"template": treeTemplate
},
{
"key": "subtree",
"templateUrl": "templates/subtree.html",
"template": subtreeTemplate,
"uses": [
"composition"
]
},
{
"key": "tree-node",
"templateUrl": "templates/tree-node.html",
"template": treeNodeTemplate,
"uses": [
"action"
]
},
{
"key": "label",
"templateUrl": "templates/label.html",
"template": labelTemplate,
"uses": [
"type",
"location"
@@ -416,7 +466,7 @@ define([
},
{
"key": "node",
"templateUrl": "templates/label.html",
"template": labelTemplate,
"uses": [
"type"
],
@@ -427,42 +477,42 @@ define([
},
{
"key": "action-group",
"templateUrl": "templates/controls/action-group.html",
"template": actionGroupTemplate,
"uses": [
"action"
]
},
{
"key": "context-menu",
"templateUrl": "templates/menu/context-menu.html",
"template": contextMenuTemplate,
"uses": [
"action"
]
},
{
"key": "switcher",
"templateUrl": "templates/controls/switcher.html",
"template": switcherTemplate,
"uses": [
"view"
]
},
{
"key": "object-inspector",
"templateUrl": "templates/object-inspector.html"
"template": objectInspectorTemplate
}
],
"controls": [
{
"key": "selector",
"templateUrl": "templates/controls/selector.html"
"template": selectorTemplate
},
{
"key": "datetime-picker",
"templateUrl": "templates/controls/datetime-picker.html"
"template": datetimePickerTemplate
},
{
"key": "datetime-field",
"templateUrl": "templates/controls/datetime-field.html"
"template": datetimeFieldTemplate
}
],
"licenses": [

26
platform/commonUI/general/res/config.rb
View File

@@ -1,26 +0,0 @@
# Require any additional compass plugins here.
# require "compass-growl"
# Set this to the root of your project when deployed:
http_path = "/"
css_dir = "css"
sass_dir = "sass"
images_dir = "images"
javascripts_dir = "js"
# You can select your preferred output style here (can be overridden via the command line):
# :expanded, :compressed, :nested
output_style = :nested
# To enable relative paths to assets via compass helper functions. Uncomment:
relative_assets = true
# To disable debugging comments that display the original location of your selectors. Uncomment:
# line_comments = false
# If you prefer the indented syntax, you might want to regenerate this
# project again passing --syntax sass, or you can uncomment this:
# preferred_syntax = :sass
# and then run:
# sass-convert -R --from scss --to sass vfn_platform/static/sass scss && rm -rf sass && mv scss sass

48
platform/commonUI/general/res/css/reset.css Normal file
View File

@@ -0,0 +1,48 @@
/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}

33
platform/commonUI/general/res/fonts/symbols/icomoon.io-WTD-symbols-project.json
View File

@@ -1,8 +1,8 @@
{
"metadata": {
"name": "WTD Symbols",
"lastOpened": 1454115620456,
"created": 1454115616211
"lastOpened": 1455833272792,
"created": 1455833268424
},
"iconSets": [
{
@@ -16,7 +16,7 @@
"tempChar": ""
},
{
"order": 117,
"order": 120,
"id": 95,
"prevSize": 32,
"code": 58904,
@@ -771,8 +771,9 @@
{
"id": 95,
"paths": [
"M101.2 287.6c57.2-69.6 118.6-104.8 182.8-104.8s125.6 35.2 182.8 104.8c51.4 62.6 89.8 141.2 112.6 196.2 27.6 65.8 58.8 121 90.6 159.6 10 12 44.2 51.4 69.8 51.4 6.4 0 30.4-3.8 69.8-51.4 31.8-38.6 63.2-93.8 90.6-159.6 23-55 61.2-133.6 112.6-196.2 3.6-4.4 7.2-8.6 10.8-12.8v-18.8c0.4-140.8-114.8-256-255.6-256h-512c-140.8 0-256 115.2-256 256v201c23.4-51.8 57.4-116.4 101.2-169.4zM744 182c54 0 106.4 24.4 156 72.8-31.6 44.6-57.4 92.2-77.6 134.2-33.4-42-61.8-59.4-78.4-59.4-17.4 0-47.8 19.2-83.2 65.8-27-57.6-54-102.4-77.4-136 51-51.2 104.8-77.4 160.6-77.4z",
"M922.8 736.4c-57.2 69.6-118.8 104.8-182.8 104.8s-125.6-35.2-182.8-104.8c-51.4-62.6-89.8-141.2-112.6-196.2-27.6-65.8-58.8-121-90.6-159.6-10-12-44.2-51.4-69.8-51.4-6.4 0-30.4 3.8-69.8 51.4-31.8 38.6-63.2 93.8-90.6 159.6-23 55-61.2 133.6-112.6 196.2-3.6 4.4-7.2 8.6-10.8 12.8v18.8c0 140.8 115.2 256 256 256h512c140.8 0 256-115.2 256-256v-201c-23.8 51.8-57.8 116.4-101.6 169.4zM280 842c-54 0-106.4-24.4-156-72.8 31.6-44.6 57.4-92.2 77.6-134.2 33.4 42 61.8 59.4 78.4 59.4 17.4 0 47.8-19.2 83.2-65.8 27 57.6 54 102.4 77.4 136-51 51.2-104.8 77.4-160.6 77.4z"
"M923 438.2l-151-100.6c-36-24-103.8-24-139.8 0l-151 100.6c-44.6 29.8-102.6 46.2-163 46.2s-118.4-16.4-163-46.2l-151.4-100.6c-1.8-1.2-3.8-2.4-5.8-3.6v208c36.6 7.4 70.6 20.8 99 39.8l151 100.6c36 24 103.8 24 139.8 0l151-100.6c44.6-29.8 102.6-46.2 163-46.2s118.4 16.4 163 46.2l151 100.6c1.8 1.2 3.8 2.4 5.8 3.6v-208c-36.2-7.2-70.2-20.8-98.6-39.8z",
"M923 822.2l-151-100.6c-36-24-103.8-24-139.8 0l-151 100.6c-44.6 29.8-102.6 46.2-163 46.2s-118.4-16.4-163-46.2l-151.4-100.6c-1.8-1.2-3.8-2.4-5.8-3.6v112c0 105.6 86.4 192 192 192h640c94.8 0 174.2-69.8 189.4-160.4-35.6-7.4-68.6-20.8-96.4-39.4z",
"M97 197.8l151 100.6c36 24 103.8 24 139.8 0l151-100.6c44.8-29.8 102.6-46.2 163.2-46.2s118.4 16.4 163 46.2l151 100.6c1.8 1.2 3.8 2.4 5.8 3.6v-112c0-105.6-86.4-192-192-192h-639.8c-94.8 0-174.2 69.8-189.4 160.4 35.6 7.4 68.6 20.8 96.4 39.4z"
],
"attrs": [],
"isMulticolor": false,
@@ -781,18 +782,20 @@
"icon-session"
],
"colorPermutations": {
"16161751": [],
"125525525516161751": []
"16161751": [
0,
0,
0
]
}
},
{
"id": 94,
"paths": [
"M546.4 431.2l32-24c31.6-23.8 91.6-23.8 123.2 0l32 24c10.8 8 22.2 15.2 34.4 21.4v-201.2c-38-19.6-82.2-30-128-30-60.4 0-118.2 18.2-162.4 51.4l-32 24c-31.6 23.8-91.6 23.8-123.2 0l-32-24c-10.8-8-22.2-15.2-34.4-21.4v201.2c38 19.6 82.2 30 128 30 60.4 0 118.2-18.2 162.4-51.4z",
"M640 541.4c-60.4 0-118.2 18.2-162.4 51.4l-32 24c-31.6 23.8-91.6 23.8-123.2 0l-32-24c-10.8-8-22.2-15.2-34.4-21.4v201.2c38 19.6 82.2 30 128 30 60.4 0 118.2-18.2 162.4-51.4l32-24c31.6-23.8 91.6-23.8 123.2 0l32 24c10.8 8 22.2 15.2 34.4 21.4v-201.2c-38-19.6-82.2-30-128-30z",
"M832 0h-128v192h127.6c0.2 0 0.2 0.2 0.4 0.4v639.4c0 0.2-0.2 0.2-0.4 0.4h-127.6v192h128c105.6 0 192-86.4 192-192v-640.2c0-105.6-86.4-192-192-192z",
"M192 831.6v-639.4c0-0.2 0.2-0.2 0.4-0.4h127.6v-191.8h-128c-105.6 0-192 86.4-192 192v640c0 105.6 86.4 192 192 192h128v-192h-127.6c-0.2 0-0.4-0.2-0.4-0.4z",
"M686 384c7.2 0 21 7.4 38.6 25.8 11.8-24.8 26.4-52.2 43.4-79v-50c-26.4-16.4-53.8-24.6-82-24.6-37.6 0-74.2 14.8-108.8 44.2 27.4 37.8 49.6 78.6 66.2 113.8 19.4-21.6 34.8-30.2 42.6-30.2z",
"M338 640c-7.2 0-21-7.4-38.6-25.8-11.8 24.8-26.4 52.2-43.4 79v74.8h82c37.6 0 74.2-14.8 108.8-44.2-27.4-37.8-49.6-78.6-66.2-113.8-19.4 21.4-34.8 30-42.6 30z",
"M768 544.2c-38.2 70.6-72.8 95.8-85 95.8-15 0-64.2-38.4-112-152.8-17.4-41.8-46.6-101.6-85.8-149.4-44.8-54.4-93.2-82-144.2-82-29.2 0-57.6 9-85 27v196.8c38.2-70.6 72.8-95.8 85-95.8 15 0 64.2 38.4 112 152.8 17.4 41.8 46.6 101.6 85.8 149.4 44.8 54.4 93.2 82 144.2 82 29.2 0 57.6-9 85-27v-196.8z"
"M320 832h-127.6c-0.2 0-0.2-0.2-0.4-0.4v-639.4c0-0.2 0.2-0.2 0.4-0.4h127.6v-191.8h-128c-105.6 0-192 86.4-192 192v640c0 105.6 86.4 192 192 192h128v-192z"
],
"attrs": [],
"isMulticolor": false,
@@ -801,8 +804,12 @@
"icon-topic"
],
"colorPermutations": {
"16161751": [],
"125525525516161751": []
"16161751": [
0,
0,
0,
0
]
}
},
{

BIN
platform/commonUI/general/res/fonts/symbols/wtdsymbols.eot
View File

Binary file not shown.

4
platform/commonUI/general/res/fonts/symbols/wtdsymbols.svg
View File

@@ -94,8 +94,8 @@
<glyph unicode="&#xe614;" glyph-name="icon-collapse-pane-right" d="M768 960h256v-1024h-256c-105.6 0-192 86.4-192 192v640c0 105.6 86.4 192 192 192zM512 640l-512-320v640z" />
<glyph unicode="&#xe615;" glyph-name="icon-eye-open" d="M512 896c-261 0-480.6-195.4-512-448 31.4-252.6 251-448 512-448s480.6 195.4 512 448c-31.4 252.6-251 448-512 448zM768.2 225.4c-71.4-62.8-162.8-97.4-257.6-97.4s-186.2 34.6-257.6 97.4c-66.6 58.6-110.6 137.2-125 222.6 0 0 0 0.2 0 0.2 76.8 154 220.8 257.6 384 257.6s307.2-103.8 384-257.6c0 0 0-0.2 0-0.2-14.4-85.4-61.2-164-127.8-222.6zM512 672c-123.8 0-224-100.2-224-224s100.2-224 224-224 224 100.2 224 224-100.2 224-224 224z" />
<glyph unicode="&#xe616;" glyph-name="icon-eye-open-no-gleam" d="M512 896c-261 0-480.6-195.4-512-448 31.4-252.6 251-448 512-448s480.6 195.4 512 448c-31.4 252.6-251 448-512 448zM768.2 225.4c-71.4-62.8-162.8-97.4-257.6-97.4s-186.2 34.6-257.6 97.4c-66.6 58.6-110.6 137.2-125 222.6 0 0 0 0.2 0 0.2 76.8 154 220.8 257.6 384 257.6s307.2-103.8 384-257.6c0 0 0-0.2 0-0.2-14.4-85.4-61.2-164-127.8-222.6zM512 672c-123.8 0-224-100.2-224-224s100.2-224 224-224 224 100.2 224 224-100.2 224-224 224zM576 416c-53 0-96 43-96 96s43 96 96 96 96-43 96-96c0-53-43-96-96-96z" />
<glyph unicode="&#xe617;" glyph-name="icon-topic" d="M832 960h-128v-192h127.6c0.2 0 0.2-0.2 0.4-0.4v-639.4c0-0.2-0.2-0.2-0.4-0.4h-127.6v-192h128c105.6 0 192 86.4 192 192v640.2c0 105.6-86.4 192-192 192zM192 128.4v639.4c0 0.2 0.2 0.2 0.4 0.4h127.6v191.8h-128c-105.6 0-192-86.4-192-192v-640c0-105.6 86.4-192 192-192h128v192h-127.6c-0.2 0-0.4 0.2-0.4 0.4zM686 576c7.2 0 21-7.4 38.6-25.8 11.8 24.8 26.4 52.2 43.4 79v50c-26.4 16.4-53.8 24.6-82 24.6-37.6 0-74.2-14.8-108.8-44.2 27.4-37.8 49.6-78.6 66.2-113.8 19.4 21.6 34.8 30.2 42.6 30.2zM338 320c-7.2 0-21 7.4-38.6 25.8-11.8-24.8-26.4-52.2-43.4-79v-74.8h82c37.6 0 74.2 14.8 108.8 44.2-27.4 37.8-49.6 78.6-66.2 113.8-19.4-21.4-34.8-30-42.6-30zM768 415.8c-38.2-70.6-72.8-95.8-85-95.8-15 0-64.2 38.4-112 152.8-17.4 41.8-46.6 101.6-85.8 149.4-44.8 54.4-93.2 82-144.2 82-29.2 0-57.6-9-85-27v-196.8c38.2 70.6 72.8 95.8 85 95.8 15 0 64.2-38.4 112-152.8 17.4-41.8 46.6-101.6 85.8-149.4 44.8-54.4 93.2-82 144.2-82 29.2 0 57.6 9 85 27v196.8z" />
<glyph unicode="&#xe618;" glyph-name="icon-session" d="M101.2 672.4c57.2 69.6 118.6 104.8 182.8 104.8s125.6-35.2 182.8-104.8c51.4-62.6 89.8-141.2 112.6-196.2 27.6-65.8 58.8-121 90.6-159.6 10-12 44.2-51.4 69.8-51.4 6.4 0 30.4 3.8 69.8 51.4 31.8 38.6 63.2 93.8 90.6 159.6 23 55 61.2 133.6 112.6 196.2 3.6 4.4 7.2 8.6 10.8 12.8v18.8c0.4 140.8-114.8 256-255.6 256h-512c-140.8 0-256-115.2-256-256v-201c23.4 51.8 57.4 116.4 101.2 169.4zM744 778c54 0 106.4-24.4 156-72.8-31.6-44.6-57.4-92.2-77.6-134.2-33.4 42-61.8 59.4-78.4 59.4-17.4 0-47.8-19.2-83.2-65.8-27 57.6-54 102.4-77.4 136 51 51.2 104.8 77.4 160.6 77.4zM922.8 223.6c-57.2-69.6-118.8-104.8-182.8-104.8s-125.6 35.2-182.8 104.8c-51.4 62.6-89.8 141.2-112.6 196.2-27.6 65.8-58.8 121-90.6 159.6-10 12-44.2 51.4-69.8 51.4-6.4 0-30.4-3.8-69.8-51.4-31.8-38.6-63.2-93.8-90.6-159.6-23-55-61.2-133.6-112.6-196.2-3.6-4.4-7.2-8.6-10.8-12.8v-18.8c0-140.8 115.2-256 256-256h512c140.8 0 256 115.2 256 256v201c-23.8-51.8-57.8-116.4-101.6-169.4zM280 118c-54 0-106.4 24.4-156 72.8 31.6 44.6 57.4 92.2 77.6 134.2 33.4-42 61.8-59.4 78.4-59.4 17.4 0 47.8 19.2 83.2 65.8 27-57.6 54-102.4 77.4-136-51-51.2-104.8-77.4-160.6-77.4z" />
<glyph unicode="&#xe617;" glyph-name="icon-topic" d="M546.4 528.8l32 24c31.6 23.8 91.6 23.8 123.2 0l32-24c10.8-8 22.2-15.2 34.4-21.4v201.2c-38 19.6-82.2 30-128 30-60.4 0-118.2-18.2-162.4-51.4l-32-24c-31.6-23.8-91.6-23.8-123.2 0l-32 24c-10.8 8-22.2 15.2-34.4 21.4v-201.2c38-19.6 82.2-30 128-30 60.4 0 118.2 18.2 162.4 51.4zM640 418.6c-60.4 0-118.2-18.2-162.4-51.4l-32-24c-31.6-23.8-91.6-23.8-123.2 0l-32 24c-10.8 8-22.2 15.2-34.4 21.4v-201.2c38-19.6 82.2-30 128-30 60.4 0 118.2 18.2 162.4 51.4l32 24c31.6 23.8 91.6 23.8 123.2 0l32-24c10.8-8 22.2-15.2 34.4-21.4v201.2c-38 19.6-82.2 30-128 30zM832 960h-128v-192h127.6c0.2 0 0.2-0.2 0.4-0.4v-639.4c0-0.2-0.2-0.2-0.4-0.4h-127.6v-192h128c105.6 0 192 86.4 192 192v640.2c0 105.6-86.4 192-192 192zM320 128h-127.6c-0.2 0-0.2 0.2-0.4 0.4v639.4c0 0.2 0.2 0.2 0.4 0.4h127.6v191.8h-128c-105.6 0-192-86.4-192-192v-640c0-105.6 86.4-192 192-192h128v192z" />
<glyph unicode="&#xe618;" glyph-name="icon-session" d="M923 521.8l-151 100.6c-36 24-103.8 24-139.8 0l-151-100.6c-44.6-29.8-102.6-46.2-163-46.2s-118.4 16.4-163 46.2l-151.4 100.6c-1.8 1.2-3.8 2.4-5.8 3.6v-208c36.6-7.4 70.6-20.8 99-39.8l151-100.6c36-24 103.8-24 139.8 0l151 100.6c44.6 29.8 102.6 46.2 163 46.2s118.4-16.4 163-46.2l151-100.6c1.8-1.2 3.8-2.4 5.8-3.6v208c-36.2 7.2-70.2 20.8-98.6 39.8zM923 137.8l-151 100.6c-36 24-103.8 24-139.8 0l-151-100.6c-44.6-29.8-102.6-46.2-163-46.2s-118.4 16.4-163 46.2l-151.4 100.6c-1.8 1.2-3.8 2.4-5.8 3.6v-112c0-105.6 86.4-192 192-192h640c94.8 0 174.2 69.8 189.4 160.4-35.6 7.4-68.6 20.8-96.4 39.4zM97 762.2l151-100.6c36-24 103.8-24 139.8 0l151 100.6c44.8 29.8 102.6 46.2 163.2 46.2s118.4-16.4 163-46.2l151-100.6c1.8-1.2 3.8-2.4 5.8-3.6v112c0 105.6-86.4 192-192 192h-639.8c-94.8 0-174.2-69.8-189.4-160.4 35.6-7.4 68.6-20.8 96.4-39.4z" />
<glyph unicode="&#xe619;" glyph-name="icon-bullet" d="M832 208c0-44-36-80-80-80h-480c-44 0-80 36-80 80v480c0 44 36 80 80 80h480c44 0 80-36 80-80v-480z" />
<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>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 32 KiB

After

Width:  |  Height:  |  Size: 31 KiB

BIN
platform/commonUI/general/res/fonts/symbols/wtdsymbols.ttf
View File

Binary file not shown.

BIN
platform/commonUI/general/res/fonts/symbols/wtdsymbols.woff
View File

Binary file not shown.

0
platform/commonUI/general/res/images/bg-about-openmctweb.jpg → platform/commonUI/general/res/images/bg-splash.jpg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 218 KiB

After

Width:  |  Height:  |  Size: 218 KiB

32
platform/commonUI/general/res/images/logo-app-shdw.svg Normal file
View File

@@ -0,0 +1,32 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 18.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="20 0 640 150" enable-background="new 20 0 640 150" xml:space="preserve">
<filter height="130%" width="150%" id="AI_Shadow_Custom" x="-15%" filterUnits="objectBoundingBox" y="-15%">
<feGaussianBlur in="SourceAlpha" result="blur" stdDeviation="6"></feGaussianBlur>
<feOffset in="blur" dy="3" result="offsetBlurredAlpha" dx="0"></feOffset>
<feMerge>
<feMergeNode in="offsetBlurredAlpha"></feMergeNode>
<feMergeNode in="SourceGraphic"></feMergeNode>
</feMerge>
</filter>
<g filter="url(#AI_Shadow_Custom)">
<path fill="#FFFFFF" d="M90.7,13.2c14.8,0,22.8,8,22.8,22.8v46.3c0,14.8-8,22.8-22.8,22.8H62.8c-14.8,0-22.8-8-22.8-22.8V36
c0-14.8,8-22.8,22.8-22.8H90.7z M97.8,36.2c0-5.8-3.1-9.2-9.2-9.2h-24c-5.8,0-9.2,3.2-9.2,9.2v45.9c0,6,3.4,9.2,9.2,9.2h24
c6,0,9.2-3.2,9.2-9.2V36.2z"/>
<path fill="#FFFFFF" d="M173.2,13.2c14.8,0,22.8,8,22.8,22.8v46.3c0,14.8-8,22.8-22.8,22.8h-9c-11.2,0-19.2-6.6-26.5-13.6v44.2
h-15.5V13.2h15.5v13.6c7.3-7,15.3-13.6,26.5-13.6H173.2z M180.3,36.2c0-5.8-3.1-9.2-9.2-9.2h-8.3c-9.4,0-17,3.6-25.2,9.2v45.9
c8.2,5.6,15.8,9.2,25.2,9.2h8.3c6.1,0,9.2-3.4,9.2-9.2V36.2z"/>
<path fill="#FFFFFF" d="M220.3,82.8c0,6,3.2,9.2,9.2,9.2h23c6,0,9.2-3.4,9.2-9.2V76h15.6v6.3c0,14.8-8,22.8-22.8,22.8h-27
c-14.8,0-22.8-8-22.8-22.8V36c0-14.8,8-22.8,22.8-22.8h27c14.8,0,22.8,8,22.8,22.8v26.9h-57V82.8z M229.5,26.3
c-6,0-9.2,3.2-9.2,9.2v15.8h41.3V35.5c0-6-3.1-9.2-9.2-9.2H229.5z"/>
<path fill="#FFFFFF" d="M285.7,13.2h15.5v13.6c7.3-7,15.3-13.6,26.5-13.6h7.1c14.8,0,22.8,8,22.8,22.8v69.1h-15.5V36.6
c0-6-3.2-9.2-9.2-9.2h-6.6c-9.4,0-17,3.4-25.2,9.2v68.5h-15.5V13.2z"/>
<path fill="#4F79F7" d="M495.4,105.1c-12.5,0-18.4-6-18.4-18.4V28.7c0-12.5,6.2-18.4,18.7-18.4h42.2c12.5,0,18.1,6,18.1,18.4v17.7
h-25.4V33.9c0-1.9-0.5-2.4-2.4-2.4h-23.3c-1.9,0-2.4,0.5-2.4,2.4v47.6c0,1.9,0.5,2.4,2.4,2.4h23.3c1.9,0,2.4-0.5,2.4-2.4V69H556
v17.7c0,12.5-6,18.4-18.4,18.4H495.4z"/>
<path fill="#4F79F7" d="M613.7,32v73.1h-25.4V32H562V10.3h78V32H613.7z"/>
<path fill="#4F79F7" d="M425.3,93.6l17.4-42.4v48.6c0,3,2.4,5.4,5.4,5.4h19V15.7c0-3-2.4-5.4-5.4-5.4h-23.3l-21.2,49.4l-21.2-49.4
h-23.3c-3,0-5.4,2.4-5.4,5.4v89.5h19c3,0,5.4-2.4,5.4-5.4V51.2l17.4,42.4H425.3z"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.4 KiB

24
platform/commonUI/general/res/images/logo-app.svg Normal file
View File

@@ -0,0 +1,24 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 18.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="20 0 640 150" enable-background="new 20 0 640 150" xml:space="preserve">
<g>
<path fill="#FFFFFF" d="M90.7,13.2c14.8,0,22.8,8,22.8,22.8v46.3c0,14.8-8,22.8-22.8,22.8H62.8c-14.8,0-22.8-8-22.8-22.8V36
c0-14.8,8-22.8,22.8-22.8H90.7z M97.8,36.2c0-5.8-3.1-9.2-9.2-9.2h-24c-5.8,0-9.2,3.2-9.2,9.2v45.9c0,6,3.4,9.2,9.2,9.2h24
c6,0,9.2-3.2,9.2-9.2V36.2z"/>
<path fill="#FFFFFF" d="M173.2,13.2c14.8,0,22.8,8,22.8,22.8v46.3c0,14.8-8,22.8-22.8,22.8h-9c-11.2,0-19.2-6.6-26.5-13.6v44.2
h-15.5V13.2h15.5v13.6c7.3-7,15.3-13.6,26.5-13.6H173.2z M180.3,36.2c0-5.8-3.1-9.2-9.2-9.2h-8.3c-9.4,0-17,3.6-25.2,9.2v45.9
c8.2,5.6,15.8,9.2,25.2,9.2h8.3c6.1,0,9.2-3.4,9.2-9.2V36.2z"/>
<path fill="#FFFFFF" d="M220.3,82.8c0,6,3.2,9.2,9.2,9.2h23c6,0,9.2-3.4,9.2-9.2V76h15.6v6.3c0,14.8-8,22.8-22.8,22.8h-27
c-14.8,0-22.8-8-22.8-22.8V36c0-14.8,8-22.8,22.8-22.8h27c14.8,0,22.8,8,22.8,22.8v26.9h-57V82.8z M229.5,26.3
c-6,0-9.2,3.2-9.2,9.2v15.8h41.3V35.5c0-6-3.1-9.2-9.2-9.2H229.5z"/>
<path fill="#FFFFFF" d="M285.7,13.2h15.5v13.6c7.3-7,15.3-13.6,26.5-13.6h7.1c14.8,0,22.8,8,22.8,22.8v69.1h-15.5V36.6
c0-6-3.2-9.2-9.2-9.2h-6.6c-9.4,0-17,3.4-25.2,9.2v68.5h-15.5V13.2z"/>
<path fill="#4F79F7" d="M495.4,105.1c-12.5,0-18.4-6-18.4-18.4V28.7c0-12.5,6.2-18.4,18.7-18.4h42.2c12.5,0,18.1,6,18.1,18.4v17.7
h-25.4V33.9c0-1.9-0.5-2.4-2.4-2.4h-23.3c-1.9,0-2.4,0.5-2.4,2.4v47.6c0,1.9,0.5,2.4,2.4,2.4h23.3c1.9,0,2.4-0.5,2.4-2.4V69H556
v17.7c0,12.5-6,18.4-18.4,18.4H495.4z"/>
<path fill="#4F79F7" d="M613.7,32v73.1h-25.4V32H562V10.3h78V32H613.7z"/>
<path fill="#4F79F7" d="M425.3,93.6l17.4-42.4v48.6c0,3,2.4,5.4,5.4,5.4h19V15.7c0-3-2.4-5.4-5.4-5.4h-23.3l-21.2,49.4l-21.2-49.4
h-23.3c-3,0-5.4,2.4-5.4,5.4v89.5h19c3,0,5.4-2.4,5.4-5.4V51.2l17.4,42.4H425.3z"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.0 KiB

99
platform/commonUI/general/res/images/logo-openmctweb-shdw.svg
View File

@@ -1,99 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 17.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="1040px" height="150px" viewBox="0 0 1040 150" enable-background="new 0 0 1040 150" xml:space="preserve">
<filter width="150%" height="130%" x="-15%" y="-15%" filterUnits="objectBoundingBox" id="AI_Shadow_Custom">
<feGaussianBlur in="SourceAlpha" stdDeviation="6" result="blur"></feGaussianBlur>
<feOffset dy="3" dx="0" in="blur" result="offsetBlurredAlpha"></feOffset>
<feMerge>
<feMergeNode in="offsetBlurredAlpha"></feMergeNode>
<feMergeNode in="SourceGraphic"></feMergeNode>
</feMerge>
</filter>
<g filter="url(#AI_Shadow_Custom)">
<path fill="#FFFFFF" d="M121.932,76.064c0,5.952-0.992,11.507-3.174,16.665c-1.984,4.96-4.96,9.324-8.531,13.094
c-3.769,3.769-7.936,6.547-13.094,8.531c-4.96,1.984-10.515,2.976-16.466,2.976H56.463c-5.952,0-11.507-0.992-16.466-2.976
s-9.523-4.96-13.094-8.531c-3.769-3.769-6.547-8.134-8.729-13.094C15.992,87.57,15,82.015,15,76.064V57.217
c0-5.952,0.992-11.507,3.174-16.665s4.96-9.523,8.729-13.094c3.571-3.571,7.936-6.547,12.895-8.531s10.515-3.174,16.466-3.174
h24.203c5.952,0,11.507,0.992,16.466,3.174c4.96,1.984,9.324,4.96,13.094,8.531s6.547,7.936,8.531,13.094
c1.984,5.158,3.174,10.515,3.174,16.665v18.847H121.932z M103.878,57.217c0-3.571-0.595-6.745-1.786-9.523
c-1.19-2.777-2.777-5.357-4.761-7.34c-1.984-1.984-4.563-3.571-7.34-4.761c-2.777-1.19-5.952-1.786-9.523-1.786H56.463
c-3.571,0-6.745,0.595-9.523,1.786c-2.777,1.19-5.357,2.777-7.34,4.761c-1.984,1.984-3.571,4.563-4.761,7.34
c-1.389,2.777-1.984,5.952-1.984,9.523v18.847c0,3.571,0.595,6.745,1.786,9.523c1.19,2.976,2.777,5.357,4.761,7.34
s4.563,3.571,7.34,4.761c2.777,1.19,6.15,1.786,9.523,1.786h24.203c3.571,0,6.745-0.595,9.523-1.786
c2.777-1.19,5.357-2.777,7.34-4.761s3.571-4.563,4.761-7.34c1.19-2.777,1.786-6.15,1.786-9.523L103.878,57.217z"/>
<path fill="#FFFFFF" d="M209.62,90.943c0,3.174-0.397,5.753-1.19,8.332c-0.794,2.381-1.786,4.563-3.174,6.547
c-1.19,1.786-2.777,3.373-4.563,4.761c-1.786,1.389-3.571,2.381-5.357,3.174c-1.786,0.794-3.769,1.389-5.555,1.786
c-1.984,0.397-3.769,0.595-5.357,0.595h-32.337V98.283h32.337c2.381,0,4.166-0.595,5.357-1.786c1.19-1.19,1.786-2.976,1.786-5.357
V66.739c0-2.579-0.595-4.365-1.786-5.555c-1.19-1.19-2.976-1.786-5.357-1.786h-32.139c-2.381,0-4.365,0.595-5.555,1.786
c-1.19,1.19-1.786,2.976-1.786,5.357v72.809H127.09V66.541c0-3.174,0.397-5.753,1.19-8.332c0.794-2.381,1.786-4.563,3.174-6.547
c1.389-1.786,2.777-3.373,4.563-4.761s3.571-2.381,5.357-3.174s3.769-1.389,5.555-1.786c1.984-0.397,3.769-0.595,5.357-0.595
h32.337c3.174,0,5.753,0.397,8.332,1.19c2.381,0.794,4.563,1.786,6.348,3.174c1.786,1.19,3.373,2.777,4.761,4.563
s2.381,3.571,3.174,5.357c0.794,1.786,1.389,3.769,1.785,5.555c0.397,1.984,0.595,3.769,0.595,5.357L209.62,90.943L209.62,90.943z"
/>
<path fill="#FFFFFF" d="M295.126,66.144c0,2.579-0.397,5.158-1.389,7.936c-0.794,2.777-2.381,5.555-4.166,7.936
c-1.984,2.381-4.563,4.563-7.737,6.15c-3.174,1.587-6.944,2.579-11.507,2.579H237.99V73.683h32.337
c2.381,0,4.365-0.794,5.555-2.182c1.389-1.587,1.984-3.373,1.984-5.555c0-2.381-0.794-4.166-2.182-5.555
c-1.587-1.389-3.373-1.984-5.357-1.984H237.99c-2.381,0-4.365,0.794-5.753,2.182c-1.389,1.587-1.984,3.373-1.984,5.555V91.34
c0,2.381,0.794,4.166,2.182,5.555c1.587,1.389,3.373,1.984,5.555,1.984h46.82v17.061h-47.018c-2.579,0-5.158-0.397-7.936-1.389
c-2.777-0.794-5.555-2.381-7.936-4.166c-2.381-1.984-4.563-4.563-6.15-7.737c-1.587-3.174-2.381-6.944-2.381-11.507V66.144
c0-2.579,0.397-5.158,1.389-7.936c0.794-2.777,2.381-5.555,4.166-7.936c1.984-2.381,4.563-4.563,7.737-6.15
s6.944-2.579,11.507-2.579h32.337c2.579,0,5.158,0.397,7.936,1.389c2.777,0.794,5.555,2.381,7.936,4.166
c2.381,1.984,4.563,4.563,6.15,7.737C294.332,57.812,295.126,61.78,295.126,66.144z"/>
<path fill="#FFFFFF" d="M379.838,116.138h-17.855V74.675c0-2.381-0.397-4.365-1.19-6.348c-0.794-1.785-1.984-3.373-3.373-4.761
c-1.389-1.389-2.976-2.381-4.96-2.976c-1.785-0.794-3.968-0.992-5.952-0.992h-31.346v56.541h-17.855V50.471
c0-1.19,0.198-2.381,0.595-3.571c0.397-0.992,1.19-1.984,1.984-2.777c0.794-0.794,1.785-1.389,2.976-1.984
c1.19-0.397,2.182-0.595,3.571-0.595h40.471c2.182,0,4.563,0.198,7.142,0.794c2.579,0.595,4.96,1.389,7.539,2.381
c2.381,1.19,4.761,2.579,6.944,4.365c2.182,1.786,4.166,3.769,5.952,6.348c1.785,2.381,3.174,5.357,4.166,8.531
c0.992,3.174,1.587,6.944,1.587,10.911v41.265H379.838z"/>
<path fill="#FFFFFF" d="M502.839,116.138h-18.053V57.217l-31.742,55.946c-0.794,1.389-1.785,2.579-3.373,3.174
c-1.389,0.794-2.976,1.19-4.563,1.19s-2.976-0.397-4.365-1.19c-1.389-0.794-2.381-1.786-3.174-3.174l-31.941-55.946v58.922h-17.855
V24.879c0-1.984,0.595-3.968,1.785-5.555c1.19-1.587,2.777-2.777,4.761-3.174c0.992-0.198,1.984-0.397,2.976-0.198
c0.992,0,1.984,0.198,2.777,0.595c0.992,0.397,1.785,0.794,2.381,1.389c0.794,0.595,1.389,1.389,1.785,2.182l40.868,71.023
l40.868-71.023c0.992-1.786,2.579-2.976,4.365-3.769c1.785-0.794,3.769-0.794,5.753-0.397c1.984,0.595,3.571,1.587,4.761,3.174
c1.19,1.587,1.785,3.373,1.785,5.555v91.457H502.839z"/>
<path fill="#FFFFFF" d="M595.685,116.138h-62.493c-1.587,0-3.373-0.198-5.357-0.595c-1.984-0.397-3.769-0.992-5.753-1.786
c-1.786-0.794-3.571-1.984-5.357-3.174c-1.786-1.389-3.174-2.976-4.563-4.761c-1.389-1.786-2.381-3.968-3.174-6.547
c-0.794-2.381-1.19-5.158-1.19-8.332V42.337c0-1.587,0.198-3.373,0.595-5.357c0.397-1.984,0.992-3.769,1.785-5.753
c0.794-1.786,1.984-3.571,3.174-5.357c1.389-1.786,2.976-3.174,4.761-4.563c1.786-1.389,3.968-2.381,6.348-3.174
c2.381-0.794,5.158-1.19,8.332-1.19h62.493v17.855h-62.493c-2.381,0-4.166,0.595-5.357,1.786c-1.19,1.19-1.785,3.174-1.785,5.555
v48.407c0,2.381,0.595,4.166,1.984,5.357c1.19,1.19,2.976,1.984,5.357,1.984h62.493v18.252H595.685z"/>
<path fill="#FFFFFF" d="M697.658,35.195h-39.479v80.943h-17.855V35.195h-39.479V17.34h97.012v17.855H697.658z"/>
<path fill="#4F79F7" d="M98.125,49.083c-0.992-2.381-2.182-4.166-3.769-5.952c-1.587-1.587-3.571-2.777-5.952-3.769
c-2.381-0.992-4.96-1.389-7.936-1.389H65.192c-1.389,7.34-1.389,12.697-0.794,15.474c0.198-0.198,0.397-0.198,0.397-0.397
c1.587-1.389,3.571-3.174,6.15-4.166c1.785-0.794,3.769-1.19,5.555-1.19c3.174,0,5.952,1.19,7.936,3.373
c2.777,3.174,3.968,8.332,3.174,14.879c-1.984,16.07-11.308,17.26-14.086,17.26c-1.786,0-3.769-0.397-5.555-1.19
c-2.579-1.19-4.365-2.976-5.555-4.365l-0.198-0.198c-1.389,2.579-2.976,8.531-3.571,17.26h21.823c2.976,0,5.555-0.397,7.936-1.389
c2.381-0.992,4.365-2.182,5.952-3.769c1.587-1.587,2.777-3.571,3.769-5.753c0.992-2.381,1.389-4.96,1.389-7.936V57.018
C99.514,54.241,99.117,51.463,98.125,49.083z M61.82,72.096c2.777,0,4.365,4.365,7.936,5.952c4.761,2.182,11.308,0.397,12.895-12.3
s-4.761-14.482-9.919-12.3c-3.968,1.587-6.547,5.952-9.324,5.952c-3.571,0-5.158-8.134-2.976-21.426h-4.166
c-2.976,0-5.555,0.397-7.936,1.389c-2.381,0.992-4.365,2.182-5.952,3.769c-1.587,1.587-2.976,3.571-3.769,5.952
c-0.992,2.381-1.389,4.96-1.389,7.936v18.847c0,2.976,0.397,5.753,1.389,7.936c0.992,2.381,2.182,4.166,3.769,5.753
c1.587,1.587,3.571,2.777,5.952,3.769c1.587,0.595,3.373,0.992,5.357,1.19C54.479,80.825,58.249,72.096,61.82,72.096z"/>
<path fill="#4F79F7" d="M858.155,17.142l-16.665,93.045c-0.397,1.786-1.19,3.373-2.579,4.761c-1.389,1.389-2.777,2.182-4.761,2.579
s-3.769,0.198-5.357-0.595c-1.587-0.794-2.976-1.984-3.968-3.373l-32.933-54.16l-32.933,54.16
c-0.794,1.389-1.786,2.381-3.174,3.174c-1.389,0.794-2.777,1.19-4.365,1.19c-2.182,0-4.166-0.595-5.753-1.984
s-2.579-3.174-2.976-5.357l-16.665-93.045h18.252l11.903,65.468l28.37-45.233c0.794-1.389,1.786-2.381,3.174-3.174
s2.777-1.19,4.365-1.19c1.587,0,2.976,0.397,4.365,1.19c1.389,0.794,2.381,1.786,3.373,3.174l28.171,45.233l11.903-65.468h18.252
V17.142z"/>
<path fill="#4F79F7" d="M1024.802,91.141c0,1.786-0.198,3.571-0.595,5.357c-0.397,1.984-0.992,3.769-1.786,5.555
c-0.794,1.786-1.984,3.571-3.174,5.357c-1.389,1.786-2.976,3.174-4.761,4.563c-1.786,1.389-3.968,2.381-6.547,3.174
c-2.381,0.794-5.158,1.19-8.332,1.19H967.07c-1.786,0-3.571-0.198-5.357-0.595c-1.984-0.397-3.769-0.992-5.555-1.786
c-1.785-0.794-3.571-1.984-5.357-3.174c-1.786-1.389-3.174-2.976-4.563-4.761c-1.389-1.786-2.381-3.968-3.174-6.547
c-0.794-2.381-1.19-5.158-1.19-8.332V10h18.053v81.141c0,2.182,0.595,3.968,1.984,5.357s3.174,1.984,5.158,1.984h32.536
c2.182,0,3.968-0.595,5.357-1.984c1.19-1.389,1.984-3.174,1.984-5.357V66.938c0-2.182-0.595-3.968-1.984-5.357
c-1.389-1.19-2.976-1.984-5.158-1.984h-32.536V41.544h32.536c1.786,0,3.571,0.198,5.357,0.595c1.984,0.397,3.769,0.992,5.555,1.786
c1.786,0.794,3.571,1.984,5.357,3.174c1.785,1.389,3.174,2.976,4.563,4.761s2.381,3.968,3.174,6.547
c0.794,2.381,1.19,5.158,1.19,8.332v24.402H1024.802z"/>
<path fill="#4F79F7" d="M937.709,66.144c0,2.579-0.397,5.158-1.389,7.936c-0.794,2.777-2.381,5.555-4.166,7.936
c-1.984,2.381-4.563,4.563-7.737,6.15c-3.174,1.587-6.944,2.579-11.507,2.579h-32.337V73.683h32.337
c2.381,0,4.365-0.794,5.555-2.182c1.389-1.587,1.984-3.373,1.984-5.555c0-2.381-0.794-4.166-2.182-5.555
c-1.587-1.389-3.373-1.984-5.357-1.984h-32.337c-2.381,0-4.365,0.794-5.753,2.182c-1.389,1.587-1.984,3.373-1.984,5.555V91.34
c0,2.381,0.794,4.166,2.182,5.555c1.587,1.389,3.373,1.984,5.555,1.984h47.018v17.061h-47.018c-2.579,0-5.158-0.397-7.936-1.389
c-2.777-0.794-5.555-2.381-7.936-4.166c-2.381-1.984-4.563-4.563-6.15-7.737c-1.587-3.174-2.381-6.944-2.381-11.507V66.144
c0-2.579,0.397-5.158,1.389-7.936c0.794-2.777,2.381-5.555,4.166-7.936c1.984-2.381,4.563-4.563,7.737-6.15
c3.174-1.587,6.944-2.579,11.507-2.579h32.337c2.579,0,5.158,0.397,7.936,1.389c2.777,0.794,5.555,2.381,7.936,4.166
c2.381,1.984,4.563,4.563,6.15,7.737C936.717,57.812,937.709,61.78,937.709,66.144z"/>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 9.8 KiB

70
platform/commonUI/general/res/images/logo-openmctweb.svg
View File

@@ -1,70 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 509 65.2" enable-background="new 0 0 509 65.2" xml:space="preserve">
<g id="logo_s3_4_">
<g>
<g>
<path fill="#FFFFFF" d="M53.9,33.3c0,3-0.5,5.8-1.6,8.4c-1,2.5-2.5,4.7-4.3,6.6c-1.9,1.9-4,3.3-6.6,4.3c-2.5,1-5.3,1.5-8.3,1.5
H20.9c-3,0-5.8-0.5-8.3-1.5c-2.5-1-4.8-2.5-6.6-4.3c-1.9-1.9-3.3-4.1-4.4-6.6C0.5,39.1,0,36.3,0,33.3v-9.5c0-3,0.5-5.8,1.6-8.4
c1.1-2.6,2.5-4.8,4.4-6.6C7.8,7,10,5.5,12.5,4.5c2.5-1,5.3-1.6,8.3-1.6h12.2c3,0,5.8,0.5,8.3,1.6c2.5,1,4.7,2.5,6.6,4.3
c1.9,1.8,3.3,4,4.3,6.6c1,2.6,1.6,5.3,1.6,8.4V33.3z M44.8,23.8c0-1.8-0.3-3.4-0.9-4.8c-0.6-1.4-1.4-2.7-2.4-3.7
c-1-1-2.3-1.8-3.7-2.4c-1.4-0.6-3-0.9-4.8-0.9H20.9c-1.8,0-3.4,0.3-4.8,0.9c-1.4,0.6-2.7,1.4-3.7,2.4c-1,1-1.8,2.3-2.4,3.7
C9.3,20.4,9,22,9,23.8v9.5c0,1.8,0.3,3.4,0.9,4.8c0.6,1.5,1.4,2.7,2.4,3.7c1,1,2.3,1.8,3.7,2.4c1.4,0.6,3.1,0.9,4.8,0.9H33
c1.8,0,3.4-0.3,4.8-0.9c1.4-0.6,2.7-1.4,3.7-2.4c1-1,1.8-2.3,2.4-3.7c0.6-1.4,0.9-3.1,0.9-4.8V23.8z"/>
<path fill="#FFFFFF" d="M98.1,40.8c0,1.6-0.2,2.9-0.6,4.2c-0.4,1.2-0.9,2.3-1.6,3.3c-0.6,0.9-1.4,1.7-2.3,2.4
c-0.9,0.7-1.8,1.2-2.7,1.6c-0.9,0.4-1.9,0.7-2.8,0.9c-1,0.2-1.9,0.3-2.7,0.3H69.1v-9h16.3c1.2,0,2.1-0.3,2.7-0.9
c0.6-0.6,0.9-1.5,0.9-2.7V28.6c0-1.3-0.3-2.2-0.9-2.8c-0.6-0.6-1.5-0.9-2.7-0.9H69.2c-1.2,0-2.2,0.3-2.8,0.9
c-0.6,0.6-0.9,1.5-0.9,2.7v36.7h-9V28.5c0-1.6,0.2-2.9,0.6-4.2c0.4-1.2,0.9-2.3,1.6-3.3c0.7-0.9,1.4-1.7,2.3-2.4
c0.9-0.7,1.8-1.2,2.7-1.6c0.9-0.4,1.9-0.7,2.8-0.9c1-0.2,1.9-0.3,2.7-0.3h16.3c1.6,0,2.9,0.2,4.2,0.6c1.2,0.4,2.3,0.9,3.2,1.6
c0.9,0.6,1.7,1.4,2.4,2.3c0.7,0.9,1.2,1.8,1.6,2.7c0.4,0.9,0.7,1.9,0.9,2.8c0.2,1,0.3,1.9,0.3,2.7V40.8z"/>
<path fill="#FFFFFF" d="M141.2,28.3c0,1.3-0.2,2.6-0.7,4c-0.4,1.4-1.2,2.8-2.1,4c-1,1.2-2.3,2.3-3.9,3.1
c-1.6,0.8-3.5,1.3-5.8,1.3h-16.3v-8.6h16.3c1.2,0,2.2-0.4,2.8-1.1c0.7-0.8,1-1.7,1-2.8c0-1.2-0.4-2.1-1.1-2.8
c-0.8-0.7-1.7-1-2.7-1h-16.3c-1.2,0-2.2,0.4-2.9,1.1c-0.7,0.8-1,1.7-1,2.8V41c0,1.2,0.4,2.1,1.1,2.8c0.8,0.7,1.7,1,2.8,1h23.6
v8.6h-23.7c-1.3,0-2.6-0.2-4-0.7c-1.4-0.4-2.8-1.2-4-2.1c-1.2-1-2.3-2.3-3.1-3.9c-0.8-1.6-1.2-3.5-1.2-5.8V28.3
c0-1.3,0.2-2.6,0.7-4c0.4-1.4,1.2-2.8,2.1-4c1-1.2,2.3-2.3,3.9-3.1c1.6-0.8,3.5-1.3,5.8-1.3h16.3c1.3,0,2.6,0.2,4,0.7
c1.4,0.4,2.8,1.2,4,2.1c1.2,1,2.3,2.3,3.1,3.9C140.8,24.1,141.2,26.1,141.2,28.3z"/>
<path fill="#FFFFFF" d="M183.9,53.5h-9V32.6c0-1.2-0.2-2.2-0.6-3.2c-0.4-0.9-1-1.7-1.7-2.4c-0.7-0.7-1.5-1.2-2.5-1.5
c-0.9-0.4-2-0.5-3-0.5h-15.8v28.5h-9V20.4c0-0.6,0.1-1.2,0.3-1.8c0.2-0.5,0.6-1,1-1.4c0.4-0.4,0.9-0.7,1.5-1
c0.6-0.2,1.1-0.3,1.8-0.3h20.4c1.1,0,2.3,0.1,3.6,0.4c1.3,0.3,2.5,0.7,3.8,1.2c1.2,0.6,2.4,1.3,3.5,2.2c1.1,0.9,2.1,1.9,3,3.2
c0.9,1.2,1.6,2.7,2.1,4.3c0.5,1.6,0.8,3.5,0.8,5.5V53.5z"/>
<path fill="#FFFFFF" d="M245.9,53.5h-9.1V23.8l-16,28.2c-0.4,0.7-0.9,1.3-1.7,1.6c-0.7,0.4-1.5,0.6-2.3,0.6
c-0.8,0-1.5-0.2-2.2-0.6c-0.7-0.4-1.2-0.9-1.6-1.6l-16.1-28.2v29.7h-9v-46c0-1,0.3-2,0.9-2.8c0.6-0.8,1.4-1.4,2.4-1.6
c0.5-0.1,1-0.2,1.5-0.1c0.5,0,1,0.1,1.4,0.3c0.5,0.2,0.9,0.4,1.2,0.7c0.4,0.3,0.7,0.7,0.9,1.1l20.6,35.8l20.6-35.8
c0.5-0.9,1.3-1.5,2.2-1.9c0.9-0.4,1.9-0.4,2.9-0.2c1,0.3,1.8,0.8,2.4,1.6c0.6,0.8,0.9,1.7,0.9,2.8V53.5z"/>
<path fill="#FFFFFF" d="M292.7,53.5h-31.5c-0.8,0-1.7-0.1-2.7-0.3c-1-0.2-1.9-0.5-2.9-0.9c-0.9-0.4-1.8-1-2.7-1.6
c-0.9-0.7-1.6-1.5-2.3-2.4c-0.7-0.9-1.2-2-1.6-3.3c-0.4-1.2-0.6-2.6-0.6-4.2V16.3c0-0.8,0.1-1.7,0.3-2.7c0.2-1,0.5-1.9,0.9-2.9
c0.4-0.9,1-1.8,1.6-2.7c0.7-0.9,1.5-1.6,2.4-2.3c0.9-0.7,2-1.2,3.2-1.6c1.2-0.4,2.6-0.6,4.2-0.6h31.5v9h-31.5
c-1.2,0-2.1,0.3-2.7,0.9c-0.6,0.6-0.9,1.6-0.9,2.8v24.4c0,1.2,0.3,2.1,1,2.7c0.6,0.6,1.5,1,2.7,1h31.5V53.5z"/>
<path fill="#FFFFFF" d="M344.1,12.7h-19.9v40.8h-9V12.7h-19.9v-9h48.9V12.7z"/>
<path fill="#4F79F7" d="M41.9,19.7c-0.5-1.2-1.1-2.1-1.9-3c-0.8-0.8-1.8-1.4-3-1.9c-1.2-0.5-2.5-0.7-4-0.7h-7.7
c-0.7,3.7-0.7,6.4-0.4,7.8c0.1-0.1,0.2-0.1,0.2-0.2c0.8-0.7,1.8-1.6,3.1-2.1c0.9-0.4,1.9-0.6,2.8-0.6c1.6,0,3,0.6,4,1.7
c1.4,1.6,2,4.2,1.6,7.5c-1,8.1-5.7,8.7-7.1,8.7c-0.9,0-1.9-0.2-2.8-0.6c-1.3-0.6-2.2-1.5-2.8-2.2c0,0-0.1-0.1-0.1-0.1
c-0.7,1.3-1.5,4.3-1.8,8.7h11c1.5,0,2.8-0.2,4-0.7c1.2-0.5,2.2-1.1,3-1.9c0.8-0.8,1.4-1.8,1.9-2.9c0.5-1.2,0.7-2.5,0.7-4v-9.5
C42.6,22.3,42.4,20.9,41.9,19.7z M23.6,31.3c1.4,0,2.2,2.2,4,3c2.4,1.1,5.7,0.2,6.5-6.2c0.8-6.4-2.4-7.3-5-6.2
c-2,0.8-3.3,3-4.7,3c-1.8,0-2.6-4.1-1.5-10.8h-2.1c-1.5,0-2.8,0.2-4,0.7c-1.2,0.5-2.2,1.1-3,1.9c-0.8,0.8-1.5,1.8-1.9,3
c-0.5,1.2-0.7,2.5-0.7,4v9.5c0,1.5,0.2,2.9,0.7,4c0.5,1.2,1.1,2.1,1.9,2.9c0.8,0.8,1.8,1.4,3,1.9c0.8,0.3,1.7,0.5,2.7,0.6
C19.9,35.7,21.8,31.3,23.6,31.3z"/>
</g>
<g>
<path fill="#4F79F7" d="M425,3.6l-8.4,46.9c-0.2,0.9-0.6,1.7-1.3,2.4c-0.7,0.7-1.4,1.1-2.4,1.3c-1,0.2-1.9,0.1-2.7-0.3
c-0.8-0.4-1.5-1-2-1.7l-16.6-27.3L375,52.2c-0.4,0.7-0.9,1.2-1.6,1.6s-1.4,0.6-2.2,0.6c-1.1,0-2.1-0.3-2.9-1
c-0.8-0.7-1.3-1.6-1.5-2.7l-8.4-46.9h9.2l6,33l14.3-22.8c0.4-0.7,0.9-1.2,1.6-1.6c0.7-0.4,1.4-0.6,2.2-0.6c0.8,0,1.5,0.2,2.2,0.6
c0.7,0.4,1.2,0.9,1.7,1.6l14.2,22.8l6-33H425z"/>
<path fill="#4F79F7" d="M509,40.9c0,0.9-0.1,1.8-0.3,2.7c-0.2,1-0.5,1.9-0.9,2.8c-0.4,0.9-1,1.8-1.6,2.7
c-0.7,0.9-1.5,1.6-2.4,2.3c-0.9,0.7-2,1.2-3.3,1.6c-1.2,0.4-2.6,0.6-4.2,0.6h-16.4c-0.9,0-1.8-0.1-2.7-0.3
c-1-0.2-1.9-0.5-2.8-0.9c-0.9-0.4-1.8-1-2.7-1.6c-0.9-0.7-1.6-1.5-2.3-2.4c-0.7-0.9-1.2-2-1.6-3.3c-0.4-1.2-0.6-2.6-0.6-4.2V0
h9.1v40.9c0,1.1,0.3,2,1,2.7c0.7,0.7,1.6,1,2.6,1h16.4c1.1,0,2-0.3,2.7-1c0.6-0.7,1-1.6,1-2.7V28.7c0-1.1-0.3-2-1-2.7
c-0.7-0.6-1.5-1-2.6-1h-16.4v-9.1h16.4c0.9,0,1.8,0.1,2.7,0.3c1,0.2,1.9,0.5,2.8,0.9c0.9,0.4,1.8,1,2.7,1.6
c0.9,0.7,1.6,1.5,2.3,2.4c0.7,0.9,1.2,2,1.6,3.3c0.4,1.2,0.6,2.6,0.6,4.2V40.9z"/>
<path fill="#4F79F7" d="M465.1,28.3c0,1.3-0.2,2.6-0.7,4c-0.4,1.4-1.2,2.8-2.1,4c-1,1.2-2.3,2.3-3.9,3.1
c-1.6,0.8-3.5,1.3-5.8,1.3h-16.3v-8.6h16.3c1.2,0,2.2-0.4,2.8-1.1c0.7-0.8,1-1.7,1-2.8c0-1.2-0.4-2.1-1.1-2.8
c-0.8-0.7-1.7-1-2.7-1h-16.3c-1.2,0-2.2,0.4-2.9,1.1c-0.7,0.8-1,1.7-1,2.8V41c0,1.2,0.4,2.1,1.1,2.8c0.8,0.7,1.7,1,2.8,1H460v8.6
h-23.7c-1.3,0-2.6-0.2-4-0.7c-1.4-0.4-2.8-1.2-4-2.1c-1.2-1-2.3-2.3-3.1-3.9c-0.8-1.6-1.2-3.5-1.2-5.8V28.3c0-1.3,0.2-2.6,0.7-4
c0.4-1.4,1.2-2.8,2.1-4c1-1.2,2.3-2.3,3.9-3.1c1.6-0.8,3.5-1.3,5.8-1.3h16.3c1.3,0,2.6,0.2,4,0.7c1.4,0.4,2.8,1.2,4,2.1
c1.2,1,2.3,2.3,3.1,3.9C464.6,24.1,465.1,26.1,465.1,28.3z"/>
</g>
</g>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 6.6 KiB

44
platform/commonUI/general/res/sass/_about.scss
View File

@@ -20,64 +20,29 @@
* at runtime from the About dialog for additional information.
*****************************************************************************/
// General About dialog styling
// Depends on styles loaded via /platform/commonUI/general/res/sass/startup-base.scss
.l-about {
// Layout
&.abs {
// top: 20px;
overflow: auto;
}
$contentH: 200px;
.l-logo-holder {
.l-splash {
position: relative;
height: 45%;
.l-logo {
$w: 5%;
position: absolute;
&.l-logo-app {
// @include test(blue);
top: 0; right: 15%; bottom: 0; left: 15%;
}
&.s-logo-nasa {
// @include test(red);
$m: 10px;
background-image: url($dirImgs + 'logo-nasa.svg');
top: $m; right: auto; bottom: auto; left: $m;
width: $w * 2; height: auto; padding-bottom: $w; padding-top: $w;
}
}
}
.l-content {
// @include test();
position: relative;
margin-top: $interiorMarginLg;
}
}
.s-about {
// Styling
line-height: 120%;
a {
color: $colorAboutLink;
}
.s-description,
.s-info {
// font-size: 0.8em;
}
.s-logo-holder {
background: url($dirImgs + "bg-about-openmctweb.jpg") no-repeat center; // For OpenMCT Web.
background-size: cover;
}
.s-logo {
// @include txtShdwLarge(); // text-shadow doesn't work for svg
background-position: center;
background-repeat: no-repeat;
background-size: contain;
}
.s-logo-openmctweb {
background-image: url($dirImgs + 'logo-openmctweb-shdw.svg');
}
.s-btn {
line-height: 2em;
}
@@ -90,10 +55,6 @@
}
em {
color: pushBack($colorBodyFg, 20%);
// margin-left: 2em;
&:first-child {
// margin-left: 0;
}
}
h3 {
font-size: 1.25em;
@@ -104,4 +65,3 @@
}
}
}

8
platform/commonUI/general/res/sass/_archetypes.scss
View File

@@ -34,7 +34,7 @@
.cols {
@include clearfix;
.col {
@include box-sizing(border-box);
box-sizing: border-box;
@include clearfix;
float: left;
margin-left: $ueColMargin;
@@ -94,7 +94,7 @@
/********************************************* FLEX STYLES */
.l-flex-row,
.l-flex-col {
@include display-flex;
@include display(flex);
@include flex-wrap(nowrap);
.flex-elem {
min-height: 0; // Needed to allow element to shrink within parent
@@ -111,7 +111,7 @@
}
.flex-container {
// Apply to wrapping elements, mct-includes, etc.
@include display-flex;
@include display(flex);
@include flex-wrap(nowrap);
@include flex(1 1 auto);
min-height:0;
@@ -144,4 +144,4 @@
.flex-justify-end {
@include justify-content(flex-end);
}
}

6
platform/commonUI/general/res/sass/_autoflow.scss
View File

@@ -64,7 +64,7 @@
white-space: nowrap;
.l-autoflow-col {
// @include test();
@include box-sizing(border-box);
box-sizing: border-box;
border-left: 1px solid $colorInteriorBorder;
display: inline-block;
// height: 100%;
@@ -74,7 +74,7 @@
width: $colW;
.l-autoflow-row {
// @include test(red);
@include box-sizing(border-box);
box-sizing: border-box;
border-bottom: 1px solid rgba(#fff,0.05);
display: block;
height: $rowH;
@@ -110,7 +110,7 @@
width: auto;
}
&.r {
@include border-radius($smallCr);
border-radius: $smallCr;
float: right;
margin-left: $interiorMargin;
padding-left: $valPad;

6
platform/commonUI/general/res/sass/_badges.scss
View File

@@ -27,7 +27,7 @@
}
.top-bar .badge {
@include border-radius($controlCr * 1.5);
border-radius: $controlCr * 1.5;
$h: $btnStdH; //$ueTopBarBtnH; // - 5px;
font-size: 1.4em;
height: $h;
@@ -39,7 +39,7 @@
//.top-bar .btn-browse .badge {
// Moved to _controls.scss .btn.browse-btn
// @include border-radius($controlCr * 1.5);
// border-radius: $controlCr * 1.5;
// $d: 20px;
// display: block;
// font-size: 1em;
@@ -53,7 +53,7 @@
.super-menu .badge {
@include background-image(linear-gradient(lighten($colorCreateBtn, 10%), $colorCreateBtn));
@include border-radius($controlCr);
border-radius: $controlCr;
@include boxShdwSubtle();
// display: inline-block;
// margin-right: 10px !important;

4
platform/commonUI/general/res/sass/_constants.scss
View File

@@ -40,11 +40,11 @@ $ueTopBarEditH: 30px;
$ueTopBarBtnH: 35px;
$ueFooterH: 25px;
$ueColMargin: 1.5%;
$ueAppLogoW: 105px;
$ueAppLogoW: 80px;
$ueEditToolBarH: 25px;
$ueCollapsedPaneEdgeM: 22px;
$uePaneMiniTabH: $ueTopBarH;
$uePaneMiniTabW: 9px;
$uePaneMiniTabW: 10px;
$uePaneMiniTabCollapsedW: 11px;
$ueEditLeftPaneW: 75%;
$treeSearchInputBarH: 25px;

66
platform/commonUI/general/res/sass/_effects.scss
View File

@@ -19,59 +19,35 @@
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
.disabled,
a.disabled {
@include opacity($controlDisabledOpacity);
pointer-events: none !important;
cursor: default !important;
}
.incised {
@include boxIncised(0.8);
border-bottom: 1px solid rgba(#fff, 0.3);
}
.test-stripes {
@include bgDiagonalStripes();
}
.test {
@include test();
}
@mixin customKeyframes($animName: pulse, $op0: 0.5) {
@include keyframes($animName) {
0% { opacity: $op0; }
100% { opacity: 1; }
}
@include animation-name(pulse, 0.2);
}
@mixin pulse($dur: 500ms, $iteration: infinite, $opacity0: 0.5, $opacity100: 1) {
@include keyframes(pulse) {
@mixin pulse($animName: pulse, $dur: 500ms, $iteration: infinite, $opacity0: 0.5, $opacity100: 1) {
@include keyframes($animName) {
0% { opacity: $opacity0; }
100% { opacity: $opacity100; }
}
@include animation-name(pulse);
@include animation-name($animName);
@include animation-duration($dur);
@include animation-direction(alternate);
@include animation-iteration-count($iteration);
@include animation-timing-function(ease-in-out);
}
@mixin pulseBorder($c: red, $dur: 500ms, $iteration: infinite, $delay: 0s, $opacity0: 0, $opacity100: 1) {
@include keyframes(pulseBorder) {
0% { border-color: rgba($c, $opacity0); }
100% { border-color: rgba($c, $opacity100); }
}
@include animation-name(pulseBorder);
@include animation-duration($dur);
@include animation-direction(alternate);
@include animation-iteration-count($iteration);
@include animation-timing-function(ease);
@include animation-delay($delay);
.pulse {
@include pulse($animName: pulse, $dur: 750ms);
}
.pulse {
@include pulse(750ms);
}
.pulse-subtle {
@include pulse($animName: pulse-subtle, $dur: 500ms, $opacity0: 0.7);
}
@mixin pulseBorder($c: red, $dur: 500ms, $iteration: infinite, $delay: 0s, $opacity0: 0, $opacity100: 1) {
@include keyframes(pulseBorder) {
0% { border-color: rgba($c, $opacity0); }
100% { border-color: rgba($c, $opacity100); }
}
@include animation-name(pulseBorder);
@include animation-duration($dur);
@include animation-direction(alternate);
@include animation-iteration-count($iteration);
@include animation-timing-function(ease);
@include animation-delay($delay);
}

8
platform/commonUI/general/res/sass/_fixed-position.scss
View File

@@ -61,7 +61,7 @@
.l-fixed-position-box,
.l-fixed-position-image,
.l-fixed-position-text {
@include box-sizing(border-box);
box-sizing: border-box;
height: 100%;
width: 100%;
}
@@ -89,7 +89,7 @@
.l-elem {
//@include absPosDefault($p);
//@include absPosDefault(0);
@include box-sizing(border-box);
box-sizing: border-box;
display: block;
padding: 2px;
//width: 50%;
@@ -106,7 +106,7 @@
// @include test(blue);
// right: $p;
// left: auto;
@include border-radius($smallCr);
border-radius: $smallCr;
$valPad: 5px;
float: right;
margin-left: $interiorMargin;
@@ -125,7 +125,7 @@
.l-fixed-position-item-handle {
$brd: 1px solid $colorKey;
// @include border-radius($controlCr);
// border-radius: $controlCr;
background: rgba($colorKey, 0.5);
cursor: crosshair;
border: $brd;

20
platform/commonUI/general/res/sass/_global.scss
View File

@@ -46,7 +46,6 @@ a {
body, html {
-webkit-font-smoothing: subpixel-antialiased;
-moz-osx-font-smoothing: grayscale;
background-color: $colorBodyBg;
color: $colorBodyFg;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
@@ -113,6 +112,13 @@ mct-container {
padding: 1em;
}
.disabled,
a.disabled {
opacity: $controlDisabledOpacity;
pointer-events: none !important;
cursor: default !important;
}
.align-right {
text-align: right;
}
@@ -139,7 +145,7 @@ mct-container {
}
.ds {
@include box-shadow(rgba(#000, 0.7) 0 4px 10px 2px);
box-shadow: rgba(#000, 0.7) 0 4px 10px 2px;
}
.hide,
@@ -159,4 +165,12 @@ mct-container {
.sep {
color: rgba(#fff, 0.2);
}
}
.test-stripes {
@include bgDiagonalStripes();
}
.test {
@include test();
}

2
platform/commonUI/general/res/sass/_icons.scss
View File

@@ -93,7 +93,7 @@
height: auto; width: auto;
position: absolute;
left: 0; top: 0; right: 0; bottom: 10%;
@include transform-origin(bottom, left);
@include transform-origin(bottom left);
@include transform(scale(0.3));
z-index: 2;
}

46
platform/commonUI/general/res/sass/_inspector.scss
View File

@@ -32,14 +32,16 @@
color: $colorInspectorFg;
line-height: 140%;
.flex-elem.holder:not(:last-child) { margin-bottom: $interiorMargin; }
.flex-elem.holder:not(:last-child) {
margin-bottom: $interiorMargin;
}
.pane-header {
color: pushBack($colorInspectorFg, 20%);
font-size: 0.8rem;
&:before {
color: pushBack($colorInspectorFg, 10%);
content:'\e615'; // e615 Crosshair symbol
content: '\e615'; // e615 Crosshair symbol
display: inline;
font-family: symbolsfont;
margin-right: $interiorMargin;
@@ -56,14 +58,28 @@
}
}
}
ul {
@include box-sizing(border-box);
.l-inspector-part {
box-sizing: border-box;
padding-right: $interiorMargin;
.form {
margin-left: $treeVCW + $interiorMarginLg;
margin-bottom: $interiorMarginLg;
.form-section {
margin-bottom: 0;
&:not(.first) {
border-top: 1px solid $colorFormLines;
}
.form-row {
@include align-items(center);
border: none;
padding: 0;
}
}
}
}
ul li,
em {
em.t-inspector-part-header {
display: block;
position: relative;
}
@@ -71,9 +87,9 @@
ul li {
margin-bottom: $interiorMarginLg;
}
em {
@include border-radius($basicCr);
em.t-inspector-part-header {
border-radius: $basicCr;
background-color: $colorInspectorSectionHeaderBg;
color: $colorInspectorSectionHeaderFg;
margin-bottom: $interiorMargin;
@@ -99,7 +115,7 @@
.inspector-location {
.location-item {
$h: 1.2em;
@include box-sizing(border-box);
box-sizing: border-box;
cursor: pointer;
display: inline-block;
line-height: $h;
@@ -154,8 +170,16 @@
}
}
mct-representation:not(.s-status-editing) .l-inspect {
.split-pane-component.pane.top {
bottom: 0 !important;
}
}
.s-status-editing .l-inspect {
.location-item { pointer-events: none; }
.location-item {
pointer-events: none;
}
.splitter-inspect-panel,
.split-pane-component.pane.bottom {
opacity: 1;

64
platform/commonUI/general/res/sass/_logo-and-bg.scss Normal file
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.
*****************************************************************************/
.l-splash,
.l-splash:before,
.l-splash:after {
background-position: center;
background-repeat: no-repeat;
position: absolute;
}
.l-splash {
background-size: cover;
top: 0;
right: 0;
bottom: 0;
left: 0;
&:before,
&:after {
background-size: contain;
content: '';
}
&:before {
// NASA logo, dude
$w: 5%;
$m: 10px;
background-image: url('../images/logo-nasa.svg');
top: $m;
right: auto;
bottom: auto;
left: $m;
height: auto;
width: $w * 2;
padding-bottom: $w;
padding-top: $w;
}
&:after {
// App logo
top: 0;
right: 15%;
bottom: 0;
left: 15%;
}
}

57
platform/commonUI/general/res/sass/_mixins.scss
View File

@@ -175,8 +175,8 @@
@mixin sliderTrack($bg: $scrollbarTrackColorBg) {
//$b: 1px solid lighten($bg, 30%);
@include border-radius(2px);
@include box-sizing(border-box);
border-radius: 2px;
box-sizing: border-box;
@include boxIncised(0.7);
background-color: $bg;
//border-bottom: $b;
@@ -210,7 +210,7 @@
}
@mixin boxIncised($sVal: 0.6, $inset: 5px) {
@include box-shadow(inset rgba(black, $sVal) 0 1px $inset);
box-shadow: inset rgba(black, $sVal) 0 1px $inset;
}
@mixin boxOutline($c: lighten($colorBodyBg, 20%)) {
@@ -219,24 +219,24 @@
@mixin boxShdw($sVal: rgba(black, 0.4) 0 0 3px) {
@if $sVal != 'none' {
@include box-shadow($sVal);
box-shadow: $sVal;
}
}
@mixin boxShdwSubtle($sVal: 0.2) {
@if $sVal != 'none' {
@include box-shadow(rgba(black, $sVal) 0 1px 2px);
box-shadow: rgba(black, $sVal) 0 1px 2px;
}
}
@mixin boxShdwLarge($sVal: 0.7) {
@if $sVal != 'none' {
@include box-shadow(rgba(black, $sVal) 0 3px 10px);
box-shadow: rgba(black, $sVal) 0 3px 10px;
}
}
@mixin outerGlow($color: #fff, $sVal: 0.3) {
@include box-shadow(rgba($color, $sVal) 0 0 30px);
box-shadow: rgba($color, $sVal) 0 0 30px;
}
@mixin linearGlow($deg: 0, $c: red, $a: 0.4) {
@@ -249,18 +249,18 @@
@mixin txtShdw($sVal) {
//@if $sVal != 'none' {
@include text-shadow($sVal);
text-shadow: $sVal;
//}
}
@mixin txtShdwSubtle($sVal: 0.1) {
@if $sVal != 'none' {
@include text-shadow(rgba(black, $sVal) 0 1px 2px);
text-shadow: rgba(black, $sVal) 0 1px 2px;
}
}
@mixin txtShdwLarge($sVal: 0.7) {
@include text-shadow(rgba(black, $sVal) 0 3px 7px);
text-shadow: rgba(black, $sVal) 0 3px 7px;
}
@function pullForward($c, $p: 20%) {
@@ -291,35 +291,32 @@
@mixin containerBase($bg: $colorBodyBg, $fg: $colorBodyFg) {
background-color: $bg;
@include border-radius($controlCr);
@include box-sizing(border-box);
border-radius: $controlCr;
box-sizing: border-box;
color: $fg;
display: inline-block;
}
@mixin btnBase($bg: $colorBodyBg, $bgHov: none, $fg: $colorBodyFg, $ic: $colorBtnIcon) {
@mixin btnBase($bg: $colorBodyBg, $bgHovColor: none, $fg: $colorBodyFg, $ic: $colorBtnIcon) {
@include user-select(none);
@include transition(background, .25s);
.icon {
color: $ic;
}
@include desktop {
@if $bgHov != none {
&:not(.disabled):hover {
@include background-image($bgHov);
>.icon {
color: lighten($ic, $ltGamma);
}
}
}
}
@if $bgHovColor != none {
&:not(.disabled):hover {
background: $bgHovColor; // was just background, and background-image before that
>.icon {
color: lighten($ic, $ltGamma);
}
}
}
}
@mixin input-base($bg: $colorInputBg, $fg: $colorInputFg, $shdw: rgba(black, 0.6) 0 1px 3px) {
@include appearance(none);
@include border-radius($controlCr);
@include box-sizing(border-box);
@include box-shadow(inset $shdw);
border-radius: $controlCr;
box-sizing: border-box;
box-shadow: inset $shdw;
background: $bg;
border: none;
color: $fg;
@@ -335,7 +332,7 @@
}
@mixin contextArrow() {
@include text-shadow(none);
text-shadow: none;
content: '\76';
display: inline-block;
font-family: 'symbolsfont';
@@ -408,13 +405,13 @@
}
@mixin tmpBorder($c: #ffcc00, $a: 0.75) {
@include box-sizing(border-box);
box-sizing: border-box;
border: 1px dotted rgba($c, $a);
}
@mixin testObj($w: 2000px, $h: 1000px, $c: black, $a: 0.1) {
&:after {
@include box-sizing(border-box);
box-sizing: border-box;
@include bgDiagonalStripes($c, $a);
color: rgba(white, 0.3);
font-style: italic;

4
platform/commonUI/general/res/sass/_object-label.scss
View File

@@ -41,12 +41,9 @@ mct-representation {
.t-item-icon {
&:before {
$spinBW: 4px;
$spinD: 0;
@include spinner($spinBW);
content: "";
padding: 30%;
width: $spinD;
height: $spinD;
}
.t-item-icon-glyph {
display: none;
@@ -59,6 +56,7 @@ mct-representation {
}
}
}
.selected mct-representation.s-status-pending .t-object-label .t-item-icon:before {
border-color: rgba($colorItemTreeSelectedFg, 0.25) !important;
border-top-color: rgba($colorItemTreeSelectedFg, 1.0) !important;

6
platform/commonUI/general/res/sass/controls/_breadcrumb.scss
View File

@@ -8,9 +8,9 @@
.l-breadcrumb-item {
//@include test();
a {
@include box-sizing(border-box);
@include border-radius($basicCr*.75);
@include single-transition(background-color, 0.25s);
box-sizing: border-box;
border-radius: $basicCr*.75;
@include transition(background-color, 0.25s);
color: darken($colorBodyFg, 15%);
display: inline-block;
//margin-right: $interiorMargin;

232
platform/commonUI/general/res/sass/controls/_buttons.scss
View File

@@ -32,7 +32,7 @@ $pad: $interiorMargin * $baseRatio;
}
.s-btn {
@include box-sizing(border-box);
box-sizing: border-box;
padding: 0 $pad;
font-size: 0.7rem;
vertical-align: top;
@@ -66,7 +66,7 @@ $pad: $interiorMargin * $baseRatio;
&:not(.major) {
// bg, bgHov, fg, ic
@include btnSubtle($colorBtnBg, $colorKey, $colorBtnFg, $colorBtnIcon);
@include btnSubtle($colorBtnBg, $colorBtnBgHov, $colorBtnFg, $colorBtnIcon);
}
&.pause-play {
@@ -91,7 +91,7 @@ $pad: $interiorMargin * $baseRatio;
&.paused {
@include btnSubtle($colorPausedBg, pushBack($colorPausedBg, 10%), $colorPausedFg, $colorPausedFg);
.icon {
@include pulse(1000ms);
@include pulse($dur: 1000ms);
:before {
content: "\0000EF";
}
@@ -111,172 +111,154 @@ $pad: $interiorMargin * $baseRatio;
// Color and styling additionally in _controls.scss
}
.mini-tab {
body.desktop .mini-tab {
// Meant to be used as pane hide/show control elements in concert with mct-splitter
//@extend .ui-symbol;
@include desktop {
//@include test(green);
$iconH: $uePaneMiniTabH;
$iconW: $uePaneMiniTabW;
$iconInnerLR: 0;
$arwD: 9px;
$arwOffsetX: 0px;
$arwAnimOffsetX: 2px + $iconInnerLR;
$cBg: pullForward($colorBodyBg, 15%);
$cFg: $cBg;
$iconH: $uePaneMiniTabH;
$iconW: $uePaneMiniTabW;
$iconInnerLR: 0;
$arwD: 9px;
$arwOffsetX: 0px;
$arwAnimOffsetX: 2px + $iconInnerLR;
$cBg: pullForward($colorBodyBg, 15%);
$cFg: $cBg;
@include border-radius($basicCr);
//@include boxShdw($shdwBtns);
@include box-sizing(border-box);
@include trans-prop-nice((color, background-color), 100ms);
color: $cFg;
cursor: pointer;
font-family: symbolsfont;
font-size: $arwD;
display: block;
position: absolute;
line-height: $iconH;
height: $iconH; width: $iconW;
text-align: center;
border-radius: $basicCr;
//@include boxShdw($shdwBtns);
box-sizing: border-box;
@include trans-prop-nice((color, background-color), 100ms);
color: $cFg;
cursor: pointer;
font-family: symbolsfont;
font-size: $arwD;
display: block;
position: absolute;
line-height: $iconH;
height: $iconH; width: $iconW;
text-align: center;
&.collapsed {
// State when the pane this element controls has been collapsed
@include btnSubtle($colorBtnBg, $colorKey, $colorBtnFg, $colorBtnIcon);
&:before { opacity: 0; }
&:after { opacity: 1; }
&:hover {
//background-color: $cBg;
color: $colorKey; //pullForward($cFg, $ltGamma);
&:before { opacity: 1; }
&:after { opacity: 0; }
}
&.collapsed {
// State when the pane this element controls has been collapsed
@include btnSubtle($colorBtnBg, $colorKey, $colorBtnFg, $colorBtnIcon);
&:before { opacity: 0; }
&:after { opacity: 1; }
&:hover {
&:before { opacity: 1; }
&:after { opacity: 0; }
}
}
}
&:before,
&:after {
@include trans-prop-nice((left, right, opacity), 250ms);
display: block;
height: 100%;
position: absolute;
}
&:before,
&:after {
//@include test();
@include trans-prop-nice((left, right, opacity), 250ms);
display: block;
height: 100%;
position: absolute;
}
&:before {
// Always the arrow icon
width: $arwD;
}
&:after {
// Always icon; content is set in _layout.scss
width: 100%;
text-align: center;
opacity: 0;
}
&.anchor-left {
// |<
text-align: right;
&:before {
// Always the arrow icon
//@include test(green);
//font-size: $arwD;
width: $arwD;
content:'\3c'; // Collapse left icon e613
right: $iconInnerLR;
}
&:after {
// Always icon; content is set in _layout.scss
width: 100%;
text-align: center;
opacity: 0;
}
&.anchor-left {
// |<
text-align: right;
&:before {
content:'\3c'; // Collapse left icon e613
right: $iconInnerLR;
}
//&:hover:before { right: $arwAnimOffsetX; }
&.collapsed {
@include border-left-radius(0);
text-align: left;
&:before {
content:'\3e';
left: $iconInnerLR;
}
&:hover:before { left: $arwAnimOffsetX; }
}
}
&.anchor-right {
// >|
&.collapsed {
@include border-left-radius(0);
text-align: left;
&:before {
content:'\3e'; // Collapse right icon e614
content:'\3e';
left: $iconInnerLR;
}
//&:hover:before { left: $arwAnimOffsetX; }
&.collapsed {
@include border-right-radius(0);
&:before {
text-align: right;
content:'\3c';
right: $iconInnerLR;
}
&:hover:before { right: $arwAnimOffsetX; }
&:hover:before { left: $arwAnimOffsetX; }
}
}
&.anchor-right {
// >|
text-align: left;
&:before {
content:'\3e'; // Collapse right icon e614
left: $iconInnerLR;
}
&.collapsed {
@include border-right-radius(0);
&:before {
text-align: right;
content:'\3c';
right: $iconInnerLR;
}
&:hover:before { right: $arwAnimOffsetX; }
}
}
}
.mini-tab-icon {
body.desktop .mini-tab-icon {
// Meant to be used as pane hide/show control elements in concert with mct-splitter
//@extend .ui-symbol;
@include desktop {
$d: $uePaneMiniTabW;
//@include trans-prop-nice(transform, 150ms);
color: pullForward($colorBodyBg, 15%);
cursor: pointer;
display: block;
font-family: symbolsfont;
font-size: $d;
$d: $uePaneMiniTabW;
color: pullForward($colorBodyBg, 15%);
cursor: pointer;
display: block;
font-family: symbolsfont;
font-size: $d;
position: absolute;
height: $d; width: $d;
line-height: $d;
overflow: hidden;
word-break: break-all;
&.collapsed {
$d: $uePaneMiniTabCollapsedW;
width: $d; font-size: $d;
}
&:before,
&:after {
position: absolute;
height: $d; width: $d;
line-height: $d;
overflow: hidden;
word-break: break-all;
display: inherit;
}
&.collapsed {
$d: $uePaneMiniTabCollapsedW;
width: $d; font-size: $d;
}
&:before {
content: '\78'; // X icon
}
&:before,
&:after {
position: absolute;
display: inherit;
}
&:before {
content: '\78'; // X icon
}
&:hover {
color: $colorKey;
//@include transform(scale(1.2));
}
&:hover {
color: $colorKey;
}
}
.l-btn-set {
// Buttons that have a very tight conceptual grouping - no internal space between them.
// Structure: .btn-set > mct-representation class=first|last > .s-btn
//@include test(red);
font-size: 0; // Remove space between s-btn elements due to white space in markup
.s-btn {
@include border-radius(0);
border-radius: 0;
margin-left: 1px;
}
.first {
.s-btn {
.s-btn,
&.s-btn {
@include border-left-radius($controlCr);
margin-left: 0;
}
}
.last {
.s-btn {
.s-btn,
&.s-btn {
@include border-right-radius($controlCr);
}
}

4
platform/commonUI/general/res/sass/controls/_color-palette.scss
View File

@@ -25,7 +25,7 @@
$m: 1;
$colorSelectedColor: #fff;
@include box-sizing(border-box);
box-sizing: border-box;
padding: $interiorMargin !important;
.l-palette-row {
@@ -34,7 +34,7 @@
width: ($d * $colorsPerRow) + ($m * $colorsPerRow);
.l-palette-item {
@include box-sizing(border-box);
box-sizing: border-box;
@include txtShdwSubtle(0.8);
@include trans-prop-nice-fade(0.25s);
border: 1px solid transparent;

69
platform/commonUI/general/res/sass/controls/_controls.scss
View File

@@ -28,8 +28,8 @@
}
.accordion-head {
$op: 0.2;
@include border-radius($basicCr * 0.75);
@include box-sizing("border-box");
border-radius: $basicCr * 0.75;
box-sizing: "border-box";
background: rgba($colorBodyFg, $op);
cursor: pointer;
font-size: 0.75em;
@@ -83,8 +83,7 @@
.l-control-group {
// Buttons that have a conceptual grouping - internal space between, and a divider between groups.
// @include test();
@include box-sizing(border-box);
box-sizing: border-box;
border-left: 1px solid $colorInteriorBorder;
display: inline-block;
padding: 0 $interiorMargin;
@@ -109,31 +108,29 @@
font-size: 0.7rem;
}
label.checkbox.custom {
label.checkbox.custom,
label.radio.custom {
$bg: pullForward($colorBodyBg, 10%);
$d: $formRowCtrlsH;
cursor: pointer;
display: inline-block;
line-height: $d;
margin-right: $interiorMargin * 4;
padding-left: $d + $interiorMargin;
position: relative;
vertical-align: middle; // was top
em {
color: $colorBodyFg;
display: inline-block;
height: $d;
min-width: $d;
width: $d;
&:before {
@include border-radius($basicCr * .75);
border-radius: $basicCr * .75;
background: $bg;
@include box-shadow(inset rgba(black, 0.4) 0 1px 2px);
box-shadow: inset rgba(black, 0.4) 0 1px 2px;
box-sizing: border-box;
content: " ";
content: "";
font-family: 'symbolsfont';
font-size: 0.8em;
font-size: 0.7em;
display: inline-block;
margin-right: $interiorMargin;
height: $d;
width: $d;
left: 0;
@@ -157,11 +154,13 @@ label.checkbox.custom {
&:checked ~ em:before {
background: $colorCheck;
color: lighten($colorCheck, 50%);
content: "2";
}
}
}
label.checkbox.custom input:checked ~ em:before { content: "\32"; }
label.radio.custom input:checked ~ em:before { content: "\e619"; }
.input-labeled {
margin-left: $interiorMargin;
label {
@@ -182,7 +181,7 @@ label.checkbox.custom {
.item .checkbox {
&.checked label {
@include box-shadow(none);
box-shadow: none;
border-bottom: none;
}
}
@@ -235,16 +234,16 @@ label.checkbox.custom {
font-size: 0.7em;
@include webkitProp(flex, '0 0 1');
}
}
@include desktop {
body.desktop .object-header {
.context-available {
@include trans-prop-nice(opacity, 0.25s);
opacity: 0;
}
&:hover {
.context-available {
@include trans-prop-nice(opacity, 0.25s);
opacity: 0;
}
&:hover {
.context-available {
opacity: 1;
}
opacity: 1;
}
}
}
@@ -293,13 +292,13 @@ label.checkbox.custom {
}
.s-progress-bar {
@include border-radius($basicCr);
border-radius: $basicCr;
@include boxIncised(0.3, 4px);
background: $colorProgressBarOuter;
.progress-amt {
@include border-radius($basicCr);
border-radius: $basicCr;
@include boxShdw();
@include border-radius($basicCr - 1);
border-radius: $basicCr - 1;
@include trans-prop-nice(width);
&:before {
background-color: $colorProgressBarAmt;
@@ -333,7 +332,7 @@ label.checkbox.custom {
/******************************************************** SLIDERS */
.slider {
$knobH: 100%; //14px;
$knobH: 100%;
.slot {
width: auto;
position: absolute;
@@ -369,7 +368,7 @@ label.checkbox.custom {
background-color: $sliderColorRange;
cursor: ew-resize;
position: absolute;
top: 0; //$tbOffset;
top: 0;
right: auto;
bottom: 0;
left: auto;
@@ -433,7 +432,7 @@ label.checkbox.custom {
.l-calendar {
$colorMuted: pushBack($colorMenuFg, 30%);
ul.l-cal-row {
@include display-flex;
@include display(flex);
@include flex-flow(row nowrap);
margin-top: 1px;
&:first-child {
@@ -481,11 +480,11 @@ label.checkbox.custom {
/******************************************************** BROWSER ELEMENTS */
@include desktop {
body.desktop {
::-webkit-scrollbar {
@include border-radius(2px);
@include box-sizing(border-box);
@include box-shadow(inset $scrollbarTrackShdw);
border-radius: 2px;
box-sizing: border-box;
box-shadow: inset $scrollbarTrackShdw;
background-color: $scrollbarTrackColorBg;
height: $scrollbarTrackSize;
width: $scrollbarTrackSize;
@@ -496,8 +495,8 @@ label.checkbox.custom {
$hc: $scrollbarThumbColorHov;
$gr: 5%;
@include background-image(linear-gradient(lighten($bg, $gr), $bg 20px));
@include border-radius(2px);
@include box-sizing(border-box);
border-radius: 2px;
box-sizing: border-box;
&:hover {
@include background-image(linear-gradient(lighten($hc, $gr), $hc 20px));
}

8
platform/commonUI/general/res/sass/controls/_menus.scss
View File

@@ -72,7 +72,7 @@
}
.s-menu {
@include border-radius($basicCr);
border-radius: $basicCr;
@include containerSubtle($colorMenuBg, $colorMenuFg);
@include boxShdw($shdwMenu);
@include txtShdw($shdwMenuText);
@@ -87,7 +87,7 @@
ul {
@include menuUlReset();
li {
@include box-sizing(border-box);
box-sizing: border-box;
border-top: 1px solid pullForward($colorMenuBg, 10%);
color: pullForward($colorMenuBg, 60%);
line-height: $menuLineH;
@@ -171,7 +171,7 @@
@include absPosDefault($interiorMargin);
}
.pane {
@include box-sizing(border-box);
box-sizing: border-box;
&.left {
//@include test();
border-right: 1px solid pullForward($colorMenuBg, 10%);
@@ -183,7 +183,7 @@
overflow-y: auto;
ul {
li {
@include border-radius($controlCr);
border-radius: $controlCr;
padding-left: 30px;
border-top: none;
}

142
platform/commonUI/general/res/sass/controls/_messages.scss
View File

@@ -36,38 +36,49 @@
}
}
.status.block {
// Status coloring
.ok, .info {
.status-indicator {
color: $colorStatusInfo;
}
}
.alert, .caution, .warning {
.status-indicator, .count {
color: $colorStatusAlert;
}
}
.error, .err {
.status-indicator, .count {
color: $colorStatusError;
}
}
.available {
.status-indicator, .count {
color: $colorStatusAvailable;
}
}
.status-block-holder {
// Applied to mct-include element
// Contains status.block elements
$transDelay: 1.5s;
$transSpeed: .25s;
color: $colorStatusDefault;
cursor: default;
display: inline-block;
margin-right: $interiorMargin;
.status-indicator,
.label,
.count {
display: inline-block;
vertical-align: top;
}
&.no-icon {
display: inline-block;
&.clickable { cursor: pointer; }
&:not(.clickable) { cursor: default; }
&.no-icon .status.block {
.status-indicator {
display: none;
}
}
&.float-right {
float: right;
}
&.subtle {
opacity: 0.5;
}
.status-indicator {
margin-right: $interiorMarginSm;
}
&:not(.no-collapse) {
&:not(.no-collapse) .status.block {
.label {
// Max-width silliness is necessary for width transition
@include trans-prop-nice(max-width, $transSpeed, $transDelay);
@@ -77,7 +88,7 @@
&:hover {
.label {
@include trans-prop-nice(max-width, $transSpeed, 0s);
max-width: 450px;
max-width: 600px;
width: auto;
}
.count {
@@ -87,29 +98,42 @@
}
}
&.ok .status-indicator,
&.info .status-indicator {
color: $colorStatusInfo;
}
.status.block {
$transDelay: 1.5s;
$transSpeed: .25s;
color: $colorStatusDefault;
display: inline-block;
margin-right: $interiorMargin;
.status-indicator,
.label,
.count {
display: inline-block;
vertical-align: top;
}
&.alert .status-indicator,
&.warning .status-indicator,
&.caution .status-indicator {
color: $colorStatusAlert;
}
&.error .status-indicator {
color: $colorStatusError;
.status-indicator {
margin-right: $interiorMarginSm;
}
.count {
@include trans-prop-nice(opacity, $transSpeed, $transDelay);
font-weight: bold;
opacity: 1;
}
.s-btn {
background: $colorStatusBtnBg;
padding: 0 $interiorMargin;
height: auto;
line-height: inherit;
}
}
/* Styles for messages and message banners */
.message {
&.block {
@include border-radius($basicCr);
border-radius: $basicCr;
padding: $interiorMarginLg;
}
&.error {
@@ -121,9 +145,9 @@
.l-message-banner {
$m: $interiorMarginSm;
$lh: $ueFooterH - ($m*2) - 1;
@include box-sizing(border-box);
box-sizing: border-box;
@include ellipsize();
@include display-flex;
@include display(flex);
@include flex-direction(row);
@include align-items(center);
position: absolute;
@@ -146,7 +170,7 @@
left: 50%;
opacity: 1;
&:not(.info) {
@include pulse(100ms, 10);
@include pulse($dur: 100ms, $iteration: 10);
}
}
@@ -178,18 +202,12 @@
}
.s-message-banner {
//@include transition-property(left, opacity);
//@include transition-duration(0.35s);
//@include transition-timing-function(ease-in-out);
}
.s-message-banner {
@include border-radius($controlCr);
border-radius: $controlCr;
@include statusBannerColors($colorStatusDefault, $colorStatusFg);
cursor: pointer;
a { color: inherit; }
.s-action {
@include border-radius($basicCr);
border-radius: $basicCr;
@include trans-prop-nice(background-color);
}
.close {
@@ -250,7 +268,7 @@
*/
.l-message {
@include display-flex;
@include display(flex);
@include flex-direction(row);
@include align-items(stretch);
.type-icon.message-type {
@@ -275,17 +293,17 @@
// Message as singleton
.t-message-single {
@include messageBlock(80px);
}
@include desktop {
.l-message,
.bottom-bar {
@include absPosDefault();
}
body.desktop .t-message-single {
.l-message,
.bottom-bar {
@include absPosDefault();
}
.bottom-bar {
top: auto;
height: $ovrFooterH;
}
.bottom-bar {
top: auto;
height: $ovrFooterH;
}
}
@@ -295,15 +313,13 @@
.message-contents {
.l-message {
//border-bottom: 1px solid pullForward($colorOvrBg, 20%);
@include border-radius($controlCr);
border-radius: $controlCr;
background: rgba($colorOvrFg, 0.1);
margin-bottom: $interiorMargin;
padding: $interiorMarginLg;
.message-contents,
.bottom-bar {
//@include test(green);
position: relative;
}
@@ -320,8 +336,8 @@
}
}
}
}
@include desktop {
.message-contents .l-message { margin-right: $interiorMarginLg; }
}
}
body.desktop .t-message-list {
.message-contents .l-message { margin-right: $interiorMarginLg; }
}

12
platform/commonUI/general/res/sass/controls/_time-controller.scss
View File

@@ -37,7 +37,7 @@ mct-include.l-time-controller {
{
//@include test();
@include absPosDefault(0, visible);
@include box-sizing(border-box);
box-sizing: border-box;
top: auto;
}
.l-time-range-slider,
@@ -73,7 +73,7 @@ mct-include.l-time-controller {
//@include test(green);
height: $r2H; bottom: $r3H + ($interiorMarginSm * 1);
.range-holder {
@include box-shadow(none);
box-shadow: none;
background: none;
border: none;
.range {
@@ -101,7 +101,7 @@ mct-include.l-time-controller {
}
&:after {
// Circle element
@include border-radius($myW);
border-radius: $myW;
@include transform(translateY(-50%));
top: 50%; right: 0; bottom: auto; left: 0;
width: auto;
@@ -167,7 +167,7 @@ mct-include.l-time-controller {
color: $sliderColorKnobHov;
}
&.knob-l {
//@include border-bottom-left-radius($knobCr); // MOVED TO _CONTROLS.SCSS
//border-bottom-left-radius: $knobCr; // MOVED TO _CONTROLS.SCSS
margin-left: $knobM;
.range-value {
text-align: right;
@@ -175,7 +175,7 @@ mct-include.l-time-controller {
}
}
&.knob-r {
//@include border-bottom-right-radius($knobCr);
//border-bottom-right-radius: $knobCr;
margin-right: $knobM;
.range-value {
left: $rangeValOffset;
@@ -193,7 +193,7 @@ mct-include.l-time-controller {
.s-time-range-val {
//@include test();
@include border-radius($controlCr);
border-radius: $controlCr;
background-color: $colorInputBg;
padding: 1px 1px 0 $interiorMargin;
}

10
platform/commonUI/general/res/sass/edit/_editor.scss
View File

@@ -38,22 +38,22 @@
z-index: 11;
}
&.edit-resize-nw {
@include border-bottom-right-radius($cr);
border-bottom-right-radius: $cr;
cursor: nw-resize;
top: 0; left: 0;
}
&.edit-resize-ne {
@include border-bottom-left-radius($cr);
border-bottom-left-radius: $cr;
cursor: ne-resize;
top: 0; right: 0;
}
&.edit-resize-se {
@include border-top-left-radius($cr);
border-top-left-radius: $cr;
cursor: se-resize;
bottom: 0; right: 0;
}
&.edit-resize-sw {
@include border-top-right-radius($cr);
border-top-right-radius: $cr;
cursor: sw-resize;
bottom: 0; left: 0;
}
@@ -109,4 +109,4 @@
}
}
}
}
}

4
platform/commonUI/general/res/sass/features/_imagery.scss
View File

@@ -104,8 +104,8 @@
}
.l-image-thumb-item {
@include single-transition(background-color, 0.25s);
@include box-sizing(border-box);
@include transition(background-color, 0.25s);
box-sizing: border-box;
padding: 1px;
position: relative;
.l-thumb,

54
platform/commonUI/general/res/sass/forms/_elems.scss
View File

@@ -20,10 +20,9 @@
* at runtime from the About dialog for additional information.
*****************************************************************************/
.section-header {
@include border-radius($basicCr);
border-radius: $basicCr;
background: $colorFormSectionHeader;
$c: lighten($colorBodyFg, 20%);
//border-bottom: 1px solid rgba(#fff, 0.3);
color: $c;
font-size: 0.8em;
padding: $formTBPad $formLRPad;
@@ -32,6 +31,7 @@
.form {
color: $colorFormText;
width: 100%;
.form-section {
position: relative;
margin-bottom: $interiorMarginLg * 2;
@@ -39,7 +39,7 @@
.form-row {
$m: $interiorMargin;
@include box-sizing(border-box);
box-sizing: border-box;
@include clearfix;
border-top: 1px solid $colorFormLines;
margin-top: $m;
@@ -51,7 +51,7 @@
>.label,
>.controls {
@include box-sizing(border-box);
box-sizing: border-box;
@include clearfix;
font-size: 0.8rem;
line-height: $formInputH;
@@ -60,28 +60,24 @@
>.label {
// Only style this way for immediate children of .form-row; prevents problems when .label is used in .controls section of a form
//@include test(orange, 0.05);
float: left;
min-width: 120px;
order: 1;
position: relative;
white-space: nowrap;
width: $formLabelW;
}
.value {
color: $colorInputFg; //lighten($colorBodyFg, 20%);
color: $colorInputFg;
}
.controls {
float: left;
order: 2;
position: relative;
width: 99.9% - $formLabelW; // Start with less than 100% for Firefox
@include flex(1 1 auto);
.l-composite-control {
// display: inline-block;
&.l-checkbox {
// @include test();
// height: $formRowCtrlsH;
display: inline-block;
line-height: $formRowCtrlsH;
margin-right: 5px;
@@ -115,7 +111,6 @@
$h: 150px;
position: relative;
height: $h;
// max-width: 50%;
>.wrapper {
$p: $interiorMargin;
overflow: auto;
@@ -129,6 +124,37 @@
}
}
.l-controls-first {
.form .form-row {
margin-top: $interiorMarginSm;
>.label,
>.controls {
line-height: inherit;
min-height: inherit;;
}
>.label {
@include flex(1 1 auto);
min-width: 0;
width: auto;
order: 2;
}
>.controls {
@include flex(0 0 auto);
margin-right: $interiorMargin;
order: 1;
}
}
}
.no-validate {
.form .form-row >.label {
padding-right: 0;
&:after {
display: none;
}
}
}
label.form-control.checkbox {
input {
margin-right: $interiorMargin;
@@ -149,7 +175,7 @@ label.form-control.checkbox {
vertical-align: top;
div.s-hint {
@include border-radius($basicCr);
border-radius: $basicCr;
background: rgba($colorFormInvalid, 0.8);
display: block;
color: lighten($colorFormInvalid, 30%);

12
platform/commonUI/general/res/sass/forms/_filter.scss
View File

@@ -27,7 +27,7 @@
}
}
.icon.ui-symbol {
@include border-radius($controlCr);
border-radius: $controlCr;
display: inline-block;
font-size: 1.3em;
height: $formInputH;
@@ -43,9 +43,9 @@
$d: $formInputH - $mgn * 2;
$cb: #fff;
$cf: #333;
@include border-radius($controlCr);
@include box-sizing(border-box);
@include opacity(0.2);
border-radius: $controlCr;
box-sizing: border-box;
opacity: 0.2;
background: $cb;
color: $cf;
display: block;
@@ -59,7 +59,7 @@
text-align: center;
z-index: 5;
&:hover {
@include opacity(0.6);
opacity: 0.6;
background-color: $colorKey;
}
}
@@ -95,7 +95,7 @@
.clear-icon,
.menu-icon,
&:before {
@include box-sizing(border-box);
box-sizing: border-box;
display: inline-block;
line-height: inherit;
position: absolute;

2
platform/commonUI/general/res/sass/forms/_selects.scss
View File

@@ -30,7 +30,7 @@
line-height: $formInputH;
select {
@include appearance(none);
@include box-sizing(border-box);
box-sizing: border-box;
background: none;
color: $colorSelectFg;
cursor: pointer;

6
platform/commonUI/general/res/sass/helpers/_bubbles.scss
View File

@@ -30,7 +30,7 @@
.l-infobubble-wrapper {
$arwSize: 5px;
@include box-shadow(rgba(black, 0.4) 0 1px 5px);
box-shadow: rgba(black, 0.4) 0 1px 5px;
position: relative;
z-index: 50;
.l-infobubble {
@@ -149,8 +149,8 @@
.s-infobubble {
$emFg: darken($colorInfoBubbleFg, 20%);
@include border-radius($basicCr);
@include box-shadow(rgba(black, 0.4) 0 1px 5px);
border-radius: $basicCr;
box-shadow: rgba(black, 0.4) 0 1px 5px;
background: $colorInfoBubbleBg;
color: $colorInfoBubbleFg;
font-size: 0.8rem;

2
platform/commonUI/general/res/sass/helpers/_splitter.scss
View File

@@ -39,7 +39,7 @@
display: block;
@if $splitterEndCr != 'none' {
@include border-radius($splitterEndCr);
border-radius: $splitterEndCr;
}
}
&:active {

4
platform/commonUI/general/res/sass/helpers/_wait-spinner.scss
View File

@@ -34,8 +34,8 @@
@include animation-duration(0.5s);
@include animation-iteration-count(infinite);
@include animation-timing-function(linear);
@include border-radius(100%);
@include box-sizing(border-box);
border-radius: 100%;
box-sizing: border-box;
border-color: rgba($c, 0.25);
border-top-color: rgba($c, 1.0);
border-style: solid;

6
platform/commonUI/general/res/sass/lists/_tabular.scss
View File

@@ -26,7 +26,7 @@
.tabular,
table {
@include box-sizing(border-box);
box-sizing: border-box;
border-spacing: 0;
border-collapse: collapse;
display: table;
@@ -107,7 +107,7 @@ table {
&.s-cell-type-value {
text-align: right;
.l-cell-contents {
@include border-radius($smallCr);
border-radius: $smallCr;
padding-left: $itemPadLR;
padding-right: $itemPadLR;
}
@@ -126,7 +126,7 @@ table {
top: $tabularHeaderH * 2;
}
input[type="text"] {
@include box-sizing(border-box);
box-sizing: border-box;
width: 100%; //50px;
}
}

33
platform/commonUI/general/res/sass/mobile/_item.scss
View File

@@ -24,11 +24,21 @@
// representation. Instead of a grid,
// a list is used.
// Refactored to use Victorizr
.items-holder {
.item {
&.grid-item {
$titleH: 30px;
@include phoneandtablet {
}
}
}
body.phone,
body.tablet {
.items-holder {
.item {
&.grid-item {
width: 100%;
>.contents {
top: 0px; right: $interiorMarginLg; bottom: 0px; left: $interiorMarginLg;
@@ -36,7 +46,6 @@
.bar {
&.top-bar {
// Becomes the right side of the item
//@include test(blue);
bottom: 0 !important; left: auto !important; right: 20px !important;
width: 40px !important; height: auto !important;
text-align: right;
@@ -46,7 +55,7 @@
left: $mobileListIconSize + $interiorMarginLg;
right: 60px;
}
}
.item-main {
.item-type,
@@ -63,8 +72,14 @@
}
}
}
}
}
}
@include phone {
body.phone {
.items-holder {
.item {
&.grid-item {
$dHei: $phoneItemH;
height: $dHei;
.bar {
@@ -85,8 +100,14 @@
}
}
}
@include tablet {
}
}
}
body.tablet {
.items-holder {
.item {
&.grid-item {
$dHei: $tabletItemH;
height: $dHei;
.bar {

13
platform/commonUI/general/res/sass/mobile/_layout.scss
View File

@@ -20,14 +20,7 @@
* at runtime from the About dialog for additional information.
*****************************************************************************/
@include phoneandtablet {
// Wrapper of the entire 2 panes, only enacted on
// phone and tablet. Also for the panes
.browse-wrapper,
.pane {
top: 0 !important; right: 0; bottom: 0; left: 0;
}
body.mobile {
.pane.left.treeview {
background-color: $colorMobilePaneLeft;
}
@@ -141,7 +134,7 @@
}
}
@include phonePortrait {
body.phone.portrait {
.pane-tree-showing {
.pane.left.treeview {
width: $proporMenuOnly !important;
@@ -156,7 +149,7 @@
}
}
@include desktop {
body.desktop {
.desktop-hide {
display: none;
}

4
platform/commonUI/general/res/sass/mobile/_mixins.scss
View File

@@ -78,6 +78,8 @@
// Desktop monitors in any orientation
@mixin desktopandtablet {
// Keeping only for legacy - should not be used moving forward
// Use body.desktop, body.tablet instead.
@media #{$tabletPortrait},
#{$tabletLandscape},
#{$desktop} {
@@ -87,6 +89,8 @@
// Desktop monitors in any orientation
@mixin desktop {
// Keeping only for legacy - should not be used moving forward
// Use body.desktop instead.
@media #{$desktop} {
@content
}

6
platform/commonUI/general/res/sass/mobile/_tree.scss
View File

@@ -20,7 +20,7 @@
* at runtime from the About dialog for additional information.
*****************************************************************************/
@include phoneandtablet {
body.touch {
ul.tree {
// Sets the margin on the left, which causes the
// running indentation after each folder is made
@@ -42,10 +42,10 @@
&:before {
content: "\7d";
left: 50%;
@include transform(translateX(-50%) rotate(90deg));
@include transform(translateX(-50%) rotate(270deg));
}
&.expanded:before {
@include transform(translateX(-50%) rotate(270deg));
@include transform(translateX(-50%) rotate(90deg));
}
}
}

2
platform/commonUI/general/res/sass/mobile/overlay/_overlay.scss
View File

@@ -27,7 +27,7 @@
.overlay > .holder {
//@include test(orange); // This works!
$m: 0;
@include border-radius($m);
border-radius: $m;
top: $m;
right: $m;
bottom: $m;

39
platform/commonUI/general/res/sass/openmct.scss Normal file
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.
*****************************************************************************/
.app-logo {
background: url('../images/logo-app.svg') no-repeat center center;
}
.l-splash-holder {
background: #333;
.s-splash {
border-radius: 10px;
box-shadow: 0 5px 50px 25px rgba(255, 255, 255, 0.1);
}
}
.s-splash {
background-image: url('../images/bg-splash.jpg');
&:after {
background-image: url('../images/logo-app-shdw.svg');
}
}

2
platform/commonUI/general/res/sass/overlay/_overlay.scss
View File

@@ -37,7 +37,7 @@
> .holder {
//$i: 15%;
@include containerSubtle($colorOvrBg, $colorOvrFg);
@include border-radius($basicCr * 3);
border-radius: $basicCr * 3;
color: $colorOvrFg;
top: 50%;
right: auto;

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

@@ -69,8 +69,8 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
}
.gl-plot-coords {
@include box-sizing(border-box);
@include border-radius($controlCr);
box-sizing: border-box;
border-radius: $controlCr;
background: black;
color: lighten($colorBodyFg, 30%);
padding: 2px 5px;
@@ -117,7 +117,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
&.l-plot-y-label {
$x: -50%;
$r: -90deg;
@include transform-origin(50%, 0);
@include transform-origin(50% 0);
@include transform(translateX($x) rotate($r));
display: inline-block;
margin-left: $interiorMargin; // Kick off the left edge
@@ -234,7 +234,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
}
.plot-color-swatch,
.color-swatch {
@include border-radius(2px);
border-radius: 2px;
display: inline-block;
height: $swatchD;
width: $swatchD;
@@ -244,7 +244,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
.gl-plot-legend {
.plot-legend-item {
@include border-radius($smallCr);
border-radius: $smallCr;
line-height: 1.5em;
padding: 0px $itemPadLR;
.plot-color-swatch {
@@ -310,4 +310,4 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
&.tick-label-y {
right: 0; left: 0;
}
}
}

5
platform/commonUI/general/res/sass/search/_search.scss
View File

@@ -42,7 +42,6 @@
$iconEdgeM: 4px;
$iconD: $treeSearchInputBarH - ($iconEdgeM*2);
font-size: 0.8em;
max-width: 250px;
position: relative;
.search-input {
@@ -53,7 +52,7 @@
&:before,
.clear-icon,
.menu-icon {
@include box-sizing(border-box);
box-sizing: border-box;
color: $colorInputIcon;
height: $iconD;
width: $iconD;
@@ -130,7 +129,7 @@
.active-filter-display {
$s: 0.7em;
$p: $interiorMargin;
@include box-sizing(border-box);
box-sizing: border-box;
line-height: 130%;
padding-left: $s * 2.25;
font-size: $s;

70
platform/commonUI/general/res/sass/startup-base.scss Normal file
View File

@@ -0,0 +1,70 @@
/*****************************************************************************
* 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.
*****************************************************************************/
@import "bourbon";
@import "logo-and-bg";
@mixin splashElem($m: 20%) {
top: $m; right: $m * 1.25; bottom: $m; left: $m * 1.25;
}
.l-splash-holder {
// Main outer holder.
@include transition-property(opacity);
@include transition-duration(500ms);
@include transition-timing-function(ease-in-out);
@include transition-delay(1s);
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 10000;
opacity: 1;
&.fadeout {
opacity: 0;
pointer-events: none;
}
.l-splash {
// The splash element.
@include splashElem();
}
}
@media only screen and (max-device-width: 767px) {
.l-splash-holder .l-splash {
@include splashElem(0);
border-radius: 0;
box-shadow: none;
}
}
@media only screen and (max-device-width: 767px) and (orientation: portrait) {
.l-splash-holder .l-splash {
&:before {
// Make the NASA logo a bit bigger when we're in portrait mode.
$w: 12%;
width: $w * 2;
padding-bottom: $w;
padding-top: $w;
}
}
}

59
platform/commonUI/general/res/sass/tree/_tree.scss
View File

@@ -34,11 +34,10 @@ 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);
box-sizing: border-box;
border-radius: $basicCr;
@include transition(background-color, 0.25s);
font-size: 0.8rem;
height: $menuLineH;
line-height: $menuLineH;
@@ -64,11 +63,6 @@ ul.tree {
@include transform(rotate(90deg));
}
}
@include desktop {
&:hover {
color: $colorItemTreeVCHover !important;
}
}
}
.t-object-label {
@@ -95,18 +89,6 @@ ul.tree {
}
}
&:not(.selected) {
@include desktop {
&:hover {
background: $colorItemTreeHoverBg;
color: $colorItemTreeHoverFg;
.t-item-icon {
color: $colorItemTreeIconHover;
}
}
}
}
&:not(.loading) {
cursor: pointer;
}
@@ -124,31 +106,38 @@ ul.tree {
}
}
body.desktop {
.tree-item,
.search-result-item {
.view-control {
&:hover {
color: $colorItemTreeVCHover !important;
}
}
&:not(.selected) {
&:hover {
background: $colorItemTreeHoverBg;
color: $colorItemTreeHoverFg;
.t-item-icon {
color: $colorItemTreeIconHover;
}
}
}
}
}
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 {
@@ -169,7 +158,7 @@ mct-representation {
.t-item-icon,
.t-title-label {
color: $colorItemTreeEditingFg;
@include text-shadow(none);
text-shadow: none;
}
.t-title-label {
font-style: italic;

22
platform/commonUI/general/res/sass/user-environ/_frame.scss
View File

@@ -66,17 +66,6 @@
.view-switcher {
z-index: 10;
}
// Hide the view switcher by default when it's in an element that's in a frame context
// Frame template is used because we need to target the lowest nested frame
@include desktop {
.view-switcher {
opacity: 0;
}
&:hover .view-switcher {
// Show the view switcher on frame hover
opacity: 1;
}
}
}
.view-switcher {
// Hide the name when the view switcher is in a frame context
@@ -85,3 +74,14 @@
}
}
}
body.desktop .frame.frame-template {
// Hide the view switcher by default when it's in an element that's in a frame context
// Frame template is used because we need to target the lowest nested frame
.view-switcher {
opacity: 0;
}
&:hover .view-switcher {
// Show the view switcher on frame hover
opacity: 1;
}
}

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

@@ -27,7 +27,7 @@
}
.editor {
@include border-radius($basicCr * 1.5);
border-radius: $basicCr * 1.5;
}
.contents {
@@ -86,7 +86,7 @@
color: lighten($colorBodyBg, 30%);
font-size: .7rem;
.status-holder {
@include box-sizing(border-box);
box-sizing: border-box;
@include absPosDefault($interiorMargin);
@include ellipsize();
right: 120px;
@@ -94,15 +94,13 @@
z-index: 1;
}
.app-logo {
@include box-sizing(border-box);
@include absPosDefault($interiorMargin);
background-position: right center;
box-sizing: border-box;
@include absPosDefault($interiorMargin - 1);
cursor: pointer;
left: auto;
left: auto; right: $interiorMargin;
width: $ueAppLogoW;
z-index: 2;
&.logo-openmctweb {
background: url($dirImgs + 'logo-openmctweb.svg') no-repeat center center;
}
}
}
}
@@ -121,7 +119,7 @@
}
.pane {
@include box-sizing(border-box);
box-sizing: border-box;
position: absolute;
.pane-header {
@@ -137,48 +135,6 @@
.mini-tab-icon.toggle-pane {
z-index: 5;
@include desktop {
$d: $uePaneMiniTabH;
$paneExpandedOffset: $splitterD + $uePaneMiniTabW;
top: $bodyMargin;
height: $d;
line-height: $d;
&:after {
// Always the icon that shows when the pane is collapsed
opacity: 0;
}
&.collapsed {
&:before {
opacity: 0;
}
&:after {
opacity: 1;
}
}
&.toggle-tree.anchor-left {
left: 0;
@include transform(translateX(-1 * $paneExpandedOffset));
&:after {
content: '\6d'; // Menu 'hamburger' icon
}
&.collapsed {
left: 0;
@include transform(translateX((-1 * $ueCollapsedPaneEdgeM) + $interiorMargin));
}
&:not(.collapsed):before {
@include trans-prop-nice(opacity, 200ms, 200ms);
}
}
&.toggle-inspect.anchor-right {
right: $bodyMargin;
&:after {
content: '\e615'; // Eye icon
}
&.collapsed {
right: $interiorMargin;
}
}
}
}
&.items {
.object-browse-bar {
@@ -190,6 +146,49 @@
}
}
body.desktop .pane .mini-tab-icon.toggle-pane {
$d: $uePaneMiniTabH;
$paneExpandedOffset: $splitterD + $uePaneMiniTabW;
top: $bodyMargin;
height: $d;
line-height: $d;
&:after {
// Always the icon that shows when the pane is collapsed
opacity: 0;
}
&.collapsed {
&:before {
opacity: 0;
}
&:after {
opacity: 1;
}
}
&.toggle-tree.anchor-left {
left: 0;
@include transform(translateX(-1 * $paneExpandedOffset));
&:after {
content: '\6d'; // Menu 'hamburger' icon
}
&.collapsed {
left: 0;
@include transform(translateX((-1 * $ueCollapsedPaneEdgeM) + $interiorMargin));
}
&:not(.collapsed):before {
@include trans-prop-nice(opacity, 200ms, 200ms);
}
}
&.toggle-inspect.anchor-right {
right: $bodyMargin;
&:after {
content: '\e615'; // Eye icon
}
&.collapsed {
right: $interiorMargin;
}
}
}
.split-layout {
// Specific elements margins
.holder.holder-treeview-elements {
@@ -282,7 +281,7 @@
/***************************************************** OBJECT BROWSE BAR */
.object-browse-bar {
@include box-sizing(border-box);
box-sizing: border-box;
height: $ueTopBarH;
line-height: $ueTopBarH;
white-space: nowrap;
@@ -339,7 +338,7 @@
}
}
@include desktop {
body.desktop {
.holder-all {
min-width: $ueDesktopMinW;
}
@@ -378,7 +377,7 @@
.s-status-editing {
.l-object-wrapper {
@include pulseBorder($colorEditAreaFg, $dur: 1s, $opacity0: 0.3);
@include border-radius($controlCr);
border-radius: $controlCr;
background-color: $colorEditAreaBg;
border-color: $colorEditAreaFg;
border-width: 2px;

2
platform/commonUI/general/res/sass/user-environ/_tool-bar.scss
View File

@@ -27,7 +27,7 @@
height: $btnToolbarH;
}
input[type="text"] {
@include box-sizing(border-box);
box-sizing: border-box;
font-size: .9em;
height: $btnToolbarH;
margin-bottom: 1px;

4
platform/commonUI/general/res/templates/bottombar.html
View File

@@ -23,7 +23,9 @@
<div id='status' class='status-holder'>
<mct-include ng-repeat="indicator in bar.getIndicators()"
ng-model="indicator.ngModel"
key="indicator.template">
key="indicator.template"
class="status-block-holder"
ng-class='indicator.ngModel.getGlyphClass()'>
</mct-include>
</div>
<mct-include key="'message-banner'"></mct-include>

9
platform/commonUI/general/res/templates/indicator.html
View File

@@ -23,18 +23,13 @@
<div class='status block'
title="{{ngModel.getDescription()}}"
ng-click='ngModel.configure()'
ng-class='ngModel.getGlyphClass()'
ng-show="ngModel.getText().length > 0">
<span class="ui-symbol status-indicator">
{{ngModel.getGlyph()}}
</span><span class="label"
ng-class='ngModel.getTextClass()'>
{{ngModel.getText()}}
<a class="s-btn ui-symbol" ng-if="ngModel.configure">G</a>
</span><span class="count">
<!-- Add int count value here if this type of indicator has one or more messages associated with it -->
</span><a href=''
class="ui-symbol"
ng-if="ngModel.configure">
G
</a>
</span>
</div>

55
platform/commonUI/general/res/templates/object-inspector.html
View File

@@ -19,55 +19,24 @@
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">
<span class="l-inspect">
<div ng-controller="PaneController">
<mct-split-pane class='abs contents split-layout' anchor='bottom'>
<div class="split-pane-component pane top">
<div class="abs holder holder-inspector l-flex-col">
<div class="pane-header flex-elem">Inspection</div>
<ul class="flex-elem grows vscroll">
<li>
<em>Properties</em>
<div class="inspector-properties"
ng-repeat="data in metadata"
ng-class="{ first:$index === 0 }">
<div class="label">{{ data.name }}</div>
<div class="value">{{ data.value }}</div>
</div>
</li>
<li ng-if="contextutalParents.length > 0">
<em title="The location of this linked object.">Location</em>
<span class="inspector-location"
ng-repeat="parent in contextutalParents"
ng-class="{ last:($index + 1) === contextualParents.length }">
<mct-representation key="'label'"
mct-object="parent"
ng-model="ngModel"
ng-click="ngModel.selectedObject = parent"
class="location-item">
</mct-representation>
</span>
</li>
<li ng-if="primaryParents.length > 0">
<em title="The location of the original object that this was linked from.">Original Location</em>
<span class="inspector-location"
ng-repeat="parent in primaryParents"
ng-class="{ last:($index + 1) === primaryParents.length }">
<mct-representation key="'label'"
mct-object="parent"
ng-model="ngModel"
ng-click="ngModel.selectedObject = parent"
class="location-item">
</mct-representation>
</span>
</li>
</ul>
</div><!--/ holder-inspector -->
</div><!--/ split-pane-component -->
<mct-representation
key="'inspector-region'"
mct-object="domainObject"
ng-model="ngModel"
class="flex-elem grows vscroll l-flex-col">
</mct-representation>
</div>
</div>
<mct-splitter class="splitter-inspect-panel mobile-hide"></mct-splitter>
<div class="split-pane-component pane bottom">
<div class="abs holder holder-elements l-flex-col">
<em class="flex-elem">Elements</em>
<em class="flex-elem t-inspector-part-header">Elements</em>
<mct-representation
key="'edit-elements'"
mct-object="domainObject"
@@ -76,5 +45,5 @@
</div>
</div>
</mct-split-pane>
</div><!--/ PaneController -->
</div>
</span>

46
platform/commonUI/general/src/SplashScreenManager.js Normal file
View File

@@ -0,0 +1,46 @@
/*****************************************************************************
* 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';
function SplashScreenManager($document) {
var splash;
$document = $document[0];
splash = $document.querySelectorAll('.l-splash-holder')[0];
if (!splash) {
return;
}
splash.className += ' fadeout';
splash.addEventListener('transitionend', function () {
splash.parentNode.removeChild(splash);
});
}
return SplashScreenManager;
});

6
platform/commonUI/general/src/controllers/BannerController.js
View File

@@ -60,6 +60,12 @@ define(
notification.model.cancel = function(){
dialogService.dismiss();
};
//If the notification is dismissed by the user, close
// the dialog.
notification.onDismiss(function(){
dialogService.dismiss();
});
dialogService.showBlockingMessage(notification.model);
}
};

18
platform/commonUI/general/src/directives/MCTContainer.js
View File

@@ -47,13 +47,7 @@ define(
// Initialize container map from extensions
containers.forEach(function (container) {
var key = container.key;
containerMap[key] = Object.create(container);
containerMap[key].templateUrl = [
container.bundle.path,
container.bundle.resources,
container.templateUrl
].join("/");
containerMap[container.key] = container;
});
return {
@@ -85,13 +79,11 @@ define(
scope[alias] = copiedAttributes;
},
// Get the template URL for this container, based
// on its attributes.
templateUrl: function (element, attrs) {
var key = attrs.key;
return containerMap[key].templateUrl;
template: function (element, attrs) {
var key = attrs.key,
container = containerMap[key];
return container ? container.template : "";
}
};
}

91
platform/commonUI/general/test/SplashScreenManagerSpec.js Normal file
View File

@@ -0,0 +1,91 @@
/*****************************************************************************
* 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,beforeEach,jasmine,it,expect*/
define([
'../src/SplashScreenManager'
], function (SplashScreenManager) {
'use strict';
describe('SplashScreenManager', function () {
var $document,
splashElement;
beforeEach(function () {
$document = jasmine.createSpyObj(
'$document',
['querySelectorAll']
);
splashElement = jasmine.createSpyObj(
'splashElement',
['addEventListener']
);
splashElement.parentNode = jasmine.createSpyObj(
'splashParent',
['removeChild']
);
splashElement.className = 'some-class-name';
$document.querySelectorAll.andReturn([splashElement]);
});
describe('when element exists', function () {
beforeEach(function () {
$document.querySelectorAll.andReturn([splashElement]);
new SplashScreenManager([$document]);
});
it('adds fade out class', function () {
expect(splashElement.className).toBe('some-class-name fadeout');
});
it('removes the element when the transition ends', function () {
expect(splashElement.addEventListener)
.toHaveBeenCalledWith(
'transitionend',
jasmine.any(Function)
);
expect(splashElement.parentNode.removeChild)
.not
.toHaveBeenCalled();
splashElement.addEventListener.mostRecentCall.args[1]();
expect(splashElement.parentNode.removeChild)
.toHaveBeenCalledWith(splashElement);
});
});
it('does not error when element doesn\'t exist', function () {
$document.querySelectorAll.andReturn([]);
function run() {
new SplashScreenManager([$document]);
}
expect(run).not.toThrow();
});
});
});

12
platform/commonUI/general/test/directives/MCTContainerSpec.js
View File

@@ -30,12 +30,12 @@ define(
var testContainers = [
{
bundle: { path: "a", resources: "b" },
templateUrl: "c/template.html",
template: "<div>foo</div>",
key: "abc"
},
{
bundle: { path: "x", resources: "y" },
templateUrl: "z/template.html",
template: "<span>bar</span>",
key: "xyz",
attributes: [ "someAttr", "someOtherAttr" ]
}
@@ -55,15 +55,15 @@ define(
});
it("chooses a template based on key", function () {
expect(mctContainer.templateUrl(
expect(mctContainer.template(
undefined,
{ key: "abc" }
)).toEqual("a/b/c/template.html");
)).toEqual(testContainers[0].template);
expect(mctContainer.templateUrl(
expect(mctContainer.template(
undefined,
{ key: "xyz" }
)).toEqual("x/y/z/template.html");
)).toEqual(testContainers[1].template);
});
it("copies attributes needed by the container", function () {

16
platform/commonUI/inspect/bundle.js
View File

@@ -25,11 +25,19 @@ define([
"./src/gestures/InfoGesture",
"./src/gestures/InfoButtonGesture",
"./src/services/InfoService",
"text!./res/info-table.html",
"text!./res/info-bubble.html",
"text!./res/bubble.html",
"text!./res/templates/info-button.html",
'legacyRegistry'
], function (
InfoGesture,
InfoButtonGesture,
InfoService,
infoTableTemplate,
infoBubbleTemplate,
bubbleTemplate,
infoButtonTemplate,
legacyRegistry
) {
"use strict";
@@ -39,17 +47,17 @@ define([
"templates": [
{
"key": "info-table",
"templateUrl": "info-table.html"
"template": infoTableTemplate
},
{
"key": "info-bubble",
"templateUrl": "info-bubble.html"
"template": infoBubbleTemplate
}
],
"containers": [
{
"key": "bubble",
"templateUrl": "bubble.html",
"template": bubbleTemplate,
"attributes": [
"bubbleTitle",
"bubbleLayout"
@@ -99,7 +107,7 @@ define([
"representations": [
{
"key": "info-button",
"templateUrl": "templates/info-button.html",
"template": infoButtonTemplate,
"gestures": [
"infobutton"
]

5
platform/commonUI/notification/bundle.js
View File

@@ -25,11 +25,13 @@ define([
"./src/NotificationIndicatorController",
"./src/NotificationIndicator",
"./src/NotificationService",
"text!./res/notification-indicator.html",
'legacyRegistry'
], function (
NotificationIndicatorController,
NotificationIndicator,
NotificationService,
notificationIndicatorTemplate,
legacyRegistry
) {
"use strict";
@@ -53,7 +55,7 @@ define([
"templates": [
{
"key": "notificationIndicatorTemplate",
"templateUrl": "notification-indicator.html"
"template": notificationIndicatorTemplate
}
],
"controllers": [
@@ -79,6 +81,7 @@ define([
"implementation": NotificationService,
"depends": [
"$timeout",
"topic",
"DEFAULT_AUTO_DISMISS",
"MINIMIZE_TIMEOUT"
]

7
platform/commonUI/notification/res/notification-indicator.html
View File

@@ -1,10 +1,9 @@
<!-- DO NOT ADD SPACES BETWEEN THE SPANS - IT ADDS WHITE SPACE!! -->
<span ng-show="notifications.length > 0" class="status block"
ng-class="highest.severity"
ng-controller="NotificationIndicatorController">
<span class="ui-symbol status-indicator">&#xe610;</span>
<span class="label">
<span class="ui-symbol status-indicator">&#xe610;</span><span class="label">
<a ng-click="showNotificationsList()">{{notifications.length}}
Notifications</a>
</span>
<span class="count">{{notifications.length}}</span>
</span><span class="count">{{notifications.length}}</span>
</span>

4
platform/commonUI/notification/src/NotificationIndicatorController.js
View File

@@ -50,9 +50,7 @@ define(
title: "Messages",
//Launch the message list dialog with the models
// from the notifications
messages: notificationService.notifications && notificationService.notifications.map(function(notification){
return notification.model;
})
messages: notificationService.notifications
},
cancel: function(){
dialogService.dismiss();

96
platform/commonUI/notification/src/NotificationService.js
View File

@@ -58,21 +58,23 @@ define(
* @property {string} title The title of the message
* @property {string} severity The importance of the message (one of
* 'info', 'alert', or 'error' where info < alert <error)
* @property {number} progress The completion status of a task
* @property {number} [progress] The completion status of a task
* represented numerically
* @property {boolean} unknownProgress a boolean indicating that the
* @property {boolean} [unknownProgress] a boolean indicating that the
* progress of the underlying task is unknown. This will result in a
* visually distinct progress bar.
* @property {boolean | number} autoDismiss If truthy, dialog will
* @property {boolean | number} [autoDismiss] If truthy, dialog will
* be automatically minimized or dismissed (depending on severity).
* Additionally, if the provided value is a number, it will be used
* as the delay period before being dismissed.
* @property {NotificationOption} primaryOption the default user
* @property {boolean} [dismissable=true] If true, notification will
* include an option to dismiss it completely.
* @property {NotificationOption} [primaryOption] the default user
* response to
* this message. Will be represented as a button with the provided
* label and action. May be used by banner notifications to display
* only the most important option to users.
* @property {NotificationOption[]} options any additional
* @property {NotificationOption[]} [options] any additional
* actions the user can take. Will be represented as additional buttons
* that may or may not be available from a banner.
* @see DialogModel
@@ -99,6 +101,8 @@ define(
* be used for dismissing a notification. If more control is
* required, then the minimize or dismiss functions can be called
* individually.
* @property {function} onDismiss Allows listening for on dismiss
* events. This allows cleanup etc. when the notification is dismissed.
*/
/**
@@ -113,12 +117,13 @@ define(
* animation is shown. This animation requires some time to execute,
* so a timeout is required before the notification is hidden
*/
function NotificationService($timeout, DEFAULT_AUTO_DISMISS, MINIMIZE_TIMEOUT) {
function NotificationService($timeout, topic, DEFAULT_AUTO_DISMISS, MINIMIZE_TIMEOUT) {
this.notifications = [];
this.$timeout = $timeout;
this.highest ={ severity: "info" };
this.DEFAULT_AUTO_DISMISS = DEFAULT_AUTO_DISMISS;
this.MINIMIZE_TIMEOUT = MINIMIZE_TIMEOUT;
this.topic = topic;
/*
* A context in which to hold the active notification and a
@@ -127,14 +132,16 @@ define(
this.active = {};
}
/*
/**
* Minimize a notification. The notification will still be available
* from the notification list. Typically notifications with a
* severity of 'info' should not be minimized, but rather
* dismissed. If you're not sure which is appropriate,
* use {@link Notification#dismissOrMinimize}
*
* @private
*/
function minimize (service, notification) {
NotificationService.prototype.minimize = function (service, notification) {
//Check this is a known notification
var index = service.notifications.indexOf(notification);
@@ -159,17 +166,19 @@ define(
service.setActiveNotification(service.selectNextNotification());
}, service.MINIMIZE_TIMEOUT);
}
}
};
/*
/**
* Completely removes a notification. This will dismiss it from the
* message banner and remove it from the list of notifications.
* Typically only notifications with a severity of info should be
* dismissed. If you're not sure whether to dismiss or minimize a
* notification, use {@link Notification#dismissOrMinimize}.
* dismiss
*
* @private
*/
function dismiss (service, notification) {
NotificationService.prototype.dismiss = function (service, notification) {
//Check this is a known notification
var index = service.notifications.indexOf(notification);
@@ -190,19 +199,23 @@ define(
service.notifications.splice(index, 1);
}
service.setActiveNotification(service.selectNextNotification());
}
/*
this.setHighestSeverity();
};
/**
* Depending on the severity of the notification will selectively
* dismiss or minimize where appropriate.
*
* @private
*/
function dismissOrMinimize (notification){
NotificationService.prototype.dismissOrMinimize = function (notification) {
//For now minimize everything, and have discussion around which
//kind of messages should or should not be in the minimized
//notifications list
notification.minimize();
}
};
/**
* Returns the notification that is currently visible in the banner area
@@ -261,6 +274,24 @@ define(
return this.notify(notificationModel);
};
/**
* @private
*/
NotificationService.prototype.setHighestSeverity = function () {
var severity = {
"info": 1,
"alert": 2,
"error": 3
};
this.highest.severity = this.notifications.reduce(function(previous, notification){
if (severity[notification.model.severity] > severity[previous]){
return notification.model.severity;
} else {
return previous;
}
}, "info");
};
/**
* Notifies the user of an event. If there is a banner notification
* already active, then it will be dismissed or minimized automatically,
@@ -274,23 +305,23 @@ define(
NotificationService.prototype.notify = function (notificationModel) {
var self = this,
notification,
ordinality = {
"info": 1,
"alert": 2,
"error": 3
},
activeNotification = self.active.notification;
activeNotification = self.active.notification,
topic = this.topic();
notification = {
model: notificationModel,
minimize: function() {
minimize(self, notification);
self.minimize(self, notification);
},
dismiss: function(){
dismiss(self, notification);
self.dismiss(self, notification);
topic.notify();
},
dismissOrMinimize: function(){
dismissOrMinimize(notification);
self.dismissOrMinimize(notification);
},
onDismiss: function(callback) {
topic.listen(callback);
}
};
@@ -299,12 +330,25 @@ define(
notificationModel.autoDismiss = this.DEFAULT_AUTO_DISMISS;
}
if (ordinality[notificationModel.severity.toLowerCase()] > ordinality[this.highest.severity.toLowerCase()]){
this.highest.severity = notificationModel.severity;
//Notifications support a 'dismissable' attribute. This is a
// convenience to support adding a 'dismiss' option to the
// notification for the common case of dismissing a
// notification. Could also be done manually by specifying an
// option on the model
if (notificationModel.dismissable !== false) {
notificationModel.options = notificationModel.options || [];
notificationModel.options.unshift({
label: "Dismiss",
callback: function() {
notification.dismiss();
}
});
}
this.notifications.push(notification);
this.setHighestSeverity();
/*
Check if there is already an active (ie. visible) notification
*/

21
platform/commonUI/notification/test/NotificationServiceSpec.js
View File

@@ -32,13 +32,19 @@ define(
mockAutoDismiss,
mockMinimizeTimeout,
successModel,
mockTopicFunction,
mockTopicObject,
errorModel;
beforeEach(function(){
mockTimeout = jasmine.createSpy("$timeout");
mockTopicFunction = jasmine.createSpy("topic");
mockTopicObject = jasmine.createSpyObj("topicObject", ["listen", "notify"]);
mockTopicFunction.andReturn(mockTopicObject);
mockAutoDismiss = mockMinimizeTimeout = 1000;
notificationService = new NotificationService(
mockTimeout, mockAutoDismiss, mockMinimizeTimeout);
mockTimeout, mockTopicFunction, mockAutoDismiss, mockMinimizeTimeout);
successModel = {
title: "Mock Success Notification",
severity: "info"
@@ -57,6 +63,19 @@ define(
expect(activeNotification.model).toBe(successModel);
});
it("notifies listeners on dismissal of notification", function() {
var notification,
dismissListener = jasmine.createSpy("ondismiss");
notification = notificationService.notify(successModel);
notification.onDismiss(dismissListener);
expect(mockTopicObject.listen).toHaveBeenCalled();
notification.dismiss();
expect(mockTopicObject.notify).toHaveBeenCalled();
mockTopicObject.listen.mostRecentCall.args[0]();
expect(dismissListener).toHaveBeenCalled();
});
it("allows specification of an info notification given just a" +
" title, making the notification active", function() {
var activeNotification,

55
platform/commonUI/regions/bundle.js Normal file
View File

@@ -0,0 +1,55 @@
/*****************************************************************************
* 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([
'./src/InspectorController',
'./src/EditableRegionPolicy',
'legacyRegistry'
], function (
InspectorController,
EditableRegionPolicy,
legacyRegistry
) {
"use strict";
legacyRegistry.register("platform/commonUI/regions", {
"extensions": {
"controllers": [
{
"key": "InspectorController",
"implementation": InspectorController,
"depends": [
"$scope",
"policyService"
]
}
],
"policies": [
{
"category": "region",
"implementation": EditableRegionPolicy
}
]
}
});
});

57
platform/commonUI/regions/src/EditableRegionPolicy.js Normal file
View File

@@ -0,0 +1,57 @@
/*****************************************************************************
* 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";
/**
* A policy for determining whether a region part should be visible or
* not, based on its editability and the current state of the domain
* object .
* @constructor
* @implements {Policy}
* @memberof platform/commonUI/regions
*/
function EditableRegionPolicy() {
}
EditableRegionPolicy.prototype.allow = function (regionPart, domainObject) {
if (!regionPart.modes){
return true;
}
if (domainObject.getCapability('status').get('editing')){
//If the domain object is in edit mode, only include a part
// if it is marked editable
return regionPart.modes.indexOf('edit') !== -1;
} else {
//If the domain object is not in edit mode, return any parts
// that are not explicitly marked editable
return regionPart.modes.indexOf('browse') !== -1;
}
};
return EditableRegionPolicy;
}
);

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