ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-01-31 16:36:13 +00:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'github/master' into open1515

Browse Source
This commit is contained in:
Victor Woeltjen 2015-09-24 11:17:13 -07:00
commit 6bd8e7a47c
168 changed files with 14612 additions and 6722 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@ -5,6 +5,7 @@
*.DS_Store *.DS_Store
*.sass-cache *.sass-cache
*COMPILE.css
# Intellij project configuration files # Intellij project configuration files
*.idea *.idea

2
bundles.json
View File

@ -8,6 +8,8 @@
"platform/commonUI/dialog", "platform/commonUI/dialog",
"platform/commonUI/general", "platform/commonUI/general",
"platform/commonUI/inspect", "platform/commonUI/inspect",
"platform/commonUI/mobile",
"platform/commonUI/themes/espresso",
"platform/containment", "platform/containment",
"platform/execution", "platform/execution",
"platform/telemetry", "platform/telemetry",

4
circle.yml
View File

@ -8,3 +8,7 @@ deployment:
branch: search branch: search
heroku: heroku:
appname: openmctweb-staging-un appname: openmctweb-staging-un
openmctweb-staging-deux:
branch: mobile
heroku:
appname: openmctweb-staging-deux

1
index.html
View File

@ -23,6 +23,7 @@
<html> <html>
<head lang="en"> <head lang="en">
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title></title> <title></title>
<script type="text/javascript" <script type="text/javascript"
src="platform/framework/lib/require.js" src="platform/framework/lib/require.js"

34
platform/commonUI/browse/bundle.json
View File

@ -16,7 +16,20 @@
{ {
"key": "BrowseController", "key": "BrowseController",
"implementation": "BrowseController.js", "implementation": "BrowseController.js",
"depends": [ "$scope", "$route", "$location", "objectService", "navigationService", "urlService" ] "depends": [
"$scope",
"$route",
"$location",
"objectService",
"navigationService",
"urlService"
]
},
{
"key": "BrowseTreeController",
"implementation": "BrowseTreeController.js",
"priority": "preferred",
"depends": [ "$scope", "agentService" ]
}, },
{ {
"key": "BrowseObjectController", "key": "BrowseObjectController",
@ -25,17 +38,17 @@
}, },
{ {
"key": "CreateMenuController", "key": "CreateMenuController",
"implementation": "creation/CreateMenuController", "implementation": "creation/CreateMenuController.js",
"depends": [ "$scope" ] "depends": [ "$scope" ]
}, },
{ {
"key": "LocatorController", "key": "LocatorController",
"implementation": "creation/LocatorController", "implementation": "creation/LocatorController.js",
"depends": [ "$scope", "$timeout" ] "depends": [ "$scope", "$timeout" ]
}, },
{ {
"key": "MenuArrowController", "key": "MenuArrowController",
"implementation": "MenuArrowController", "implementation": "MenuArrowController.js",
"depends": [ "$scope" ] "depends": [ "$scope" ]
} }
], ],
@ -45,12 +58,6 @@
"templateUrl": "templates/create/locator.html" "templateUrl": "templates/create/locator.html"
} }
], ],
"templates": [
{
"key": "topbar-browse",
"templateUrl": "templates/topbar-browse.html"
}
],
"representations": [ "representations": [
{ {
"key": "browse-object", "key": "browse-object",
@ -82,6 +89,11 @@
"templateUrl": "templates/menu-arrow.html", "templateUrl": "templates/menu-arrow.html",
"uses": [ "action" ], "uses": [ "action" ],
"gestures": [ "menu" ] "gestures": [ "menu" ]
},
{
"key": "back-arrow",
"uses": [ "context" ],
"templateUrl": "templates/back-arrow.html"
} }
], ],
"services": [ "services": [
@ -142,7 +154,7 @@
"provides": "creationService", "provides": "creationService",
"type": "provider", "type": "provider",
"implementation": "creation/CreationService.js", "implementation": "creation/CreationService.js",
"depends": [ "persistenceService", "$q", "$log" ] "depends": [ "persistenceService", "now", "$q", "$log" ]
} }
], ],
"runs": [ "runs": [

30
platform/commonUI/browse/res/templates/back-arrow.html Normal file
View File

@ -0,0 +1,30 @@
<!--
Open MCT Web, Copyright (c) 2014-2015, United States Government
as represented by the Administrator of the National Aeronautics and Space
Administration. All rights reserved.
Open MCT Web is licensed under the Apache License, Version 2.0 (the
"License"); you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0.
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
License for the specific language governing permissions and limitations
under the License.
Open MCT Web includes source code licensed under additional open source
licenses. See the Open Source Licenses file (LICENSES.md) included with
this source code distribution or the Licensing information page available
at runtime from the About dialog for additional information.
-->
<!-- Back Arrow Icon used on mobile-->
<a
class='type-icon icon ui-symbol s-back'
ng-show="context.getPath().length > 2"
ng-click="context.getParent().getCapability('action').perform('navigate')">
{
</a>

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

@ -20,22 +20,25 @@
at runtime from the About dialog for additional information. at runtime from the About dialog for additional information.
--> -->
<span ng-controller="BrowseObjectController"> <span ng-controller="BrowseObjectController">
<div class="object-browse-bar bar abs"> <div class="object-browse-bar bar l-flex">
<div class="items-select left abs"> <div class="items-select left">
<mct-representation key="'back-arrow'"
mct-object="domainObject"
class="l-back"></mct-representation>
<mct-representation key="'object-header'" mct-object="domainObject"> <mct-representation key="'object-header'" mct-object="domainObject">
</mct-representation> </mct-representation>
</div> </div>
<div class="btn-bar right">
<div class="btn-bar right abs">
<mct-representation key="'action-group'"
mct-object="domainObject"
parameters="{ category: 'view-control' }">
</mct-representation>
<mct-representation key="'switcher'" <mct-representation key="'switcher'"
mct-object="domainObject" mct-object="domainObject"
ng-model="representation"> ng-model="representation">
</mct-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> </div>
</div> </div>

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

@ -19,13 +19,15 @@
this source code distribution or the Licensing information page available this source code distribution or the Licensing information page available
at runtime from the About dialog for additional information. at runtime from the About dialog for additional information.
--> -->
<div content="jquery-wrapper" class="abs holder-all browse-mode">
<div class="abs holder-all browse-mode" ng-controller="BrowseController">
<mct-include key="'topbar-browse'"></mct-include> <mct-include key="'topbar-browse'"></mct-include>
<div class="holder browse-area s-browse-area abs" ng-controller="BrowseController"> <div class="holder browse-area s-browse-area abs browse-wrapper"
ng-controller="BrowseTreeController as tree"
ng-class="tree.visible() ? 'browse-showtree' : 'browse-hidetree'">
<mct-split-pane class='contents abs' anchor='left'> <mct-split-pane class='contents abs' anchor='left'>
<div <div class='split-pane-component treeview pane left'>
class='split-pane-component treeview pane left' <div class="holder abs l-mobile">
>
<mct-representation key="'create-button'" mct-object="navigatedObject"> <mct-representation key="'create-button'" mct-object="navigatedObject">
</mct-representation> </mct-representation>
<div class='holder search-holder abs' <div class='holder search-holder abs'
@ -35,22 +37,31 @@
ng-model="treeModel"> ng-model="treeModel">
</mct-representation> </mct-representation>
</div> </div>
<div class='holder tree-holder abs' <div class='tree-holder abs mobile-tree-holder'
ng-hide="treeModel.search"> ng-hide="treeModel.search">
<mct-representation key="'tree'" <mct-representation key="'tree'"
mct-object="domainObject" mct-object="domainObject"
parameters="tree"
ng-model="treeModel"> ng-model="treeModel">
</mct-representation> </mct-representation>
</div> </div>
</div> </div>
<mct-splitter></mct-splitter> </div>
<div class='split-pane-component items pane'>
<div class='holder abs' id='content-area'> <mct-splitter class="mobile-hide"></mct-splitter>
<mct-representation mct-object="navigatedObject" key="'browse-object'">
<div class='split-pane-component items pane right-repr'>
<div class='holder abs l-mobile' id='content-area'>
<mct-representation mct-object="navigatedObject"
key="'browse-object'">
</mct-representation> </mct-representation>
</div> </div>
<div class="key-properties ui-symbol icon mobile-menu-icon desktop-hide"
mct-device="mobile"
ng-click="tree.toggle()">m</div>
</div> </div>
</mct-split-pane> </mct-split-pane>
</div> </div>
<mct-include key="'bottombar'"></mct-include> <mct-include key="'bottombar'"></mct-include>
</div> </div>

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

@ -19,11 +19,11 @@
this source code distribution or the Licensing information page available this source code distribution or the Licensing information page available
at runtime from the About dialog for additional information. at runtime from the About dialog for additional information.
--> -->
<div class='object-header'> <div class='object-header object-header-mobile'>
<span class="label s-label"> <span class='type-icon ui-symbol'>{{type.getGlyph()}}</span>
<span class='type-icon icon ui-symbol'>{{type.getGlyph()}}</span> <!--span class='type-name mobile-important-hide'>{{type.getName()}}</span-->
<span class="l-elem-wrapper l-flex">
<span ng-if="parameters.mode" class='action'>{{parameters.mode}}</span> <span ng-if="parameters.mode" class='action'>{{parameters.mode}}</span>
<span class='type-name'>{{type.getName()}}</span>
<span class='title-label'>{{model.name}}</span> <span class='title-label'>{{model.name}}</span>
<mct-representation key="'menu-arrow'" mct-object='domainObject'></mct-representation> <mct-representation key="'menu-arrow'" mct-object='domainObject'></mct-representation>
</span> </span>

7
platform/commonUI/browse/res/templates/create/create-button.html
View File

@ -20,10 +20,11 @@
at runtime from the About dialog for additional information. at runtime from the About dialog for additional information.
--> -->
<div class="menu-element wrapper" ng-controller="ClickAwayController as createController"> <div class="menu-element wrapper" ng-controller="ClickAwayController as createController">
<div class="btn btn-menu create-btn major" ng-click="createController.toggle()"> <div class="s-menu major create-btn" ng-click="createController.toggle()">
Create <span class="ui-symbol icon type-icon">&#x2b;</span>
<span class="title-label">Create</span>
</div> </div>
<div class="menu dropdown super-menu" ng-show="createController.isActive()"> <div class="menu super-menu" ng-show="createController.isActive()">
<mct-representation mct-object="domainObject" key="'create-menu'"> <mct-representation mct-object="domainObject" key="'create-menu'">
</mct-representation> </mct-representation>
</div> </div>

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

@ -20,7 +20,7 @@
at runtime from the About dialog for additional information. at runtime from the About dialog for additional information.
--> -->
<div ng-controller="LocatorController" class="selector-list"> <div ng-controller="LocatorController" class="selector-list">
<div> <div class="wrapper">
<mct-representation key="'tree'" <mct-representation key="'tree'"
mct-object="rootObject" mct-object="rootObject"
ng-model="treeModel"> ng-model="treeModel">

18
platform/commonUI/browse/res/templates/items/grid-item.html
View File

@ -21,31 +21,27 @@
--> -->
<!-- For selected, add class 'selected' to outer div --> <!-- For selected, add class 'selected' to outer div -->
<div class='item grid-item' ng-click='action.perform("navigate")'> <div class='item grid-item' ng-click='action.perform("navigate")'>
<div class="contents abs"> <div class='contents abs'>
<div class='top-bar bar abs'> <div class='top-bar bar abs'>
<div class='left abs'> <div class='ui-symbol profile' title='Shared'>&#x4f;</div>
<mct-include key="_checkbox"></mct-include> <mct-representation class="desktop-hide" key="'info-button'" mct-object="domainObject"></mct-representation>
</div>
<div class='right abs'>
<div class='ui-symbol icon l-icon-alert'></div>
<div class='ui-symbol icon profile' title="Shared">P</div>
</div>
</div> </div>
<div class='item-main abs'> <div class='item-main abs'>
<div class='ui-symbol icon lg item-type'> <div class='ui-symbol icon lg item-type'>
{{type.getGlyph()}} {{type.getGlyph()}}
<span <span
class="ui-symbol icon l-icon-link" title="This object is a link" class="ui-symbol l-icon-link" title="This object is a link"
ng-show="location.isLink()" ng-show="location.isLink()"
></span> ></span>
</div> </div>
<div class='ui-symbol icon abs item-open'>}</div> <div class='ui-symbol abs item-open'>}</div>
</div> </div>
<div class='bottom-bar bar abs'> <div class='bottom-bar bar abs'>
<div class='title'>{{model.name}}</div> <div class='title'>{{model.name}}</div>
<div class='details'> <div class='details'>
<span>{{type.getName()}}</span>
<span ng-show="model.composition !== undefined"> <span ng-show="model.composition !== undefined">
{{model.composition.length}} Items - {{model.composition.length}} Item<span ng-show="model.composition.length > 1">s</span>
</span> </span>
</div> </div>
</div> </div>

36
platform/commonUI/browse/res/templates/topbar-browse.html
View File

@ -1,36 +0,0 @@
<!--
Open MCT Web, Copyright (c) 2014-2015, United States Government
as represented by the Administrator of the National Aeronautics and Space
Administration. All rights reserved.
Open MCT Web is licensed under the Apache License, Version 2.0 (the
"License"); you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0.
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
License for the specific language governing permissions and limitations
under the License.
Open MCT Web includes source code licensed under additional open source
licenses. See the Open Source Licenses file (LICENSES.md) included with
this source code distribution or the Licensing information page available
at runtime from the About dialog for additional information.
-->
<div class='top-bar browse abs'>
<!-- TO-DO: replace JS placeholders for click actions -->
<div class='browse-main bar abs left'>
<a class="menu-element btn btn-menu browse-btn" onclick="alert('Not yet functional. This will allow filtering of browsed objects and search context.');">
<span class='ui-symbol badge major' href=''>*</span>Browse All<span class='ui-symbol invoke-menu'>v</span>
</a>
<input type='text' class='control filter' name='filter-available'/>
<a class='icon icon-filter ui-symbol' onclick="alert('Not yet functional. This will initiate a search.');">M</a>
</div>
<div class='icon-buttons-main bar abs right'>
<a class='ui-symbol icon major alert' onclick="alert('Not yet functional. This will allow updating of domain objects that need to be refreshed.');">!<span id='alert-actions-menu' class='ui-symbol invoke-menu'>v</span></a>
<!--a class='ui-symbol icon major profile' href=''>P<span id='profile-actions-menu' class='ui-symbol invoke-menu'>v</span></a-->
<a class='ui-symbol icon major settings' onclick="alert('Not yet functional. This will allow access to application configuration settings.');">G<span id='settings-actions-menu' class='ui-symbol invoke-menu'>v</span></a>
</div>
</div>

78
platform/commonUI/browse/src/BrowseTreeController.js Normal file
View File

@ -0,0 +1,78 @@
/*****************************************************************************
* 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*/
define(
[],
function () {
"use strict";
/**
* Controller to provide the ability to show/hide the tree in
* Browse mode.
* @constructor
* @memberof platform/commonUI/browse
*/
function BrowseTreeController($scope, agentService) {
var self = this;
this.agentService = agentService;
this.state = true;
/**
* Callback to invoke when any selection occurs in the tree.
* This controller can be passed in as the `parameters` object
* to the tree representation.
*
* @property {Function} callback
* @memberof platform/commonUI/browse.BrowseTreeController#
*/
this.callback = function () {
// Note that, since this is a callback to pass, this is not
// declared as a method but as a property which happens to
// be a function.
if (agentService.isPhone() && agentService.isPortrait()) {
// On phones, trees should collapse in portrait mode
// when something is navigated-to.
self.state = false;
}
};
}
/**
* Toggle the visibility of the tree.
*/
BrowseTreeController.prototype.toggle = function () {
this.state = !this.state;
};
/**
* Get the desired visibility state of the tree.
* @returns {boolean} true when visible
*/
BrowseTreeController.prototype.visible = function () {
return this.state;
};
return BrowseTreeController;
}
);

35
platform/commonUI/browse/src/creation/CreationService.js
View File

@ -42,10 +42,11 @@ define(
* @memberof platform/commonUI/browse * @memberof platform/commonUI/browse
* @constructor * @constructor
*/ */
function CreationService(persistenceService, $q, $log) { function CreationService(persistenceService, now, $q, $log) {
this.persistenceService = persistenceService; this.persistenceService = persistenceService;
this.$q = $q; this.$q = $q;
this.$log = $log; this.$log = $log;
this.now = now;
} }
/** /**
@ -86,37 +87,18 @@ define(
// composition, so that it will subsequently appear // composition, so that it will subsequently appear
// as a child contained by that parent. // as a child contained by that parent.
function addToComposition(id, parent, parentPersistence) { function addToComposition(id, parent, parentPersistence) {
var mutatationResult = parent.useCapability("mutation", function (model) { var compositionCapability = parent.getCapability('composition'),
if (Array.isArray(model.composition)) { addResult = compositionCapability &&
// Don't add if the id is already there compositionCapability.add(id);
if (model.composition.indexOf(id) === -1) {
model.composition.push(id);
}
} else {
// This is abnormal; composition should be an array
self.$log.warn(NO_COMPOSITION_WARNING + parent.getId());
return false; // Cancel mutation
}
});
return self.$q.when(mutatationResult).then(function (result) { return self.$q.when(addResult).then(function (result) {
if (!result) { if (!result) {
self.$log.error("Could not mutate " + parent.getId()); self.$log.error("Could not modify " + parent.getId());
return undefined; return undefined;
} }
return parentPersistence.persist().then(function () { return parentPersistence.persist().then(function () {
// Locate and return new Object in context of parent. return result;
return parent
.useCapability('composition')
.then(function (children) {
var i;
for (i = 0; i < children.length; i += 1) {
if (children[i].getId() === id) {
return children[i];
}
}
});
}); });
}); });
} }
@ -133,6 +115,7 @@ define(
// 2. Create a model with that ID in the persistence space // 2. Create a model with that ID in the persistence space
// 3. Add that ID to // 3. Add that ID to
return self.$q.when(uuid()).then(function (id) { return self.$q.when(uuid()).then(function (id) {
model.persisted = self.now();
return doPersist(persistence.getSpace(), id, model); return doPersist(persistence.getSpace(), id, model);
}).then(function (id) { }).then(function (id) {
return addToComposition(id, parent, persistence); return addToComposition(id, parent, persistence);

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

@ -146,12 +146,14 @@ define(
expect(mockScope.navigatedObject).toEqual(mockDomainObject); expect(mockScope.navigatedObject).toEqual(mockDomainObject);
}); });
it("releases its navigation listener when its scope is destroyed", function () { it("releases its navigation listener when its scope is destroyed", function () {
expect(mockScope.$on).toHaveBeenCalledWith( expect(mockScope.$on).toHaveBeenCalledWith(
"$destroy", "$destroy",
jasmine.any(Function) jasmine.any(Function)
); );
mockScope.$on.mostRecentCall.args[1](); mockScope.$on.mostRecentCall.args[1]();
// Should remove the listener it added earlier // Should remove the listener it added earlier
expect(mockNavigationService.removeListener).toHaveBeenCalledWith( expect(mockNavigationService.removeListener).toHaveBeenCalledWith(
mockNavigationService.addListener.mostRecentCall.args[0] mockNavigationService.addListener.mostRecentCall.args[0]

90
platform/commonUI/browse/test/BrowseTreeControllerSpec.js Normal file
View File

@ -0,0 +1,90 @@
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/*global define,Promise,describe,it,expect,beforeEach,waitsFor,jasmine*/
define(
["../src/BrowseTreeController"],
function (BrowseTreeController) {
'use strict';
describe("The BrowseTreeController", function () {
var mockScope,
mockAgentService,
mockDomainObjects,
controller;
// We want to reinstantiate for each test case
// because device state can influence constructor-time behavior
function instantiateController() {
return new BrowseTreeController(
mockScope,
mockAgentService
);
}
beforeEach(function () {
mockScope = jasmine.createSpyObj("$scope", [ "$on" ]);
mockDomainObjects = ['a', 'b'].map(function (id) {
var mockDomainObject = jasmine.createSpyObj(
'domainObject-' + id,
[ 'getId', 'getModel', 'getCapability' ]
);
mockDomainObject.getId.andReturn(id);
mockDomainObject.getModel.andReturn({});
return mockDomainObject;
});
mockAgentService = jasmine.createSpyObj(
"agentService",
[ "isMobile", "isPhone", "isTablet", "isPortrait", "isLandscape" ]
);
});
it("is initially visible", function () {
expect(instantiateController().visible()).toBeTruthy();
});
it("allows visibility to be toggled", function () {
controller = instantiateController();
controller.toggle();
expect(controller.visible()).toBeFalsy();
controller.toggle();
expect(controller.visible()).toBeTruthy();
});
it("collapses on navigation changes on portrait-oriented phones", function () {
mockAgentService.isMobile.andReturn(true);
mockAgentService.isPhone.andReturn(true);
mockAgentService.isPortrait.andReturn(true);
controller = instantiateController();
expect(controller.visible()).toBeTruthy();
// Simulate a change from the tree by invoking controller's
controller.callback();
// Tree should have collapsed
expect(controller.visible()).toBeFalsy();
});
});
}
);

60
platform/commonUI/browse/test/creation/CreationServiceSpec.js
View File

@ -31,6 +31,7 @@ define(
describe("The creation service", function () { describe("The creation service", function () {
var mockPersistenceService, var mockPersistenceService,
mockNow,
mockQ, mockQ,
mockLog, mockLog,
mockParentObject, mockParentObject,
@ -63,6 +64,7 @@ define(
"persistenceService", "persistenceService",
[ "createObject" ] [ "createObject" ]
); );
mockNow = jasmine.createSpy('now');
mockQ = { when: mockPromise, reject: mockReject }; mockQ = { when: mockPromise, reject: mockReject };
mockLog = jasmine.createSpyObj( mockLog = jasmine.createSpyObj(
"$log", "$log",
@ -86,7 +88,7 @@ define(
); );
mockCompositionCapability = jasmine.createSpyObj( mockCompositionCapability = jasmine.createSpyObj(
"composition", "composition",
["invoke"] ["invoke", "add"]
); );
mockContextCapability = jasmine.createSpyObj( mockContextCapability = jasmine.createSpyObj(
"context", "context",
@ -103,6 +105,8 @@ define(
mockPromise(true) mockPromise(true)
); );
mockNow.andReturn(12321);
mockParentObject.getCapability.andCallFake(function (key) { mockParentObject.getCapability.andCallFake(function (key) {
return mockCapabilities[key]; return mockCapabilities[key];
}); });
@ -120,9 +124,11 @@ define(
mockCompositionCapability.invoke.andReturn( mockCompositionCapability.invoke.andReturn(
mockPromise([mockNewObject]) mockPromise([mockNewObject])
); );
mockCompositionCapability.add.andReturn(mockPromise(true));
creationService = new CreationService( creationService = new CreationService(
mockPersistenceService, mockPersistenceService,
mockNow,
mockQ, mockQ,
mockLog mockLog
); );
@ -143,32 +149,33 @@ define(
parentModel = { composition: ["notAnyUUID"] }; parentModel = { composition: ["notAnyUUID"] };
creationService.createObject(model, mockParentObject); creationService.createObject(model, mockParentObject);
// Invoke the mutation callback // Verify that a new ID was added
expect(mockMutationCapability.invoke).toHaveBeenCalled(); expect(mockCompositionCapability.add)
mockMutationCapability.invoke.mostRecentCall.args[0](parentModel); .toHaveBeenCalledWith(jasmine.any(String));
// Should have a longer composition now, with the new UUID
expect(parentModel.composition.length).toEqual(2);
}); });
it("warns if parent has no composition", function () { it("provides the newly-created object", function () {
var model = { someKey: "some value" }, var mockDomainObject = jasmine.createSpyObj(
parentModel = { }; 'newDomainObject',
creationService.createObject(model, mockParentObject); ['getId', 'getModel', 'getCapability']
),
mockCallback = jasmine.createSpy('callback');
// Verify precondition; no prior warnings // Act as if the object had been created
expect(mockLog.warn).not.toHaveBeenCalled(); mockCompositionCapability.add.andCallFake(function (id) {
mockDomainObject.getId.andReturn(id);
// Invoke the mutation callback mockCompositionCapability.invoke
expect(mockMutationCapability.invoke).toHaveBeenCalled(); .andReturn(mockPromise([mockDomainObject]));
mockMutationCapability.invoke.mostRecentCall.args[0](parentModel); return mockPromise(mockDomainObject);
// Should have a longer composition now, with the new UUID
expect(mockLog.warn).toHaveBeenCalled();
// Composition should still be undefined
expect(parentModel.composition).toBeUndefined();
}); });
// Should find it in the composition
creationService.createObject({}, mockParentObject)
.then(mockCallback);
expect(mockCallback).toHaveBeenCalledWith(mockDomainObject);
});
it("warns if parent has no persistence capability", function () { it("warns if parent has no persistence capability", function () {
// Callbacks // Callbacks
@ -185,7 +192,6 @@ define(
expect(mockLog.warn).toHaveBeenCalled(); expect(mockLog.warn).toHaveBeenCalled();
expect(success).not.toHaveBeenCalled(); expect(success).not.toHaveBeenCalled();
expect(failure).toHaveBeenCalled(); expect(failure).toHaveBeenCalled();
}); });
it("logs an error when mutaton fails", function () { it("logs an error when mutaton fails", function () {
@ -194,13 +200,19 @@ define(
var model = { someKey: "some value" }, var model = { someKey: "some value" },
parentModel = { composition: ["notAnyUUID"] }; parentModel = { composition: ["notAnyUUID"] };
mockMutationCapability.invoke.andReturn(mockPromise(false)); mockCompositionCapability.add.andReturn(mockPromise(false));
creationService.createObject(model, mockParentObject); creationService.createObject(model, mockParentObject);
expect(mockLog.error).toHaveBeenCalled(); expect(mockLog.error).toHaveBeenCalled();
}); });
it("attaches a 'persisted' timestamp", function () {
var model = { someKey: "some value" };
creationService.createObject(model, mockParentObject);
expect(model.persisted).toEqual(mockNow());
});
}); });
} }
); );

1
platform/commonUI/browse/test/suite.json
View File

@ -1,6 +1,7 @@
[ [
"BrowseController", "BrowseController",
"BrowseObjectController", "BrowseObjectController",
"BrowseTreeController",
"MenuArrowController", "MenuArrowController",
"creation/CreateAction", "creation/CreateAction",
"creation/CreateActionProvider", "creation/CreateActionProvider",

8
platform/commonUI/dialog/res/templates/dialog.html
View File

@ -25,7 +25,7 @@
All fields marked <span class="ui-symbol req">*</span> are required. All fields marked <span class="ui-symbol req">*</span> are required.
</div> </div>
</div> </div>
<div class="abs form outline editor"> <div class="abs form editor">
<div class='abs contents l-dialog'> <div class='abs contents l-dialog'>
<mct-form ng-model="ngModel.value" <mct-form ng-model="ngModel.value"
structure="ngModel.structure" structure="ngModel.structure"
@ -34,13 +34,13 @@
</div> </div>
</div> </div>
<div class="abs bottom-bar"> <div class="abs bottom-bar">
<a class='btn lg major' <a class='s-btn major'
href=''
ng-class="{ disabled: !createForm.$valid }" ng-class="{ disabled: !createForm.$valid }"
ng-click="ngModel.confirm()"> ng-click="ngModel.confirm()">
OK OK
</a> </a>
<a class='btn lg subtle' href='' ng-click="ngModel.cancel()"> <a class='s-btn'
ng-click="ngModel.cancel()">
Cancel Cancel
</a> </a>
</div> </div>

2
platform/commonUI/dialog/res/templates/overlay-options.html
View File

@ -35,7 +35,7 @@
<div class="abs bottom-bar"> <div class="abs bottom-bar">
<a ng-repeat="option in ngModel.dialog.options" <a ng-repeat="option in ngModel.dialog.options"
href='' href=''
class="btn lg" class="s-btn lg"
title="{{option.description}}" title="{{option.description}}"
ng-click="ngModel.confirm(option.key)" ng-click="ngModel.confirm(option.key)"
ng-class="{ major: $first, subtle: !$first }"> ng-class="{ major: $first, subtle: !$first }">

2
platform/commonUI/dialog/res/templates/overlay.html
View File

@ -25,7 +25,7 @@
<a href="" <a href=""
ng-click="ngModel.cancel()" ng-click="ngModel.cancel()"
ng-if="ngModel.cancel" ng-if="ngModel.cancel"
class="btn normal ui-symbol close"> class="clk-icon icon ui-symbol close">
x x
</a> </a>
<div class="abs contents" ng-transclude> <div class="abs contents" ng-transclude>

2
platform/commonUI/edit/res/templates/edit-action-buttons.html
View File

@ -21,7 +21,7 @@
--> -->
<span ng-controller="EditActionController"> <span ng-controller="EditActionController">
<span ng-repeat="currentAction in editActions"> <span ng-repeat="currentAction in editActions">
<a class='btn' <a class='s-btn'
ng-click="currentAction.perform()" ng-click="currentAction.perform()"
ng-class="{ major: $index === 0, subtle: $index !== 0 }"> ng-class="{ major: $index === 0, subtle: $index !== 0 }">
{{currentAction.getMetadata().name}} {{currentAction.getMetadata().name}}

15
platform/commonUI/edit/src/actions/LinkAction.js
View File

@ -36,20 +36,11 @@ define(
function LinkAction(context) { function LinkAction(context) {
this.domainObject = (context || {}).domainObject; this.domainObject = (context || {}).domainObject;
this.selectedObject = (context || {}).selectedObject; this.selectedObject = (context || {}).selectedObject;
this.selectedId = this.selectedObject && this.selectedObject.getId();
} }
LinkAction.prototype.perform = function () { LinkAction.prototype.perform = function () {
var self = this; var self = this;
// Add this domain object's identifier
function addId(model) {
if (Array.isArray(model.composition) &&
model.composition.indexOf(self.selectedId) < 0) {
model.composition.push(self.selectedId);
}
}
// Persist changes to the domain object // Persist changes to the domain object
function doPersist() { function doPersist() {
var persistence = var persistence =
@ -59,11 +50,13 @@ define(
// Link these objects // Link these objects
function doLink() { function doLink() {
return self.domainObject.useCapability("mutation", addId) var composition = self.domainObject &&
self.domainObject.getCapability('composition');
return composition && composition.add(self.selectedObject)
.then(doPersist); .then(doPersist);
} }
return this.selectedId && doLink(); return this.selectedObject && doLink();
}; };
return LinkAction; return LinkAction;

3
platform/commonUI/edit/src/actions/PropertiesDialog.js
View File

@ -54,6 +54,9 @@ define(
var row = Object.create(property.getDefinition()); var row = Object.create(property.getDefinition());
row.key = index; row.key = index;
return row; return row;
}).filter(function (row) {
// Only show properties which are editable
return row.control;
}) })
}] }]
}; };

1
platform/commonUI/edit/src/actions/RemoveAction.js
View File

@ -95,7 +95,6 @@ define(
// Stop when object is not defined (above ROOT) // Stop when object is not defined (above ROOT)
while (traverseObject) { while (traverseObject) {
// If object currently traversed to is object being removed // If object currently traversed to is object being removed
// navigate to parent of current object and then exit loop // navigate to parent of current object and then exit loop
if (traverseObject.getId() === object.getId()) { if (traverseObject.getId() === object.getId()) {

34
platform/commonUI/edit/test/actions/LinkActionSpec.js
View File

@ -31,7 +31,7 @@ define(
mockDomainObject, mockDomainObject,
mockParent, mockParent,
mockContext, mockContext,
mockMutation, mockComposition,
mockPersistence, mockPersistence,
mockType, mockType,
actionContext, actionContext,
@ -67,7 +67,7 @@ define(
} }
}; };
mockContext = jasmine.createSpyObj("context", [ "getParent" ]); mockContext = jasmine.createSpyObj("context", [ "getParent" ]);
mockMutation = jasmine.createSpyObj("mutation", [ "invoke" ]); mockComposition = jasmine.createSpyObj("composition", [ "invoke", "add" ]);
mockPersistence = jasmine.createSpyObj("persistence", [ "persist" ]); mockPersistence = jasmine.createSpyObj("persistence", [ "persist" ]);
mockType = jasmine.createSpyObj("type", [ "hasFeature" ]); mockType = jasmine.createSpyObj("type", [ "hasFeature" ]);
@ -75,11 +75,11 @@ define(
mockDomainObject.getCapability.andReturn(mockContext); mockDomainObject.getCapability.andReturn(mockContext);
mockContext.getParent.andReturn(mockParent); mockContext.getParent.andReturn(mockParent);
mockType.hasFeature.andReturn(true); mockType.hasFeature.andReturn(true);
mockMutation.invoke.andReturn(mockPromise(true)); mockComposition.invoke.andReturn(mockPromise(true));
mockComposition.add.andReturn(mockPromise(true));
capabilities = { capabilities = {
mutation: mockMutation, composition: mockComposition,
persistence: mockPersistence, persistence: mockPersistence,
type: mockType type: mockType
}; };
@ -96,30 +96,14 @@ define(
}); });
it("mutates the parent when performed", function () { it("adds to the parent's composition when performed", function () {
action.perform(); action.perform();
expect(mockMutation.invoke) expect(mockComposition.add)
.toHaveBeenCalledWith(jasmine.any(Function)); .toHaveBeenCalledWith(mockDomainObject);
}); });
it("changes composition from its mutation function", function () { it("persists changes afterward", function () {
var mutator, result;
action.perform(); action.perform();
mutator = mockMutation.invoke.mostRecentCall.args[0];
result = mutator(model);
// Should not have cancelled the mutation
expect(result).not.toBe(false);
// Simulate mutate's behavior (remove can either return a
// new model or modify this one in-place)
result = result || model;
// Should have removed "test" - that was our
// mock domain object's id.
expect(result.composition).toEqual(["a", "b", "c", "test"]);
// Finally, should have persisted
expect(mockPersistence.persist).toHaveBeenCalled(); expect(mockPersistence.persist).toHaveBeenCalled();
}); });

2
platform/commonUI/edit/test/actions/PropertiesDialogSpec.js
View File

@ -39,7 +39,7 @@ define(
return { return {
getValue: function (model) { return model[k]; }, getValue: function (model) { return model[k]; },
setValue: function (model, v) { model[k] = v; }, setValue: function (model, v) { model[k] = v; },
getDefinition: function () { return {}; } getDefinition: function () { return { control: 'textfield '}; }
}; };
}); });

14
platform/commonUI/general/bundle.json
View File

@ -6,7 +6,7 @@
"services": [ "services": [
{ {
"key": "urlService", "key": "urlService",
"implementation": "/services/UrlService.js", "implementation": "services/UrlService.js",
"depends": [ "$location" ] "depends": [ "$location" ]
} }
], ],
@ -20,18 +20,6 @@
{ {
"stylesheetUrl": "css/normalize.min.css", "stylesheetUrl": "css/normalize.min.css",
"priority": "mandatory" "priority": "mandatory"
},
{
"stylesheetUrl": "css/theme-espresso.css",
"priority": 1000
},
{
"stylesheetUrl": "css/items.css",
"priority": 901
},
{
"stylesheetUrl": "css/tree.css",
"priority": 900
} }
], ],
"templates": [ "templates": [

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

@ -13,7 +13,7 @@ javascripts_dir = "js"
output_style = :nested output_style = :nested
# To enable relative paths to assets via compass helper functions. Uncomment: # To enable relative paths to assets via compass helper functions. Uncomment:
# relative_assets = true relative_assets = true
# To disable debugging comments that display the original location of your selectors. Uncomment: # To disable debugging comments that display the original location of your selectors. Uncomment:
# line_comments = false # line_comments = false

533
platform/commonUI/general/res/css/forms.css
View File

@ -1,533 +0,0 @@
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/*****************************************************************************
* 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.
*****************************************************************************/
/************************** FEATURES */
/************************** VERY INFLUENTIAL GLOBAL DIMENSIONS */
/************************** COLORS AND SHADING */
/************************** RATIOS */
/************************** LAYOUT */
/************************** CONTROLS */
/************************** PATHS */
/************************** TIMINGS */
/*****************************************************************************
* 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.
*****************************************************************************/
/*********************************************** FORM ELEMENTS */
/*
@mixin invokeMenu($baseColor: $colorBodyFg) {
$c: $baseColor;
color: $c;
&:hover {
color: lighten($c, $ltGamma);
}
}
*/
/*****************************************************************************
* 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.
*****************************************************************************/
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/* line 22, ../sass/forms/_elems.scss */
.section-header {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
background: rgba(255, 255, 255, 0.1);
font-size: 0.8em;
margin-top: 5px;
padding: 5px; }
/* line 28, ../sass/forms/_elems.scss */
.section-header:first-child {
margin-top: 0; }
/* line 35, ../sass/forms/_elems.scss */
.form .form-section {
position: relative; }
/* line 39, ../sass/forms/_elems.scss */
.form .form-row {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
overflow: hidden;
*zoom: 1;
border-top: 1px solid #4d4d4d;
margin-top: 5px;
padding: 5px;
position: relative; }
/* line 46, ../sass/forms/_elems.scss */
.form .form-row.first {
border-top: none; }
/* line 50, ../sass/forms/_elems.scss */
.form .form-row .label,
.form .form-row .controls {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
overflow: hidden;
*zoom: 1;
box-sizing: border-box;
font-size: 0.75rem;
line-height: 22px;
min-height: 22px; }
/* line 61, ../sass/forms/_elems.scss */
.form .form-row > .label {
float: left;
position: relative;
white-space: nowrap;
width: 20%; }
/* line 69, ../sass/forms/_elems.scss */
.form .form-row .value {
color: #cccccc; }
/* line 73, ../sass/forms/_elems.scss */
.form .form-row .controls {
float: left;
position: relative;
width: 79.9%; }
/* line 80, ../sass/forms/_elems.scss */
.form .form-row .controls .l-composite-control.l-checkbox {
display: inline-block;
line-height: 14px;
margin-right: 5px; }
/* line 89, ../sass/forms/_elems.scss */
.form .form-row .controls .l-med input[type="text"] {
width: 200px; }
/* line 93, ../sass/forms/_elems.scss */
.form .form-row .controls .l-small input[type="text"] {
width: 50px; }
/* line 97, ../sass/forms/_elems.scss */
.form .form-row .controls .l-numeric input[type="text"] {
text-align: right; }
/* line 101, ../sass/forms/_elems.scss */
.form .form-row .controls .select {
margin-right: 5px; }
/* line 106, ../sass/forms/_elems.scss */
.form .form-row .field-hints {
color: #666666; }
/* line 110, ../sass/forms/_elems.scss */
.form .form-row .selector-list {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
background: rgba(0, 0, 0, 0.2);
padding: 5px;
position: relative;
height: 150px;
overflow: auto; }
/* line 121, ../sass/forms/_elems.scss */
.form .form-row .selector-list .wrapper {
overflow-y: auto;
position: absolute;
top: 5px;
right: 5px;
bottom: 5px;
left: 5px; }
/* line 135, ../sass/forms/_elems.scss */
label.form-control.checkbox input {
margin-right: 5px;
vertical-align: top; }
/* line 141, ../sass/forms/_elems.scss */
.hint,
.s-hint {
font-size: 0.9em; }
/* line 146, ../sass/forms/_elems.scss */
.l-result {
display: inline-block;
min-width: 32px;
min-height: 32px;
position: relative;
vertical-align: top; }
/* line 153, ../sass/forms/_elems.scss */
.l-result div.s-hint {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
background: rgba(255, 153, 0, 0.8);
display: block;
color: #ffd699;
padding: 5px; }
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/* line 22, ../sass/forms/_textarea.scss */
.edit-main textarea {
-moz-appearance: none;
-webkit-appearance: none;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-moz-box-shadow: inset rgba(0, 0, 0, 0.65) 0 1px 4px;
-webkit-box-shadow: inset rgba(0, 0, 0, 0.65) 0 1px 4px;
box-shadow: inset rgba(0, 0, 0, 0.65) 0 1px 4px;
background: rgba(255, 255, 255, 0.1);
border: none;
color: #cccccc;
outline: none;
padding: 5px;
position: absolute;
height: 100%;
width: 100%; }
/* line 33, ../sass/forms/_mixins.scss */
.edit-main textarea.error {
background: rgba(255, 0, 0, 0.5); }
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/* line 22, ../sass/forms/_text-input.scss */
input[type="text"] {
-moz-appearance: none;
-webkit-appearance: none;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-moz-box-shadow: inset rgba(0, 0, 0, 0.65) 0 1px 4px;
-webkit-box-shadow: inset rgba(0, 0, 0, 0.65) 0 1px 4px;
box-shadow: inset rgba(0, 0, 0, 0.65) 0 1px 4px;
background: rgba(255, 255, 255, 0.1);
border: none;
color: #cccccc;
outline: none;
padding: 0 3px; }
/* line 33, ../sass/forms/_mixins.scss */
input[type="text"].error {
background: rgba(255, 0, 0, 0.5); }
/* line 29, ../sass/forms/_text-input.scss */
input[type="text"].numeric {
text-align: right; }
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/* line 22, ../sass/forms/_selects.scss */
.form-control.select {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzUyNTI1MiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzQ1NDU0NSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #525252), color-stop(100%, #454545));
background-image: -moz-linear-gradient(#525252, #454545);
background-image: -webkit-linear-gradient(#525252, #454545);
background-image: linear-gradient(#525252, #454545);
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
border: none;
border-top: 1px solid #575757;
color: #999;
display: inline-block;
cursor: pointer;
display: inline-block;
margin: 0 0 2px 2px;
overflow: hidden;
position: relative; }
/* line 162, ../sass/_mixins.scss */
.form-control.select:not(.disabled):hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzYzNjM2MyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzU3NTc1NyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #636363), color-stop(100%, #575757));
background-image: -moz-linear-gradient(#636363, #575757);
background-image: -webkit-linear-gradient(#636363, #575757);
background-image: linear-gradient(#636363, #575757);
color: #bdbdbd; }
/* line 165, ../sass/_mixins.scss */
.form-control.select:not(.disabled):hover.btn-menu .invoke-menu {
color: #878787; }
/* line 170, ../sass/_mixins.scss */
.form-control.select.btn-menu .invoke-menu {
color: #757575; }
/* line 29, ../sass/forms/_selects.scss */
.form-control.select select {
-moz-appearance: none;
-webkit-appearance: none;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
background: none;
color: #999;
border: none !important;
cursor: pointer;
padding: 4px 25px 2px 5px;
width: 120%; }
/* line 38, ../sass/forms/_selects.scss */
.form-control.select select option {
margin: 5px 0; }
/* line 42, ../sass/forms/_selects.scss */
.form-control.select:after {
color: #0099cc;
content: "v";
display: block;
font-family: 'symbolsfont';
pointer-events: none;
position: absolute;
right: 5px;
top: 0; }
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/* line 23, ../sass/forms/_channel-selector.scss */
.channel-selector .line {
margin-bottom: 5px;
min-height: 22px; }
/* line 27, ../sass/forms/_channel-selector.scss */
.channel-selector .treeview {
-moz-appearance: none;
-webkit-appearance: none;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-moz-box-shadow: inset rgba(0, 0, 0, 0.65) 0 1px 4px;
-webkit-box-shadow: inset rgba(0, 0, 0, 0.65) 0 1px 4px;
box-shadow: inset rgba(0, 0, 0, 0.65) 0 1px 4px;
background: rgba(255, 255, 255, 0.1);
border: none;
color: #cccccc;
outline: none;
padding: 0 3px;
background: #3b3b3b;
border-bottom: 1px solid #4d4d4d;
min-height: 300px;
max-height: 400px;
overflow: auto;
padding: 5px; }
/* line 33, ../sass/forms/_mixins.scss */
.channel-selector .treeview.error {
background: rgba(255, 0, 0, 0.5); }
/* line 36, ../sass/forms/_channel-selector.scss */
.channel-selector .btns-add-remove {
margin-top: 150px; }
/* line 39, ../sass/forms/_channel-selector.scss */
.channel-selector .btns-add-remove .btn {
display: block;
font-size: 1.5em;
margin-bottom: 5px;
padding: 10px;
text-align: center; }
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/* line 23, ../sass/forms/_datetime.scss */
.complex.datetime span {
display: inline-block;
margin-right: 5px; }
/* line 36, ../sass/forms/_datetime.scss */
.complex.datetime .fields {
margin-top: 3px 0;
padding: 3px 0; }
/* line 41, ../sass/forms/_datetime.scss */
.complex.datetime .date {
width: 85px; }
/* line 44, ../sass/forms/_datetime.scss */
.complex.datetime .date input {
width: 80px; }
/* line 50, ../sass/forms/_datetime.scss */
.complex.datetime .time.sm {
width: 45px; }
/* line 53, ../sass/forms/_datetime.scss */
.complex.datetime .time.sm input {
width: 40px; }

299
platform/commonUI/general/res/css/items.css
View File

@ -1,299 +0,0 @@
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/*****************************************************************************
* 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.
*****************************************************************************/
/************************** FEATURES */
/************************** VERY INFLUENTIAL GLOBAL DIMENSIONS */
/************************** COLORS AND SHADING */
/************************** RATIOS */
/************************** LAYOUT */
/************************** CONTROLS */
/************************** PATHS */
/************************** TIMINGS */
/*****************************************************************************
* 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.
*****************************************************************************/
/*********************************************** FORM ELEMENTS */
/*
@mixin invokeMenu($baseColor: $colorBodyFg) {
$c: $baseColor;
color: $c;
&:hover {
color: lighten($c, $ltGamma);
}
}
*/
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/* line 22, ../sass/items/_item.scss */
.items-holder {
overflow: hidden;
*zoom: 1;
overflow-y: auto; }
/* line 25, ../sass/items/_item.scss */
.items-holder .contents {
top: 0; }
/* line 29, ../sass/items/_item.scss */
.items-holder .item.grid-item {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzVlNWU1ZSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzUyNTI1MiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #5e5e5e), color-stop(100%, #525252));
background-image: -moz-linear-gradient(#5e5e5e, #525252);
background-image: -webkit-linear-gradient(#5e5e5e, #525252);
background-image: linear-gradient(#5e5e5e, #525252);
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
border: none;
border-top: 1px solid #636363;
color: #999;
display: inline-block;
box-sizing: border-box;
cursor: pointer;
float: left;
height: 200px;
width: 200px;
margin-bottom: 3px;
margin-right: 3px;
position: relative; }
/* line 162, ../sass/_mixins.scss */
.items-holder .item.grid-item:not(.disabled):hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzcwNzA3MCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzYzNjM2MyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #707070), color-stop(100%, #636363));
background-image: -moz-linear-gradient(#707070, #636363);
background-image: -webkit-linear-gradient(#707070, #636363);
background-image: linear-gradient(#707070, #636363);
color: #bdbdbd; }
/* line 165, ../sass/_mixins.scss */
.items-holder .item.grid-item:not(.disabled):hover.btn-menu .invoke-menu {
color: #949494; }
/* line 170, ../sass/_mixins.scss */
.items-holder .item.grid-item.btn-menu .invoke-menu {
color: #828282; }
/* line 46, ../sass/items/_item.scss */
.items-holder .item.grid-item:hover .item-main .item-type {
color: #0099cc !important; }
/* line 48, ../sass/items/_item.scss */
.items-holder .item.grid-item:hover .item-main .item-type .l-icon-link {
color: #49dedb; }
/* line 52, ../sass/items/_item.scss */
.items-holder .item.grid-item:hover .item-main .item-open {
opacity: 1; }
/* line 57, ../sass/items/_item.scss */
.items-holder .item.grid-item .contents {
top: 5px;
right: 5px;
bottom: 5px;
left: 5px; }
/* line 61, ../sass/items/_item.scss */
.items-holder .item.grid-item .bar.top-bar.abs {
bottom: auto;
height: 20px;
line-height: 20px;
z-index: 5; }
/* line 66, ../sass/items/_item.scss */
.items-holder .item.grid-item .bar.top-bar.abs .left, .items-holder .item.grid-item .bar.top-bar.abs .right {
width: auto; }
/* line 68, ../sass/items/_item.scss */
.items-holder .item.grid-item .bar.top-bar.abs .left .icon, .items-holder .item.grid-item .bar.top-bar.abs .right .icon {
margin-left: 3px; }
/* line 70, ../sass/items/_item.scss */
.items-holder .item.grid-item .bar.top-bar.abs .left .icon.l-icon-link, .items-holder .item.grid-item .bar.top-bar.abs .right .icon.l-icon-link {
color: #49dedb; }
/* line 76, ../sass/items/_item.scss */
.items-holder .item.grid-item .bar.bottom-bar.abs {
top: auto;
height: 30px;
padding: 5px; }
/* line 82, ../sass/items/_item.scss */
.items-holder .item.grid-item .item-main {
line-height: 160px;
z-index: 1; }
/* line 88, ../sass/items/_item.scss */
.items-holder .item.grid-item .item-main .item-type {
overflow: false;
position: absolute;
top: 40px;
right: 40px;
bottom: 40px;
left: 40px;
width: auto;
height: auto;
color: #737373;
text-align: center;
font-size: 96.9px;
line-height: 102px;
bottom: auto;
height: 102px;
top: 30px; }
/* line 100, ../sass/items/_item.scss */
.items-holder .item.grid-item .item-main .item-type .l-icon-link {
color: #1a8e8b;
height: 36px;
line-height: 36px;
position: absolute;
font-size: 32px;
left: 0px;
bottom: 10px;
z-index: 2; }
/* line 112, ../sass/items/_item.scss */
.items-holder .item.grid-item .item-main .item-open {
-moz-transition-property: "opacity";
-o-transition-property: "opacity";
-webkit-transition-property: "opacity";
transition-property: "opacity";
-moz-transition-duration: 200ms;
-o-transition-duration: 200ms;
-webkit-transition-duration: 200ms;
transition-duration: 200ms;
-moz-transition-timing-function: ease-in-out;
-o-transition-timing-function: ease-in-out;
-webkit-transition-timing-function: ease-in-out;
transition-timing-function: ease-in-out;
opacity: 0;
font-size: 3em;
left: auto;
width: 50px;
pointer-events: none;
text-align: right; }
/* line 124, ../sass/items/_item.scss */
.items-holder .item.grid-item .title {
text-shadow: rgba(0, 0, 0, 0.1) 0 1px 2px;
color: #cccccc;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis; }
/* line 132, ../sass/items/_item.scss */
.items-holder .item.grid-item .details {
font-size: 0.8em; }
/* line 135, ../sass/items/_item.scss */
.items-holder .item.grid-item.selected {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzBhYzJmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwYjRmMCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0ac2ff), color-stop(100%, #00b4f0));
background-image: -moz-linear-gradient(#0ac2ff, #00b4f0);
background-image: -webkit-linear-gradient(#0ac2ff, #00b4f0);
background-image: linear-gradient(#0ac2ff, #00b4f0);
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
border: none;
border-top: 1px solid #14c4ff;
color: #999;
display: inline-block;
color: #80dfff; }
/* line 162, ../sass/_mixins.scss */
.items-holder .item.grid-item.selected:not(.disabled):hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzJlY2JmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzE0YzRmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #2ecbff), color-stop(100%, #14c4ff));
background-image: -moz-linear-gradient(#2ecbff, #14c4ff);
background-image: -webkit-linear-gradient(#2ecbff, #14c4ff);
background-image: linear-gradient(#2ecbff, #14c4ff);
color: #bdbdbd; }
/* line 165, ../sass/_mixins.scss */
.items-holder .item.grid-item.selected:not(.disabled):hover.btn-menu .invoke-menu {
color: #75ddff; }
/* line 170, ../sass/_mixins.scss */
.items-holder .item.grid-item.selected.btn-menu .invoke-menu {
color: #52d4ff; }
/* line 140, ../sass/items/_item.scss */
.items-holder .item.grid-item.selected .item-type, .items-holder .item.grid-item.selected .top-bar .icon:not(.alert) {
color: #80dfff; }
/* line 141, ../sass/items/_item.scss */
.items-holder .item.grid-item.selected .item-main .item-open {
color: #80dfff; }
/* line 142, ../sass/items/_item.scss */
.items-holder .item.grid-item.selected .title {
color: white; }
/* line 144, ../sass/items/_item.scss */
.items-holder .item.grid-item.selected:hover .item-main .item-type {
color: white !important; }

120
platform/commonUI/general/res/css/main.css
View File

@ -1,120 +0,0 @@
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/*
Syntax error: Undefined variable: "$colorBodyBg".
on line 66 of /Users/iMac/dev/nasa/wtd-dev/platform/sass/_effects.scss, in `boxOutline'
from line 7 of /Users/iMac/dev/nasa/wtd-dev/platform/sass/_effects.scss
from line 10 of /Users/iMac/dev/nasa/wtd-dev/platform/sass/main.scss
Backtrace:
/Users/iMac/dev/nasa/wtd-dev/platform/sass/_effects.scss:66:in `boxOutline'
/Users/iMac/dev/nasa/wtd-dev/platform/sass/_effects.scss:7
/Users/iMac/dev/nasa/wtd-dev/platform/sass/main.scss:10
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/script/variable.rb:49:in `_perform'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/script/node.rb:40:in `perform'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/script/funcall.rb:93:in `_perform'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/script/funcall.rb:93:in `map'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/script/funcall.rb:93:in `_perform'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/script/node.rb:40:in `perform'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/perform.rb:56:in `perform_arguments'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/perform.rb:50:in `zip'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/perform.rb:50:in `perform_arguments'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/perform.rb:261:in `visit_mixin'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/base.rb:37:in `send'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/base.rb:37:in `visit'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/perform.rb:98:in `visit'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/base.rb:53:in `visit_children'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/base.rb:53:in `map'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/base.rb:53:in `visit_children'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/perform.rb:107:in `visit_children'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/perform.rb:119:in `with_environment'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/perform.rb:106:in `visit_children'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/base.rb:37:in `visit'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/perform.rb:318:in `visit_rule'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/base.rb:37:in `send'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/base.rb:37:in `visit'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/perform.rb:98:in `visit'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/perform.rb:225:in `visit_import'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/perform.rb:225:in `map'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/perform.rb:225:in `visit_import'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/base.rb:37:in `send'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/base.rb:37:in `visit'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/perform.rb:98:in `visit'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/base.rb:53:in `visit_children'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/base.rb:53:in `map'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/base.rb:53:in `visit_children'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/perform.rb:107:in `visit_children'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/perform.rb:119:in `with_environment'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/perform.rb:106:in `visit_children'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/base.rb:37:in `visit'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/perform.rb:126:in `visit_root'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/base.rb:37:in `send'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/base.rb:37:in `visit'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/perform.rb:98:in `visit'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/perform.rb:7:in `send'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/visitors/perform.rb:7:in `visit'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/tree/root_node.rb:20:in `render'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/engine.rb:315:in `_render'
/Library/Ruby/Gems/1.8/gems/sass-3.2.5/lib/sass/../sass/engine.rb:262:in `render'
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/lib/compass/compiler.rb:140:in `compile'
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/lib/compass/compiler.rb:126:in `timed'
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/lib/compass/compiler.rb:139:in `compile'
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/lib/compass/logger.rb:45:in `red'
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/lib/compass/compiler.rb:138:in `compile'
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/lib/compass/compiler.rb:118:in `compile_if_required'
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/lib/compass/compiler.rb:103:in `run'
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/lib/compass/compiler.rb:101:in `each'
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/lib/compass/compiler.rb:101:in `run'
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/lib/compass/compiler.rb:126:in `timed'
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/lib/compass/compiler.rb:100:in `run'
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/lib/compass/commands/watch_project.rb:147:in `recompile'
/Library/Ruby/Site/1.8/rubygems/custom_require.rb:36:in `to_proc'
/Library/Ruby/Gems/1.8/gems/fssm-0.2.9/lib/fssm/path.rb:73:in `call'
/Library/Ruby/Gems/1.8/gems/fssm-0.2.9/lib/fssm/path.rb:73:in `run_callback'
/Library/Ruby/Gems/1.8/gems/fssm-0.2.9/lib/fssm/path.rb:55:in `callback_action'
/Library/Ruby/Gems/1.8/gems/fssm-0.2.9/lib/fssm/path.rb:35:in `update'
/Library/Ruby/Gems/1.8/gems/fssm-0.2.9/lib/fssm/state/directory.rb:39:in `modified'
/Library/Ruby/Gems/1.8/gems/fssm-0.2.9/lib/fssm/state/directory.rb:37:in `each'
/Library/Ruby/Gems/1.8/gems/fssm-0.2.9/lib/fssm/state/directory.rb:37:in `modified'
/Library/Ruby/Gems/1.8/gems/fssm-0.2.9/lib/fssm/state/directory.rb:18:in `refresh'
/Library/Ruby/Gems/1.8/gems/fssm-0.2.9/lib/fssm/backends/polling.rb:17:in `run'
/Library/Ruby/Gems/1.8/gems/fssm-0.2.9/lib/fssm/backends/polling.rb:17:in `each'
/Library/Ruby/Gems/1.8/gems/fssm-0.2.9/lib/fssm/backends/polling.rb:17:in `run'
/Library/Ruby/Gems/1.8/gems/fssm-0.2.9/lib/fssm/backends/polling.rb:15:in `loop'
/Library/Ruby/Gems/1.8/gems/fssm-0.2.9/lib/fssm/backends/polling.rb:15:in `run'
/Library/Ruby/Gems/1.8/gems/fssm-0.2.9/lib/fssm/monitor.rb:26:in `run'
/Library/Ruby/Gems/1.8/gems/fssm-0.2.9/lib/fssm.rb:70:in `monitor'
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/lib/compass/commands/watch_project.rb:87:in `perform'
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/lib/compass/commands/base.rb:18:in `execute'
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/lib/compass/commands/project_base.rb:19:in `execute'
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/lib/compass/exec/sub_command_ui.rb:43:in `perform!'
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/lib/compass/exec/sub_command_ui.rb:15:in `run!'
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/bin/compass:30
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/bin/compass:44:in `call'
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/bin/compass:44
/usr/bin/compass:23:in `load'
/usr/bin/compass:23
*/
body:before {
white-space: pre;
font-family: monospace;
content: "Syntax error: Undefined variable: \"$colorBodyBg\".\A on line 66 of /Users/iMac/dev/nasa/wtd-dev/platform/sass/_effects.scss, in `boxOutline'\A from line 7 of /Users/iMac/dev/nasa/wtd-dev/platform/sass/_effects.scss\A from line 10 of /Users/iMac/dev/nasa/wtd-dev/platform/sass/main.scss"; }

498
platform/commonUI/general/res/css/tree.css
View File

@ -1,498 +0,0 @@
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/*****************************************************************************
* 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.
*****************************************************************************/
/************************** FEATURES */
/************************** VERY INFLUENTIAL GLOBAL DIMENSIONS */
/************************** COLORS AND SHADING */
/************************** RATIOS */
/************************** LAYOUT */
/************************** CONTROLS */
/************************** PATHS */
/************************** TIMINGS */
/*****************************************************************************
* 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.
*****************************************************************************/
/*********************************************** FORM ELEMENTS */
/*
@mixin invokeMenu($baseColor: $colorBodyFg) {
$c: $baseColor;
color: $c;
&:hover {
color: lighten($c, $ltGamma);
}
}
*/
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/* line 23, ../sass/tree/_tree.scss */
ul.tree {
margin: 0;
padding: 0; }
/* line 308, ../sass/_mixins.scss */
ul.tree li {
list-style-type: none;
margin: 0;
padding: 0; }
/* line 25, ../sass/tree/_tree.scss */
ul.tree li {
display: block;
position: relative; }
/* line 28, ../sass/tree/_tree.scss */
ul.tree li span.tree-item {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
-moz-transition: background-color 0.25s;
-o-transition: background-color 0.25s;
-webkit-transition: background-color 0.25s;
transition: background-color 0.25s;
display: block;
font-size: 0.8em;
height: 1.5rem;
line-height: 1.5rem;
margin-bottom: 3px;
position: relative; }
/* line 39, ../sass/tree/_tree.scss */
ul.tree li span.tree-item .view-control {
display: inline-block;
margin-left: 5px;
font-size: 0.75em;
width: 10px; }
/* line 45, ../sass/tree/_tree.scss */
ul.tree li span.tree-item .view-control:hover {
color: #ffc700; }
/* line 50, ../sass/tree/_tree.scss */
ul.tree li span.tree-item .label {
display: block;
overflow: hidden;
position: absolute;
top: 0px;
right: 0px;
bottom: 0px;
left: 0px;
width: auto;
height: auto;
left: 15px; }
/* line 57, ../sass/tree/_tree.scss */
ul.tree li span.tree-item .label .type-icon {
overflow: false;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: auto;
height: auto;
text-shadow: rgba(0, 0, 0, 0.6) 0 1px 2px;
color: #0099cc;
left: 5px;
right: auto;
width: 1em; }
/* line 65, ../sass/tree/_tree.scss */
ul.tree li span.tree-item .label .type-icon .icon.l-icon-link, ul.tree li span.tree-item .label .type-icon .icon.l-icon-alert {
text-shadow: black 0 1px 2px;
position: absolute;
z-index: 2; }
/* line 71, ../sass/tree/_tree.scss */
ul.tree li span.tree-item .label .type-icon .icon.l-icon-alert {
color: #ff3c00;
font-size: 8px;
line-height: 8px;
height: 8px;
width: 8px;
top: 1px;
right: -2px; }
/* line 77, ../sass/tree/_tree.scss */
ul.tree li span.tree-item .label .type-icon .icon.l-icon-link {
color: #49dedb;
font-size: 8px;
line-height: 8px;
height: 8px;
width: 8px;
left: -3px;
bottom: 5px; }
/* line 86, ../sass/tree/_tree.scss */
ul.tree li span.tree-item .label .title-label {
overflow: hidden;
position: absolute;
top: 0px;
right: 0px;
bottom: 0px;
left: 0px;
width: auto;
height: auto;
display: block;
left: 30px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap; }
/* line 97, ../sass/tree/_tree.scss */
ul.tree li span.tree-item.loading {
pointer-events: none; }
/* line 99, ../sass/tree/_tree.scss */
ul.tree li span.tree-item.loading .label {
opacity: 0.5; }
/* line 101, ../sass/tree/_tree.scss */
ul.tree li span.tree-item.loading .label .title-label {
font-style: italic; }
/* line 105, ../sass/tree/_tree.scss */
ul.tree li span.tree-item.loading .wait-spinner {
margin-left: 14px; }
/* line 110, ../sass/tree/_tree.scss */
ul.tree li span.tree-item.selected {
background: #005177;
color: #fff; }
/* line 114, ../sass/tree/_tree.scss */
ul.tree li span.tree-item.selected .view-control {
color: #0099cc; }
/* line 117, ../sass/tree/_tree.scss */
ul.tree li span.tree-item.selected .label .type-icon {
color: #fff; }
/* line 123, ../sass/tree/_tree.scss */
ul.tree li span.tree-item:not(.selected):hover {
background: #404040;
color: #cccccc; }
/* line 126, ../sass/tree/_tree.scss */
ul.tree li span.tree-item:not(.selected):hover .context-trigger {
display: block; }
/* line 129, ../sass/tree/_tree.scss */
ul.tree li span.tree-item:not(.selected):hover .icon {
color: #33ccff; }
/* line 135, ../sass/tree/_tree.scss */
ul.tree li span.tree-item:not(.loading) {
cursor: pointer; }
/* line 139, ../sass/tree/_tree.scss */
ul.tree li span.tree-item .context-trigger {
top: -1px;
position: absolute;
right: 3px; }
/* line 145, ../sass/tree/_tree.scss */
ul.tree li span.tree-item .context-trigger .invoke-menu {
font-size: 0.75em;
height: 0.9rem;
line-height: 0.9rem; }
/* line 154, ../sass/tree/_tree.scss */
ul.tree ul.tree {
margin-left: 15px; }
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/* line 23, ../sass/search/_search.scss */
.abs.search-holder {
height: 25px;
bottom: 0;
z-index: 5; }
/* line 27, ../sass/search/_search.scss */
.abs.search-holder.active {
height: auto;
bottom: 0; }
/* line 38, ../sass/search/_search.scss */
.search {
display: flex;
flex-direction: column;
height: 100%; }
/* line 49, ../sass/search/_search.scss */
.search .search-bar {
font-size: 0.8em;
position: relative;
width: 100%; }
/* line 66, ../sass/search/_search.scss */
.search .search-bar .search-input {
height: 25px;
line-height: 25px;
padding-top: 0;
padding-bottom: 0; }
/* line 73, ../sass/search/_search.scss */
.search .search-bar .search-icon,
.search .search-bar .clear-icon,
.search .search-bar .menu-icon {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: #737373;
height: 17px;
width: 17px;
line-height: 17px;
position: absolute;
text-align: center;
top: 4px; }
/* line 86, ../sass/search/_search.scss */
.search .search-bar .clear-icon,
.search .search-bar .menu-icon {
cursor: pointer;
transition: color .25s; }
/* line 93, ../sass/search/_search.scss */
.search .search-bar .search-input {
position: relative;
width: 100%;
padding-left: 22px !important;
padding-right: 44px !important; }
/* line 100, ../sass/search/_search.scss */
.search .search-bar .search-input input {
width: 100%; }
/* line 105, ../sass/search/_search.scss */
.search .search-bar .search-icon {
color: #737373;
left: 3px;
transition: visibility .15s, opacity .15s, color .2s;
pointer-events: none; }
/* line 125, ../sass/search/_search.scss */
.search .search-bar .search-input:hover + div.search-icon {
color: #a6a6a6; }
/* line 129, ../sass/search/_search.scss */
.search .search-bar .clear-icon {
right: 22px;
visibility: hidden;
opacity: 0;
transition: visibility .15s, opacity .15s, color .2s; }
/* line 138, ../sass/search/_search.scss */
.search .search-bar .clear-icon.content {
visibility: visible;
opacity: 1; }
/* line 143, ../sass/search/_search.scss */
.search .search-bar .clear-icon:hover {
color: #a6a6a6; }
/* line 148, ../sass/search/_search.scss */
.search .search-bar .menu-icon {
font-size: 0.8em;
padding-right: 4px;
right: 4px;
text-align: right; }
/* line 154, ../sass/search/_search.scss */
.search .search-bar .menu-icon:hover {
color: #a6a6a6; }
/* line 159, ../sass/search/_search.scss */
.search .search-bar .search-menu-holder {
float: right;
left: -20px;
z-index: 1;
transition: visibility .05s, opacity .05s; }
/* line 169, ../sass/search/_search.scss */
.search .search-bar .search-menu-holder.off {
visibility: hidden;
opacity: 0; }
/* line 176, ../sass/search/_search.scss */
.search .search-bar .menu-icon:hover + div.search-menu-holder {
visibility: visible; }
/* line 179, ../sass/search/_search.scss */
.search .search-bar div.search-menu-holder:hover {
visibility: visible; }
/* line 184, ../sass/search/_search.scss */
.search .active-filter-display {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
line-height: 130%;
padding: 5px 0;
padding-left: 1.4625em;
font-size: 0.65em;
margin-top: 3px; }
/* line 199, ../sass/search/_search.scss */
.search .active-filter-display .clear-filters-icon {
opacity: 0.4;
font-size: 0.8em;
position: absolute;
left: 1px;
cursor: pointer; }
/* line 210, ../sass/search/_search.scss */
.search .active-filter-display.off {
visibility: hidden;
opacity: 0;
height: 0;
margin: 0;
padding: 0;
border: 0; }
/* line 220, ../sass/search/_search.scss */
.search .search-scroll {
order: 3;
margin-top: 4px;
overflow-y: auto;
top: auto;
height: auto;
max-height: 100%;
position: relative; }
/* line 235, ../sass/search/_search.scss */
.search .search-scroll .results .search-result-item {
-moz-transition: background-color 0.25s;
-o-transition: background-color 0.25s;
-webkit-transition: background-color 0.25s;
transition: background-color 0.25s;
margin-bottom: 2px;
border-radius: 2px;
padding-top: 4px;
padding-bottom: 2px; }
/* line 249, ../sass/search/_search.scss */
.search .search-scroll .results .search-result-item .label {
margin-left: 6px; }
/* line 253, ../sass/search/_search.scss */
.search .search-scroll .results .search-result-item .label .title-label {
display: inline-block;
position: absolute;
left: 29px;
right: 5px;
font-size: .8em;
line-height: 17px;
width: auto;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap; }
/* line 275, ../sass/search/_search.scss */
.search .search-scroll .results .search-result-item.selected {
background: #005177;
color: #fff; }
/* line 279, ../sass/search/_search.scss */
.search .search-scroll .results .search-result-item.selected .view-control {
color: #0099cc; }
/* line 282, ../sass/search/_search.scss */
.search .search-scroll .results .search-result-item.selected .label .type-icon {
color: #fff; }
/* line 287, ../sass/search/_search.scss */
.search .search-scroll .results .search-result-item .label .type-icon .l-icon-link {
display: none;
text-shadow: black 0 1px 2px;
z-index: 2;
color: #49dedb;
font-size: 8px;
line-height: 8px;
height: 8px;
width: 8px;
margin-left: -25px; }
/* line 299, ../sass/search/_search.scss */
.search .search-scroll .results .search-result-item:not(.selected):hover {
background: #404040;
color: #cccccc; }
/* line 302, ../sass/search/_search.scss */
.search .search-scroll .results .search-result-item:not(.selected):hover .context-trigger {
display: block; }
/* line 305, ../sass/search/_search.scss */
.search .search-scroll .results .search-result-item:not(.selected):hover .icon {
color: #33ccff; }
/* line 313, ../sass/search/_search.scss */
.search .search-scroll .load-icon {
position: relative; }
/* line 315, ../sass/search/_search.scss */
.search .search-scroll .load-icon.loading {
pointer-events: none;
margin-left: 6px; }
/* line 319, ../sass/search/_search.scss */
.search .search-scroll .load-icon.loading .title-label {
font-style: italic;
font-size: .9em;
opacity: 0.5;
margin-left: 26px;
line-height: 24px; }
/* line 329, ../sass/search/_search.scss */
.search .search-scroll .load-icon.loading .wait-spinner {
margin-left: 6px; }
/* line 334, ../sass/search/_search.scss */
.search .search-scroll .load-icon:not(.loading) {
cursor: pointer; }
/* line 339, ../sass/search/_search.scss */
.search .search-scroll .load-more-button {
margin-top: 5px 0;
font-size: 0.8em;
position: relative;
left: 50%;
margin-left: -45px;
text-align: center;
width: 90px;
white-space: nowrap; }

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

@ -1,19 +1,32 @@
{ {
"metadata": { "metadata": {
"name": "WTD Symbols v2.2", "name": "WTD Symbols v24",
"lastOpened": 1439948744240, "lastOpened": 1441992412958,
"created": 1439948734037 "created": 1441992410384
}, },
"iconSets": [ "iconSets": [
{ {
"selection": [ "selection": [
{
"order": 86,
"id": 85,
"prevSize": 32,
"code": 58888,
"codes": [
58888,
58889,
58890
],
"name": "icon-info-v15",
"tempChar": ""
},
{ {
"order": 82, "order": 82,
"id": 84, "id": 84,
"prevSize": 32, "prevSize": 32,
"code": 58887, "code": 58887,
"name": "icon-x-in-circle", "name": "icon-x-in-circle",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 77, "order": 77,
@ -21,7 +34,7 @@
"prevSize": 32, "prevSize": 32,
"code": 58881, "code": 58881,
"name": "icon-datatable", "name": "icon-datatable",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 78, "order": 78,
@ -29,7 +42,7 @@
"prevSize": 32, "prevSize": 32,
"code": 58882, "code": 58882,
"name": "icon-tabular-scrolling", "name": "icon-tabular-scrolling",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 79, "order": 79,
@ -37,7 +50,7 @@
"prevSize": 32, "prevSize": 32,
"code": 58884, "code": 58884,
"name": "icon-tabular", "name": "icon-tabular",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 80, "order": 80,
@ -45,15 +58,15 @@
"prevSize": 32, "prevSize": 32,
"code": 58885, "code": 58885,
"name": "icon-calendar", "name": "icon-calendar",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 81, "order": 83,
"id": 78, "id": 78,
"prevSize": 32, "prevSize": 32,
"code": 58886, "code": 58886,
"name": "icon-paint-bucket", "name": "icon-paint-bucket",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 1, "order": 1,
@ -61,7 +74,7 @@
"prevSize": 32, "prevSize": 32,
"code": 123, "code": 123,
"name": "icon-pointer-left", "name": "icon-pointer-left",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 3, "order": 3,
@ -69,7 +82,7 @@
"prevSize": 32, "prevSize": 32,
"code": 125, "code": 125,
"name": "icon-pointer-right", "name": "icon-pointer-right",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 4, "order": 4,
@ -77,7 +90,7 @@
"prevSize": 32, "prevSize": 32,
"code": 80, "code": 80,
"name": "icon-person", "name": "icon-person",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 5, "order": 5,
@ -85,7 +98,7 @@
"prevSize": 32, "prevSize": 32,
"code": 232, "code": 232,
"name": "icon-chain-links", "name": "icon-chain-links",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 6, "order": 6,
@ -93,7 +106,7 @@
"prevSize": 32, "prevSize": 32,
"code": 115, "code": 115,
"name": "icon-database-in-brackets", "name": "icon-database-in-brackets",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 7, "order": 7,
@ -101,7 +114,7 @@
"prevSize": 32, "prevSize": 32,
"code": 114, "code": 114,
"name": "icon-refresh", "name": "icon-refresh",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 8, "order": 8,
@ -109,7 +122,7 @@
"prevSize": 32, "prevSize": 32,
"code": 108, "code": 108,
"name": "icon-lock", "name": "icon-lock",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 9, "order": 9,
@ -117,7 +130,7 @@
"prevSize": 32, "prevSize": 32,
"code": 51, "code": 51,
"name": "icon-box-with-dashed-lines", "name": "icon-box-with-dashed-lines",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 10, "order": 10,
@ -125,7 +138,7 @@
"prevSize": 32, "prevSize": 32,
"code": 58880, "code": 58880,
"name": "icon-box-with-arrow-cursor", "name": "icon-box-with-arrow-cursor",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 11, "order": 11,
@ -133,7 +146,7 @@
"prevSize": 32, "prevSize": 32,
"code": 65, "code": 65,
"name": "icon-activity-mode", "name": "icon-activity-mode",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 12, "order": 12,
@ -141,7 +154,7 @@
"prevSize": 32, "prevSize": 32,
"code": 97, "code": 97,
"name": "icon-activity", "name": "icon-activity",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 13, "order": 13,
@ -149,7 +162,7 @@
"prevSize": 32, "prevSize": 32,
"code": 33, "code": 33,
"name": "icon-alert-rect", "name": "icon-alert-rect",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 14, "order": 14,
@ -157,7 +170,7 @@
"prevSize": 32, "prevSize": 32,
"code": 58883, "code": 58883,
"name": "icon-alert-triangle", "name": "icon-alert-triangle",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 15, "order": 15,
@ -165,7 +178,7 @@
"prevSize": 32, "prevSize": 32,
"code": 238, "code": 238,
"name": "icon-arrow-double-down", "name": "icon-arrow-double-down",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 16, "order": 16,
@ -173,7 +186,7 @@
"prevSize": 32, "prevSize": 32,
"code": 235, "code": 235,
"name": "icon-arrow-double-up", "name": "icon-arrow-double-up",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 2, "order": 2,
@ -181,7 +194,7 @@
"prevSize": 32, "prevSize": 32,
"code": 118, "code": 118,
"name": "icon-arrow-down", "name": "icon-arrow-down",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 19, "order": 19,
@ -189,7 +202,7 @@
"prevSize": 32, "prevSize": 32,
"code": 60, "code": 60,
"name": "icon-arrow-left", "name": "icon-arrow-left",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 20, "order": 20,
@ -197,7 +210,7 @@
"prevSize": 32, "prevSize": 32,
"code": 62, "code": 62,
"name": "icon-arrow-right", "name": "icon-arrow-right",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 21, "order": 21,
@ -205,7 +218,7 @@
"prevSize": 32, "prevSize": 32,
"code": 236, "code": 236,
"name": "icon-arrow-tall-down", "name": "icon-arrow-tall-down",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 22, "order": 22,
@ -213,7 +226,7 @@
"prevSize": 32, "prevSize": 32,
"code": 237, "code": 237,
"name": "icon-arrow-tall-up", "name": "icon-arrow-tall-up",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 23, "order": 23,
@ -221,7 +234,7 @@
"prevSize": 32, "prevSize": 32,
"code": 94, "code": 94,
"name": "icon-arrow-up", "name": "icon-arrow-up",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 24, "order": 24,
@ -229,7 +242,7 @@
"prevSize": 32, "prevSize": 32,
"code": 73, "code": 73,
"name": "icon-arrows-out", "name": "icon-arrows-out",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 25, "order": 25,
@ -237,7 +250,7 @@
"prevSize": 32, "prevSize": 32,
"code": 58893, "code": 58893,
"name": "icon-arrows-right-left", "name": "icon-arrows-right-left",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 33, "order": 33,
@ -245,7 +258,7 @@
"prevSize": 32, "prevSize": 32,
"code": 53, "code": 53,
"name": "icon-arrows-up-down", "name": "icon-arrows-up-down",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 26, "order": 26,
@ -253,7 +266,7 @@
"prevSize": 32, "prevSize": 32,
"code": 42, "code": 42,
"name": "icon-asterisk", "name": "icon-asterisk",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 27, "order": 27,
@ -261,15 +274,15 @@
"prevSize": 32, "prevSize": 32,
"code": 72, "code": 72,
"name": "icon-autoflow-tabular", "name": "icon-autoflow-tabular",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 28, "order": 28,
"id": 49, "id": 49,
"prevSize": 32, "prevSize": 32,
"code": 224, "code": 224,
"name": "icon-box-round-corners", "name": "icon-box",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 29, "order": 29,
@ -277,7 +290,7 @@
"prevSize": 32, "prevSize": 32,
"code": 50, "code": 50,
"name": "icon-check", "name": "icon-check",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 30, "order": 30,
@ -285,7 +298,7 @@
"prevSize": 32, "prevSize": 32,
"code": 67, "code": 67,
"name": "icon-clock", "name": "icon-clock",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 31, "order": 31,
@ -293,7 +306,7 @@
"prevSize": 32, "prevSize": 32,
"code": 46, "code": 46,
"name": "icon-connectivity", "name": "icon-connectivity",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 32, "order": 32,
@ -301,7 +314,7 @@
"prevSize": 32, "prevSize": 32,
"code": 100, "code": 100,
"name": "icon-database-query", "name": "icon-database-query",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 17, "order": 17,
@ -309,7 +322,7 @@
"prevSize": 32, "prevSize": 32,
"code": 68, "code": 68,
"name": "icon-database", "name": "icon-database",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 35, "order": 35,
@ -317,7 +330,7 @@
"prevSize": 32, "prevSize": 32,
"code": 81, "code": 81,
"name": "icon-dictionary", "name": "icon-dictionary",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 36, "order": 36,
@ -325,7 +338,7 @@
"prevSize": 32, "prevSize": 32,
"code": 242, "code": 242,
"name": "icon-duplicate", "name": "icon-duplicate",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 37, "order": 37,
@ -333,7 +346,7 @@
"prevSize": 32, "prevSize": 32,
"code": 102, "code": 102,
"name": "icon-folder-new", "name": "icon-folder-new",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 38, "order": 38,
@ -341,7 +354,7 @@
"prevSize": 32, "prevSize": 32,
"code": 70, "code": 70,
"name": "icon-folder", "name": "icon-folder",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 39, "order": 39,
@ -349,7 +362,7 @@
"prevSize": 32, "prevSize": 32,
"code": 95, "code": 95,
"name": "icon-fullscreen-collapse", "name": "icon-fullscreen-collapse",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 40, "order": 40,
@ -357,7 +370,7 @@
"prevSize": 32, "prevSize": 32,
"code": 122, "code": 122,
"name": "icon-fullscreen-expand", "name": "icon-fullscreen-expand",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 41, "order": 41,
@ -365,7 +378,7 @@
"prevSize": 32, "prevSize": 32,
"code": 71, "code": 71,
"name": "icon-gear", "name": "icon-gear",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 49, "order": 49,
@ -373,7 +386,7 @@
"prevSize": 32, "prevSize": 32,
"code": 227, "code": 227,
"name": "icon-image", "name": "icon-image",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 42, "order": 42,
@ -381,7 +394,7 @@
"prevSize": 32, "prevSize": 32,
"code": 225, "code": 225,
"name": "icon-layers", "name": "icon-layers",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 43, "order": 43,
@ -389,7 +402,7 @@
"prevSize": 32, "prevSize": 32,
"code": 76, "code": 76,
"name": "icon-layout", "name": "icon-layout",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 44, "order": 44,
@ -397,7 +410,7 @@
"prevSize": 32, "prevSize": 32,
"code": 226, "code": 226,
"name": "icon-line-horz", "name": "icon-line-horz",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 75, "order": 75,
@ -405,7 +418,7 @@
"prevSize": 32, "prevSize": 32,
"code": 244, "code": 244,
"name": "icon-link", "name": "icon-link",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 46, "order": 46,
@ -413,7 +426,7 @@
"prevSize": 32, "prevSize": 32,
"code": 88, "code": 88,
"name": "icon-magnify-in", "name": "icon-magnify-in",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 47, "order": 47,
@ -421,7 +434,7 @@
"prevSize": 32, "prevSize": 32,
"code": 89, "code": 89,
"name": "icon-magnify-out", "name": "icon-magnify-out",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 48, "order": 48,
@ -429,7 +442,7 @@
"prevSize": 32, "prevSize": 32,
"code": 77, "code": 77,
"name": "icon-magnify", "name": "icon-magnify",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 34, "order": 34,
@ -437,7 +450,7 @@
"prevSize": 32, "prevSize": 32,
"code": 109, "code": 109,
"name": "icon-menu", "name": "icon-menu",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 50, "order": 50,
@ -445,7 +458,7 @@
"prevSize": 32, "prevSize": 32,
"code": 243, "code": 243,
"name": "icon-move", "name": "icon-move",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 51, "order": 51,
@ -453,7 +466,7 @@
"prevSize": 32, "prevSize": 32,
"code": 121, "code": 121,
"name": "icon-new-window", "name": "icon-new-window",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 52, "order": 52,
@ -461,7 +474,7 @@
"prevSize": 32, "prevSize": 32,
"code": 111, "code": 111,
"name": "icon-object", "name": "icon-object",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 73, "order": 73,
@ -469,7 +482,7 @@
"prevSize": 32, "prevSize": 32,
"code": 63, "code": 63,
"name": "icon-object-unknown", "name": "icon-object-unknown",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 53, "order": 53,
@ -477,7 +490,7 @@
"prevSize": 32, "prevSize": 32,
"code": 86, "code": 86,
"name": "icon-packet", "name": "icon-packet",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 54, "order": 54,
@ -485,7 +498,7 @@
"prevSize": 32, "prevSize": 32,
"code": 234, "code": 234,
"name": "icon-page", "name": "icon-page",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 55, "order": 55,
@ -493,7 +506,7 @@
"prevSize": 32, "prevSize": 32,
"code": 241, "code": 241,
"name": "icon-pause", "name": "icon-pause",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 56, "order": 56,
@ -501,7 +514,7 @@
"prevSize": 32, "prevSize": 32,
"code": 112, "code": 112,
"name": "icon-pencil", "name": "icon-pencil",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 65, "order": 65,
@ -509,7 +522,7 @@
"prevSize": 32, "prevSize": 32,
"code": 79, "code": 79,
"name": "icon-people", "name": "icon-people",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 57, "order": 57,
@ -517,7 +530,7 @@
"prevSize": 32, "prevSize": 32,
"code": 239, "code": 239,
"name": "icon-play", "name": "icon-play",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 58, "order": 58,
@ -525,7 +538,7 @@
"prevSize": 32, "prevSize": 32,
"code": 233, "code": 233,
"name": "icon-plot-resource", "name": "icon-plot-resource",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 59, "order": 59,
@ -533,7 +546,7 @@
"prevSize": 32, "prevSize": 32,
"code": 43, "code": 43,
"name": "icon-plus", "name": "icon-plus",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 60, "order": 60,
@ -541,7 +554,7 @@
"prevSize": 32, "prevSize": 32,
"code": 45, "code": 45,
"name": "icon-minus", "name": "icon-minus",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 61, "order": 61,
@ -549,7 +562,7 @@
"prevSize": 32, "prevSize": 32,
"code": 54, "code": 54,
"name": "icon-sine", "name": "icon-sine",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 62, "order": 62,
@ -557,7 +570,7 @@
"prevSize": 32, "prevSize": 32,
"code": 228, "code": 228,
"name": "icon-T", "name": "icon-T",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 63, "order": 63,
@ -565,7 +578,7 @@
"prevSize": 32, "prevSize": 32,
"code": 116, "code": 116,
"name": "icon-telemetry-panel", "name": "icon-telemetry-panel",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 64, "order": 64,
@ -573,7 +586,7 @@
"prevSize": 32, "prevSize": 32,
"code": 84, "code": 84,
"name": "icon-telemetry", "name": "icon-telemetry",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 18, "order": 18,
@ -581,7 +594,7 @@
"prevSize": 32, "prevSize": 32,
"code": 246, "code": 246,
"name": "icon-thumbs-strip", "name": "icon-thumbs-strip",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 67, "order": 67,
@ -589,7 +602,7 @@
"prevSize": 32, "prevSize": 32,
"code": 83, "code": 83,
"name": "icon-timeline", "name": "icon-timeline",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 68, "order": 68,
@ -597,7 +610,7 @@
"prevSize": 32, "prevSize": 32,
"code": 245, "code": 245,
"name": "icon-timer", "name": "icon-timer",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 69, "order": 69,
@ -605,7 +618,7 @@
"prevSize": 32, "prevSize": 32,
"code": 90, "code": 90,
"name": "icon-trash", "name": "icon-trash",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 70, "order": 70,
@ -613,7 +626,7 @@
"prevSize": 32, "prevSize": 32,
"code": 229, "code": 229,
"name": "icon-two-parts-both", "name": "icon-two-parts-both",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 71, "order": 71,
@ -621,7 +634,7 @@
"prevSize": 32, "prevSize": 32,
"code": 231, "code": 231,
"name": "icon-two-parts-one-only", "name": "icon-two-parts-one-only",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 72, "order": 72,
@ -629,7 +642,7 @@
"prevSize": 32, "prevSize": 32,
"code": 120, "code": 120,
"name": "icon-x-heavy", "name": "icon-x-heavy",
"tempChar": "" "tempChar": ""
}, },
{ {
"order": 66, "order": 66,
@ -637,7 +650,7 @@
"prevSize": 32, "prevSize": 32,
"code": 58946, "code": 58946,
"name": "icon-x", "name": "icon-x",
"tempChar": "" "tempChar": ""
} }
], ],
"id": 2, "id": 2,
@ -652,6 +665,27 @@
"height": 1024, "height": 1024,
"prevSize": 32, "prevSize": 32,
"icons": [ "icons": [
{
"id": 85,
"paths": [
"M512 0c-282.8 0-512 229.2-512 512s229.2 512 512 512 512-229.2 512-512-229.2-512-512-512zM512 128c70.6 0 128 57.4 128 128s-57.4 128-128 128c-70.6 0-128-57.4-128-128s57.4-128 128-128zM704 832h-384v-128h64v-256h256v256h64v128z"
],
"attrs": [
{
"fill": "rgb(0, 0, 0)"
}
],
"isMulticolor": false,
"grid": 0,
"tags": [
"icon-info-v1.5"
],
"colorPermutations": {
"125525525516161751": [
0
]
}
},
{ {
"id": 84, "id": 84,
"paths": [ "paths": [
@ -840,17 +874,19 @@
{ {
"id": 78, "id": 78,
"paths": [ "paths": [
"M896 640c0 0-130 188-128 256 2 70.6 57.4 128 128 128s126-57.4 128-128c2-68-128-256-128-256z", "M544 224v224c0 88.4-71.6 160-160 160s-160-71.6-160-160v-97.2l-197.4 196.4c-50 50-12.4 215.2 112.4 340s290 162.4 340 112.4l417-423.6-352-352z",
"M449 129l0.2-64.8c0-35.4-28.4-64-63.8-64.2 0 0-0.2 0-0.2 0-35.2 0-63.8 28.6-64 63.8l-0.6 190.8-294 292.6c-50 50-12.4 215.2 112.4 340s290 162.4 340 112.4l417-423.6-447-447zM384 640c-70.6 0-128-57.4-128-128 0-47.4 25.8-89 64.4-111l-0.4 110.8c0 35.4 28.4 64 63.8 64.2 0 0 0.2 0 0.2 0 35.2 0 63.8-28.6 64-63.8l0.4-110.8c38 22.2 63.6 63.4 63.6 110.6 0 70.6-57.4 128-128 128z" "M896 1024c70.6 0 128-57.4 128-128 0-108.6-128-192-128-192s-128 83.4-128 192c0 70.6 57.4 128 128 128z",
"M384 512c-35.4 0-64-28.6-64-64v-384c0-35.4 28.6-64 64-64s64 28.6 64 64v384c0 35.4-28.6 64-64 64z"
], ],
"attrs": [ "attrs": [
{ {
"fill": "rgb(6,161,75)", "fill": "rgb(6, 161, 75)"
"opacity": 1
}, },
{ {
"fill": "rgb(6,161,75)", "fill": "rgb(6, 161, 75)"
"opacity": 1 },
{
"fill": "rgb(6, 161, 75)"
} }
], ],
"isMulticolor": false, "isMulticolor": false,
@ -861,9 +897,6 @@
"colorPermutations": { "colorPermutations": {
"16161751": [ "16161751": [
1, 1,
1
],
"125525525516161751": [
1, 1,
1 1
] ]
@ -1290,16 +1323,23 @@
{ {
"id": 49, "id": 49,
"paths": [ "paths": [
"M1024 832c0 105.6-86.4 192-192 192h-640c-105.6 0-192-86.4-192-192v-640c0-105.6 86.4-192 192-192h640c105.6 0 192 86.4 192 192v640z" "M0 0h1024v1024h-1024v-1024z"
], ],
"attrs": [ "attrs": [
{} {
"fill": "rgb(0, 0, 0)"
}
], ],
"isMulticolor": false, "isMulticolor": false,
"grid": 0, "grid": 0,
"tags": [ "tags": [
"icon-box-round-corners" "icon-box-round-corners"
],
"colorPermutations": {
"16161751": [
0
] ]
}
}, },
{ {
"id": 48, "id": 48,
@ -2046,6 +2086,12 @@
161, 161,
75, 75,
1 1
],
[
255,
255,
255,
1
] ]
] ]
], ],
@ -14807,5 +14853,6 @@
"gridSize": 16, "gridSize": 16,
"showLiga": false "showLiga": false
}, },
"uid": -1 "uid": -1,
"time": 1441993324496
} }

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

Binary file not shown.

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

@ -55,7 +55,7 @@
<glyph unicode="&#x7a;" glyph-name="icon-fullscreen-expand" d="M192.344 128c-0.118 0.1-0.244 0.224-0.344 0.344v191.656h-192v-192c0-105.6 86.4-192 192-192h192v192h-191.656zM192 767.656c0.1 0.118 0.224 0.244 0.344 0.344h191.656v192h-192c-105.6 0-192-86.4-192-192v-192h192v191.656zM832 960h-192v-192h191.656c0.118-0.1 0.244-0.226 0.344-0.344v-191.656h192v192c0 105.6-86.4 192-192 192zM832 128.344c-0.1-0.118-0.224-0.244-0.344-0.344h-191.656v-192h192c105.6 0 192 86.4 192 192v192h-192v-191.656z" /> <glyph unicode="&#x7a;" glyph-name="icon-fullscreen-expand" d="M192.344 128c-0.118 0.1-0.244 0.224-0.344 0.344v191.656h-192v-192c0-105.6 86.4-192 192-192h192v192h-191.656zM192 767.656c0.1 0.118 0.224 0.244 0.344 0.344h191.656v192h-192c-105.6 0-192-86.4-192-192v-192h192v191.656zM832 960h-192v-192h191.656c0.118-0.1 0.244-0.226 0.344-0.344v-191.656h192v192c0 105.6-86.4 192-192 192zM832 128.344c-0.1-0.118-0.224-0.244-0.344-0.344h-191.656v-192h192c105.6 0 192 86.4 192 192v192h-192v-191.656z" />
<glyph unicode="&#x7b;" glyph-name="icon-pointer-left" horiz-adv-x="512" d="M510-64l-256 512 256 512h-256l-256-512 256-512z" /> <glyph unicode="&#x7b;" glyph-name="icon-pointer-left" horiz-adv-x="512" d="M510-64l-256 512 256 512h-256l-256-512 256-512z" />
<glyph unicode="&#x7d;" glyph-name="icon-pointer-right" horiz-adv-x="512" d="M-2 960l256-512-256-512h256l256 512-256 512z" /> <glyph unicode="&#x7d;" glyph-name="icon-pointer-right" horiz-adv-x="512" d="M-2 960l256-512-256-512h256l256 512-256 512z" />
<glyph unicode="&#xe0;" glyph-name="icon-box-round-corners" d="M1024 128c0-105.6-86.4-192-192-192h-640c-105.6 0-192 86.4-192 192v640c0 105.6 86.4 192 192 192h640c105.6 0 192-86.4 192-192v-640z" /> <glyph unicode="&#xe0;" glyph-name="icon-box" d="M0 960h1024v-1024h-1024v1024z" />
<glyph unicode="&#xe1;" glyph-name="icon-layers" d="M1024 576l-512 384-512-384 512-384zM512 64l-426.666 320-85.334-64 512-384 512 384-85.334 64z" /> <glyph unicode="&#xe1;" glyph-name="icon-layers" d="M1024 576l-512 384-512-384 512-384zM512 64l-426.666 320-85.334-64 512-384 512 384-85.334 64z" />
<glyph unicode="&#xe2;" glyph-name="icon-line-horz" d="M64 384c-35.346 0-64 28.654-64 64s28.654 64 64 64h896c35.346 0 64-28.654 64-64s-28.654-64-64-64h-896z" /> <glyph unicode="&#xe2;" glyph-name="icon-line-horz" d="M64 384c-35.346 0-64 28.654-64 64s28.654 64 64 64h896c35.346 0 64-28.654 64-64s-28.654-64-64-64h-896z" />
<glyph unicode="&#xe3;" glyph-name="icon-image" d="M896 960h-768c-70.4 0-128-57.6-128-128v-768c0-70.4 57.6-128 128-128h768c70.4 0 128 57.6 128 128v768c0 70.4-57.6 128-128 128zM896 64h-768v768h768v-768zM320 704l-128-128v-448h640v320l-128 128-128-128z" /> <glyph unicode="&#xe3;" glyph-name="icon-image" d="M896 960h-768c-70.4 0-128-57.6-128-128v-768c0-70.4 57.6-128 128-128h768c70.4 0 128 57.6 128 128v768c0 70.4-57.6 128-128 128zM896 64h-768v768h768v-768zM320 704l-128-128v-448h640v320l-128 128-128-128z" />
@ -82,8 +82,9 @@
<glyph unicode="&#xe603;" glyph-name="icon-alert-triangle" d="M998.208 111.136l-422.702 739.728c-34.928 61.124-92.084 61.124-127.012 0l-422.702-739.728c-34.928-61.126-5.906-111.136 64.494-111.136h843.428c70.4 0 99.422 50.010 64.494 111.136zM512 128c-35.2 0-64 28.8-64 64s28.8 64 64 64 64-28.8 64-64c0-35.2-28.8-64-64-64zM627.448 577.242l-38.898-194.486c-6.902-34.516-41.35-62.756-76.55-62.756s-69.648 28.24-76.552 62.758l-38.898 194.486c-6.902 34.516 16.25 62.756 51.45 62.756h128c35.2 0 58.352-28.24 51.448-62.758z" /> <glyph unicode="&#xe603;" glyph-name="icon-alert-triangle" d="M998.208 111.136l-422.702 739.728c-34.928 61.124-92.084 61.124-127.012 0l-422.702-739.728c-34.928-61.126-5.906-111.136 64.494-111.136h843.428c70.4 0 99.422 50.010 64.494 111.136zM512 128c-35.2 0-64 28.8-64 64s28.8 64 64 64 64-28.8 64-64c0-35.2-28.8-64-64-64zM627.448 577.242l-38.898-194.486c-6.902-34.516-41.35-62.756-76.55-62.756s-69.648 28.24-76.552 62.758l-38.898 194.486c-6.902 34.516 16.25 62.756 51.45 62.756h128c35.2 0 58.352-28.24 51.448-62.758z" />
<glyph unicode="&#xe604;" glyph-name="icon-tabular" d="M0 896v-192h448v256h-384c-35.2 0-64-28.8-64-64zM960 960h-384v-256h448v192c0 35.2-28.8 64-64 64zM576 576h448v-256h-448v256zM0 576h448v-256h-448v256zM0 0c0-35.2 28.8-64 64-64h384v256h-448v-192zM576-64h384c35.2 0 64 28.8 64 64v192h-448v-256z" /> <glyph unicode="&#xe604;" glyph-name="icon-tabular" d="M0 896v-192h448v256h-384c-35.2 0-64-28.8-64-64zM960 960h-384v-256h448v192c0 35.2-28.8 64-64 64zM576 576h448v-256h-448v256zM0 576h448v-256h-448v256zM0 0c0-35.2 28.8-64 64-64h384v256h-448v-192zM576-64h384c35.2 0 64 28.8 64 64v192h-448v-256z" />
<glyph unicode="&#xe605;" glyph-name="icon-calendar" d="M896 960h-768c-70.4 0-128-57.6-128-128v-768c0-70.4 57.6-128 128-128h768c70.4 0 128 57.6 128 128v768c0 70.4-57.6 128-128 128zM640 512h-256v192h256v-192zM384 448h256v-192h-256v192zM320 256h-256v192h256v-192zM320 704v-192h-256v192h256zM128 0c-17 0-33 6.6-45.2 18.8s-18.8 28.2-18.8 45.2v128h256v-192h-192zM384 0v192h256v-192h-256zM960 64c0-17-6.6-33-18.8-45.2s-28.2-18.8-45.2-18.8h-192v192h256v-128zM960 256h-256v192h256v-192zM960 512h-256v192h256v-192z" /> <glyph unicode="&#xe605;" glyph-name="icon-calendar" d="M896 960h-768c-70.4 0-128-57.6-128-128v-768c0-70.4 57.6-128 128-128h768c70.4 0 128 57.6 128 128v768c0 70.4-57.6 128-128 128zM640 512h-256v192h256v-192zM384 448h256v-192h-256v192zM320 256h-256v192h256v-192zM320 704v-192h-256v192h256zM128 0c-17 0-33 6.6-45.2 18.8s-18.8 28.2-18.8 45.2v128h256v-192h-192zM384 0v192h256v-192h-256zM960 64c0-17-6.6-33-18.8-45.2s-28.2-18.8-45.2-18.8h-192v192h256v-128zM960 256h-256v192h256v-192zM960 512h-256v192h256v-192z" />
<glyph unicode="&#xe606;" glyph-name="icon-paint-bucket" d="M896 320c0 0-130-188-128-256 2-70.6 57.4-128 128-128s126 57.4 128 128c2 68-128 256-128 256zM449 831l0.2 64.8c0 35.4-28.4 64-63.8 64.2 0 0-0.2 0-0.2 0-35.2 0-63.8-28.6-64-63.8l-0.6-190.8-294-292.6c-50-50-12.4-215.2 112.4-340s290-162.4 340-112.4l417 423.6-447 447zM384 320c-70.6 0-128 57.4-128 128 0 47.4 25.8 89 64.4 111l-0.4-110.8c0-35.4 28.4-64 63.8-64.2 0 0 0.2 0 0.2 0 35.2 0 63.8 28.6 64 63.8l0.4 110.8c38-22.2 63.6-63.4 63.6-110.6 0-70.6-57.4-128-128-128z" /> <glyph unicode="&#xe606;" glyph-name="icon-paint-bucket" d="M544 736v-224c0-88.4-71.6-160-160-160s-160 71.6-160 160v97.2l-197.4-196.4c-50-50-12.4-215.2 112.4-340s290-162.4 340-112.4l417 423.6-352 352zM896-64c70.6 0 128 57.4 128 128 0 108.6-128 192-128 192s-128-83.4-128-192c0-70.6 57.4-128 128-128zM384 448c-35.4 0-64 28.6-64 64v384c0 35.4 28.6 64 64 64s64-28.6 64-64v-384c0-35.4-28.6-64-64-64z" />
<glyph unicode="&#xe607;" glyph-name="icon-x-in-circle" d="M512 960c-282.8 0-512-229.2-512-512s229.2-512 512-512 512 229.2 512 512-229.2 512-512 512zM832 256l-128-128-192 192-192-192-128 128 192 192-192 192 128 128 192-192 192 192 128-128-192-192 192-192z" /> <glyph unicode="&#xe607;" glyph-name="icon-x-in-circle" d="M512 960c-282.8 0-512-229.2-512-512s229.2-512 512-512 512 229.2 512 512-229.2 512-512 512zM832 256l-128-128-192 192-192-192-128 128 192 192-192 192 128 128 192-192 192 192 128-128-192-192 192-192z" />
<glyph unicode="&#xe608;" glyph-name="icon-info-v15" d="M512 960c-282.8 0-512-229.2-512-512s229.2-512 512-512 512 229.2 512 512-229.2 512-512 512zM512 832c70.6 0 128-57.4 128-128s-57.4-128-128-128c-70.6 0-128 57.4-128 128s57.4 128 128 128zM704 128h-384v128h64v256h256v-256h64v-128z" />
<glyph unicode="&#xe60d;" glyph-name="icon-arrows-right-left" d="M1024 448l-448-512v1024zM448 960l-448-512 448-512z" /> <glyph unicode="&#xe60d;" glyph-name="icon-arrows-right-left" d="M1024 448l-448-512v1024zM448 960l-448-512 448-512z" />
<glyph unicode="&#xe642;" glyph-name="icon-x" d="M384 448l-365.332-365.332c-24.89-24.89-24.89-65.62 0-90.51l37.49-37.49c24.89-24.89 65.62-24.89 90.51 0 0 0 365.332 365.332 365.332 365.332l365.332-365.332c24.89-24.89 65.62-24.89 90.51 0l37.49 37.49c24.89 24.89 24.89 65.62 0 90.51l-365.332 365.332c0 0 365.332 365.332 365.332 365.332 24.89 24.89 24.89 65.62 0 90.51l-37.49 37.49c-24.89 24.89-65.62 24.89-90.51 0 0 0-365.332-365.332-365.332-365.332l-365.332 365.332c-24.89 24.89-65.62 24.89-90.51 0l-37.49-37.49c-24.89-24.89-24.89-65.62 0-90.51 0 0 365.332-365.332 365.332-365.332z" /> <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> </font></defs></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 26 KiB

After

Width:  |  Height:  |  Size: 27 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.

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

@ -59,7 +59,7 @@
line-height: 120%; line-height: 120%;
a { a {
color: #84b3ff; color: $colorAboutLink;
} }
.s-description, .s-description,
.s-info { .s-info {
@ -89,7 +89,7 @@
border-top: none; border-top: none;
} }
em { em {
color: darken($colorBodyFg, 20%); color: pushBack($colorBodyFg, 20%);
// margin-left: 2em; // margin-left: 2em;
&:first-child { &:first-child {
// margin-left: 0; // margin-left: 0;

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

@ -29,7 +29,7 @@
font-size: 0.75rem; font-size: 0.75rem;
&:hover { &:hover {
.l-autoflow-header .l-btn.change-column-width { .l-autoflow-header .s-btn.change-column-width {
@include trans-prop-nice-fade(50ms); @include trans-prop-nice-fade(50ms);
opacity: 1; opacity: 1;
} }
@ -45,7 +45,7 @@
span { span {
vertical-align: middle; vertical-align: middle;
} }
.l-btn.change-column-width { .s-btn.change-column-width {
@include trans-prop-nice-fade(500ms); @include trans-prop-nice-fade(500ms);
opacity: 0; opacity: 0;
} }

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

@ -28,64 +28,8 @@ $bodyMargin: 10px;
$interiorMargin: 5px; $interiorMargin: 5px;
$interiorMarginLg: $interiorMargin * 2; $interiorMarginLg: $interiorMargin * 2;
$interiorMarginSm: 3px; $interiorMarginSm: 3px;
$basicCr: 2px;
$controlCr: 3px;
$smallCr: 2px;
$badgeW: 35px; $badgeW: 35px;
/************************** COLORS AND SHADING */
$colorBodyBg: #333;
$colorBodyFg: #999;
$colorFooterBg: #000;
$colorKey: #0099cc;
$colorKeySelectedBg: #005177;
$colorKeyFg: #fff;
$colorAlt1: #ffc700;
$colorAlert: #ff3c00;
$colorIconLink: #49dedb;
$colorPausedBg: #c56f01;
$colorPausedFg: #fff;
$colorCreateBtn: $colorKey;
$colorGridLines: rgba(#fff, 0.05);
// Menu colors
$colorMenuBg: lighten($colorBodyBg, 23%);
$colorMenuFg: lighten($colorMenuBg, 70%);
$colorMenuIc: lighten($colorKey, 17%);
$colorInteriorBorder: lighten($colorBodyBg, 10%);
$colorObjFrameBg: darken($colorBodyBg, 5%);
// Form colors
$colorCheck: $colorKey;
$colorFormRequired: #ffc700;
$colorFormValid: #33cc33;
$colorFormError: #cc0000;
$colorFormInvalid: #ff9900;
// Limits and staleness colors
$colorLimitYellow: #9d7500;
$colorLimitRed: #aa0000;
$colorTelemFresh: #fff;
$colorTelemStale: #888;
$styleTelemStale: italic;
// Bubble colors
$colorInfoBubbleFg: #666;
$colorInfoBubbleBg: #ddd;
$colorThumbsBubbleFg: lighten($colorBodyFg, 10%);
$colorThumbsBubbleBg: lighten($colorBodyBg, 10%);
// Overlay
$colorOvrBlocker: rgba(black, 0.7);
$colorOvrBg: $colorBodyBg;
$colorOvrFg: $colorBodyFg;
// Items
$colorItemBase: lighten($colorBodyBg, 5%);
$colorItemFg: lighten($colorItemBase, 20%);
$colorItemSelected: $colorKey;
// Tabular
$tabularColorBorder: rgba(white, 0.1);
$tabularColorBodyBg: darken($colorBodyBg, 10%);
$tabularColorBodyFg: lighten($tabularColorBodyBg, 40%);
$tabularColorHeaderBg: lighten($colorBodyBg, 10%);
$tabularColorHeaderFg: lighten($tabularColorHeaderBg, 40%);
$tabularColorHeaderBorder: $colorBodyBg;
/************************** RATIOS */ /************************** RATIOS */
$ltGamma: 20%; $ltGamma: 20%;
$btnFontSizeToH: 0.45; $btnFontSizeToH: 0.45;
@ -103,7 +47,8 @@ $ueEditLeftPaneW: 75%;
$treeSearchInputBarH: 25px; $treeSearchInputBarH: 25px;
// Overlay // Overlay
$ovrTopBarH: 60px; $ovrTopBarH: 60px;
$ovrFooterH: 40px; $ovrFooterH: 30px;
$overlayMargin: 25px;
// Items // Items
$ueBrowseGridItemLg: 200px; $ueBrowseGridItemLg: 200px;
$ueBrowseGridItemTopBarH: 20px; $ueBrowseGridItemTopBarH: 20px;
@ -111,17 +56,15 @@ $ueBrowseGridItemBottomBarH: 30px;
$itemPadLR: 5px; $itemPadLR: 5px;
// Tree // Tree
$treeVCW: 10px; $treeVCW: 10px;
$treeTypeIconH: 16px;
$treeTypeIconW: 20px; $treeTypeIconW: 20px;
$treeContextTriggerW: 20px; $treeContextTriggerW: 20px;
$colorItemTreeIcon: $colorKey;
$colorItemTreeIconHover: lighten($colorItemTreeIcon, 20%);
$colorItemTreeVCHover: $colorAlt1;
// Tabular // Tabular
$tabularHeaderH: 22px; //18px $tabularHeaderH: 22px; //18px
$tabularTdPadLR: $itemPadLR; $tabularTdPadLR: $itemPadLR;
$tabularTdPadTB: 3px; $tabularTdPadTB: 3px;
// Imagery // Imagery
$imageMainControlBarH: 22px; $imageMainControlBarH: 25px;
$imageThumbsD: 120px; $imageThumbsD: 120px;
$imageThumbsWrapperH: $imageThumbsD * 1.4; $imageThumbsWrapperH: $imageThumbsD * 1.4;
$imageThumbPad: 1px; $imageThumbPad: 1px;
@ -144,18 +87,21 @@ $reqSymbolFontSize: 0.7em;
/************************** CONTROLS */ /************************** CONTROLS */
$controlDisabledOpacity: 0.3; $controlDisabledOpacity: 0.3;
$formLabelW: 20%; $formLabelW: 30%;
$formInputH: 22px; $formInputH: 22px;
$formRowCtrlsH: 14px; $formRowCtrlsH: 14px;
$formTBPad: $interiorMargin;
$formLRPad: $interiorMargin;
$menuLineH: 1.5rem; $menuLineH: 1.5rem;
$scrollbarTrackSize: 10px; $menuLineHPx: 24px;
$scrollbarTrackColorBg: rgba(#000, 0.4);
$btnStdH: 25px; $btnStdH: 25px;
$btnToolbarH: $btnStdH; $btnToolbarH: $btnStdH;
$btnFrameH: 16px;
/************************** PATHS */ /************************** PATHS */
$dirImgs: '../images/'; // Relative to platform/css/ directory // Paths need to be relative to /platform/commonUI/theme/<theme-name>/css/ directory
$dirCommonRes: '../../../../general/res/';
$dirImgs: $dirCommonRes + 'images/';
/************************** TIMINGS */ /************************** TIMINGS */
$controlFadeMs: 100ms; $controlFadeMs: 100ms;

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

@ -52,7 +52,7 @@ a.disabled {
} }
@include keyframes(pulse) { @include keyframes(pulse) {
0% { opacity: 0.2; } 0% { opacity: 0.5; }
100% { opacity: 1; } 100% { opacity: 1; }
} }

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

@ -76,7 +76,7 @@
} }
.l-fixed-position-text { .l-fixed-position-text {
@include txtShdwSubtle(); //@include txtShdwSubtle();
border: 1px solid transparent; border: 1px solid transparent;
font-size: 0.8rem; font-size: 0.8rem;
$p: 1px; //$interiorMarginSm; $p: 1px; //$interiorMarginSm;

38
platform/commonUI/general/res/sass/_fonts.scss
View File

@ -1,38 +0,0 @@
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
@font-face {
/*
* Use https://www.web-font-generator.com/ to gen fonts
*/
font-family: 'symbolsfont';
src: url('../fonts/symbols/wtdsymbols.eot');
src: url('../fonts/symbols/wtdsymbols.eot?#iefix') format('embedded-opentype'),
url('../fonts/symbols/wtdsymbols.woff') format('woff'),
url('../fonts/symbols/wtdsymbols.ttf') format('truetype'),
url('../fonts/symbols/wtdsymbols.svg#armataregular') format('svg');
font-weight: normal;
font-style: normal;
}
.ui-symbol {
font-family: 'symbolsfont';
}

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

@ -19,6 +19,26 @@
* this source code distribution or the Licensing information page available * this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
/************************** FONTS */
@font-face {
/*
* Use https://icomoon.io/app with /platform/commonUI/general/res/fonts/symbols/icomoon.io-WTD-symbols-project.json
*/
font-family: 'symbolsfont';
src: url($dirCommonRes + 'fonts/symbols/wtdsymbols.eot');
src: url($dirCommonRes + 'fonts/symbols/wtdsymbols.eot?#iefix') format('embedded-opentype'),
url($dirCommonRes + 'fonts/symbols/wtdsymbols.woff') format('woff'),
url($dirCommonRes + 'fonts/symbols/wtdsymbols.ttf') format('truetype'),
url($dirCommonRes + 'fonts/symbols/wtdsymbols.svg#armataregular') format('svg');
font-weight: normal;
font-style: normal;
}
.ui-symbol {
font-family: 'symbolsfont';
}
/************************** HTML ENTITIES */
a { a {
color: #ccc; color: #ccc;
cursor: pointer; cursor: pointer;
@ -42,7 +62,6 @@ body, html {
} }
em { em {
// color: rgba(white, 0.2); Removed this as a global setting
font-style: normal; font-style: normal;
} }
@ -71,12 +90,6 @@ p {
margin-bottom: $interiorMarginLg; margin-bottom: $interiorMarginLg;
} }
span {
/* 618 DEBUG
box-sizing: border-box;
*/
}
mct-container { mct-container {
display: block; display: block;
} }
@ -100,7 +113,7 @@ mct-container {
.codehilite { .codehilite {
@extend .code; @extend .code;
background-color: rgba(#fff, 0.1); background-color: rgba($colorBodyFg, 0.1);
padding: 1em; padding: 1em;
} }
@ -116,10 +129,6 @@ mct-container {
margin: 0; margin: 0;
} }
.colorKey {
color: $colorKey;
}
.ds { .ds {
@include box-shadow(rgba(#000, 0.7) 0 4px 10px 2px); @include box-shadow(rgba(#000, 0.7) 0 4px 10px 2px);
} }
@ -129,13 +138,6 @@ mct-container {
display: none !important; display: none !important;
} }
.paused {
&:not(.s-btn) {
border-color: $colorPausedBg !important;
color: $colorPausedBg !important;
}
}
.sep { .sep {
color: rgba(#fff, 0.2); color: rgba(#fff, 0.2);
} }

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

@ -29,10 +29,8 @@
} }
.ui-symbol { .ui-symbol {
$c: $colorKey;
&.icon { &.icon {
color: $c; color: $colorKey;
@include txtShdwSubtle();
&.alert { &.alert {
color: $colorAlert; color: $colorAlert;
&:hover { &:hover {
@ -45,7 +43,7 @@
} }
} }
.bar .icon { .bar .ui-symbol {
display: inline-block; display: inline-block;
} }
@ -54,7 +52,7 @@
display: inline-block; display: inline-block;
} }
.btn-menu .invoke-menu, .s-menu .invoke-menu,
.icon.major .invoke-menu { .icon.major .invoke-menu {
margin-left: $interiorMarginSm; margin-left: $interiorMarginSm;
} }
@ -65,9 +63,9 @@
position: absolute; position: absolute;
} }
.tree-item .type-icon { //.tree-item .type-icon {
font-size: 16px; // 16px is crisp size // font-size: 16px; // 16px is crisp size
} //}
.l-icon-link:before { .l-icon-link:before {
content: "\f4"; content: "\f4";

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

@ -1,20 +0,0 @@
// Classes for initializing states of objects
.browse-mode {
.split-layout {
.split-pane-component.pane.left {
width: 15%;
}
}
}
.edit-mode {
.split-layout {
.split-pane-component.pane.right {
width: 15%;
.pane.bottom {
height: 30%;
}
}
}
}

48
platform/commonUI/general/res/sass/_limits.scss
View File

@ -1,52 +1,26 @@
@mixin limit($c, $glyph) { @mixin limit($bg, $ic, $glyph) {
background: $c; background: $bg !important;
//color: $fg !important;
&:before { &:before {
//@include pulse(500ms); //@include pulse(1000ms);
color: lighten($c, 30%); color: $ic;
content: $glyph; content: $glyph;
} }
} }
/*.s-limit-upr,
.s-limit-lwr {
$a: 0.5;
$l: 30%;
white-space: nowrap;
&:before {
display: inline-block;
font-family: symbolsfont;
font-size: 0.85em;
font-style: normal !important;
margin-right: $interiorMarginSm;
vertical-align: middle;
}
}
.s-limit-upr {
&.s-limit-yellow { @include limit($colorLimitYellow, "\0000ed"); }
&.s-limit-red { @include limit($colorLimitRed, "\0000eb"); }
}
.s-limit-lwr {
&.s-limit-yellow { @include limit($colorLimitYellow, "\0000ec"); }
&.s-limit-red { @include limit($colorLimitRed, "\0000ee"); }
}*/
[class*="s-limit"] { [class*="s-limit"] {
$a: 0.5; //white-space: nowrap;
$l: 30%;
white-space: nowrap;
&:before { &:before {
display: inline-block; display: inline-block;
font-family: symbolsfont; font-family: symbolsfont;
font-size: 0.85em; font-size: 0.75em;
font-style: normal !important; font-style: normal !important;
margin-right: $interiorMarginSm; margin-right: $interiorMarginSm;
vertical-align: middle; vertical-align: middle;
} }
} }
.s-limit-upr-red { @include limit($colorLimitRed, "\0000eb"); }; .s-limit-upr-red { @include limit($colorLimitRedBg, $colorLimitRedIc, "\0000eb"); };
.s-limit-upr-yellow { @include limit($colorLimitYellow, "\0000ed"); }; .s-limit-upr-yellow { @include limit($colorLimitYellowBg, $colorLimitYellowIc, "\0000ed"); };
.s-limit-lwr-yellow { @include limit($colorLimitYellow, "\0000ec"); }; .s-limit-lwr-yellow { @include limit($colorLimitYellowBg, $colorLimitYellowIc, "\0000ec"); };
.s-limit-lwr-red { @include limit($colorLimitRed, "\0000ee"); }; .s-limit-lwr-red { @include limit($colorLimitRedBg, $colorLimitRedIc, "\0000ee"); };

62
platform/commonUI/general/res/sass/_main.scss
View File

@ -1,4 +1,3 @@
/*****************************************************************************
/***************************************************************************** /*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government * Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space * as represented by the Administrator of the National Aeronautics and Space
@ -20,26 +19,20 @@
* this source code distribution or the Licensing information page available * this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
@import "compass";
@import "compass/reset";
@import "compass/css3";
@import "compass/css3/animation";
@import "compass/css3/user-interface";
@import "compass/utilities";
@import "mixins";
@import "effects"; @import "effects";
@import "global"; @import "global";
@import "fonts";
@import "user-environ/layout";
//@import "search/layout";
@import "fixed-position";
@import "about"; @import "about";
@import "text"; @import "text";
@import "icons"; @import "icons";
@import "limits"; @import "limits";
@import "data-status"; @import "data-status";
@import "lists/tabular"; @import "helpers/bubbles";
@import "helpers/splitter";
@import "helpers/wait-spinner";
@import "messages";
@import "properties";
/********************************* CONTROLS */
@import "controls/breadcrumb"; @import "controls/breadcrumb";
@import "controls/buttons"; @import "controls/buttons";
@import "controls/color-palette"; @import "controls/color-palette";
@ -47,30 +40,43 @@
@import "controls/lists"; @import "controls/lists";
@import "controls/menus"; @import "controls/menus";
@import "controls/time-controller"; @import "controls/time-controller";
@import "edit/editor"; @import "mobile/controls/menus";
@import "features/imagery";
@import "features/time-display"; /********************************* FORMS */
@import "forms/elems"; @import "forms/elems";
@import "forms/validation";
@import "forms/text-input";
@import "forms/selects"; @import "forms/selects";
@import "forms/channel-selector"; @import "forms/channel-selector";
@import "forms/datetime"; @import "forms/datetime";
@import "forms/validation";
@import "forms/filter"; @import "forms/filter";
@import "plots/plots-main";
/********************************* USER ENVIRON */
@import "user-environ/layout";
@import "mobile/layout";
@import "edit/editor";
@import "search/search";
@import "mobile/search/search";
@import "overlay/overlay"; @import "overlay/overlay";
@import "mobile/overlay/overlay";
@import "tree/tree";
@import "mobile/tree";
@import "user-environ/frame"; @import "user-environ/frame";
@import "user-environ/top-bar"; @import "user-environ/top-bar";
@import "user-environ/bottom-bar"; @import "user-environ/bottom-bar";
@import "user-environ/object-browse";
@import "user-environ/tool-bar"; @import "user-environ/tool-bar";
@import "helpers/bubbles";
@import "helpers/splitter"; /********************************* VIEWS */
@import "helpers/wait-spinner"; @import "fixed-position";
@import "properties"; @import "lists/tabular";
@import "autoflow"; @import "plots/plots-main";
@import "iframe"; @import "iframe";
@import "messages";
@import "initialization";
@import "hide-non-functional"; @import "hide-non-functional";
@import "views"; @import "views";
@import "items/item";
@import "mobile/item";
/********************************* TO BE MOVED */
@import "autoflow";
@import "features/imagery";
@import "features/time-display";

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

@ -19,11 +19,16 @@
* this source code distribution or the Licensing information page available * this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
@mixin absPosDefault($offset: 0px, $overflowHidden: hidden) { @mixin absPosDefault($offset: 0px, $overflowHidden: hidden) {
overflow: $overflowHidden; overflow: $overflowHidden;
position: absolute; position: absolute;
top: $offset; right: $offset; bottom: $offset; left: $offset; top: $offset;
width: auto; height: auto; right: $offset;
bottom: $offset;
left: $offset;
width: auto;
height: auto;
} }
@mixin ancillaryIcon($d, $c) { @mixin ancillaryIcon($d, $c) {
@ -140,46 +145,14 @@
background-repeat: $repeatDir; background-repeat: $repeatDir;
} }
@mixin containerSubtle($bg: $colorBodyBg, $fg: $colorBodyFg, $hover: false) {
$ltnRatio: 7%;
$gradRatio: 5%;
$hovRatio: 7%;
$bgBase: lighten($bg, $ltnRatio);
$fgBase: lighten($fg, $ltnRatio);
$gradC1: lighten($bgBase, $gradRatio);
$gradC2: $bgBase;
$cInvokeBase: lighten($gradC1, $ltnRatio*2);
@include background-image(linear-gradient($gradC1, $gradC2));
@include border-radius($controlCr);
@include box-sizing(border-box);
@include boxShdwSubtle();
border: none;
border-top: 1px solid lighten($gradC1, 2%);
color: $fg;
display: inline-block;
@if $hover == true {
&:not(.disabled):hover {
@include background-image(linear-gradient(lighten($gradC1, $hovRatio), lighten($gradC2, $hovRatio)));
color: lighten($fgBase, $hovRatio);
&.btn-menu .invoke-menu {
color: lighten($cInvokeBase, $hovRatio);
}
}
}
&.btn-menu .invoke-menu {
color: $cInvokeBase;
}
}
@mixin sliderTrack($bg: $scrollbarTrackColorBg) { @mixin sliderTrack($bg: $scrollbarTrackColorBg) {
$b: 1px solid lighten($bg, 30%); //$b: 1px solid lighten($bg, 30%);
@include border-radius(2px); @include border-radius(2px);
@include box-sizing(border-box); @include box-sizing(border-box);
@include boxIncised(0.7); @include boxIncised(0.7);
background-color: $bg; background-color: $bg;
border-bottom: $b; //border-bottom: $b;
border-right: $b; //border-right: $b;
} }
@mixin controlGrippy($b, $direction: horizontal, $w: 1px, $style: dotted) { @mixin controlGrippy($b, $direction: horizontal, $w: 1px, $style: dotted) {
@ -206,39 +179,36 @@
} }
} }
&:not(.disabled):hover:before { &:not(.disabled):hover:before {
@include trans-prop-nice("border-color",50ms); @include trans-prop-nice("border-color", 25ms);
border-color: $colorKey; border-color: $colorGrippyInteriorHover;
} }
} }
@mixin btnSubtle($bg: $colorBodyBg, $fg: $colorBodyFg) { @mixin boxIncised($sVal: 0.6, $inset: 5px) {
@include containerSubtle($bg, $fg, true); @include box-shadow(inset rgba(black, $sVal) 0 1px $inset);
}
@mixin btnNoticeable($bg: $colorBodyBg, $fg: $colorBodyFg) {
// No longer should be used; use btnSubtle instead
//@include containerSubtle($bg, $fg, true);
//@include background-image(linear-gradient(lighten($bg, 20%), $bg));
/* &:not(.disabled):hover {
@include background-image(linear-gradient(lighten($bg, 30%), lighten($bg, 10%)));
}*/
}
@mixin boxIncised($sVal: 0.6) {
@include box-shadow(inset rgba(black, $sVal) 0 1px 5px);
} }
@mixin boxOutline($c: lighten($colorBodyBg, 20%)) { @mixin boxOutline($c: lighten($colorBodyBg, 20%)) {
border: 1px solid $c; border: 1px solid $c;
} }
@mixin boxShdw($sVal: rgba(black, 0.4) 0 0 3px) {
@if $sVal != 'none' {
@include box-shadow($sVal);
}
}
@mixin boxShdwSubtle($sVal: 0.2) { @mixin boxShdwSubtle($sVal: 0.2) {
@if $sVal != 'none' {
@include box-shadow(rgba(black, $sVal) 0 1px 2px); @include box-shadow(rgba(black, $sVal) 0 1px 2px);
} }
}
@mixin boxShdwLarge($sVal: 0.7) { @mixin boxShdwLarge($sVal: 0.7) {
@if $sVal != 'none' {
@include box-shadow(rgba(black, $sVal) 0 3px 10px); @include box-shadow(rgba(black, $sVal) 0 3px 10px);
} }
}
@mixin outerGlow($color: #fff, $sVal: 0.3) { @mixin outerGlow($color: #fff, $sVal: 0.3) {
@include box-shadow(rgba($color, $sVal) 0 0 30px); @include box-shadow(rgba($color, $sVal) 0 0 30px);
@ -252,24 +222,76 @@
@include background-image(linear-gradient($deg, rgba($c, $a0), rgba($c, $a1) 100%)); @include background-image(linear-gradient($deg, rgba($c, $a0), rgba($c, $a1) 100%));
} }
@mixin txtShdw($sVal) {
//@if $sVal != 'none' {
@include text-shadow($sVal);
//}
}
@mixin txtShdwSubtle($sVal: 0.1) { @mixin txtShdwSubtle($sVal: 0.1) {
@if $sVal != 'none' {
@include text-shadow(rgba(black, $sVal) 0 1px 2px); @include text-shadow(rgba(black, $sVal) 0 1px 2px);
} }
}
@mixin txtShdwLarge($sVal: 0.7) { @mixin txtShdwLarge($sVal: 0.7) {
@include text-shadow(rgba(black, $sVal) 0 3px 7px); @include text-shadow(rgba(black, $sVal) 0 3px 7px);
} }
/*********************************************** FORM ELEMENTS */ @function pullForward($c, $p: 20%) {
// For dark interfaces, lighter things come forward
@return lighten($c, $p);
}
@function pushBack($c, $p: 20%) {
// For dark interfaces, darker things move back
@return darken($c, $p);
}
@function percentToDecimal($p) {
@return $p / 100%;
}
@function decimalToPercent($d) {
@return percentage($d);
}
/*********************************************** CONTROLS, FORM ELEMENTS */
@mixin containerBase($bg: $colorBodyBg, $fg: $colorBodyFg) {
background-color: $bg;
@include border-radius($controlCr);
@include box-sizing(border-box);
color: $fg;
display: inline-block;
}
@mixin btnBase($bg: $colorBodyBg, $bgHov: none, $fg: $colorBodyFg, $ic: $colorBtnIcon) {
@include user-select(none);
@include transition(background, .25s);
.icon {
color: $ic;
}
@include desktop {
@if $bgHov != none {
&:not(.disabled):hover {
background: $bgHov;
>.icon {
color: lighten($ic, $ltGamma);
}
}
}
}
}
@mixin input-base($bg: $colorBodyBg, $fg: $colorBodyFg) { @mixin input-base($bg: $colorBodyBg, $fg: $colorBodyFg) {
@include appearance(none); @include appearance(none);
@include border-radius($controlCr); @include border-radius($controlCr);
@include box-sizing(border-box); @include box-sizing(border-box);
@include box-shadow(inset rgba(black, 0.65) 0 1px 4px); @include box-shadow(inset rgba(black, 0.4) 0 1px 3px);
// background: lighten($bg, 20%); background: $bg;
background: rgba(#fff, 0.1);
border: none; border: none;
//border-bottom: 1px solid rgba(#fff, 0.1); color: $fg;
color: lighten($fg, 20%);
outline: none; outline: none;
&.error { &.error {
background: rgba(red, 0.5); background: rgba(red, 0.5);
@ -281,6 +303,15 @@
padding: 0 $interiorMarginSm; padding: 0 $interiorMarginSm;
} }
@mixin contextArrow() {
@include text-shadow(none);
content: '\76';
display: inline-block;
font-family: 'symbolsfont';
margin-left: $interiorMarginSm;
vertical-align: top;
}
@mixin nice-textarea($bg: $colorBodyBg, $fg: $colorBodyFg) { @mixin nice-textarea($bg: $colorBodyBg, $fg: $colorBodyFg) {
@include input-base($bg, $fg); @include input-base($bg, $fg);
padding: $interiorMargin; padding: $interiorMargin;
@ -292,16 +323,6 @@
border-bottom: 1px solid lighten($bg, 10%); border-bottom: 1px solid lighten($bg, 10%);
} }
/*
@mixin invokeMenu($baseColor: $colorBodyFg) {
$c: $baseColor;
color: $c;
&:hover {
color: lighten($c, $ltGamma);
}
}
*/
@mixin menuUlReset() { @mixin menuUlReset() {
margin: 0; margin: 0;
padding: 0; padding: 0;
@ -312,15 +333,31 @@
} }
} }
@mixin vertical-align { @mixin webkitProp($name, $val) {
#{$name}: #{$val};
-webkit-#{$name}: #{$val};
}
@mixin webkitVal($name, $val) {
#{$name}: #{$val};
#{$name}: -webkit-#{$val};
}
@mixin verticalCenter {
/* This doesn't work on an element inside an element with absolute positioning that has height: auto */ /* This doesn't work on an element inside an element with absolute positioning that has height: auto */
position: relative; //position: relative;
top: 50%; top: 50%;
-webkit-transform: translateY(-50%); -webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%); -ms-transform: translateY(-50%);
transform: translateY(-50%); transform: translateY(-50%);
} }
@mixin verticalCenterBlock($holderH, $itemH) {
top: floor(($holderH - $itemH) / 2);
bottom: auto;
height: $itemH;
}
@mixin ellipsize() { @mixin ellipsize() {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
@ -355,6 +392,11 @@
background-color: rgba($c, $a); background-color: rgba($c, $a);
} }
@mixin tmpBorder($c: #ffcc00, $a: 0.75) {
@include box-sizing(border-box);
border: 1px dotted rgba($c, $a);
}
@mixin testObj($w: 2000px, $h: 1000px, $c: black, $a: 0.1) { @mixin testObj($w: 2000px, $h: 1000px, $c: black, $a: 0.1) {
&:after { &:after {
@include box-sizing(border-box); @include box-sizing(border-box);

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

@ -37,7 +37,7 @@
} }
h1, h2, h3 { h1, h2, h3 {
color: #fff; color: pullForward($colorBodyFg, 20%);
font-weight: normal !important; font-weight: normal !important;
margin-bottom: 1em; margin-bottom: 1em;
} }

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

@ -22,122 +22,64 @@
$baseRatio: 1.5; $baseRatio: 1.5;
$pad: $interiorMargin * $baseRatio; $pad: $interiorMargin * $baseRatio;
/******* LAYOUT AND SIZING */ .s-btn {
.btn, @include box-sizing(border-box);
.l-btn {
@include user-select(none); @include user-select(none);
line-height: 1.5em; // Was 1.25em cursor: pointer;
padding: 0 $pad;
text-decoration: none; text-decoration: none;
&.lg, height: $btnStdH;
&.create-btn { line-height: $btnStdH;
$h: $ueTopBarH; // - $interiorMargin; padding: 0 $pad;
height: $h; font-size: 0.7rem;
line-height: $h - 2;
//padding: 0 $pad * 6 0 $pad; .icon {
padding: 0 $pad * 3; font-size: 0.8rem;
color: $colorKey;
} }
&.create-btn {
&:before { .title-label {
content:"+"; vertical-align: top;
font-family: symbolsfont;
font-size: 0.8em;
}
.menu {
margin-left: $pad * -1;
}
>.ui-symbol {
//font-size: 1.1em; // Normalizing for new icomoon symbols font
} }
&.lg {
font-size: 1rem;
} }
&.sm { &.sm {
padding: 0 $pad / $baseRatio; padding: 0 $pad / $baseRatio;
} }
&.vsm { &.vsm {
padding: 0 ($pad / $baseRatio) / 2; padding: 0 ($pad / $baseRatio) / 2;
} }
}
/*********************************** STYLE STYLES */
.btn,
.s-btn {
$base: lighten($colorBodyBg, 20%); // Moved to s-btn
@include border-radius($controlCr);
@include box-sizing(border-box);
@include text-shadow(rgba(black, 0.3) 0 1px 1px);
cursor: pointer;
//line-height: 1.2em;
text-decoration: none;
&.major { &.major {
$bg: $colorKey; $bg: $colorBtnMajorBg;
@include btnSubtle($bg); $hc: lighten($bg, 10%);
$fg: lighten($bg, 50%); @include btnSubtle($bg, $hc, $colorBtnMajorFg, $colorBtnMajorFg);
color: $fg;
&:hover {
@include btnSubtle(lighten($bg, 5%), $fg);
//color: $fg;
}
.invoke-menu {
color: $fg;
}
}
&.subtle {
@include btnSubtle($base, lighten($base, 40%));
}
&.very-subtle,
&.s-very-subtle {
@include containerSubtle($colorBodyBg, $colorBodyFg, true);
&.paused {
@include containerSubtle($colorPausedBg, $colorPausedFg, true);
.icon:before {
content:"\0000EF";
}
}
}
} }
.icon-btn, &:not(.major) {
.s-icon-btn { // bg, bgHov, fg, ic
@extend .s-btn; @include btnSubtle($colorBtnBg, $colorKey, $colorBtnFg, $colorBtnIcon);
font-size: 1em;
.icon {
color: $colorKey;
}
&.paused {
.icon {
color: $colorPausedFg;
}
} }
&.pause-play {
&:not(.disabled) {
&:not(.paused) {
&:hover {
.icon {
color: lighten($colorKey, $ltGamma);
}
}
}
}
&.labeled {
padding: 0 $pad/2;
.icon {
//font-size: 1.5em;
}
.title-label {
margin-left: $interiorMargin;
}
} }
&.pause-play { &.pause-play {
/* &.paused {
.icon {
@include pulse(500ms);
}
}*/
.icon:before { .icon:before {
content: "\0000F1"; content: "\0000F1";
} }
&.paused {
@include btnSubtle($colorPausedBg, pushBack($colorPausedBg, 10%), $colorPausedFg, $colorPausedFg);
.icon {
@include pulse(1000ms);
:before {
content: "\0000EF";
}
}
}
} }
&.show-thumbs { &.show-thumbs {
@ -147,14 +89,35 @@ $pad: $interiorMargin * $baseRatio;
} }
} }
/*********************************** LAYOUT STYLES */ .l-btn-set {
span.btn, // Buttons that have a very tight conceptual grouping - no internal space between them.
span.btn span, // Structure: .btn-set > mct-representation class=first|last > .s-btn
span.l-btn, //@include test(red);
span.l-btn span, font-size: 0; // Remove space between s-btn elements due to white space in markup
a.btn,
a.btn span, .s-btn {
a.l-btn, @include border-radius(0);
a.l-btn span { margin-left: 1px;
display: inline-block;
} }
.first {
.s-btn {
@include border-left-radius($controlCr);
margin-left: 0;
}
}
.last {
.s-btn {
@include border-right-radius($controlCr);
}
}
}
.paused {
&:not(.s-btn) {
border-color: $colorPausedBg !important;
color: $colorPausedBg !important;
}
}

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

@ -100,22 +100,6 @@
} }
} }
.btn-bar {
// position: relative;
.btn,
.btn-set,
.t-btn {
display: inline-block;
// margin-left: $interiorMargin;
}
.btn,
.t-btn {
&:first-child {
// margin-left: 0;
}
}
}
.l-composite-control { .l-composite-control {
vertical-align: middle; vertical-align: middle;
&.l-checkbox { &.l-checkbox {
@ -153,55 +137,16 @@
font-size: 0.7rem; font-size: 0.7rem;
} }
.btn-set {
// Buttons that have a very tight conceptual grouping - no internal space between them.
display: inline-block;
position: relative;
.btn,
.t-btn {
@include border-radius(0);
border-left: 1px solid lighten($colorBodyBg, 20%);
margin-left: 0;
&:first-child {
border-left: none;
@include border-left-radius($controlCr);
}
&:last-child {
@include border-right-radius($controlCr);
}
}
}
.object-browse-bar .btn,
.object-browse-bar .t-btn,
.top-bar .buttons-main .btn,
.top-bar .buttons-main .t-btn,
.tool-bar .btn,
.tool-bar .t-btn {
$h: $btnToolbarH;
display: inline-block;
font-size: $h * $btnFontSizeToH;
height: $h;
line-height: $h - 3;
.icon:not(.invoke-menu) {
// position: relative;
// top: -0.04em;
//font-size: 150%;
//vertical-align: middle;
}
}
label.checkbox.custom { label.checkbox.custom {
$bg: lighten($colorBodyBg, $ltGamma); $bg: pullForward($colorBodyBg, 10%);
$d: $formRowCtrlsH; $d: $formRowCtrlsH;
// @include vertical-align();
cursor: pointer; cursor: pointer;
display: inline-block; display: inline-block;
line-height: $d; line-height: $d;
margin-right: $interiorMargin * 4; margin-right: $interiorMargin * 4;
padding-left: $d + $interiorMargin; padding-left: $d + $interiorMargin;
position: relative; position: relative;
vertical-align: top; vertical-align: middle; // was top
em { em {
color: $colorBodyFg; color: $colorBodyFg;
display: inline-block; display: inline-block;
@ -210,7 +155,8 @@ label.checkbox.custom {
&:before { &:before {
@include border-radius($basicCr * .75); @include border-radius($basicCr * .75);
background: $bg; background: $bg;
border-bottom: 1px solid lighten($bg, 10%); //border-bottom: 1px solid lighten($bg, 10%);
@include box-shadow(inset rgba(black, 0.4) 0 1px 2px);
box-sizing: border-box; box-sizing: border-box;
content: " "; content: " ";
font-family: 'symbolsfont'; font-family: 'symbolsfont';
@ -259,7 +205,7 @@ label.checkbox.custom {
} }
} }
.btn-menu label.checkbox.custom { .s-menu label.checkbox.custom {
margin-left: 5px; margin-left: 5px;
} }
@ -270,88 +216,9 @@ label.checkbox.custom {
} }
} }
.btn-menu {
$h: 20px;
$p: $interiorMarginSm * 2;
$c: $colorBodyFg;
@include btnSubtle($colorBodyBg);
/* height: $h;
line-height: $h;
&.dropdown {
padding-left: $p;
padding-right: $p;
}*/
&:not(.disabled):hover {
color: lighten($c, 20%);
}
/* &.context-available {
// An element like the invoke-menu triangle;
// Indicates that this element has a dropdown menu available;
// Currently unused
$c: $colorKey;
color: $c;
padding: 0 5px;
&:hover {
color: lighten($c, 10%);
}
}*/
span.l-click-area {
// In markup, this element should not enclose anything.
@extend .abs;
}
.type-icon {
//margin-right: $interiorMargin;
}
.name {
margin-left: $interiorMargin;
}
.menu {
// margin-left: (-1 * $p);
position: absolute;
left: 0;
text-align: left;
.ui-symbol.icon {
width: 12px;
}
}
}
.top-bar .btn-menu {
$h: $btnStdH; //$ueTopBarBtnH; // 35px
$p: 10px;
$badgeM: $interiorMargin;
$badgeD: $h - ($badgeM * 2);
height: $h;
line-height: $h;
padding-right: 10px;
&.browse-btn {
margin-right: $interiorMargin;
padding-left: $badgeD + $badgeM * 2;
.badge {
@include border-radius($controlCr * 1.5);
display: block;
font-size: 1em;
line-height: $badgeD;
position: absolute;
top: $badgeM;
left: $badgeM;
bottom: $badgeM;
right: auto;
width: $badgeD;
height: auto;
}
}
}
.context-available { .context-available {
$c: $colorKey; $c: $colorKey;
color: $c; color: $c;
//padding: 0 5px;
&:hover { &:hover {
color: lighten($c, 10%); color: lighten($c, 10%);
} }
@ -363,20 +230,58 @@ label.checkbox.custom {
/******************************************************** OBJECT-HEADER */ /******************************************************** OBJECT-HEADER */
.object-header { .object-header {
display: inline-block; //@include test();
font-size: 1em; font-size: 1em;
.label {
.title-label { //> .title-label,
color: lighten($colorBodyFg, 40%); //> .type-icon,
} //> .context-available {
.type-icon { // //@include tmpBorder(#6666ff);
// //vertical-align: middle;
//}
> .type-icon {
color: $colorObjHdrIc;
font-size: 120%; font-size: 120%;
float: left;
margin-right: $interiorMargin; margin-right: $interiorMargin;
vertical-align: middle;
} }
.l-elem-wrapper {
//@include test(#66f, 0.2);
@include webkitProp(justify-content, flex-start);
mct-representation {
// Holds the context-available item
// Must have min-width to make flex work properly
// in Safari
min-width: 0.7em;
}
}
.action {
margin-right: $interiorMargin;
}
.title-label {
//@include test(green, 0.9);
color: $colorObjHdrTxt;
@include ellipsize();
//color: pushBack($colorBodyFg, 40%);
@include webkitProp(flex, '0 1 auto');
padding-right: 0.35em; // For context arrow. Done with em's so pad is relative to the scale of the text.
//position: relative;
}
.context-available { .context-available {
font-size: 0.7em;
@include webkitProp(flex, '0 0 1');
//margin-right: $interiorMargin;
}
@include desktop {
.context-available {
@include trans-prop-nice(opacity, 0.25s);
opacity: 0; opacity: 0;
font-size: 0.8em;
} }
&:hover { &:hover {
.context-available { .context-available {
@ -386,16 +291,6 @@ label.checkbox.custom {
} }
} }
.top-bar,
.object-browse-bar {
.object-header {
font-size: 1.1em;
span {
display: inline-block;
}
}
}
/******************************************************** SLIDERS */ /******************************************************** SLIDERS */
.slider { .slider {
@ -449,24 +344,31 @@ label.checkbox.custom {
/******************************************************** BROWSER ELEMENTS */ /******************************************************** BROWSER ELEMENTS */
@include desktop {
::-webkit-scrollbar { ::-webkit-scrollbar {
@include sliderTrack(); @include border-radius(2px);
@include box-sizing(border-box);
@include box-shadow(inset $scrollbarTrackShdw);
background-color: $scrollbarTrackColorBg;
height: $scrollbarTrackSize; height: $scrollbarTrackSize;
width: $scrollbarTrackSize; width: $scrollbarTrackSize;
} }
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
$bg: lighten($colorBodyBg, 10%); $bg: $scrollbarThumbColor;
@include background-image(linear-gradient(lighten($bg, 10%), lighten($bg, 5%) 20px)); $hc: $scrollbarThumbColorHov;
@include border-radius(1px); $gr: 5%;
@include background-image(linear-gradient(lighten($bg, $gr), $bg 20px));
@include border-radius(2px);
@include box-sizing(border-box); @include box-sizing(border-box);
@include boxShdwSubtle(); //@include boxShdwSubtle();
border-top: 1px solid lighten($bg, 20%); //border-top: 1px solid lighten($bg, 20%);
&:hover { &:hover {
@include background-image(linear-gradient(lighten($bg, 20%), lighten($bg, 15%) 20px)); @include background-image(linear-gradient(lighten($hc, $gr), $hc 20px));
} }
} }
::-webkit-scrollbar-corner { ::-webkit-scrollbar-corner {
background: rgba(#000, 0.4); background: $scrollbarTrackColorBg;
}
} }

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

@ -19,17 +19,59 @@
* this source code distribution or the Licensing information page available * this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
/******************************************************** MENUS */ /******************************************************** MENU BUTTONS */
.s-menu {
// Formerly .btn-menu
@extend .s-btn;
span.l-click-area {
// In markup, this element should not enclose anything.
@extend .abs;
}
.icon {
font-size: 120%;
}
.title-label {
margin-left: $interiorMarginSm;
}
&:after {
// Adds the downward facing 'context available / invoke menu' arrow element
@include contextArrow();
color: rgba($colorInvokeMenu, percentToDecimal($contrastInvokeMenuPercent));
}
&.create-btn {
.title-label {
font-size: 1rem;
}
//&:after {
// color: rgba($colorInvokeMenu, 0.5);
//}
}
.menu {
left: 0;
text-align: left;
.ui-symbol.icon {
width: 12px;
}
}
}
/******************************************************** MENUS THEMSELVES */
.menu-element { .menu-element {
$bg: lighten($colorBodyBg, 5%); $bg: $colorMenuBg;
$bgHover: lighten($bg, 20%); $fg: $colorMenuFg;
$iconColor: $colorKey; $ic: $colorMenuIc;
cursor: pointer; cursor: pointer;
position: relative; position: relative;
.menu { .menu {
@include border-radius($basicCr); @include border-radius($basicCr);
@include containerSubtle($bg); @include containerSubtle($bg, $fg);
@include txtShdwSubtle(0.2); @include boxShdw($shdwMenu);
@include txtShdw($shdwMenuText);
display: block; // set to block via jQuery display: block; // set to block via jQuery
padding: $interiorMarginSm 0; padding: $interiorMarginSm 0;
position: absolute; position: absolute;
@ -39,7 +81,7 @@
li { li {
@include box-sizing(border-box); @include box-sizing(border-box);
border-top: 1px solid lighten($bg, 20%); border-top: 1px solid lighten($bg, 20%);
color: lighten($bg, 60%); color: pullForward($bg, 60%);
line-height: $menuLineH; line-height: $menuLineH;
padding: $interiorMarginSm $interiorMargin * 2 $interiorMarginSm ($interiorMargin * 2) + $treeTypeIconW; padding: $interiorMarginSm $interiorMargin * 2 $interiorMarginSm ($interiorMargin * 2) + $treeTypeIconW;
position: relative; position: relative;
@ -48,19 +90,12 @@
border: none; border: none;
} }
&:hover { &:hover {
background: $bgHover; background: $colorMenuHovBg;
color: $colorKeyFg; color: $colorMenuHovFg;
//a {
// color: $colorKeyFg;
//}
.icon { .icon {
color: lighten($iconColor, 20%); color: $colorMenuHovIc;
} }
} }
//a {
// color: lighten($bg, 60%);
// display: block;
//}
.type-icon { .type-icon {
left: $interiorMargin * 2; left: $interiorMargin * 2;
} }
@ -68,16 +103,12 @@
} }
} }
.menu,
.context-menu, .context-menu,
.super-menu { .super-menu {
$bg: $colorMenuBg;
$fg: $colorMenuFg;
$ic: $colorMenuIc;
//font-size: 0.80rem;
pointer-events: auto; pointer-events: auto;
@include containerSubtle($bg);
ul li { ul li {
padding-left: 25px; //padding-left: 25px;
a { a {
color: $fg; color: $fg;
} }
@ -88,7 +119,7 @@
left: $interiorMargin; left: $interiorMargin;
} }
&:hover .icon { &:hover .icon {
color: lighten($ic, 5%); //color: lighten($ic, 5%);
} }
} }
} }
@ -123,10 +154,8 @@
.super-menu { .super-menu {
$w: 500px; $w: 500px;
$h: $w - 20; $h: $w - 20;
$plw: 50%; //$w * 0.5; $plw: 50%;
$prw: 50%; //$w - $plw; $prw: 50%;
$fg: #fff; //lighten($colorBodyFg, 40%);
$bgHover: $colorKey; //$bg;
display: block; display: block;
width: $w; width: $w;
height: $h; height: $h;
@ -137,7 +166,7 @@
@include box-sizing(border-box); @include box-sizing(border-box);
&.left { &.left {
//@include test(); //@include test();
border-right: 1px solid rgba(white, 0.2); border-right: 1px solid pullForward($colorMenuBg, 10%);
left: 0; left: 0;
padding-right: $interiorMargin; padding-right: $interiorMargin;
right: auto; right: auto;
@ -158,15 +187,13 @@
right: 0; right: 0;
padding: $interiorMargin * 5; padding: $interiorMargin * 5;
width: $prw; width: $prw;
.icon {
color: $fg;
}
} }
} }
.menu-item-description { .menu-item-description {
.desc-area { .desc-area {
&.icon { &.icon {
$h: 150px; $h: 150px;
color: $colorCreateMenuLgIcon;
position: relative; position: relative;
font-size: 8em; font-size: 8em;
left: 0; left: 0;
@ -176,13 +203,13 @@
text-align: center; text-align: center;
} }
&.title { &.title {
color: $fg; color: $colorCreateMenuText;
font-size: 1.2em; font-size: 1.2em;
margin-bottom: 0.5em; margin-bottom: 0.5em;
} }
&.description { &.description {
//color: lighten($bg, 30%); //color: lighten($bg, 30%);
color: $fg; color: $colorCreateMenuText;
font-size: 0.8em; font-size: 0.8em;
line-height: 1.5em; line-height: 1.5em;
} }

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

@ -1,8 +1,6 @@
.l-image-main-wrapper, .l-image-main-wrapper,
.l-image-main, .l-image-main,
.l-image-main-controlbar, .l-image-main-controlbar,
.l-image-main-controlbar .left,
.l-image-main-controlbar .right,
.l-image-thumbs-wrapper { .l-image-thumbs-wrapper {
@include absPosDefault(0, false); @include absPosDefault(0, false);
} }
@ -16,7 +14,7 @@
min-height: 100px; min-height: 100px;
min-width: 150px; min-width: 150px;
.l-image-main { .l-image-main {
background-color: rgba(#fff, 0.1); background-color: $colorPlotBg;
bottom: $imageMainControlBarH + $interiorMargin; bottom: $imageMainControlBarH + $interiorMargin;
} }
.l-image-main-controlbar { .l-image-main-controlbar {
@ -61,17 +59,14 @@
.left { .left {
//@include test(red); //@include test(red);
text-align: left; text-align: left;
width: 75% !important;
} }
.right { .right {
//@include test(green); //@include test(green);
min-width: 40px;
width: 25% !important;
z-index: 2; z-index: 2;
} }
.l-date, .l-date,
.l-time { .l-time {
color: #fff; color: pullForward($colorBodyFg, 20%);
} }
.l-mag { .l-mag {
direction: ltr; direction: ltr;
@ -82,7 +77,7 @@
} }
} }
.s-mag { .s-mag {
color: darken($colorBodyFg, 20%); color: pushBack($colorBodyFg, 20%);
} }
.l-btn.show-thumbs { .l-btn.show-thumbs {
display: none; display: none;

37
platform/commonUI/general/res/sass/forms.scss
View File

@ -1,37 +0,0 @@
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
@import "compass";
@import "compass/css3";
@import "compass/css3/border-radius";
@import "compass/css3/opacity";
@import "compass/utilities";
@import "constants";
@import "mixins";
@import "forms/mixins";
@import "forms/elems";
@import "forms/textarea";
@import "forms/text-input";
@import "forms/selects";
@import "forms/channel-selector";
@import "forms/datetime";
//@import "forms/filter";

6
platform/commonUI/general/res/sass/forms/_channel-selector.scss
View File

@ -36,11 +36,11 @@
.btns-add-remove { .btns-add-remove {
// background: rgba(#ff0000, 0.3);; // background: rgba(#ff0000, 0.3);;
margin-top: 150px; margin-top: 150px;
.btn { .s-btn {
display: block; display: block;
font-size: 1.5em; //font-size: 1.5em;
margin-bottom: $interiorMargin; margin-bottom: $interiorMargin;
padding: 10px; //padding: 10px;
text-align: center; text-align: center;
} }
} }

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

@ -20,54 +20,57 @@
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
.section-header { .section-header {
@include border-radius(3px); @include border-radius($basicCr);
background: rgba(white, 0.1); background: $colorFormSectionHeader;
$c: lighten($colorBodyFg, 20%);
//border-bottom: 1px solid rgba(#fff, 0.3);
color: $c;
font-size: 0.8em; font-size: 0.8em;
margin-top: $interiorMargin; padding: $formTBPad $formLRPad;
padding: $interiorMargin; text-transform: uppercase;
&:first-child {
margin-top: 0;
}
} }
.form { .form {
// @include test(orange); // @include test(orange);
color: $colorFormText;
.form-section { .form-section {
position: relative; position: relative;
margin-bottom: $interiorMarginLg * 2;
} }
.form-row { .form-row {
$m: $interiorMargin;
@include box-sizing(border-box); @include box-sizing(border-box);
@include clearfix; @include clearfix;
border-top: 1px solid $colorInteriorBorder; border-top: 1px solid $colorFormLines;
margin-top: $interiorMargin; margin-top: $m;
padding: $interiorMargin; padding: $formTBPad 0;
position: relative; position: relative;
&.first { &.first {
border-top: none; border-top: none;
} }
.label, >.label,
.controls { >.controls {
// @include test(orange);
@include box-sizing(border-box); @include box-sizing(border-box);
@include clearfix; @include clearfix;
box-sizing: border-box; font-size: 0.8rem;
font-size: 0.75rem;
line-height: $formInputH; line-height: $formInputH;
min-height: $formInputH; min-height: $formInputH;
} }
>.label { >.label {
// Only style this way for immediate children of .form-row; prevents problems when .label is used in .controls section of a form // 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; float: left;
min-width: 120px;
position: relative; position: relative;
white-space: nowrap; white-space: nowrap;
width: $formLabelW; width: $formLabelW;
} }
.value { .value {
color: lighten($colorBodyFg, 20%); color: $colorInputFg; //lighten($colorBodyFg, 20%);
} }
.controls { .controls {
@ -109,18 +112,18 @@
.selector-list { .selector-list {
// Used in create overlay to display tree view // Used in create overlay to display tree view
@include nice-input($colorInputBg, $colorInputFg);
$h: 150px; $h: 150px;
@include border-radius($basicCr); //@include border-radius($basicCr);
@include box-sizing(border-box); //@include box-sizing(border-box);
background: rgba(black, 0.2); //background: rgba(black, 0.2);
padding: $interiorMargin; //padding: $interiorMargin;
position: relative; position: relative;
height: $h; height: $h;
overflow: auto;
// max-width: 50%; // max-width: 50%;
.wrapper { >.wrapper {
$p: $interiorMargin; $p: $interiorMargin;
overflow-y: auto; overflow: auto;
position: absolute; position: absolute;
top: $p; top: $p;
right: $p; right: $p;
@ -158,3 +161,23 @@ label.form-control.checkbox {
padding: $interiorMargin; padding: $interiorMargin;
} }
} }
input[type="text"] {
@include nice-input($colorInputBg, $colorInputFg);
&.filter {
&.ng-dirty {
// background: red;
}
}
&.numeric {
text-align: right;
}
}
textarea {
@include nice-textarea($colorInputBg, $colorInputFg);
// font-size: 0.9em;
position: absolute;
height: 100%;
width: 100%;
}

52
platform/commonUI/general/res/sass/forms/_mixins.scss
View File

@ -1,52 +0,0 @@
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
@mixin input-base($bg: $colorBodyBg, $fg: $colorBodyFg) {
@include appearance(none);
@include border-radius($controlCr);
@include box-sizing(border-box);
@include box-shadow(inset rgba(black, 0.65) 0 1px 4px);
// background: lighten($bg, 20%);
background: rgba(#fff, 0.1);
border: none;
//border-bottom: 1px solid rgba(#fff, 0.1);
color: lighten($fg, 20%);
outline: none;
&.error {
background: rgba(red, 0.5);
}
}
@mixin nice-input($bg: $colorBodyBg, $fg: $colorBodyFg) {
@include input-base($bg, $fg);
padding: 0 $interiorMarginSm;
}
@mixin nice-textarea($bg: $colorBodyBg, $fg: $colorBodyFg) {
@include input-base($bg, $fg);
padding: $interiorMargin;
}
@mixin subdued-input($bg: $colorBodyBg, $fg: $colorBodyFg) {
@include nice-input($bg, $fg);
background: lighten($bg, 3%);
border-bottom: 1px solid lighten($bg, 10%);
}

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

@ -19,32 +19,32 @@
* this source code distribution or the Licensing information page available * this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
.form-control.select { .select {
@include btnSubtle($colorBodyBg); @include btnSubtle($colorSelectBg);
cursor: pointer;
display: inline-block;
margin: 0 0 2px 2px; // Needed to avoid dropshadow from being clipped by parent containers margin: 0 0 2px 2px; // Needed to avoid dropshadow from being clipped by parent containers
padding: 0 $interiorMargin;
overflow: hidden; overflow: hidden;
position: relative; position: relative;
select { select {
@include appearance(none); @include appearance(none);
@include box-sizing(border-box); @include box-sizing(border-box);
background: none; background: none;
color: $colorBodyFg; color: $colorSelectFg;
border: none !important;
cursor: pointer; cursor: pointer;
padding: 4px 25px 2px 5px; border: none !important;
padding: 4px 25px 2px 0px;
width: 120%; width: 120%;
option { option {
margin: $interiorMargin 0; // Firefox margin: $interiorMargin 0; // Firefox
} }
} }
&:after { &:after {
color: $colorKey; @include contextArrow();
content:"v"; color: rgba($colorSelectFg, percentToDecimal($contrastInvokeMenuPercent));
display: block; //content:"v";
font-family: 'symbolsfont'; //display: block;
pointer-events: none; //font-family: 'symbolsfont';
//pointer-events: none;
position: absolute; position: absolute;
right: $interiorMargin; top: 0; right: $interiorMargin; top: 0;
} }

28
platform/commonUI/general/res/sass/forms/_textarea.scss
View File

@ -1,28 +0,0 @@
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
.edit-main textarea {
@include nice-textarea();
// font-size: 0.9em;
position: absolute;
height: 100%;
width: 100%;
}

15
platform/commonUI/general/res/sass/forms/_validation.scss
View File

@ -21,22 +21,11 @@
*****************************************************************************/ *****************************************************************************/
.validates { .validates {
> .label { > .label {
// @include test(green, 0.1); padding-right: $reqSymbolM; // Keep room for validation element
padding-right: $reqSymbolW + $reqSymbolM; // Keep room for validation element
&::after { &::after {
// @include test(yellow, 0.3); float: right;
display: block;
position: absolute;
top: 0;
right: $reqSymbolM;
bottom: 0;
left: auto;
height: auto;
width: $reqSymbolW;
font-family: symbolsfont; font-family: symbolsfont;
font-size: $reqSymbolFontSize; font-size: $reqSymbolFontSize;
text-align: right;
vertical-align: middle;
} }
} }
&.invalid, &.invalid,

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

@ -75,17 +75,34 @@
margin-left: $bubbleArwSize*2; margin-left: $bubbleArwSize*2;
.l-infobubble::before { .l-infobubble::before {
right: 100%; right: 100%;
// NOTE: [MOBILE] REMOVES TRIANGLE
// Removes the triangle located on the info
// bubble for phones only, for tablets and
// desktops, triangle remains.
@include desktopandtablet {
@include triangle('left', $bubbleArwSize, 1.5, $colorInfoBubbleBg); @include triangle('left', $bubbleArwSize, 1.5, $colorInfoBubbleBg);
} }
} }
}
&.arw-right { &.arw-right {
// NOTE: [MOBILE] REMOVES RIGHT MARGIN
// Removes right margin made for the
// triangle on mobile
@include desktopandtablet {
margin-right: $bubbleArwSize*2; margin-right: $bubbleArwSize*2;
}
.l-infobubble::before { .l-infobubble::before {
left: 100%; left: 100%;
// NOTE: [MOBILE] REMOVES TRIANGLE
// Removes the triangle located on the info
// bubble for phones only, for tablets and
// desktops, triangle remains.
@include desktopandtablet {
@include triangle('right', $bubbleArwSize, 1.5, $colorInfoBubbleBg); @include triangle('right', $bubbleArwSize, 1.5, $colorInfoBubbleBg);
} }
} }
}
&.arw-top { &.arw-top {
.l-infobubble::before { .l-infobubble::before {

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

@ -20,18 +20,20 @@
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
.split-layout { .split-layout {
$b: lighten($colorBodyBg, 5%); $b: pullForward($colorBodyBg, $contrastRatioPercent);
$splitterD: 5px;
// TEMP VAlS - this will need to be redone when we implement a draggable splitter
$splitL: 85%;
$splitT: 70%;
.splitter { .splitter {
background-color: $b; background-color: $b;
@include box-shadow(rgba(black, 0.4) 0 0 3px); @include border-radius($splitterEndCr);
@include boxShdw($splitterShdw);
overflow: hidden; overflow: hidden;
position: absolute; position: absolute;
z-index: 1; z-index: 1;
//@if $colorSplitterHover != 'none' {
&:hover {
background-color: $colorSplitterHover;
}
//}
} }
&.horizontal { &.horizontal {
// Slides vertically up and down, splitting the element horizontally // Slides vertically up and down, splitting the element horizontally
@ -41,21 +43,17 @@
right: 0; right: 0;
&.top { &.top {
bottom: auto; bottom: auto;
// height: $splitT;
} }
&.bottom { &.bottom {
top: auto; top: auto;
// height: 100% - $splitT;
} }
} }
>.splitter { >.splitter {
@include controlGrippy($b, horizontal); @include controlGrippy($colorSplitterInterior, horizontal);
cursor: row-resize; cursor: row-resize;
left: 0; right: 0; left: 0; right: 0;
width: auto; width: auto;
height: $splitterD; height: $splitterW;
// margin-top: ($splitterD + 2) * -1; // Controlled by splitter
// top: $splitT; // Controlled by splitter
} }
} }
&.vertical { &.vertical {
@ -65,20 +63,16 @@
bottom: 0; bottom: 0;
&.left { &.left {
right: auto; right: auto;
// width: $splitL - 1%; // Controlled by splitter
} }
&.right { &.right {
left: auto; left: auto;
// width: 100% - $splitL; // Controlled by splitter
} }
} }
>.splitter { >.splitter {
@include controlGrippy($b, vertical); @include controlGrippy($colorBodyBg, vertical);
bottom: 0; bottom: 0;
cursor: col-resize; cursor: col-resize;
width: $splitterD; width: $splitterW;
// margin-left: ($splitterD + 2) * -1; // Controlled by splitter
// left: $splitL; // Controlled by splitter
} }
} }
} }

53
platform/commonUI/general/res/sass/items/_item.scss
View File

@ -29,11 +29,10 @@
&.grid-item { &.grid-item {
//div { @include test() } //div { @include test() }
$d: $ueBrowseGridItemLg; $d: $ueBrowseGridItemLg;
//$iconD: 100px;
$iconMargin: 40px; $iconMargin: 40px;
$iconD: ($d - ($iconMargin * 2)) * 0.85; $iconD: ($d - ($iconMargin * 2)) * 0.85;
$transTime: 200ms; $transTime: 200ms;
@include btnSubtle($colorItemBase); @include btnSubtle($colorItemBg, $colorItemBgHov, $colorItemFg, $colorItemIc);
box-sizing: border-box; box-sizing: border-box;
cursor: pointer; cursor: pointer;
float: left; float: left;
@ -44,24 +43,27 @@
position: relative; position: relative;
&:hover .item-main { &:hover .item-main {
.item-type { .item-type {
color: $colorKey !important; color: lighten($colorKey, 10%);
.l-icon-link { .l-icon-link {
color: $colorIconLink; color: $colorIconLink;
} }
} }
.item-open { .item-open {
//display: block;
opacity: 1; opacity: 1;
} }
} }
.contents { .contents {
top: $interiorMargin; right: $interiorMargin; bottom: $interiorMargin; left: $interiorMargin; //@include test(red);
$m: $interiorMarginLg;
top: $m; right: $m; bottom: $m; left: $m;
} }
.bar { .bar {
&.top-bar.abs { &.top-bar {
bottom: auto; bottom: auto;
color: $colorItemSubIcons;
height: $ueBrowseGridItemTopBarH; height: $ueBrowseGridItemTopBarH;
line-height: $ueBrowseGridItemTopBarH; line-height: $ueBrowseGridItemTopBarH;
text-align: right;
z-index: 5; z-index: 5;
.left, .right { .left, .right {
width: auto; width: auto;
@ -73,69 +75,64 @@
} }
} }
} }
&.bottom-bar.abs { &.bottom-bar {
top: auto; top: auto;
height: $ueBrowseGridItemBottomBarH; line-height: 110%;
padding: $interiorMargin;
} }
} }
.item-main { .item-main {
$h: $ueBrowseGridItemLg; $h: $ueBrowseGridItemLg;
$lh: $h * 0.8; $lh: $h * 0.8;
//top: $ueBrowseGridItemTopBarH; bottom: $ueBrowseGridItemBottomBarH; //top: $ueBrowseGridItemTopBarH; bottom: $ueBrowseGridItemBottomBarH; //
line-height: $lh; line-height: $lh;
z-index: 1; z-index: 1;
.item-type { .item-type {
//@include trans-prop-nice("color", $transTime); //@include trans-prop-nice("color", $transTime);
@include absPosDefault($iconMargin, false); @include absPosDefault($iconMargin, false);
//@include test(red); //@include test(red);
color: $colorItemFg; //color: $colorItemIc;
text-align: center; text-align: center;
font-size: $iconD * 0.95; //6em; font-size: $iconD * 0.95; //6em;
line-height: $iconD; line-height: $iconD;
bottom: auto; bottom: auto;
height: $iconD; height: $iconD;
top: $iconMargin - 10; top: $iconMargin - 10;
//line-height: $lh;
.l-icon-link { .l-icon-link {
// When the link icon is in the item-type icon holder color: $colorIconLink;
color: darken($colorIconLink, 25%); height: auto;
height: 36px; line-height: 100%;
line-height: 36px;
position: absolute; position: absolute;
font-size: 32px; font-size: 0.3em;
left: 0px; left: 0px;
bottom: 10px; bottom: 10px;
z-index: 2; z-index: 2;
} }
} }
.item-open { .item-open {
//@include test();
@include trans-prop-nice("opacity", $transTime); @include trans-prop-nice("opacity", $transTime);
opacity: 0; opacity: 0;
//display: none; color: $colorItemOpenIcon;
font-size: 3em; font-size: 3em;
//line-height: $lh;
left: auto; width: 50px; left: auto; width: 50px;
pointer-events: none; pointer-events: none;
text-align: right; text-align: right;
} }
} }
.title { .title {
@include txtShdwSubtle(); @include txtShdw($shdwItemText);
color: lighten($colorBodyFg, 20%); @include ellipsize();
overflow: hidden; color: $colorItemFg;
white-space: nowrap;
text-overflow: ellipsis;
// font-weight: bold;
} }
.details { .details {
@include txtShdw($shdwItemText);
@include ellipsize();
color: $colorItemFgDetails;
font-size: 0.8em; font-size: 0.8em;
} }
&.selected { &.selected {
$cfg: lighten($colorItemSelected, 35%); $cfg: lighten($colorItemBgSelected, 35%);
$cfgh: lighten($cfg, 30%); $cfgh: lighten($cfg, 30%);
@include btnSubtle($colorItemSelected); @include btnSubtle($colorItemBgSelected);
color: $cfg; color: $cfg;
.item-type, .top-bar .icon:not(.alert) { color: $cfg } .item-type, .top-bar .icon:not(.alert) { color: $cfg }
.item-main .item-open { color: $cfg } .item-main .item-open { color: $cfg }

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

@ -29,30 +29,22 @@ table {
@include box-sizing(border-box); @include box-sizing(border-box);
border-spacing: 0; border-spacing: 0;
border-collapse: collapse; border-collapse: collapse;
color: #fff;
display: table; display: table;
font-size: 0.75rem; font-size: 0.75rem;
position: relative; position: relative;
//height: 100%; MOVED
width: 100%; width: 100%;
thead, .thead, thead, .thead,
tbody tr, .tbody .tr { tbody tr, .tbody .tr {
//display: table; MOVED
width: 100%; width: 100%;
//table-layout: fixed; MOVED
} }
thead, .thead { thead, .thead {
border-bottom: 1px solid $tabularColorHeaderBorder; border-bottom: 1px solid $colorTabHeaderBorder;
} }
tbody, .tbody { tbody, .tbody {
//@include absPosDefault(0); MOVED
//top: $tabularHeaderH; MOVED
//display: block; MOVED
//overflow-y: scroll; MOVED
display: table-row-group; display: table-row-group;
tr, .tr { tr, .tr {
&:hover { &:hover {
background: rgba(white, 0.1); background: rgba($colorTabBodyFg, 0.1);
} }
} }
} }
@ -64,17 +56,17 @@ table {
&.group-header { &.group-header {
td, .td { td, .td {
$d: 5%; $d: 5%;
background-color: darken($tabularColorHeaderBg, $d); background-color: pushBack($colorTabHeaderBg, $d);
color: darken($tabularColorHeaderFg, $d); color: pushBack($colorTabHeaderFg, $d);
} }
} }
th, .th, td, .td { th, .th, td, .td {
display: table-cell; display: table-cell;
} }
th, .th { th, .th {
background-color: $tabularColorHeaderBg; background-color: $colorTabHeaderBg;
border-left: 1px solid $tabularColorHeaderBorder; border-left: 1px solid $colorTabHeaderBorder;
color: $tabularColorHeaderFg; color: $colorTabHeaderFg;
padding: $tabularTdPadLR $tabularTdPadLR; padding: $tabularTdPadLR $tabularTdPadLR;
white-space: nowrap; white-space: nowrap;
vertical-align: middle; // This is crucial to hiding f**king 4px height injected by browser by default vertical-align: middle; // This is crucial to hiding f**king 4px height injected by browser by default
@ -99,7 +91,7 @@ table {
} }
} }
td, .td { td, .td {
border-bottom: 1px solid $tabularColorBorder; border-bottom: 1px solid $colorTabBorder;
min-width: 20px; min-width: 20px;
color: $colorTelemFresh; color: $colorTelemFresh;
padding: $tabularTdPadTB $tabularTdPadLR; padding: $tabularTdPadTB $tabularTdPadLR;

83
platform/commonUI/general/res/sass/mobile/_constants.scss Normal file
View File

@ -0,0 +1,83 @@
/*****************************************************************************
* 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.
*****************************************************************************/
/************************** MOBILE REPRESENTATION ITEMS DIMENSIONS */
$mobileListIconSize: 30px;
$mobileTitleDescH: 35px;
$mobileOverlayMargin: 10px;
$phoneItemH: floor($ueBrowseGridItemLg/4);
$tabletItemH: floor($ueBrowseGridItemLg/3);
/************************** MOBILE TREE MENU DIMENSIONS */
$mobileTreeItemH: 35px;
$mobileTreeItemIndent: 20px;
$mobileTreeRightArrowW: 30px;
/************************** WINDOW DIMENSIONS FOR RWD */
$phoMaxW: 514px;
$phoMaxH: 740px;
$tabMinW: 515px;
$tabMaxW: 799px;
$tabMinH: 741px;
$tabMaxH: 1024px;
$compMinW: 800px;
$compMinH: 1025px;
/************************** MEDIA QUERIES: WINDOW CHECKS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
$screenPortrait: "screen and (orientation: portrait)";
$screenLandscape: "screen and (orientation: landscape)";
$mobileDevice: "(max-device-width: #{$tabMaxW}) and (max-device-height: #{$tabMaxH})";
$mobileDeviceEmu: "(max-device-width: #{$tabMaxH}) and (max-device-height: #{$tabMaxW})";
$phonePortraitCheck: "(max-width: #{$phoMaxW}) and (max-height: #{$phoMaxH})";
$phoneLandscapeCheck: "(max-height: #{$phoMaxW}) and (max-width: #{$phoMaxH})";
$tabWidPorCheck: "(min-width: #{$tabMinW}) and (max-width: #{$tabMaxW})";
$tabHeiPorCheck: "(min-height: #{$tabMinH}) and (max-height: #{$tabMaxH})";
$tabletPortraitCheck: "#{$tabWidPorCheck} and #{$tabHeiPorCheck}";
$tabWidLanCheck: "(min-height: #{$tabMinW}) and (max-height: #{$tabMaxW})";
$tabHeiLanCheck: "(min-width: #{$tabMinH}) and (max-width: #{$tabMaxH})";
$tabletLandscapeCheck: "#{$tabWidLanCheck} and #{$tabHeiLanCheck}";
$desktopPortraitCheck: "(min-device-width: #{$compMinW}) and (min-device-height: #{$compMinH})";
$desktopLandscapeCheck: "(min-device-width: #{$compMinH}) and (min-device-height: #{$compMinW})";
/************************** MEDIA QUERIES: WINDOWS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
$phonePortrait: "#{$screenPortrait} and #{$phonePortraitCheck} and #{$mobileDevice}";
$phoneLandscape: "#{$screenLandscape} and #{$phoneLandscapeCheck} and #{$mobileDevice}";
$phoneLandscapeEmu: "#{$screenLandscape} and #{$phoneLandscapeCheck} and #{$mobileDeviceEmu}";
$tabletPortrait: "#{$screenPortrait} and #{$tabletPortraitCheck} and #{$mobileDevice}";
$tabletLandscape: "#{$screenLandscape} and #{$tabletLandscapeCheck} and #{$mobileDevice}";
$tabletLandscapeEmu: "#{$screenLandscape} and #{$tabletLandscapeCheck} and #{$mobileDeviceEmu}";
$desktopPortrait: "screen and #{$desktopPortraitCheck}";
$desktopLandscape: "screen and #{$desktopLandscapeCheck}";
/************************** DEVICE PARAMETERS FOR MENUS/REPRESENTATIONS */
$proporMenuOnly: 90%;
$proporMenuWithView: 40%;

119
platform/commonUI/general/res/sass/mobile/_item.scss Normal file
View File

@ -0,0 +1,119 @@
/*****************************************************************************
* 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.
*****************************************************************************/
// Sets the size of the items in the folder
// representation. Instead of a grid,
// a list is used.
.items-holder {
.item {
&.grid-item {
$titleH: 30px;
@include phoneandtablet {
width: 100%;
>.contents {
top: 0px; right: $interiorMarginLg; bottom: 0px; left: $interiorMarginLg;
}
.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;
}
&.bottom-bar {
// Becomes the left side of the item
left: $mobileListIconSize + $interiorMarginLg;
right: 60px;
}
}
.item-main {
.item-type {
//@include test(blue);
font-size: $mobileListIconSize;
right: auto;
bottom: auto;
left: 0;
line-height: 100%;
text-align: left;
width: $mobileListIconSize;
.l-icon-link {
bottom: 0;
}
}
.item-open {
display: block;
opacity: 1;
font-size: 1em;
width: auto;
}
}
}
@include phone {
$dHei: $phoneItemH;
height: $dHei;
.bar {
&.top-bar {
// Becomes the right side of the item
line-height: $dHei !important;
}
&.bottom-bar {
@include verticalCenterBlock($dHei, $mobileTitleDescH);
}
}
.item-main {
.item-type {
@include verticalCenterBlock($dHei, $mobileListIconSize);
}
.item-open {
line-height: $dHei;
}
}
}
@include tablet {
$dHei: $tabletItemH;
height: $dHei;
.bar {
&.top-bar {
// Becomes the right side of the item
line-height: $dHei !important;
}
&.bottom-bar {
@include verticalCenterBlock($dHei, $mobileTitleDescH);
}
}
.item-main {
.item-type {
@include verticalCenterBlock($dHei, $mobileListIconSize);
}
.item-open {
line-height: $dHei;
}
}
}
}
}
}

174
platform/commonUI/general/res/sass/mobile/_layout.scss Normal file
View File

@ -0,0 +1,174 @@
/*****************************************************************************
* 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.
*****************************************************************************/
@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;
}
.pane.left.treeview {
background-color: $colorMobilePaneLeft;
}
.pane.right-repr {
//@include test();
@include slMenuTransitions;
margin-left: 0 !important;
#content-area {
@include slMenuTransitions;
opacity: 1;
}
}
.user-environ .browse-area,
.user-environ .edit-area,
.user-environ .editor {
top: 0; left: 0; right: 0; bottom: $ueFooterH;
}
.holder.l-mobile {
top: $bodyMargin !important;
right: $bodyMargin !important;
bottom: $bodyMargin !important;
left: $bodyMargin !important;
}
// When the tree is hidden, these are the
// classes used for the left menu and the
// right representation.
.browse-hidetree {
@include user-select(none);
// Sets the left tree menu when the tree
// is hidden.
.pane.left.treeview {
opacity: 0;
right: 100% !important;
width: auto !important;
overflow-y: hidden;
overflow-x: hidden;
}
// Sets the right represenation when
// the tree is hidden.
.pane.right-repr {
left: 0 !important;
}
}
.browse-showtree {
// NOTE: DISABLED SELECTION
// Selection disabled in both panes
// causing cut/copy/paste menu to
// not appear. Should me moved in
// future to properly work
@include user-select(none);
// Sets the left tree menu when the tree is shown.
.pane.left.treeview {
@include trans-prop-nice(opacity, .4s);
@include background-image(linear-gradient(90deg, rgba(black, 0) 98%, rgba(black, 0.3) 100%));
opacity: 1;
display: block !important;
//width: auto !important; // CH CO
right: auto !important;
width: $proporMenuWithView !important;
}
// Sets the right representation when the tree is shown.
.pane.right-repr {
left: $proporMenuWithView !important;
//width: auto !important;
//left: 0 !important;
//transform: translateX($proporMenuWithView);
}
}
.mobile-menu-icon {
font-size: 110%;
position: absolute;
top: $bodyMargin + 2;
left: $bodyMargin;
}
.object-browse-bar {
//@include test();
left: 30px !important;
.context-available {
opacity: 1 !important;
}
.view-switcher {
margin-right: 0 !important;
.title-label {
// Hide the name in mobile
display: none;
}
}
}
.tree-holder {
overflow-x: hidden !important;
}
.mobile-disable-select {
@include user-select(none);
}
// Hides objects on phone and tablet
.mobile-hide,
.mobile-hide-important {
display: none !important;
}
.mobile-back-hide {
pointer-events: none;
@include trans-prop-nice(opacity, .4s);
opacity: 0;
}
.mobile-back-unhide {
pointer-events: all;
@include trans-prop-nice(opacity, .4s);
opacity: 1;
}
}
@include phonePortrait {
.browse-showtree {
.pane.left.treeview {
width: $proporMenuOnly !important;
}
.pane.right-repr {
left: 0 !important;
@include webkitProp(transform, translateX($proporMenuOnly));
#content-area {
opacity: 0;
}
}
}
}
@include desktop {
.desktop-hide {
display: none;
}
}

107
platform/commonUI/general/res/sass/mobile/_mixins.scss Normal file
View File

@ -0,0 +1,107 @@
/*****************************************************************************
* 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.
*****************************************************************************/
// Phones in any orientation
@mixin phone {
@media #{$phonePortrait},
#{$phoneLandscape},
#{$phoneLandscapeEmu} {
@content
}
}
//Phones in portrait orientation
@mixin phonePortrait {
@media #{$phonePortrait} {
@content
}
}
// Phones in landscape orientation
@mixin phoneLandscape {
@media #{$phoneLandscape},
#{$phoneLandscapeEmu} {
@content
}
}
// Tablets in any orientation
@mixin tablet {
@media #{$tabletPortrait},
#{$tabletLandscape},
#{$tabletLandscapeEmu} {
@content
}
}
// Tablets in portrait orientation
@mixin tabletPortrait {
@media #{$tabletPortrait} {
@content
}
}
// Tablets in landscape orientation
@mixin tabletLandscape {
@media #{$tabletLandscape},
#{$tabletLandscapeEmu} {
@content
}
}
// Phones and tablets in any orientation
@mixin phoneandtablet {
@media #{$phonePortrait},
#{$phoneLandscape},
#{$phoneLandscapeEmu},
#{$tabletPortrait},
#{$tabletLandscape},
#{$tabletLandscapeEmu} {
@content
}
}
// Desktop monitors in any orientation
@mixin desktopandtablet {
@media #{$tabletPortrait},
#{$tabletLandscape},
#{$tabletLandscapeEmu},
#{$desktopPortrait},
#{$desktopLandscape} {
@content
}
}
// Desktop monitors in any orientation
@mixin desktop {
@media #{$desktopPortrait},
#{$desktopLandscape} {
@content
}
}
// Transition used for the slide menu
@mixin slMenuTransitions {
@include transition-duration(.35s);
transition-timing-function: ease;
backface-visibility: hidden;
}

39
platform/commonUI/general/res/sass/user-environ/_object-browse.scss → platform/commonUI/general/res/sass/mobile/_tree.scss
View File

@ -19,12 +19,39 @@
* this source code distribution or the Licensing information page available * this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
.object-browse-bar {
height: $ueTopBarH; @include phoneandtablet {
line-height: $ueTopBarH; ul.tree {
.items-select { // Sets the margin on the left, which causes the
.btn-menu { // running indentation after each folder is made
margin-right: $interiorMargin * 3; ul.tree {
margin-left: $mobileTreeItemIndent;
}
}
.tree-item,
.search-result-item {
height: $mobileTreeItemH;
line-height: $mobileTreeItemH;
margin-bottom: 0px;
.view-control {
//@include test(red);
position: absolute;
font-size: 1.1em;
right: 0px;
width: $mobileTreeRightArrowW;
text-align: center;
}
.label {
left: 0;
right: $mobileTreeRightArrowW + $interiorMargin; // Allows tree item name to stop prior to the arrow
line-height: $mobileTreeItemH;
//font-size: 1.1em; // CH CO
.type-icon {
@include verticalCenterBlock($mobileTreeItemH, $treeTypeIconH);
}
.title-label {
}
} }
} }
} }

25
platform/commonUI/general/res/sass/forms/_text-input.scss → platform/commonUI/general/res/sass/mobile/controls/_menus.scss
View File

@ -19,14 +19,25 @@
* this source code distribution or the Licensing information page available * this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
input[type="text"] {
@include nice-input(); // Override the Create menu for mobile
&.filter { @include phoneandtablet {
&.ng-dirty { .menu-element {
// background: red; .super-menu {
$d: 250px;
width: $d;
height: $d;
.pane {
&.left {
border-right: none;
padding-right: 0;
width: 100%;
}
&.right {
display: none;
}
} }
} }
&.numeric {
text-align: right;
} }
} }

56
platform/commonUI/general/res/sass/mobile/overlay/_overlay.scss Normal file
View File

@ -0,0 +1,56 @@
@include phoneandtablet {
.overlay {
$m: 0;
.clk-icon.close {
top: $mobileOverlayMargin; right: $mobileOverlayMargin;
}
> .holder {
@include border-radius($m);
top: $m;
right: $m;
bottom: $m;
left: $m;
> .contents {
top: $mobileOverlayMargin;
right: $mobileOverlayMargin;
bottom: $mobileOverlayMargin;
left: $mobileOverlayMargin;
.top-bar {
> .title {
margin-right: 1.2em;
}
}
.form.editor {
border: none;
.contents {
top: 0;
right: 0;
bottom: 0;
left: 0;
}
}
}
}
}
}
@include phone {
.overlay > .holder > .contents .form.editor .contents .form-row {
> .label,
> .controls {
//@include test(blue);
display: block;
float: none;
width: 100%;
}
> .label {
&:after {
float: none;
}
}
}
}

13
platform/commonUI/general/res/sass/mobile/search/_search.scss Normal file
View File

@ -0,0 +1,13 @@
@include phone {
.search {
.search-bar {
// Hide menu-icon and adjust spacing when in phone mode
.menu-icon {
display: none;
}
.clear-icon {
right: $interiorMargin;
}
}
}
}

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

@ -24,32 +24,27 @@
background: $colorOvrBlocker; background: $colorOvrBlocker;
z-index: 100; z-index: 100;
} }
.btn.close { .clk-icon.close {
@include border-radius($basicCr * 2); font-size: 0.8rem;
padding: 3px 6px;
position: absolute; position: absolute;
border: none; top: $interiorMarginLg; right: $interiorMarginLg; bottom: auto; left: auto;
top: $interiorMarginSm; right: $interiorMarginSm; bottom: auto; left: auto;
z-index: 100; z-index: 100;
}
.editor {
// background: $colorBodyBg;
} }
>.holder { >.holder {
$i: 15%; $i: 15%;
@include containerSubtle(); @include containerSubtle($colorOvrBg, $colorOvrFg);
@include border-radius($basicCr * 3); @include border-radius($basicCr * 3);
color: $colorOvrFg; color: $colorOvrFg;
top: $i; right: $i; bottom: $i; left: $i; top: $i; right: $i; bottom: $i; left: $i;
z-index: 101; z-index: 101;
>.contents { >.contents {
$m: 25px; $m: $overlayMargin;
top: $m; right: $m; bottom: $m; left: $m; top: $m; right: $m; bottom: $m; left: $m;
} }
} }
.title { .title {
@include ellipsize(); @include ellipsize();
font-size: 1.3em; font-size: 1.2em;
margin-bottom: $interiorMargin; margin-bottom: $interiorMargin;
} }
@ -69,8 +64,22 @@
//font-size: 1em; //font-size: 1em;
height: $ovrFooterH; height: $ovrFooterH;
text-align: right; text-align: right;
.btn { .s-btn {
margin-left: 10px; $bg: $colorOvrBtnBg;
&:not(.major) {
@include btnSubtle($bg, pullForward($bg, 10%), $colorOvrBtnFg, $colorOvrBtnFg);
}
font-size: 95%;
height: $ovrFooterH;
line-height: $ovrFooterH;
margin-left: $interiorMargin;
padding: 0 $interiorMargin * 3;
//&.major {
// @extend .s-btn.major;
// &:hover {
// @extend .s-btn.major:hover;
// }
//}
} }
} }
.contents.l-dialog { .contents.l-dialog {
@ -80,5 +89,10 @@
bottom: $myM; bottom: $myM;
left: $myM; left: $myM;
overflow: auto; overflow: auto;
.field.l-med {
input[type='text'] {
width: 100%;
}
}
} }
} }

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

@ -23,13 +23,13 @@ $yBarW: 60px;
$yLabelW: auto; $yLabelW: auto;
$xBarH: 32px; $xBarH: 32px;
$legendH: 20px; $legendH: 20px;
$colorHash: rgba(white, 0.3); //$colorHash: rgba(white, 0.3); // MOVED INTO CONSTANTS
$styleHash: dashed; //$styleHash: dashed; // MOVED INTO CONSTANTS
$swatchD: 8px; $swatchD: 8px;
$plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBarW); // Top, right, bottom, left $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBarW); // Top, right, bottom, left
.gl-plot { .gl-plot {
color: $colorBodyFg; color: $colorPlotFg;
font-size: 0.7rem; font-size: 0.7rem;
position: relative; position: relative;
width: 100%; width: 100%;
@ -74,13 +74,16 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
} }
.gl-plot-display-area { .gl-plot-display-area {
@if $colorPlotBg != none {
background-color: $colorPlotBg;
}
position: absolute; position: absolute;
top: nth($plotDisplayArea, 1); top: nth($plotDisplayArea, 1);
right: nth($plotDisplayArea, 2); right: nth($plotDisplayArea, 2);
bottom: nth($plotDisplayArea, 3); bottom: nth($plotDisplayArea, 3);
left: nth($plotDisplayArea, 4); left: nth($plotDisplayArea, 4);
cursor: crosshair; cursor: crosshair;
border: 1px solid $colorInteriorBorder; border: 1px solid $colorPlotAreaBorder;
} }
.gl-plot-label, .gl-plot-label,
@ -130,7 +133,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
.gl-plot-hash { .gl-plot-hash {
position: absolute; position: absolute;
border: 0 $colorHash $styleHash; border: 0 $colorPlotHash $stylePlotHash;
&.hash-v { &.hash-v {
border-right-width: 1px; border-right-width: 1px;
height: 100%; height: 100%;
@ -170,8 +173,8 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
height: auto; height: auto;
z-index: 0; z-index: 0;
&.s-limit-yellow { @include limitBg($colorLimitYellow); } &.s-limit-yellow { @include limitBg($colorLimitYellowBg); }
&.s-limit-red { @include limitBg($colorLimitRed); } &.s-limit-red { @include limitBg($colorLimitRedBg); }
} }
.l-oob-data { .l-oob-data {
@ -213,7 +216,11 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
width: $swatchD; width: $swatchD;
//margin-right: $interiorMarginSm; //margin-right: $interiorMarginSm;
} }
.title-label {} &[class*='s-limit'] {
.title-label {
//color: #fff;
}
}
} }
} }
@ -221,7 +228,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
.plot-legend-item { .plot-legend-item {
//@include test(); //@include test();
@include border-radius($smallCr); @include border-radius($smallCr);
color: #fff; //color: #fff;
line-height: 1.5em; line-height: 1.5em;
padding: 0px $itemPadLR; padding: 0px $itemPadLR;
.plot-color-swatch { .plot-color-swatch {
@ -234,7 +241,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
.tick { .tick {
position: absolute; position: absolute;
border: 0 $colorHash solid; border: 0 $colorPlotHash solid;
&.tick-x { &.tick-x {
border-right-width: 1px; border-right-width: 1px;
height: 100%; // Assumption is that the tick will be in a holder that will set it's height; height: 100%; // Assumption is that the tick will be in a holder that will set it's height;

31
platform/commonUI/general/res/sass/search/_layout.scss
View File

@ -1,31 +0,0 @@
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
// Overrides some styling in user-environ/_layout.scss
.pane {
&.treeview.left {
.tree-holder {
// Want tree holder to start right below the search bar.
top: 60px;
}
}
}

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

@ -28,7 +28,7 @@
height: auto; height: auto;
bottom: 0; bottom: 0;
} }
//top: 23px; top: 23px;
// Align with the top of the divider bar, below create button // Align with the top of the divider bar, below create button
//margin-top: 10px; // CH comment out //margin-top: 10px; // CH comment out
@ -39,26 +39,20 @@
$iconWidth: 20px; $iconWidth: 20px;
$leftMargin: 6px; $leftMargin: 6px;
$rightPadding: 5px; $rightPadding: 5px;
@include webkitVal(display, flex);
//padding-right: $rightPadding; //display: flex;
//@include test(); @include webkitProp(flex-direction, column);
display: flex; //block; //flex-direction: column;
flex-direction: column;
height: 100%; height: 100%;
.search-bar { .search-bar {
//$heightAdjust: 4px;
$textInputHeight: 19px; // This is equal to the default value, 19px $textInputHeight: 19px; // This is equal to the default value, 19px
$iconEdgeM: 4px; $iconEdgeM: 4px;
$iconD: $treeSearchInputBarH - ($iconEdgeM*2); $iconD: $treeSearchInputBarH - ($iconEdgeM*2);
font-size: 0.8em; font-size: 0.8em;
max-width: 250px;
//order: 1;
position: relative; position: relative;
width: 100%; width: 100%;
//height: $textInputHeight;
//margin-top: $heightAdjust;
.search-input, .search-input,
.search-icon { .search-icon {
} }
@ -75,7 +69,7 @@
.menu-icon { .menu-icon {
//@include test(#008800); //@include test(#008800);
@include box-sizing(border-box); @include box-sizing(border-box);
color: $colorItemFg; color: $colorInputIcon;
height: $iconD; width: $iconD; height: $iconD; width: $iconD;
line-height: $iconD; line-height: $iconD;
position: absolute; position: absolute;
@ -86,7 +80,7 @@
.clear-icon, .clear-icon,
.menu-icon { .menu-icon {
cursor: pointer; cursor: pointer;
transition: color .25s; @include transition(color, .25s);
} }
@ -103,7 +97,7 @@
} }
.search-icon { .search-icon {
color: $colorItemFg; //color: $colorItemFg;
left: $interiorMarginSm; left: $interiorMarginSm;
transition: visibility .15s, opacity .15s, color .2s; transition: visibility .15s, opacity .15s, color .2s;
pointer-events: none; pointer-events: none;
@ -123,7 +117,7 @@
// Make icon lighten when hovering over search bar // Make icon lighten when hovering over search bar
.search-input:hover + div.search-icon { .search-input:hover + div.search-icon {
color: lighten($colorItemFg, 20%); color: pullForward($colorInputIcon, 10%);
} }
.clear-icon { .clear-icon {
@ -141,7 +135,7 @@
} }
&:hover { &:hover {
color: lighten($colorItemFg, 20%); color: pullForward($colorInputIcon, 10%);
} }
} }
@ -152,7 +146,7 @@
text-align: right; text-align: right;
&:hover { &:hover {
color: lighten($colorItemFg, 20%); color: pullForward($colorInputIcon, 10%);
} }
} }
@ -197,7 +191,8 @@
.clear-filters-icon { .clear-filters-icon {
opacity: 0.4; color: $colorInputIcon;
opacity: 1;
font-size: 0.8em; font-size: 0.8em;
position: absolute; position: absolute;
left: 1px; left: 1px;
@ -230,86 +225,6 @@
max-height: 100%; max-height: 100%;
position: relative; position: relative;
.results {
.search-result-item {
// Include transitions (for the highlights)
@include single-transition(background-color, 0.25s);
// Space the results from each other
margin-bottom: 2px;
// Make the highlights the right color and shape.
// Attempting to match the style in the tree, but
// while having these be compact.
border-radius: 2px;
padding-top: 4px;
padding-bottom: 2px;
.label {
// Give some padding away from the left side
margin-left: $leftMargin;
.title-label {
display: inline-block;
position: absolute;
// Give some padding away from the left side
left: $leftMargin + 3px + $iconWidth;
// and the right side
right: $rightPadding;
// Size and position the text
font-size: .8em;
line-height: 17px;
// Hide overflow text
width: auto;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
// Change styling when it's selected
&.selected {
$c: #fff;
background: $colorKeySelectedBg;
color: $c;
.view-control {
color: $colorItemTreeIcon;
}
.label .type-icon {
color: #fff;
}
}
.label .type-icon .l-icon-link {
// Hide links for now. See GitHub issue #84.
display: none;
@include txtShdwSubtle(1);
z-index: 2;
@include ancillaryIcon(8px, $colorIconLink);
margin-left: -25px;
}
// Change styling when it's being hovered over
&:not(.selected) {
&:hover {
background: lighten($colorBodyBg, 5%);
color: lighten($colorBodyFg, 20%);
.context-trigger {
display: block;
}
.icon {
color: $colorItemTreeIconHover;
}
}
}
}
}
.load-icon { .load-icon {
position: relative; position: relative;
&.loading { &.loading {

22
platform/commonUI/general/res/sass/themes/_theme-espresso.scss
View File

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

31
platform/commonUI/general/res/sass/tree.scss
View File

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

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

@ -22,28 +22,41 @@
ul.tree { ul.tree {
@include menuUlReset(); @include menuUlReset();
@include user-select(none);
li { li {
display: block; display: block;
position: relative; position: relative;
span.tree-item { }
ul.tree {
margin-left: $treeVCW + $interiorMargin;
}
}
.tree-item,
.search-result-item {
$runningItemW: 0; $runningItemW: 0;
@include box-sizing(border-box);
@include border-radius($basicCr); @include border-radius($basicCr);
@include single-transition(background-color, 0.25s); @include single-transition(background-color, 0.25s);
display: block; display: block;
font-size: 0.8em; font-size: 0.8rem;
height: $menuLineH; height: $menuLineH;
line-height: $menuLineH; line-height: $menuLineH;
margin-bottom: $interiorMarginSm; margin-bottom: $interiorMarginSm;
position: relative; position: relative;
.view-control { .view-control {
color: $colorItemTreeVC;
display: inline-block; display: inline-block;
margin-left: $interiorMargin; margin-left: $interiorMargin;
font-size: 0.75em; font-size: 0.75em;
width: $treeVCW; width: $treeVCW;
$runningItemW: $interiorMargin + $treeVCW; $runningItemW: $interiorMargin + $treeVCW;
// NOTE: [Mobile] Removed Hover on Mobile
@include desktop {
&:hover { &:hover {
color: $colorItemTreeVCHover; color: $colorItemTreeVCHover !important;
}
} }
} }
@ -52,19 +65,25 @@ ul.tree {
// @include test(orange); // @include test(orange);
@include absPosDefault(); @include absPosDefault();
//left: $runningItemW + $interiorMargin; // Adding pad to left to make room for link icon //left: $runningItemW + $interiorMargin; // Adding pad to left to make room for link icon
left: $runningItemW; line-height: $menuLineH;
//left: $runningItemW;
.type-icon { .type-icon {
@include absPosDefault(0, false); //@include absPosDefault(0, false);
@include txtShdwSubtle(0.6); $d: $treeTypeIconH; // 16px is crisp size
@include txtShdwSubtle($shdwItemTreeIcon);
font-size: $d;
color: $colorItemTreeIcon; color: $colorItemTreeIcon;
left: $interiorMargin; left: $interiorMargin;
right: auto; width: 1em; position: absolute;
@include verticalCenterBlock($menuLineHPx, $d);
line-height: 100%;
right: auto; width: $d;
.icon { .icon {
&.l-icon-link, &.l-icon-link,
&.l-icon-alert { &.l-icon-alert {
@include txtShdwSubtle(1); //@include txtShdw($shdwItemTreeIcon);
position: absolute; position: absolute;
z-index: 2; z-index: 2;
} }
@ -78,8 +97,7 @@ ul.tree {
$d: 8px; $d: 8px;
@include ancillaryIcon($d, $colorIconLink); @include ancillaryIcon($d, $colorIconLink);
left: -3px; left: -3px;
bottom: 5px; bottom: 0px;
} }
} }
} }
@ -108,29 +126,31 @@ ul.tree {
} }
&.selected { &.selected {
$c: #fff; background: $colorItemTreeSelectedBg;
background: $colorKeySelectedBg; color: $colorItemTreeSelectedFg;
color: $c;
.view-control { .view-control {
color: $colorItemTreeIcon; color: $colorItemTreeSelectedVC;
} }
.label .type-icon { .label .type-icon {
color: #fff; //$colorItemTreeIconHover; color: $colorItemTreeSelectedFg; //$colorItemTreeIconHover;
} }
} }
&:not(.selected) { &:not(.selected) {
// NOTE: [Mobile] Removed Hover on Mobile
@include desktop {
&:hover { &:hover {
background: lighten($colorBodyBg, 5%); background: rgba($colorBodyFg, 0.1); //lighten($colorBodyBg, 5%);
color: lighten($colorBodyFg, 20%); color: pullForward($colorBodyFg, 20%);
.context-trigger { //.context-trigger {
display: block; // display: block;
} //}
.icon { .icon {
color: $colorItemTreeIconHover; color: $colorItemTreeIconHover;
} }
} }
} }
}
&:not(.loading) { &:not(.loading) {
cursor: pointer; cursor: pointer;
@ -149,9 +169,9 @@ ul.tree {
} }
} }
} }
}
ul.tree { .tree-item {
margin-left: $treeVCW + $interiorMargin; .label {
left: $interiorMargin + $treeVCW;
} }
} }

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

@ -54,7 +54,7 @@
.status.block { .status.block {
//display: inline-block; //display: inline-block;
display: inline; // New status bar design. Inline to support ellipsis overflow display: inline; // New status bar design. Inline to support ellipsis overflow
margin-right: $interiorMargin * 2; margin-right: $interiorMarginLg;
.status-indicator { .status-indicator {
//@include border-radius($controlCr * 0.9); //@include border-radius($controlCr * 0.9);
//@include box-shadow(inset rgba(black, 0.5) 0 0 3px); //@include box-shadow(inset rgba(black, 0.5) 0 0 3px);

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

@ -20,25 +20,23 @@
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
.frame { .frame {
$ohH: 20px; $ohH: $btnFrameH;
$bc: $colorInteriorBorder; $bc: $colorInteriorBorder;
&.child-frame.panel { &.child-frame.panel {
background: $colorBodyBg; background: $colorBodyBg;
border: 1px solid $bc; border: 1px solid $bc;
&:hover { &:hover {
border-color: lighten($bc, 10%); border-color: lighten($bc, 10%);
//z-index: 2;
}
.contents {
// overflow: hidden;
} }
} }
>.object-header.abs { >.object-header.abs {
//@include test(red);
font-size: 0.75em; font-size: 0.75em;
height: $ohH; height: $ohH;
line-height: $ohH;
} }
>.object-holder.abs { >.object-holder.abs {
top: $ohH + $interiorMarginSm; top: $ohH + $interiorMargin;
} }
.contents { .contents {
$myM: $interiorMargin; $myM: $interiorMargin;
@ -48,21 +46,38 @@
left: $myM; left: $myM;
} }
&.frame-template { &.frame-template {
.s-btn,
.s-menu {
height: $ohH;
line-height: $ohH;
padding: 0 $interiorMargin;
> span {
font-size: 0.65rem;
}
}
.s-menu:after {
font-size: 8px;
}
.view-switcher {
z-index: 10;
}
// Hide the view switcher by default when it's in an element that's in a frame context // 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 // Frame template is used because we need to target the lowest nested frame
@include desktop {
.view-switcher { .view-switcher {
opacity: 0; opacity: 0;
z-index: 10;
} }
&:hover .view-switcher { &:hover .view-switcher {
// Show the view switcher on frame hover // Show the view switcher on frame hover
//display: inline-block !important;
opacity: 1; opacity: 1;
} }
} }
}
.view-switcher { .view-switcher {
// Hide the name when the view switcher is in a frame context // Hide the name when the view switcher is in a frame context
.name { .title-label {
display: none; display: none;
} }
} }

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

@ -70,21 +70,28 @@
&.abs { &.abs {
text-wrap: none; text-wrap: none;
white-space: nowrap; white-space: nowrap;
}
&.left, &.left,
.left { .left {
width: 45% !important; width: 45%;
right: auto !important; right: auto;
} }
&.right, &.right,
.right { .right {
width: 45% !important; width: 45%;
left: auto !important; left: auto;
text-align: right; text-align: right;
.icon.major { .icon.major {
margin-left: $interiorMargin * 3; margin-left: $interiorMargin * 3;
} }
} }
.l-flex,
&.l-flex {
.left,
.right {
width: auto;
}
}
}
} }
.user-environ { .user-environ {
@ -118,7 +125,7 @@
} }
} }
.bottom-bar { .ue-bottom-bar {
//@include absPosDefault($bodyMargin); //@include absPosDefault($bodyMargin);
@include absPosDefault(0);// New status bar design @include absPosDefault(0);// New status bar design
top: auto; top: auto;
@ -200,7 +207,8 @@
.split-layout { .split-layout {
.split-pane-component.pane.left { .split-pane-component.pane.left {
min-width: 150px; min-width: 150px;
max-width: 50%; max-width: 800px;
width: $ueBrowseLeftPaneW;
} }
} }
} }
@ -208,16 +216,17 @@
.edit-mode { .edit-mode {
.split-layout { .split-layout {
.split-pane-component.pane.right { .split-pane-component.pane.right {
min-width: 150px; width: 15%;
max-width: 50%; .pane.bottom {
.split-pane-component.pane.bottom {
min-height: 50px; min-height: 50px;
max-height: 80%; height: 30%;
} }
} }
} }
} }
.pane { .pane {
position: absolute; position: absolute;
&.treeview.left { &.treeview.left {
@ -243,6 +252,12 @@
.right.abs { .right.abs {
top: auto; top: auto;
} }
//.left.abs {
// @include tmpBorder(green);
//}
//.right.abs {
// @include tmpBorder(red);
//}
} }
.object-holder { .object-holder {
top: $ueTopBarH + $interiorMarginLg; top: $ueTopBarH + $interiorMarginLg;
@ -267,6 +282,7 @@
&.vertical { &.vertical {
// Slides left and right // Slides left and right
>.pane { >.pane {
// @include test();
margin-left: $interiorMargin; margin-left: $interiorMargin;
>.holder { >.holder {
left: 0; left: 0;
@ -283,6 +299,52 @@
} }
} }
.object-browse-bar .s-btn,
.top-bar .buttons-main .s-btn,
.top-bar .s-menu,
.tool-bar .s-btn,
.tool-bar .s-menu {
$h: $btnToolbarH;
height: $h;
line-height: $h;
vertical-align: top;
}
.object-browse-bar,
.top-bar {
.view-switcher {
margin-right: $interiorMarginLg * 2;
}
}
.object-browse-bar {
//@include test(blue);
@include absPosDefault(0, visible);
@include box-sizing(border-box);
height: $ueTopBarH;
line-height: $ueTopBarH;
white-space: nowrap;
.left {
padding-right: $interiorMarginLg * 2;
.l-back {
display: inline-block;
float: left;
margin-right: $interiorMarginLg;
}
}
}
.l-flex {
@include webkitVal('display', 'flex');
@include webkitProp('flex-flow', 'row nowrap');
.left {
//@include test(red);
@include webkitProp(flex, '1 1 0');
padding-right: $interiorMarginLg;
}
}
.vscroll { .vscroll {
overflow-y: auto; overflow-y: auto;
} }

19
platform/commonUI/general/res/sass/user-environ/_top-bar.scss
View File

@ -20,33 +20,26 @@
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
.top-bar { .top-bar {
// $h: $ueTopBarH - 5px;
// background: rgba(#ff0000, 0.2);
// line-height: $ueTopBarBtnH;
&.browse, &.browse,
&.edit { &.edit {
border-bottom: 1px solid $colorInteriorBorder; border-bottom: 1px solid $colorInteriorBorder;
top: $bodyMargin; right: $bodyMargin; bottom: auto; left: $bodyMargin; top: $bodyMargin; right: $bodyMargin; bottom: auto; left: $bodyMargin;
height: $ueTopBarEditH; height: $ueTopBarEditH;
line-height: $ueTopBarH;
} }
.action { /* .title {
}
.title {
color: #fff; color: #fff;
// font-weight: bold; }*/
}
.buttons-main { .buttons-main {
font-size: 0.8em; font-size: 0.8em;
left: auto; left: auto;
text-align: right; text-align: right;
// width: 200px; // width: 200px;
.btn { // .btn {
margin-left: $interiorMargin; // margin-left: $interiorMargin;
} // }
} }
} }

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

@ -19,7 +19,7 @@
this source code distribution or the Licensing information page available this source code distribution or the Licensing information page available
at runtime from the About dialog for additional information. at runtime from the About dialog for additional information.
--> -->
<div class='abs bottom-bar ue-bottom-bar' ng-controller="BottomBarController as bar"> <div class='abs bottom-bar ue-bottom-bar mobile-disable-select' ng-controller="BottomBarController as bar">
<div id='status' class='status-holder'> <div id='status' class='status-holder'>
<mct-include ng-repeat="indicator in bar.getIndicators()" <mct-include ng-repeat="indicator in bar.getIndicators()"
ng-model="indicator.ngModel" ng-model="indicator.ngModel"

2
platform/commonUI/general/res/templates/controls/action-button.html
View File

@ -19,7 +19,7 @@
this source code distribution or the Licensing information page available this source code distribution or the Licensing information page available
at runtime from the About dialog for additional information. at runtime from the About dialog for additional information.
--> -->
<a class="btn s-btn s-icon-btn s-very-subtle key-{{parameters.action.getMetadata().key}}" <a class="s-btn key-{{parameters.action.getMetadata().key}}"
ng-class="{ labeled: parameters.labeled }" ng-class="{ labeled: parameters.labeled }"
title="{{parameters.action.getMetadata().description}}" title="{{parameters.action.getMetadata().description}}"
ng-click="parameters.action.perform()"> ng-click="parameters.action.perform()">

13
platform/commonUI/general/res/templates/controls/action-group.html
View File

@ -20,17 +20,16 @@
at runtime from the About dialog for additional information. at runtime from the About dialog for additional information.
--> -->
<span ng-controller="ActionGroupController"> <span ng-controller="ActionGroupController">
<span ng-repeat="action in ungrouped"> <span ng-repeat="action in ungrouped">
<mct-include key="'action-button'" parameters="{ action: action }"> <mct-include key="'action-button'" parameters="{ action: action }"></mct-include>
</mct-include>
</span> </span>
<span class="l-btn-set" ng-repeat="group in groups">
<span class="btn-set" ng-repeat="group in groups">
<span ng-repeat="action in group"> <span ng-repeat="action in group">
<mct-include key="'action-button'" parameters="{ action: action }"> <mct-include key="'action-button'"
parameters="{ action: action }"
ng-class="{ first:$index == 0, last:$index == group.length - 1 }"
>
</mct-include> </mct-include>
</span> </span>
</span> </span>
</span> </span>

4
platform/commonUI/general/res/templates/controls/selector.html
View File

@ -43,11 +43,11 @@
</div> </div>
<div class='col col-2'> <div class='col col-2'>
<div class='btn-holder valign-mid btns-add-remove'> <div class='btn-holder valign-mid btns-add-remove'>
<a class='btn major' <a class='s-btn major'
ng-click="selector.select(selector.treeModel.selectedObject)"> ng-click="selector.select(selector.treeModel.selectedObject)">
<span class='ui-symbol'>&gt;</span> <span class='ui-symbol'>&gt;</span>
</a> </a>
<a class='btn major' <a class='s-btn major'
ng-click="selector.deselect(selector.listModel.selectedObject)"> ng-click="selector.deselect(selector.listModel.selectedObject)">
<span class='ui-symbol'>&lt;</span> <span class='ui-symbol'>&lt;</span>
</a> </a>

8
platform/commonUI/general/res/templates/controls/switcher.html
View File

@ -21,7 +21,7 @@
--> -->
<span ng-controller="ViewSwitcherController"> <span ng-controller="ViewSwitcherController">
<div <div
class="view-switcher menu-element btn btn-menu dropdown click-invoke" class="view-switcher menu-element s-menu"
ng-if="view.length > 1" ng-if="view.length > 1"
ng-controller="ClickAwayController as toggle" ng-controller="ClickAwayController as toggle"
> >
@ -33,11 +33,9 @@
></span> ></span>
<span class="ui-symbol icon type-icon">{{ngModel.selected.glyph}}</span> <span class="ui-symbol icon type-icon">{{ngModel.selected.glyph}}</span>
<span class="name">{{ngModel.selected.name}}</span> <span class="title-label">{{ngModel.selected.name}}</span>
<span class='ui-symbol invoke-menu'>v</span>
<div class="menu" ng-show="toggle.isActive()">
<div class="menu dropdown" ng-show="toggle.isActive()">
<ul> <ul>
<li ng-repeat="option in view" <li ng-repeat="option in view"
ng-click="ngModel.selected = option; toggle.setState(false)"> ng-click="ngModel.selected = option; toggle.setState(false)">

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

@ -22,7 +22,8 @@
<div class='status block' <div class='status block'
title="{{ngModel.getDescription()}}" title="{{ngModel.getDescription()}}"
ng-click='ngModel.configure()' ng-click='ngModel.configure()'
ng-class='ngModel.getClass()'> ng-class='ngModel.getClass()'
ng-show="ngModel.getText().length > 0">
<span class="ui-symbol status-indicator" <span class="ui-symbol status-indicator"
ng-class='ngModel.getGlyphClass()'> ng-class='ngModel.getGlyphClass()'>
{{ngModel.getGlyph()}} {{ngModel.getGlyph()}}

4
platform/commonUI/general/res/templates/menu/context-menu.html
View File

@ -19,8 +19,8 @@
this source code distribution or the Licensing information page available this source code distribution or the Licensing information page available
at runtime from the About dialog for additional information. at runtime from the About dialog for additional information.
--> -->
<div class="menu-element context-menu-wrapper" ng-controller="ContextMenuController"> <div class="menu-element context-menu-wrapper mobile-disable-select" ng-controller="ContextMenuController">
<div class="menu context-menu dropdown"> <div class="menu context-menu">
<ul> <ul>
<li ng-repeat="menuAction in menuActions" <li ng-repeat="menuAction in menuActions"

1
platform/commonUI/general/res/templates/subtree.html
View File

@ -29,6 +29,7 @@
<li ng-repeat="child in composition"> <li ng-repeat="child in composition">
<mct-representation key="'tree-node'" <mct-representation key="'tree-node'"
mct-object="child" mct-object="child"
parameters="parameters"
ng-model="ngModel"> ng-model="ngModel">
</mct-representation> </mct-representation>
</li> </li>

27
platform/commonUI/general/res/templates/tree-node.html
View File

@ -26,19 +26,41 @@
ng-class="{selected: treeNode.isSelected()}" ng-class="{selected: treeNode.isSelected()}"
> >
<span <span
mct-device="desktop"
class='ui-symbol view-control' class='ui-symbol view-control'
ng-click="toggle.toggle(); treeNode.trackExpansion()" ng-click="toggle.toggle(); treeNode.trackExpansion()"
ng-if="model.composition !== undefined" ng-if="model.composition !== undefined"
> >
{{toggle.isActive() ? "v" : ">"}} {{toggle.isActive() ? "v" : ">"}}
</span> </span>
<mct-representation <mct-representation
mct-device="desktop"
class="mobile-hide"
key="'label'" key="'label'"
mct-object="domainObject" mct-object="domainObject"
ng-model="ngModel" ng-click="treeNode.select()"
ng-click="ngModel.selectedObject = domainObject"
> >
</mct-representation> </mct-representation>
<mct-representation
mct-device="mobile"
class="desktop-hide"
key="'label'"
mct-object="domainObject"
ng-click="(model.composition === undefined) && treeNode.select();
toggle.toggle();
treeNode.trackExpansion();"
>
</mct-representation>
<span
mct-device="mobile"
class='ui-symbol view-control'
ng-model="ngModel"
ng-click="treeNode.select()"
>
}
</span>
</span> </span>
<span <span
class="tree-item-subtree" class="tree-item-subtree"
@ -48,6 +70,7 @@
<mct-representation key="'subtree'" <mct-representation key="'subtree'"
ng-model="ngModel" ng-model="ngModel"
parameters="parameters"
mct-object="treeNode.hasBeenExpanded() && domainObject"> mct-object="treeNode.hasBeenExpanded() && domainObject">
</mct-representation> </mct-representation>

3
platform/commonUI/general/res/templates/tree.html
View File

@ -23,7 +23,8 @@
<li> <li>
<mct-representation key="'tree-node'" <mct-representation key="'tree-node'"
mct-object="domainObject" mct-object="domainObject"
ng-model="ngModel"> ng-model="ngModel"
parameters="parameters">
</mct-representation> </mct-representation>
</li> </li>
</ul> </ul>

30
platform/commonUI/general/src/controllers/TreeNodeController.js
View File

@ -48,12 +48,23 @@ define(
* node expansion when this tree node's _subtree_ will contain * node expansion when this tree node's _subtree_ will contain
* the navigated object (recursively, this becomes an * the navigated object (recursively, this becomes an
* expand-to-show-navigated-object behavior.) * expand-to-show-navigated-object behavior.)
*
* Finally, if a `callback` property is passed in through the
* `parameters` attribute of the `tree-node`, that callback
* will be invoked whenever a user clicks in a manner which
* would result in a selection. This callback is invoked
* even if the selection does not change (if you are only
* interested in changes, watch the `selectedObject` property
* of the object passed in `ng-model` instead.)
*
* @memberof platform/commonUI/general * @memberof platform/commonUI/general
* @constructor * @constructor
*/ */
function TreeNodeController($scope, $timeout) { function TreeNodeController($scope, $timeout) {
var self = this, var self = this,
selectedObject = ($scope.ngModel || {}).selectedObject; selectedObject = ($scope.ngModel || {}).selectedObject,
isSelected = false,
hasBeenExpanded = false;
// Look up the id for a domain object. A convenience // Look up the id for a domain object. A convenience
// for mapping; additionally does some undefined-checking. // for mapping; additionally does some undefined-checking.
@ -131,12 +142,29 @@ define(
this.isSelectedFlag = false; this.isSelectedFlag = false;
this.hasBeenExpandedFlag = false; this.hasBeenExpandedFlag = false;
this.$timeout = $timeout; this.$timeout = $timeout;
this.$scope = $scope;
// Listen for changes which will effect display parameters // Listen for changes which will effect display parameters
$scope.$watch("ngModel.selectedObject", setSelection); $scope.$watch("ngModel.selectedObject", setSelection);
$scope.$watch("domainObject", checkSelection); $scope.$watch("domainObject", checkSelection);
} }
/**
* Select the domain object represented by this node in the tree.
* This will both update the `selectedObject` property in
* the object passed in via `ng-model`, and will fire any `callback`
* passed in via `parameters`.
*/
TreeNodeController.prototype.select = function () {
if (this.$scope.ngModel) {
this.$scope.ngModel.selectedObject =
this.$scope.domainObject;
}
if ((this.$scope.parameters || {}).callback) {
this.$scope.parameters.callback(this.$scope.domainObject);
}
};
/** /**
* This method should be called when a node is expanded * This method should be called when a node is expanded
* to record that this has occurred, to support one-time * to record that this has occurred, to support one-time

3
platform/commonUI/general/src/directives/MCTResize.js
View File

@ -74,6 +74,7 @@ define(
lastBounds.width !== bounds.width || lastBounds.width !== bounds.width ||
lastBounds.height !== bounds.height) { lastBounds.height !== bounds.height) {
scope.$eval(attrs.mctResize, { bounds: bounds }); scope.$eval(attrs.mctResize, { bounds: bounds });
scope.$apply(); // Trigger a digest
lastBounds = bounds; lastBounds = bounds;
} }
} }
@ -86,7 +87,7 @@ define(
height: element[0].offsetHeight height: element[0].offsetHeight
}); });
if (active) { if (active) {
$timeout(onInterval, currentInterval()); $timeout(onInterval, currentInterval(), false);
} }
} }

26
platform/commonUI/general/test/controllers/TreeNodeControllerSpec.js
View File

@ -19,7 +19,7 @@
* this source code distribution or the Licensing information page available * this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
/*global define,Promise,describe,it,expect,beforeEach,waitsFor,jasmine*/ /*global define,describe,it,expect,beforeEach,jasmine*/
define( define(
["../../src/controllers/TreeNodeController"], ["../../src/controllers/TreeNodeController"],
@ -29,6 +29,7 @@ define(
describe("The tree node controller", function () { describe("The tree node controller", function () {
var mockScope, var mockScope,
mockTimeout, mockTimeout,
mockDomainObject,
controller; controller;
function TestObject(id, context) { function TestObject(id, context) {
@ -41,8 +42,13 @@ define(
} }
beforeEach(function () { beforeEach(function () {
mockScope = jasmine.createSpyObj("$scope", ["$watch", "$on"]); mockScope = jasmine.createSpyObj("$scope", ["$watch", "$on", "$emit"]);
mockTimeout = jasmine.createSpy("$timeout"); mockTimeout = jasmine.createSpy("$timeout");
mockDomainObject = jasmine.createSpyObj(
"domainObject",
[ "getId", "getCapability", "getModel", "useCapability" ]
);
controller = new TreeNodeController(mockScope, mockTimeout); controller = new TreeNodeController(mockScope, mockTimeout);
}); });
@ -183,6 +189,22 @@ define(
expect(controller.isSelected()).toBeFalsy(); expect(controller.isSelected()).toBeFalsy();
}); });
it("exposes selected objects in scope", function () {
mockScope.domainObject = mockDomainObject;
mockScope.ngModel = {};
controller.select();
expect(mockScope.ngModel.selectedObject)
.toEqual(mockDomainObject);
});
it("invokes optional callbacks upon selection", function () {
mockScope.parameters =
{ callback: jasmine.createSpy('callback') };
controller.select();
expect(mockScope.parameters.callback).toHaveBeenCalled();
});
}); });
} }
); );

34
platform/commonUI/general/test/directives/MCTResizeSpec.js
View File

@ -35,7 +35,7 @@ define(
beforeEach(function () { beforeEach(function () {
mockTimeout = jasmine.createSpy("$timeout"); mockTimeout = jasmine.createSpy("$timeout");
mockScope = jasmine.createSpyObj("$scope", ["$eval", "$on"]); mockScope = jasmine.createSpyObj("$scope", ["$eval", "$on", "$apply"]);
testElement = { offsetWidth: 100, offsetHeight: 200 }; testElement = { offsetWidth: 100, offsetHeight: 200 };
testAttrs = { mctResize: "some-expr" }; testAttrs = { mctResize: "some-expr" };
@ -52,7 +52,8 @@ define(
mctResize.link(mockScope, [testElement], testAttrs); mctResize.link(mockScope, [testElement], testAttrs);
expect(mockTimeout).toHaveBeenCalledWith( expect(mockTimeout).toHaveBeenCalledWith(
jasmine.any(Function), jasmine.any(Function),
jasmine.any(Number) jasmine.any(Number),
false
); );
expect(mockScope.$eval).toHaveBeenCalledWith( expect(mockScope.$eval).toHaveBeenCalledWith(
testAttrs.mctResize, testAttrs.mctResize,
@ -110,6 +111,35 @@ define(
expect(mockTimeout.calls.length).toEqual(2); expect(mockTimeout.calls.length).toEqual(2);
}); });
it("triggers a digest cycle when size changes", function () {
var applyCount;
mctResize.link(mockScope, [testElement], testAttrs);
applyCount = mockScope.$apply.calls.length;
// Change the element's apparent size
testElement.offsetWidth = 300;
testElement.offsetHeight = 350;
// Fire the timeout
mockTimeout.mostRecentCall.args[0]();
// No more apply calls
expect(mockScope.$apply.calls.length)
.toBeGreaterThan(applyCount);
});
it("does not trigger a digest cycle when size does not change", function () {
var applyCount;
mctResize.link(mockScope, [testElement], testAttrs);
applyCount = mockScope.$apply.calls.length;
// Fire the timeout
mockTimeout.mostRecentCall.args[0]();
// No more apply calls
expect(mockScope.$apply.calls.length).toEqual(applyCount);
});
}); });
} }
); );

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