[Plot] Only highlight legend if multiple

Legend items will only be highlighted when
selected for inspection if there are more
than one legend item in the plot.

.gitignore

@@ -3,13 +3,8 @@
 *.gzip
 *.tgz
 *.DS_Store
-
-*.sass-cache
-*COMPILE.css
-
-# Intellij project configuration files
 *.idea
-*.iml
+*.sass-cache
 
 # External dependencies
 

CONTRIBUTING.md

@@ -238,9 +238,6 @@ Commit messages should:
 * Contain a reference to a relevant issue number in the body of the commit.
   * This is important for traceability; while branch names also provide this,
     you cannot tell from looking at a commit what branch it was authored on.
-  * This may be omitted if the relevant issue is otherwise obvious from the
-    commit history (that is, if using `git log` from the relevant commit
-    directly leads to a similar issue reference) to minimize clutter.
 * Describe the change that was made, and any useful rationale therefore.
   * Comments in code should explain what things do, commit messages describe
     how they came to be done that way.

bundles.json

@@ -8,8 +8,6 @@
     "platform/commonUI/dialog",
     "platform/commonUI/general",
     "platform/commonUI/inspect",
-    "platform/commonUI/mobile",
-    "platform/commonUI/themes/espresso",
     "platform/containment",
     "platform/execution",
     "platform/telemetry",
@@ -20,14 +18,13 @@
     "platform/features/scrolling",
     "platform/features/events",
     "platform/forms",
-    "platform/identity",
-    "platform/persistence/local",
     "platform/persistence/queue",
     "platform/policy",
     "platform/entanglement",
     "platform/search",
 
     "example/imagery",
+    "example/persistence",
     "example/eventGenerator",
     "example/generator"
 ]

circle.yml

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

example/identity/bundle.json

@@ -1,12 +0,0 @@
-{
-    "extensions": {
-        "components": [
-            {
-                "implementation": "ExampleIdentityService.js",
-                "provides": "identityService",
-                "type": "provider",
-                "depends": [ "dialogService" ]
-            }
-        ]
-    }
-}

example/identity/src/ExampleIdentityService.js

@@ -1,75 +0,0 @@
-/*****************************************************************************
- * Open MCT Web, Copyright (c) 2014-2015, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT Web is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT Web includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-/*global define*/
-
-define(
-    function () {
-        "use strict";
-
-        var DEFAULT_IDENTITY = { key: "user", name: "Example User" },
-            DIALOG_STRUCTURE = {
-                name: "Identify Yourself",
-                sections: [{ rows: [
-                    {
-                        name: "User ID",
-                        control: "textfield",
-                        key: "key",
-                        required: true
-                    },
-                    {
-                        name: "Human name",
-                        control: "textfield",
-                        key: "name",
-                        required: true
-                    }
-                ]}]
-            };
-
-
-        /**
-         * Example implementation of an identity service. This prompts the
-         * user to enter a name and user ID; in a more realistic
-         * implementation, this would be read from a server, possibly
-         * prompting for a user name and password (or similar) as
-         * appropriate.
-         *
-         * @implements {IdentityService}
-         * @memberof platform/identity
-         */
-        function ExampleIdentityProvider(dialogService) {
-            // Handle rejected dialog messages by treating the
-            // current user as undefined.
-            function echo(v) { return v; }
-            function giveUndefined() { return undefined; }
-
-            this.userPromise =
-                dialogService.getUserInput(DIALOG_STRUCTURE, DEFAULT_IDENTITY)
-                    .then(echo, giveUndefined);
-        }
-
-        ExampleIdentityProvider.prototype.getUser = function () {
-            return this.userPromise;
-        };
-
-        return ExampleIdentityProvider;
-    }
-);

example/localstorage/bundle.json

@@ -13,11 +13,6 @@
                 "key": "PERSISTENCE_SPACE",
                 "value": "mct"
             }
-        ],
-        "indicators": [
-            {
-                "implementation": "LocalStorageIndicator.js"
-            }
         ]
     }
-}
+}

example/localstorage/src/LocalStoragePersistenceProvider.js

@@ -0,0 +1,86 @@
+/*****************************************************************************
+ * 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,localStorage*/
+/**
+ * Stubbed implementation of a persistence provider,
+ * to permit objects to be created, saved, etc.
+ */
+define(
+    [],
+    function () {
+        'use strict';
+
+        function BrowserPersistenceProvider($q, SPACE) {
+            var spaces = SPACE ? [SPACE] : [],
+                promises = {
+                    as: function (value) {
+                        return $q.when(value);
+                    }
+                },
+                provider;
+
+            function setValue(key, value) {
+                localStorage[key] = JSON.stringify(value);
+            }
+
+            function getValue(key) {
+                if (localStorage[key]) {
+                    return JSON.parse(localStorage[key]);
+                }
+                return {};
+            }
+
+            provider = {
+                listSpaces: function () {
+                    return promises.as(spaces);
+                },
+                listObjects: function (space) {
+                    var space_obj = getValue(space);
+                    return promises.as(Object.keys(space_obj));
+                },
+                createObject: function (space, key, value) {
+                    var space_obj = getValue(space);
+                    space_obj[key] = value;
+                    setValue(space, space_obj);
+                    return promises.as(true);
+                },
+                readObject: function (space, key) {
+                    var space_obj = getValue(space);
+                    return promises.as(space_obj[key]);
+                },
+                deleteObject: function (space, key, value) {
+                    var space_obj = getValue(space);
+                    delete space_obj[key];
+                    return promises.as(true);
+                }
+            };
+
+            provider.updateObject = provider.createObject;
+
+            return provider;
+
+        }
+
+        return BrowserPersistenceProvider;
+    }
+);

ideas/cli/bundle.json

@@ -1,22 +0,0 @@
-{
-    "extensions": {
-        "routes": [
-            {
-                "when": "/cli",
-                "templateUrl": "templates/cli.html"
-            }
-        ],
-        "controllers": [
-            {
-                "key": "CLIController",
-                "implementation": "CLIController.js",
-                "depends": [ "$scope", "navigationService", "objectService" ]
-            }
-        ],
-        "stylesheets": [
-            {
-                "stylesheetUrl": "stylesheets/cli.css"
-            }
-        ]
-    }
-}

ideas/cli/res/stylesheets/cli.css

@@ -1,47 +0,0 @@
-.iw-container {
-    position: absolute;
-    bottom: 30px;
-    left: 0;
-    top: 0;
-    right: 0;
-}
-
-.iw-stdin {
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    height: 30px;
-    width: calc(100% - 8px);
-    margin: 4px;
-    font-family: monospace;
-    font-size: 16px;
-}
-
-.iw-stdout {
-    position: absolute;
-    left: 6px;
-    right: 6px;
-    top: 12px;
-    bottom: 44px;
-    border: 1px #211 solid;
-    border-radius: 12px;
-    padding: 8px;
-    background: #302;
-    overflow: auto;
-    box-shadow: inset 0px 2px 8px 0px rgba(0, 0, 0, 0.5);
-}
-
-.iw-stdout span {
-    display: block;
-    font-family: monospace;
-    color: #FD9;
-    font-size: 16px;
-    margin-top: 2px;
-    margin-bottom: 2px;
-    min-height: 1em;
-    white-space: pre;
-}
-
-.iw-stdout span.iw-user-input {
-    color: gray;
-}

ideas/cli/res/templates/cli.html

@@ -1,15 +0,0 @@
-<div class="abs holder-all browse-mode" ng-controller="CLIController">
-    <div class="iw-container">
-        <div class="iw-stdout" mct-scroll-y="stdoutScroll">
-            <span ng-repeat="line in stdout track by $index"
-                  class="{{line.cssClass}}"
-                  ng-bind="line.text">
-            </span>
-        </div>
-        <form ng-submit="enter(stdin)">
-            <input type="text" class="iw-stdin" ng-model="stdin" autofocus>
-        </form>
-    </div>
-    <mct-include key="'bottombar'"></mct-include>
-</div>
-

ideas/cli/src/CLIController.js

@@ -1,177 +0,0 @@
-/*****************************************************************************
- * Open MCT Web, Copyright (c) 2014-2015, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT Web is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT Web includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-/*global define*/
-
-define(function () {
-    'use strict';
-    return function CLIController($scope, navigationService, objectService) {
-        var unlistenToMutation,
-            currentComposition = [];
-
-        function print(str, cssClass) {
-            $scope.stdout.push({
-                text: str,
-                cssClass: cssClass
-            });
-            $scope.stdoutScroll = Number.MAX_VALUE;
-        }
-
-        function pad(str, length) {
-            while (str.length < length) {
-                str += " ";
-            }
-            return str;
-        }
-
-        function summarize(domainObject) {
-            var type = domainObject.getCapability("type"),
-                typeName = type ? type.getName() : "Object",
-                location = domainObject.getCapability('location'),
-                isLink = (location && location.isLink()),
-                suffix = isLink ? " (link)" : "";
-            return "[" + typeName + "] " + domainObject.getModel().name + suffix;
-        }
-
-        function printComposition(domainObject) {
-            return domainObject.useCapability("composition").then(function (c) {
-                currentComposition = c;
-                c.forEach(function (childObject, i) {
-                    print(i + ") " + summarize(childObject));
-                });
-            });
-        }
-
-        function printObject(domainObject, callback) {
-            // Exclude the root object; nobody wants to see that
-            if (domainObject.hasCapability("context")) {
-                print(summarize(domainObject));
-            }
-            if (domainObject.hasCapability('composition')) {
-                printComposition(domainObject).then(callback);
-            } else {
-                callback();
-            }
-        }
-
-        function unlisten() {
-            if (unlistenToMutation) {
-                unlistenToMutation();
-                unlistenToMutation = undefined;
-            }
-        }
-
-        function navChange(domainObject) {
-            unlisten();
-            unlistenToMutation = domainObject.getCapability("mutation")
-                .listen(function () { printObject(domainObject); });
-            printObject(domainObject);
-        }
-
-        function findTarget(id) {
-            if (id === "this") {
-                return navigationService.getNavigation();
-            } else {
-                return currentComposition[parseInt(id, 10)];
-            }
-        }
-
-        function listActions(domainObject, index) {
-            // Don't show actions for the root
-            if (!domainObject.hasCapability('context')) {
-                return;
-            }
-
-            domainObject.getCapability('action').getActions().forEach(function (a) {
-                var metadata = a.getMetadata(),
-                    desc = metadata.description,
-                    suffix = index !== undefined ? (" " + index) : "";
-                print(pad(metadata.key + suffix, 32) + (desc || ""));
-            });
-        }
-
-        function performAction(domainObject, action) {
-            domainObject.getCapability('action').perform(action);
-        }
-
-        function handleInput(input) {
-            var parts = input.split(" "),
-                targetObject;
-
-            if (input.length === 0) {
-                targetObject = navigationService.getNavigation();
-                if (targetObject) {
-                    printObject(targetObject, function () {
-                        print("");
-                        listActions(targetObject);
-                    });
-                }
-                return;
-            } else if (parts.length === 1) {
-                if (isNaN(parseInt(parts[0], 10))) {
-                    targetObject = navigationService.getNavigation();
-                    performAction(targetObject, parts[0]);
-                    return;
-                }
-                targetObject = findTarget(parts[0]);
-                if (targetObject) {
-                    listActions(targetObject, parts[0]);
-                    return;
-                }
-            } else if (parts.length === 2) {
-                targetObject = findTarget(parts[1]);
-                if (targetObject) {
-                    performAction(targetObject, parts[0]);
-                    return;
-                }
-            }
-
-            // Any parse-able input should have returned already.
-            print("SYNTAX ERROR. READY.");
-        }
-
-        if (!navigationService.getNavigation()) {
-            objectService.getObjects(["ROOT"]).then(function (objects) {
-                navigationService.setNavigation(objects.ROOT);
-            });
-        }
-
-        navigationService.addListener(navChange);
-
-        $scope.stdout = [];
-        $scope.stdin = "";
-        $scope.stdoutScroll = 0;
-
-        $scope.enter = function (input) {
-            $scope.stdin = "";
-            print("");
-            print(input, "iw-user-input");
-            print("");
-
-            handleInput(input);
-        };
-
-        $scope.$on("$destroy", function () {
-            navigationService.removeListener(navChange);
-            unlisten();
-        });
-    };
-});

index.html

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

platform/commonUI/browse/bundle.json

@@ -16,39 +16,26 @@
             {
                 "key": "BrowseController",
                 "implementation": "BrowseController.js",
-                "depends": [
-                    "$scope",
-                    "$route",
-                    "$location",
-                    "objectService",
-                    "navigationService",
-                    "urlService"
-                ]
-            },
-            {
-                "key": "BrowseTreeController",
-                "implementation": "BrowseTreeController.js",
-                "priority": "preferred",
-                "depends": [ "$scope", "agentService" ]
+                "depends": [ "$scope", "$route", "$location", "objectService", "navigationService", "urlService" ]
             },
             {
                 "key": "BrowseObjectController",
                 "implementation": "BrowseObjectController.js",
-                "depends": [ "$scope", "$location", "$route" ]
+                "depends": [ "$scope", "$location", "$route", "$window" ]
             },
             {
                 "key": "CreateMenuController",
-                "implementation": "creation/CreateMenuController.js",
+                "implementation": "creation/CreateMenuController",
                 "depends": [ "$scope" ]
             },
             {
                 "key": "LocatorController",
-                "implementation": "creation/LocatorController.js",
-                "depends": [ "$scope", "$timeout" ]
+                "implementation": "creation/LocatorController",
+                "depends": [ "$scope" ]
             },
             {
                 "key": "MenuArrowController",
-                "implementation": "MenuArrowController.js",
+                "implementation": "MenuArrowController",
                 "depends": [ "$scope" ]
             }
         ],
@@ -58,6 +45,12 @@
                 "templateUrl": "templates/create/locator.html"
             }
         ],
+        "templates": [
+            {
+                "key": "topbar-browse",
+                "templateUrl": "templates/topbar-browse.html"
+            }
+        ],
         "representations": [
             {
                 "key": "browse-object",
@@ -89,31 +82,25 @@
                 "templateUrl": "templates/menu-arrow.html",
                 "uses": [ "action" ],
                 "gestures": [ "menu" ]
-            },
-            {
-                "key": "back-arrow",
-                "uses": [ "context" ],
-                "templateUrl": "templates/back-arrow.html"
             }
         ],
         "services": [
             {
                 "key": "navigationService",
                 "implementation": "navigation/NavigationService.js"
+            },
+            {
+                "key": "creationService",
+                "implementation": "creation/CreationService.js",
+                "depends": [ "persistenceService", "$q", "$log" ]
             }
         ],
         "actions": [
             {
                 "key": "navigate",
-                "description": "Browse to this object.",
                 "implementation": "navigation/NavigateAction.js",
                 "depends": [ "navigationService", "$q" ]
             },
-            {
-                "key": "back",
-                "implementation": "navigation/BackAction.js",
-                "description": "Navigate to the parent of this object."
-            },
             {
                 "key": "window",
                 "name": "Open In New Tab",
@@ -123,7 +110,7 @@
                 "depends": [ "urlService", "$window" ],
                 "group": "windowing",
                 "glyph": "y",
-                "priority": "preferred"
+			  	"priority": "preferred"
             },
             {
                 "key": "fullscreen",
@@ -131,7 +118,7 @@
                 "category": "view-control",
                 "group": "windowing",
                 "glyph": "z",
-                "priority": "default"
+			  	"priority": "default"
             }
         ],
         "views": [
@@ -154,13 +141,6 @@
                 "type": "provider",
                 "implementation": "creation/CreateActionProvider.js",
                 "depends": [ "typeService", "dialogService", "creationService", "policyService" ]
-            },
-            {
-                "key": "CreationService",
-                "provides": "creationService",
-                "type": "provider",
-                "implementation": "creation/CreationService.js",
-                "depends": [ "persistenceService", "now", "$q", "$log" ]
             }
         ],
         "runs": [

platform/commonUI/browse/res/templates/back-arrow.html

@@ -1,30 +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.
--->
-
-<!-- Back Arrow Icon used on mobile-->
-<a
-   class='type-icon icon ui-symbol s-back'
-   ng-show="context.getPath().length > 2"
-   ng-click="domainObject.getCapability('action').perform('back')">
-    {
-</a>
-

platform/commonUI/browse/res/templates/browse-object.html

@@ -20,31 +20,44 @@
  at runtime from the About dialog for additional information.
 -->
 <span ng-controller="BrowseObjectController">
-    <div class="object-browse-bar bar l-flex">
-        <div class="items-select left">
-            <mct-representation key="'back-arrow'"
-                                mct-object="domainObject"
-                                class="l-back"></mct-representation>
+    
+    <div class="object-browse-bar bar abs"
+         ng-click="ngModel.inspectionObjects = [domainObject]">
+        
+        <div class="pane-tabs left"
+             ng-class="{inactivePane: !ngModel.leftPane, activePane: ngModel.leftPane}"
+             ng-click="ngModel.leftPane = !ngModel.leftPane">
+        </div>
+        
+        <div class="items-select left abs">
             <mct-representation key="'object-header'" mct-object="domainObject">
             </mct-representation>
         </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-object="domainObject"
                                 ng-model="representation">
             </mct-representation>
-            <!-- Temporarily, on mobile, the action buttons are hidden-->
-            <mct-representation key="'action-group'"
-                                mct-object="domainObject"
-                                parameters="{ category: 'view-control' }"
-                                class="mobile-hide">
-            </mct-representation>
         </div>
+        
+        <div class="pane-tabs right"
+             ng-class="{inactivePane: !ngModel.rightPane, activePane: ngModel.rightPane}"
+             ng-click="ngModel.rightPane = !ngModel.rightPane">
+        </div>
+        
     </div>
 
     <div class='object-holder abs vscroll'>
         <mct-representation key="representation.selected.key"
-                            mct-object="representation.selected.key && domainObject">
+                            mct-object="representation.selected.key && domainObject"
+                            ng-model="ngModel">
         </mct-representation>
     </div>
+    
 </span>

platform/commonUI/browse/res/templates/browse.html

@@ -20,48 +20,83 @@
  at runtime from the About dialog for additional information.
 -->
 
-<div class="abs holder-all browse-mode" ng-controller="BrowseController">
-    <mct-include key="'topbar-browse'"></mct-include>
-    <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'>
-            <div class='split-pane-component treeview pane left'>
-                <div class="holder abs l-mobile">
-                    <mct-representation key="'create-button'" mct-object="navigatedObject">
-                    </mct-representation>
-                    <div class='holder search-holder abs'
-                         ng-class="{active: treeModel.search}">
-                        <mct-representation key="'search'"
-                                     mct-object="domainObject"
-                                     ng-model="treeModel">
-                        </mct-representation>
-                    </div>
-                    <div class='tree-holder abs mobile-tree-holder'
-                         ng-hide="treeModel.search">
-                        <mct-representation key="'tree'"
-                                            mct-object="domainObject"
-                                            parameters="tree"
-                                            ng-model="treeModel">
-                        </mct-representation>
-                    </div>
-                </div>
-            </div>
-
-            <mct-splitter class="mobile-hide"></mct-splitter>
-
-            <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'">
+<div content="jquery-wrapper"
+     class="abs holder-all browse-mode">
+    
+    <mct-include key="'topbar-browse'">
+    </mct-include>
+    
+    <div class="holder browse-area s-browse-area abs"
+         ng-controller="BrowseController">
+        
+        <mct-split-pane class='contents abs'
+                        anchor='left'>
+            <div class='split-pane-component treeview pane left'
+                 ng-class='{inactive: !treeModel.leftPane}'>
+                
+                <mct-representation key="'create-button'"
+                                    mct-object="navigatedObject"
+                                    ng-model="treeModel">
+                </mct-representation>
+                
+                <div class='holder search-holder abs'
+                     ng-class="{active: treeModel.search}">
+                    <mct-representation key="'search'"
+                                 mct-object="domainObject"
+                                 ng-model="treeModel">
+                    </mct-representation>
+                </div>
+                
+                <div class='holder tree-holder abs'
+                     ng-hide="treeModel.search">
+                    <mct-representation key="'tree'"
+                                        mct-object="domainObject"
+                                        ng-model="treeModel">
                     </mct-representation>
                 </div>
-                <div class="key-properties ui-symbol icon mobile-menu-icon desktop-hide"
-                     mct-device="mobile"
-                     ng-click="tree.toggle()">m</div>
             </div>
+            
+            <mct-splitter class="splitter-bar left"
+                          ng-class="{inactive: !treeModel.leftPane}">
+            </mct-splitter>
+            
+            <div class='split-pane-component secondary-split pane right slide'
+                 ng-class='{leftInactive: !treeModel.leftPane}'>
+                <mct-split-pane class='contents abs'
+                                anchor='right'>
+                    
+                    <div class='split-pane-component items pane slide'
+                         ng-class='{rightInactive: !treeModel.rightPane}'>
+                        <div class='holder abs'
+                             id='content-area'>
+                            <mct-representation key="'browse-object'"
+                                                mct-object="navigatedObject"
+                                                ng-model="treeModel">
+                            </mct-representation>
+                        </div>
+                    </div>
+                    
+                    <mct-splitter class="splitter-bar right"
+                                  ng-class="{inactive: !treeModel.rightPane}">
+                    </mct-splitter>
+                    
+                    <div class='split-pane-component object-inspector pane right'
+                         ng-class='{inactive: !treeModel.rightPane}'>
+                        <div class='holder inspector-holder abs'>
+                            <mct-representation key="'object-inspector'"
+                                                mct-object="domainObject"
+                                                ng-model="treeModel">
+                            </mct-representation>
+                        </div>
+                    </div>
+                    
+                </mct-split-pane>
+            </div>
+            
         </mct-split-pane>
+        
     </div>
-    <mct-include key="'bottombar'"></mct-include>
+    
+    <mct-include key="'bottombar'">
+    </mct-include>
 </div>
-

platform/commonUI/browse/res/templates/browse/object-header.html

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

platform/commonUI/browse/res/templates/create/create-button.html

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

platform/commonUI/browse/res/templates/create/locator.html

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

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

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

platform/commonUI/browse/res/templates/topbar-browse.html

@@ -0,0 +1,36 @@
+<!--
+ 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>

platform/commonUI/browse/src/BrowseController.js

@@ -55,7 +55,7 @@ define(
 
                 unlisten = $scope.$on('$locationChangeSuccess', function () {
                     // Checks path to make sure /browse/ is at front
-                    // if so, change $route.current
+                    // if so, change $route.current                    
                     if ($location.path().indexOf("/browse/") === 0) {
                         $route.current = priorRoute;
                     }
@@ -65,7 +65,7 @@ define(
                 // path to new, addressed, path based on
                 // domainObject
                 $location.path(urlService.urlForLocation("browse", domainObject));
-
+                
             }
 
             // Callback for updating the in-scope reference to the object
@@ -139,10 +139,14 @@ define(
             });
 
             // Provide a model for the tree to modify
+            // Also use this model for the left and right pane controlling
             $scope.treeModel = {
                 selectedObject: navigationService.getNavigation()
             };
-
+            // Create an array of objects which will allow for multiple selection
+            // for the object inspector. 
+            $scope.inspectionObjects = [$scope.domainObject];
+            
             // Listen for changes in navigation state.
             navigationService.addListener(setNavigation);
 
@@ -153,7 +157,6 @@ define(
             $scope.$on("$destroy", function () {
                 navigationService.removeListener(setNavigation);
             });
-
         }
 
         return BrowseController;

platform/commonUI/browse/src/BrowseObjectController.js

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

platform/commonUI/browse/src/BrowseTreeController.js

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

platform/commonUI/browse/src/creation/CreateAction.js

@@ -53,12 +53,11 @@ define(
          */
         function CreateAction(type, parent, context, dialogService, creationService, policyService) {
             this.metadata = {
-                key: 'create.' + type.getKey(),
+                key: 'create',
                 glyph: type.getGlyph(),
                 name: type.getName(),
                 type: type.getKey(),
                 description: type.getDescription(),
-                category: [ 'creation' ],
                 context: context
             };
 

platform/commonUI/browse/src/creation/CreateActionProvider.js

@@ -63,10 +63,7 @@ define(
             // domain object to serve as the container for the
             // newly-created object (although the user may later
             // make a different selection)
-            if (!destination) {
-                return [];
-            }
-            if (context.category && context.category !== "creation") {
+            if (key !== 'create' || !destination) {
                 return [];
             }
 

platform/commonUI/browse/src/creation/CreateMenuController.js

@@ -41,7 +41,7 @@ define(
             // Update the set of Create actions
             function refreshActions() {
                 $scope.createActions = $scope.action ?
-                        $scope.action.getActions({ category: "creation" }) :
+                        $scope.action.getActions('create') :
                         [];
             }
 

platform/commonUI/browse/src/creation/CreateWizard.js

@@ -59,10 +59,10 @@ define(
                 var locatingType = locatingObject &&
                     locatingObject.getCapability('type');
                 return locatingType && policyService.allow(
-                    "composition",
-                    locatingType,
-                    type
-                );
+                        "composition",
+                        locatingType,
+                        type
+                    );
             }
 
             sections.push({
@@ -77,9 +77,6 @@ define(
                     row.key = index;
 
                     return row;
-                }).filter(function (row) {
-                    // Only show rows which have defined controls
-                    return row && row.control;
                 })
             });
 

platform/commonUI/browse/src/creation/CreationService.js

@@ -42,11 +42,10 @@ define(
          * @memberof platform/commonUI/browse
          * @constructor
          */
-        function CreationService(persistenceService, now, $q, $log) {
+        function CreationService(persistenceService, $q, $log) {
             this.persistenceService = persistenceService;
             this.$q = $q;
             this.$log = $log;
-            this.now = now;
         }
 
         /**
@@ -56,10 +55,6 @@ define(
          * space an object is created within (as it is possible to
          * have multiple persistence spaces attached.)
          *
-         * Note that the model passed in for object creation may be
-         * modified to attach additional initial properties associated
-         * with domain object creation.
-         *
          * @param {object} model the model for the newly-created
          *        domain object
          * @param {DomainObject} parent the domain object which
@@ -72,6 +67,12 @@ define(
             var persistence = parent.getCapability("persistence"),
                 self = this;
 
+            // Store the location of an object relative to it's parent.
+            function addLocationToModel(modelId, model, parent) {
+                model.location = parent.getId();
+                return model;
+            }
+
             // Persist the new domain object's model; it will be fully
             // constituted as a domain object when loaded back, as all
             // domain object models are.
@@ -87,18 +88,37 @@ define(
             // composition, so that it will subsequently appear
             // as a child contained by that parent.
             function addToComposition(id, parent, parentPersistence) {
-                var compositionCapability = parent.getCapability('composition'),
-                    addResult = compositionCapability &&
-                        compositionCapability.add(id);
+                var mutatationResult = parent.useCapability("mutation", function (model) {
+                    if (Array.isArray(model.composition)) {
+                        // Don't add if the id is already there
+                        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(addResult).then(function (result) {
+                return self.$q.when(mutatationResult).then(function (result) {
                     if (!result) {
-                        self.$log.error("Could not modify " + parent.getId());
+                        self.$log.error("Could not mutate " + parent.getId());
                         return undefined;
                     }
 
                     return parentPersistence.persist().then(function () {
-                        return result;
+                        // Locate and return new Object in context of parent.
+                        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];
+                                    }
+                                }
+                            });
                     });
                 });
             }
@@ -115,7 +135,7 @@ define(
             // 2. Create a model with that ID in the persistence space
             // 3. Add that ID to
             return self.$q.when(uuid()).then(function (id) {
-                model.persisted = self.now();
+                model = addLocationToModel(id, model, parent);
                 return doPersist(persistence.getSpace(), id, model);
             }).then(function (id) {
                 return addToComposition(id, parent, persistence);

platform/commonUI/browse/src/creation/LocatorController.js

@@ -33,7 +33,7 @@ define(
          * @memberof platform/commonUI/browse
          * @constructor
          */
-        function LocatorController($scope, $timeout) {
+        function LocatorController($scope) {
             // Populate values needed by the locator control. These are:
             // * rootObject: The top-level object, since we want to show
             //               the full tree
@@ -41,19 +41,9 @@ define(
             //              used for bi-directional object selection.
             function setLocatingObject(domainObject, priorObject) {
                 var context = domainObject &&
-                    domainObject.getCapability("context"),
-                    contextRoot = context && context.getRoot();
-
-                if (contextRoot && contextRoot !== $scope.rootObject) {
-                    $scope.rootObject = undefined;
-                    // Update the displayed tree on a timeout to avoid
-                    // an infinite digest exception.
-                    $timeout(function () {
-                        $scope.rootObject =
-                            (context && context.getRoot()) || $scope.rootObject;
-                    }, 0);
-                }
+                    domainObject.getCapability("context");
 
+                $scope.rootObject = (context && context.getRoot()) || $scope.rootObject;
                 $scope.treeModel.selectedObject = domainObject;
                 $scope.ngModel[$scope.field] = domainObject;
 
@@ -62,7 +52,10 @@ define(
                         $scope.structure &&
                             $scope.structure.validate) {
                     if (!$scope.structure.validate(domainObject)) {
-                        setLocatingObject(priorObject, undefined);
+                        setLocatingObject(
+                            $scope.structure.validate(priorObject) ?
+                                    priorObject : undefined
+                        );
                         return;
                     }
                 }

platform/commonUI/browse/src/navigation/BackAction.js

@@ -1,68 +0,0 @@
-/*****************************************************************************
- * Open MCT Web, Copyright (c) 2014-2015, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT Web is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT Web includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-/*global define,Promise*/
-
-/**
- * Module defining NavigateAction. Created by vwoeltje on 11/10/14.
- */
-define(
-    [],
-    function () {
-        "use strict";
-
-        /**
-         * The `back` action navigates to the contextual parent of a
-         * specific domain object.
-         * @memberof platform/commonUI/browse
-         * @constructor
-         * @implements {Action}
-         */
-        function BackAction(context) {
-            this.domainObject = context.domainObject;
-        }
-
-        /**
-         * Navigate to the object described in the context.
-         * @returns {Promise} a promise that is resolved once the
-         *          navigation has been updated
-         */
-        BackAction.prototype.perform = function () {
-            var parent = this.domainObject.getCapability("context")
-                    .getParent();
-            return parent.getCapability("action").perform("navigate");
-        };
-
-        /**
-         * Navigate as an action is only applicable when a domain object
-         * is described in the action context.
-         * @param {ActionContext} context the context in which the action
-         *        will be performed
-         * @returns {boolean} true if applicable
-         */
-        BackAction.appliesTo = function (context) {
-            return context.domainObject !== undefined &&
-                    context.domainObject.hasCapability("context");
-        };
-
-        return BackAction;
-    }
-);

platform/commonUI/browse/src/windowing/FullscreenAction.js

@@ -53,10 +53,9 @@ define(
             // based on whether or not we are currently
             // full screen.
             var metadata = Object.create(FullscreenAction);
-            metadata.key = "fullscreen";
             metadata.glyph = screenfull.isFullscreen ? "_" : "z";
             metadata.description = screenfull.isFullscreen ?
-                    EXIT_FULLSCREEN : ENTER_FULLSCREEN;
+                EXIT_FULLSCREEN : ENTER_FULLSCREEN;
             metadata.group = "windowing";
             metadata.context = this.context;
             return metadata;

platform/commonUI/browse/test/BrowseControllerSpec.js

@@ -54,6 +54,7 @@ define(
                     "$scope",
                     [ "$on", "$watch" ]
                 );
+                mockScope.ngModel = {};
                 mockRoute = { current: { params: {} } };
                 mockLocation = jasmine.createSpyObj(
                     "$location",
@@ -146,14 +147,12 @@ define(
                 expect(mockScope.navigatedObject).toEqual(mockDomainObject);
             });
 
-
             it("releases its navigation listener when its scope is destroyed", function () {
                 expect(mockScope.$on).toHaveBeenCalledWith(
                     "$destroy",
                     jasmine.any(Function)
                 );
                 mockScope.$on.mostRecentCall.args[1]();
-
                 // Should remove the listener it added earlier
                 expect(mockNavigationService.removeListener).toHaveBeenCalledWith(
                     mockNavigationService.addListener.mostRecentCall.args[0]
@@ -224,16 +223,16 @@ define(
                 mockNavigationService.addListener.mostRecentCall.args[0](
                     mockNextObject
                 );
-
+                
                 // Allows the path index to be checked
-                // prior to setting $route.current
+                // prior to setting $route.current                
                 mockLocation.path.andReturn("/browse/");
-
+                
                 // Exercise the Angular workaround
                 mockScope.$on.mostRecentCall.args[1]();
                 expect(mockUnlisten).toHaveBeenCalled();
-
-                // location.path to be called with the urlService's
+                
+                // location.path to be called with the urlService's 
                 // urlFor function with the next domainObject and mode
                 expect(mockLocation.path).toHaveBeenCalledWith(
                     mockUrlService.urlForLocation(mockMode, mockNextObject)

platform/commonUI/browse/test/BrowseObjectControllerSpec.js

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

platform/commonUI/browse/test/BrowseTreeControllerSpec.js

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

platform/commonUI/browse/test/creation/CreateWizardSpec.js

@@ -42,9 +42,7 @@ define(
                     "property" + name,
                     [ "getDefinition", "getValue", "setValue" ]
                 );
-                mockProperty.getDefinition.andReturn({
-                    control: "textfield"
-                });
+                mockProperty.getDefinition.andReturn({});
                 mockProperty.getValue.andReturn(name);
                 return mockProperty;
             }
@@ -159,4 +157,4 @@ define(
 
         });
     }
-);
+);

platform/commonUI/browse/test/creation/CreationServiceSpec.js

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

platform/commonUI/browse/test/creation/LocatorControllerSpec.js

@@ -31,7 +31,6 @@ define(
 
         describe("The locator controller", function () {
             var mockScope,
-                mockTimeout,
                 mockDomainObject,
                 mockRootObject,
                 mockContext,
@@ -42,7 +41,6 @@ define(
                     "$scope",
                     [ "$watch" ]
                 );
-                mockTimeout = jasmine.createSpy("$timeout");
                 mockDomainObject = jasmine.createSpyObj(
                     "domainObject",
                     [ "getCapability" ]
@@ -62,7 +60,7 @@ define(
                 mockScope.ngModel = {};
                 mockScope.field = "someField";
 
-                controller = new LocatorController(mockScope, mockTimeout);
+                controller = new LocatorController(mockScope);
             });
 
             it("adds a treeModel to scope", function () {
@@ -82,7 +80,6 @@ define(
                 // Need to pass on selection changes as updates to
                 // the control's value
                 mockScope.$watch.mostRecentCall.args[1](mockDomainObject);
-                mockTimeout.mostRecentCall.args[0]();
                 expect(mockScope.ngModel.someField).toEqual(mockDomainObject);
                 expect(mockScope.rootObject).toEqual(mockRootObject);
 
@@ -98,7 +95,6 @@ define(
 
                 // Pass selection change
                 mockScope.$watch.mostRecentCall.args[1](mockDomainObject);
-                mockTimeout.mostRecentCall.args[0]();
 
                 expect(mockScope.structure.validate).toHaveBeenCalled();
                 // Change should have been rejected
@@ -112,16 +108,14 @@ define(
                 );
 
                 mockScope.$watch.mostRecentCall.args[1](mockDomainObject);
-                mockTimeout.mostRecentCall.args[0]();
                 expect(mockScope.ngModelController.$setValidity)
                     .toHaveBeenCalledWith(jasmine.any(String), true);
 
                 mockScope.$watch.mostRecentCall.args[1](undefined);
-                mockTimeout.mostRecentCall.args[0]();
                 expect(mockScope.ngModelController.$setValidity)
                     .toHaveBeenCalledWith(jasmine.any(String), false);
             });
 
         });
     }
-);
+);

platform/commonUI/browse/test/suite.json

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

platform/commonUI/dialog/res/templates/dialog.html

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

platform/commonUI/dialog/res/templates/overlay-options.html

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

platform/commonUI/dialog/res/templates/overlay.html

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

platform/commonUI/edit/res/templates/edit-action-buttons.html

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

platform/commonUI/edit/res/templates/edit-object.html

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

platform/commonUI/edit/res/templates/edit.html

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

platform/commonUI/edit/res/templates/elements.html

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

platform/commonUI/edit/src/actions/LinkAction.js

@@ -36,11 +36,20 @@ define(
         function LinkAction(context) {
             this.domainObject = (context || {}).domainObject;
             this.selectedObject = (context || {}).selectedObject;
+            this.selectedId = this.selectedObject && this.selectedObject.getId();
         }
 
         LinkAction.prototype.perform = function () {
             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
             function doPersist() {
                 var persistence =
@@ -50,13 +59,11 @@ define(
 
             // Link these objects
             function doLink() {
-                var composition = self.domainObject &&
-                        self.domainObject.getCapability('composition');
-                return composition && composition.add(self.selectedObject)
-                        .then(doPersist);
+                return self.domainObject.useCapability("mutation", addId)
+                    .then(doPersist);
             }
 
-            return this.selectedObject && doLink();
+            return this.selectedId && doLink();
         };
 
         return LinkAction;

platform/commonUI/edit/src/actions/PropertiesDialog.js

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

platform/commonUI/edit/src/actions/RemoveAction.js

@@ -81,7 +81,7 @@ define(
                 var persistence = domainObject.getCapability('persistence');
                 return persistence && persistence.persist();
             }
-
+            
             /*
              * Checks current object and ascendants of current
              * object with object being removed, if the current
@@ -90,11 +90,11 @@ define(
              */
             function checkObjectNavigation(object, parentObject) {
                 // Traverse object starts at current location
-                var traverseObject = (navigationService).getNavigation(),
-                    context;
-
+                var traverseObject = (navigationService).getNavigation();
+                
                 // Stop when object is not defined (above ROOT)
                 while (traverseObject) {
+                    
                     // If object currently traversed to is object being removed
                     // navigate to parent of current object and then exit loop
                     if (traverseObject.getId() === object.getId()) {
@@ -103,8 +103,7 @@ define(
                     }
                     // Traverses to parent of current object, moving
                     // up the ascendant path
-                    context = traverseObject.getCapability('context');
-                    traverseObject = context && context.getParent();
+                    traverseObject = traverseObject.getCapability('context').getParent();
                 }
             }
 
@@ -116,11 +115,11 @@ define(
             function removeFromContext(object) {
                 var contextCapability = object.getCapability('context'),
                     parent = contextCapability.getParent();
-
+                
                 // If currently within path of removed object(s),
                 // navigates to existing object up tree
                 checkObjectNavigation(object, parent);
-
+                
                 return $q.when(
                     parent.useCapability('mutation', doMutate)
                 ).then(function () {

platform/commonUI/edit/src/controllers/EditController.js

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

platform/commonUI/edit/test/actions/LinkActionSpec.js

@@ -31,7 +31,7 @@ define(
                 mockDomainObject,
                 mockParent,
                 mockContext,
-                mockComposition,
+                mockMutation,
                 mockPersistence,
                 mockType,
                 actionContext,
@@ -67,7 +67,7 @@ define(
                     }
                 };
                 mockContext = jasmine.createSpyObj("context", [ "getParent" ]);
-                mockComposition = jasmine.createSpyObj("composition", [ "invoke", "add" ]);
+                mockMutation = jasmine.createSpyObj("mutation", [ "invoke" ]);
                 mockPersistence = jasmine.createSpyObj("persistence", [ "persist" ]);
                 mockType = jasmine.createSpyObj("type", [ "hasFeature" ]);
 
@@ -75,11 +75,11 @@ define(
                 mockDomainObject.getCapability.andReturn(mockContext);
                 mockContext.getParent.andReturn(mockParent);
                 mockType.hasFeature.andReturn(true);
-                mockComposition.invoke.andReturn(mockPromise(true));
-                mockComposition.add.andReturn(mockPromise(true));
+                mockMutation.invoke.andReturn(mockPromise(true));
+
 
                 capabilities = {
-                    composition: mockComposition,
+                    mutation: mockMutation,
                     persistence: mockPersistence,
                     type: mockType
                 };
@@ -96,17 +96,33 @@ define(
             });
 
 
-            it("adds to the parent's composition when performed", function () {
+            it("mutates the parent when performed", function () {
                 action.perform();
-                expect(mockComposition.add)
-                    .toHaveBeenCalledWith(mockDomainObject);
+                expect(mockMutation.invoke)
+                    .toHaveBeenCalledWith(jasmine.any(Function));
             });
 
-            it("persists changes afterward", function () {
+            it("changes composition from its mutation function", function () {
+                var mutator, result;
                 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();
             });
 
         });
     }
-);
+);

platform/commonUI/edit/test/actions/PropertiesDialogSpec.js

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

platform/commonUI/general/bundle.json

@@ -6,7 +6,7 @@
         "services": [
             {
                 "key": "urlService",
-                "implementation": "services/UrlService.js",
+                "implementation": "/services/UrlService.js",
                 "depends": [ "$location" ]
             }
         ],
@@ -20,6 +20,18 @@
             {
                 "stylesheetUrl": "css/normalize.min.css",
                 "priority": "mandatory"
+            },
+            {
+                "stylesheetUrl": "css/theme-espresso.css",
+                "priority": 1000
+            },
+            {
+                "stylesheetUrl": "css/items.css",
+                "priority": 901
+            },
+            {
+                "stylesheetUrl": "css/tree.css",
+                "priority": 900
             }
         ],
         "templates": [
@@ -92,6 +104,11 @@
                 "key": "SelectorController",
                 "implementation": "controllers/SelectorController.js",
                 "depends": [ "objectService", "$scope" ]
+            },
+            {
+                "key": "ObjectInspectorController",
+                "implementation": "controllers/ObjectInspectorController.js",
+                "depends": [ "$scope", "objectService" ]
             }
         ],
         "directives": [
@@ -123,7 +140,7 @@
             {
                 "key": "mctSplitPane",
                 "implementation": "directives/MCTSplitPane.js",
-                "depends": [ "$parse", "$log", "$interval" ]
+                "depends": [ "$parse", "$log" ]
             },
             {
                 "key": "mctSplitter",
@@ -207,6 +224,10 @@
                 "key": "switcher",
                 "templateUrl": "templates/controls/switcher.html",
                 "uses": [ "view" ]
+            },
+            {
+              "key": "object-inspector",
+              "templateUrl": "templates/object-inspector.html"
             }
         ],
         "controls": [

platform/commonUI/general/res/config.rb

@@ -13,7 +13,7 @@ javascripts_dir = "js"
 output_style = :nested
 
 # 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:
 # line_comments = false

platform/commonUI/general/res/css/forms.css

@@ -0,0 +1,533 @@
+/*****************************************************************************
+ * 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; }

platform/commonUI/general/res/css/items.css

@@ -0,0 +1,299 @@
+/*****************************************************************************
+ * 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; }

platform/commonUI/general/res/css/main.css

@@ -0,0 +1,120 @@
+/*****************************************************************************
+ * 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"; }

platform/commonUI/general/res/css/tree.css

@@ -0,0 +1,498 @@
+/*****************************************************************************
+ * 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; }

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

@@ -1,32 +1,19 @@
 {
 	"metadata": {
-		"name": "WTD Symbols v24",
-		"lastOpened": 1441992412958,
-		"created": 1441992410384
+		"name": "WTD Symbols v2.2",
+		"lastOpened": 1439948744240,
+		"created": 1439948734037
 	},
 	"iconSets": [
 		{
 			"selection": [
-				{
-					"order": 86,
-					"id": 85,
-					"prevSize": 32,
-					"code": 58888,
-					"codes": [
-						58888,
-						58889,
-						58890
-					],
-					"name": "icon-info-v15",
-					"tempChar": ""
-				},
 				{
 					"order": 82,
 					"id": 84,
 					"prevSize": 32,
 					"code": 58887,
 					"name": "icon-x-in-circle",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 77,
@@ -34,7 +21,7 @@
 					"prevSize": 32,
 					"code": 58881,
 					"name": "icon-datatable",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 78,
@@ -42,7 +29,7 @@
 					"prevSize": 32,
 					"code": 58882,
 					"name": "icon-tabular-scrolling",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 79,
@@ -50,7 +37,7 @@
 					"prevSize": 32,
 					"code": 58884,
 					"name": "icon-tabular",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 80,
@@ -58,15 +45,15 @@
 					"prevSize": 32,
 					"code": 58885,
 					"name": "icon-calendar",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
-					"order": 83,
+					"order": 81,
 					"id": 78,
 					"prevSize": 32,
 					"code": 58886,
 					"name": "icon-paint-bucket",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 1,
@@ -74,7 +61,7 @@
 					"prevSize": 32,
 					"code": 123,
 					"name": "icon-pointer-left",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 3,
@@ -82,7 +69,7 @@
 					"prevSize": 32,
 					"code": 125,
 					"name": "icon-pointer-right",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 4,
@@ -90,7 +77,7 @@
 					"prevSize": 32,
 					"code": 80,
 					"name": "icon-person",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 5,
@@ -98,7 +85,7 @@
 					"prevSize": 32,
 					"code": 232,
 					"name": "icon-chain-links",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 6,
@@ -106,7 +93,7 @@
 					"prevSize": 32,
 					"code": 115,
 					"name": "icon-database-in-brackets",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 7,
@@ -114,7 +101,7 @@
 					"prevSize": 32,
 					"code": 114,
 					"name": "icon-refresh",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 8,
@@ -122,7 +109,7 @@
 					"prevSize": 32,
 					"code": 108,
 					"name": "icon-lock",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 9,
@@ -130,7 +117,7 @@
 					"prevSize": 32,
 					"code": 51,
 					"name": "icon-box-with-dashed-lines",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 10,
@@ -138,7 +125,7 @@
 					"prevSize": 32,
 					"code": 58880,
 					"name": "icon-box-with-arrow-cursor",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 11,
@@ -146,7 +133,7 @@
 					"prevSize": 32,
 					"code": 65,
 					"name": "icon-activity-mode",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 12,
@@ -154,7 +141,7 @@
 					"prevSize": 32,
 					"code": 97,
 					"name": "icon-activity",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 13,
@@ -162,7 +149,7 @@
 					"prevSize": 32,
 					"code": 33,
 					"name": "icon-alert-rect",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 14,
@@ -170,7 +157,7 @@
 					"prevSize": 32,
 					"code": 58883,
 					"name": "icon-alert-triangle",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 15,
@@ -178,7 +165,7 @@
 					"prevSize": 32,
 					"code": 238,
 					"name": "icon-arrow-double-down",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 16,
@@ -186,7 +173,7 @@
 					"prevSize": 32,
 					"code": 235,
 					"name": "icon-arrow-double-up",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 2,
@@ -194,7 +181,7 @@
 					"prevSize": 32,
 					"code": 118,
 					"name": "icon-arrow-down",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 19,
@@ -202,7 +189,7 @@
 					"prevSize": 32,
 					"code": 60,
 					"name": "icon-arrow-left",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 20,
@@ -210,7 +197,7 @@
 					"prevSize": 32,
 					"code": 62,
 					"name": "icon-arrow-right",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 21,
@@ -218,7 +205,7 @@
 					"prevSize": 32,
 					"code": 236,
 					"name": "icon-arrow-tall-down",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 22,
@@ -226,7 +213,7 @@
 					"prevSize": 32,
 					"code": 237,
 					"name": "icon-arrow-tall-up",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 23,
@@ -234,7 +221,7 @@
 					"prevSize": 32,
 					"code": 94,
 					"name": "icon-arrow-up",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 24,
@@ -242,7 +229,7 @@
 					"prevSize": 32,
 					"code": 73,
 					"name": "icon-arrows-out",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 25,
@@ -250,7 +237,7 @@
 					"prevSize": 32,
 					"code": 58893,
 					"name": "icon-arrows-right-left",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 33,
@@ -258,7 +245,7 @@
 					"prevSize": 32,
 					"code": 53,
 					"name": "icon-arrows-up-down",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 26,
@@ -266,7 +253,7 @@
 					"prevSize": 32,
 					"code": 42,
 					"name": "icon-asterisk",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 27,
@@ -274,15 +261,15 @@
 					"prevSize": 32,
 					"code": 72,
 					"name": "icon-autoflow-tabular",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 28,
 					"id": 49,
 					"prevSize": 32,
 					"code": 224,
-					"name": "icon-box",
-					"tempChar": ""
+					"name": "icon-box-round-corners",
+					"tempChar": ""
 				},
 				{
 					"order": 29,
@@ -290,7 +277,7 @@
 					"prevSize": 32,
 					"code": 50,
 					"name": "icon-check",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 30,
@@ -298,7 +285,7 @@
 					"prevSize": 32,
 					"code": 67,
 					"name": "icon-clock",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 31,
@@ -306,7 +293,7 @@
 					"prevSize": 32,
 					"code": 46,
 					"name": "icon-connectivity",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 32,
@@ -314,7 +301,7 @@
 					"prevSize": 32,
 					"code": 100,
 					"name": "icon-database-query",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 17,
@@ -322,7 +309,7 @@
 					"prevSize": 32,
 					"code": 68,
 					"name": "icon-database",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 35,
@@ -330,7 +317,7 @@
 					"prevSize": 32,
 					"code": 81,
 					"name": "icon-dictionary",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 36,
@@ -338,7 +325,7 @@
 					"prevSize": 32,
 					"code": 242,
 					"name": "icon-duplicate",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 37,
@@ -346,7 +333,7 @@
 					"prevSize": 32,
 					"code": 102,
 					"name": "icon-folder-new",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 38,
@@ -354,7 +341,7 @@
 					"prevSize": 32,
 					"code": 70,
 					"name": "icon-folder",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 39,
@@ -362,7 +349,7 @@
 					"prevSize": 32,
 					"code": 95,
 					"name": "icon-fullscreen-collapse",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 40,
@@ -370,7 +357,7 @@
 					"prevSize": 32,
 					"code": 122,
 					"name": "icon-fullscreen-expand",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 41,
@@ -378,7 +365,7 @@
 					"prevSize": 32,
 					"code": 71,
 					"name": "icon-gear",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 49,
@@ -386,7 +373,7 @@
 					"prevSize": 32,
 					"code": 227,
 					"name": "icon-image",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 42,
@@ -394,7 +381,7 @@
 					"prevSize": 32,
 					"code": 225,
 					"name": "icon-layers",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 43,
@@ -402,7 +389,7 @@
 					"prevSize": 32,
 					"code": 76,
 					"name": "icon-layout",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 44,
@@ -410,7 +397,7 @@
 					"prevSize": 32,
 					"code": 226,
 					"name": "icon-line-horz",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 75,
@@ -418,7 +405,7 @@
 					"prevSize": 32,
 					"code": 244,
 					"name": "icon-link",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 46,
@@ -426,7 +413,7 @@
 					"prevSize": 32,
 					"code": 88,
 					"name": "icon-magnify-in",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 47,
@@ -434,7 +421,7 @@
 					"prevSize": 32,
 					"code": 89,
 					"name": "icon-magnify-out",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 48,
@@ -442,7 +429,7 @@
 					"prevSize": 32,
 					"code": 77,
 					"name": "icon-magnify",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 34,
@@ -450,7 +437,7 @@
 					"prevSize": 32,
 					"code": 109,
 					"name": "icon-menu",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 50,
@@ -458,7 +445,7 @@
 					"prevSize": 32,
 					"code": 243,
 					"name": "icon-move",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 51,
@@ -466,7 +453,7 @@
 					"prevSize": 32,
 					"code": 121,
 					"name": "icon-new-window",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 52,
@@ -474,7 +461,7 @@
 					"prevSize": 32,
 					"code": 111,
 					"name": "icon-object",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 73,
@@ -482,7 +469,7 @@
 					"prevSize": 32,
 					"code": 63,
 					"name": "icon-object-unknown",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 53,
@@ -490,7 +477,7 @@
 					"prevSize": 32,
 					"code": 86,
 					"name": "icon-packet",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 54,
@@ -498,7 +485,7 @@
 					"prevSize": 32,
 					"code": 234,
 					"name": "icon-page",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 55,
@@ -506,7 +493,7 @@
 					"prevSize": 32,
 					"code": 241,
 					"name": "icon-pause",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 56,
@@ -514,7 +501,7 @@
 					"prevSize": 32,
 					"code": 112,
 					"name": "icon-pencil",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 65,
@@ -522,7 +509,7 @@
 					"prevSize": 32,
 					"code": 79,
 					"name": "icon-people",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 57,
@@ -530,7 +517,7 @@
 					"prevSize": 32,
 					"code": 239,
 					"name": "icon-play",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 58,
@@ -538,7 +525,7 @@
 					"prevSize": 32,
 					"code": 233,
 					"name": "icon-plot-resource",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 59,
@@ -546,7 +533,7 @@
 					"prevSize": 32,
 					"code": 43,
 					"name": "icon-plus",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 60,
@@ -554,7 +541,7 @@
 					"prevSize": 32,
 					"code": 45,
 					"name": "icon-minus",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 61,
@@ -562,7 +549,7 @@
 					"prevSize": 32,
 					"code": 54,
 					"name": "icon-sine",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 62,
@@ -570,7 +557,7 @@
 					"prevSize": 32,
 					"code": 228,
 					"name": "icon-T",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 63,
@@ -578,7 +565,7 @@
 					"prevSize": 32,
 					"code": 116,
 					"name": "icon-telemetry-panel",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 64,
@@ -586,7 +573,7 @@
 					"prevSize": 32,
 					"code": 84,
 					"name": "icon-telemetry",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 18,
@@ -594,7 +581,7 @@
 					"prevSize": 32,
 					"code": 246,
 					"name": "icon-thumbs-strip",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 67,
@@ -602,7 +589,7 @@
 					"prevSize": 32,
 					"code": 83,
 					"name": "icon-timeline",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 68,
@@ -610,7 +597,7 @@
 					"prevSize": 32,
 					"code": 245,
 					"name": "icon-timer",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 69,
@@ -618,7 +605,7 @@
 					"prevSize": 32,
 					"code": 90,
 					"name": "icon-trash",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 70,
@@ -626,7 +613,7 @@
 					"prevSize": 32,
 					"code": 229,
 					"name": "icon-two-parts-both",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 71,
@@ -634,7 +621,7 @@
 					"prevSize": 32,
 					"code": 231,
 					"name": "icon-two-parts-one-only",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 72,
@@ -642,7 +629,7 @@
 					"prevSize": 32,
 					"code": 120,
 					"name": "icon-x-heavy",
-					"tempChar": ""
+					"tempChar": ""
 				},
 				{
 					"order": 66,
@@ -650,7 +637,7 @@
 					"prevSize": 32,
 					"code": 58946,
 					"name": "icon-x",
-					"tempChar": ""
+					"tempChar": ""
 				}
 			],
 			"id": 2,
@@ -665,27 +652,6 @@
 			"height": 1024,
 			"prevSize": 32,
 			"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,
 					"paths": [
@@ -874,19 +840,17 @@
 				{
 					"id": 78,
 					"paths": [
-						"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",
-						"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"
+						"M896 640c0 0-130 188-128 256 2 70.6 57.4 128 128 128s126-57.4 128-128c2-68-128-256-128-256z",
+						"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"
 					],
 					"attrs": [
 						{
-							"fill": "rgb(6, 161, 75)"
+							"fill": "rgb(6,161,75)",
+							"opacity": 1
 						},
 						{
-							"fill": "rgb(6, 161, 75)"
-						},
-						{
-							"fill": "rgb(6, 161, 75)"
+							"fill": "rgb(6,161,75)",
+							"opacity": 1
 						}
 					],
 					"isMulticolor": false,
@@ -897,6 +861,9 @@
 					"colorPermutations": {
 						"16161751": [
 							1,
+							1
+						],
+						"125525525516161751": [
 							1,
 							1
 						]
@@ -1323,23 +1290,16 @@
 				{
 					"id": 49,
 					"paths": [
-						"M0 0h1024v1024h-1024v-1024z"
+						"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"
 					],
 					"attrs": [
-						{
-							"fill": "rgb(0, 0, 0)"
-						}
+						{}
 					],
 					"isMulticolor": false,
 					"grid": 0,
 					"tags": [
 						"icon-box-round-corners"
-					],
-					"colorPermutations": {
-						"16161751": [
-							0
-						]
-					}
+					]
 				},
 				{
 					"id": 48,
@@ -2086,12 +2046,6 @@
 						161,
 						75,
 						1
-					],
-					[
-						255,
-						255,
-						255,
-						1
 					]
 				]
 			],
@@ -14853,6 +14807,5 @@
 		"gridSize": 16,
 		"showLiga": false
 	},
-	"uid": -1,
-	"time": 1441993324496
+	"uid": -1
 }

platform/commonUI/general/res/fonts/symbols/wtdsymbols.svg

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

platform/commonUI/general/res/sass/_about.scss

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

platform/commonUI/general/res/sass/_autoflow.scss

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

platform/commonUI/general/res/sass/_constants.scss

@@ -28,8 +28,64 @@ $bodyMargin: 10px;
 $interiorMargin: 5px;
 $interiorMarginLg: $interiorMargin * 2;
 $interiorMarginSm: 3px;
+$basicCr: 2px;
+$controlCr: 3px;
+$smallCr: 2px;
 $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 */
 $ltGamma: 20%;
 $btnFontSizeToH: 0.45;
@@ -47,8 +103,7 @@ $ueEditLeftPaneW: 75%;
 $treeSearchInputBarH: 25px;
 // Overlay
 $ovrTopBarH: 60px;
-$ovrFooterH: 30px;
-$overlayMargin: 25px;
+$ovrFooterH: 40px;
 // Items
 $ueBrowseGridItemLg: 200px;
 $ueBrowseGridItemTopBarH: 20px;
@@ -56,15 +111,17 @@ $ueBrowseGridItemBottomBarH: 30px;
 $itemPadLR: 5px;
 // Tree
 $treeVCW: 10px;
-$treeTypeIconH: 16px;
 $treeTypeIconW: 20px;
 $treeContextTriggerW: 20px;
+$colorItemTreeIcon: $colorKey;
+$colorItemTreeIconHover: lighten($colorItemTreeIcon, 20%);
+$colorItemTreeVCHover: $colorAlt1;
 // Tabular
 $tabularHeaderH: 22px; //18px
 $tabularTdPadLR: $itemPadLR;
 $tabularTdPadTB: 3px;
 // Imagery
-$imageMainControlBarH: 25px;
+$imageMainControlBarH: 22px;
 $imageThumbsD: 120px;
 $imageThumbsWrapperH: $imageThumbsD * 1.4;
 $imageThumbPad: 1px;
@@ -87,21 +144,18 @@ $reqSymbolFontSize: 0.7em;
 
 /************************** CONTROLS */
 $controlDisabledOpacity: 0.3;
-$formLabelW: 30%;
+$formLabelW: 20%;
 $formInputH: 22px;
 $formRowCtrlsH: 14px;
-$formTBPad: $interiorMargin;
-$formLRPad: $interiorMargin;
 $menuLineH: 1.5rem;
-$menuLineHPx: 24px;
+$scrollbarTrackSize: 10px;
+$scrollbarTrackColorBg: rgba(#000, 0.4);
 $btnStdH: 25px;
 $btnToolbarH: $btnStdH;
-$btnFrameH: 16px;
 
 /************************** PATHS */
-// Paths need to be relative to /platform/commonUI/theme/<theme-name>/css/ directory
-$dirCommonRes: '../../../../general/res/';
-$dirImgs: $dirCommonRes + 'images/';
+$dirImgs: '../images/'; // Relative to platform/css/ directory
 
 /************************** TIMINGS */
 $controlFadeMs: 100ms;
+

platform/commonUI/general/res/sass/_effects.scss

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

platform/commonUI/general/res/sass/_fixed-position.scss

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

platform/commonUI/general/res/sass/_fonts.scss

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

platform/commonUI/general/res/sass/_global.scss

@@ -19,26 +19,6 @@
  * this source code distribution or the Licensing information page available
  * 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 {
 	color: #ccc;
 	cursor: pointer;
@@ -62,6 +42,7 @@ body, html {
 }
 
 em {
+//	color: rgba(white, 0.2); Removed this as a global setting
 	font-style: normal;
 }
 
@@ -90,6 +71,12 @@ p {
 	margin-bottom: $interiorMarginLg;
 }
 
+span {
+	/* 618 DEBUG
+	box-sizing: border-box;
+	*/
+}
+
 mct-container {
 	display: block;
 }
@@ -113,7 +100,7 @@ mct-container {
 
 .codehilite {
 	@extend .code;
-	background-color: rgba($colorBodyFg, 0.1);
+	background-color: rgba(#fff, 0.1);
 	padding: 1em;
 }
 
@@ -129,6 +116,10 @@ mct-container {
 	margin: 0;
 }
 
+.colorKey {
+	color: $colorKey;
+}
+
 .ds {
 	@include box-shadow(rgba(#000, 0.7) 0 4px 10px 2px);
 }
@@ -138,6 +129,13 @@ mct-container {
 	display: none !important;
 }
 
+.paused {
+	&:not(.s-btn) {
+		border-color: $colorPausedBg !important;
+		color: $colorPausedBg !important;
+	}
+}
+
 .sep {
 	color: rgba(#fff, 0.2);
 }

platform/commonUI/general/res/sass/_icons.scss

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

platform/commonUI/general/res/sass/_initialization.scss

@@ -0,0 +1,20 @@
+// 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%;
+            }
+        }
+    }
+}

platform/commonUI/general/res/sass/_limits.scss

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

platform/commonUI/general/res/sass/_main.scss

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

platform/commonUI/general/res/sass/_mixins.scss

@@ -19,279 +19,257 @@
  * this source code distribution or the Licensing information page available
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
-
 @mixin absPosDefault($offset: 0px, $overflowHidden: hidden) {
     overflow: $overflowHidden;
     position: absolute;
-    top: $offset;
-    right: $offset;
-    bottom: $offset;
-    left: $offset;
-    width: auto;
-    height: auto;
+    top: $offset; right: $offset; bottom: $offset; left: $offset;
+    width: auto; height: auto;
 }
 
 @mixin ancillaryIcon($d, $c) {
-    // Used for small icons used in combination with larger icons,
-    // like the link and alert icons in tree items.
-    color: $c;
-    font-size: $d;
-    line-height: $d;
-    height: $d;
-    width: $d;
+	// Used for small icons used in combination with larger icons,
+	// like the link and alert icons in tree items.
+	color: $c;
+	font-size: $d;
+	line-height: $d;
+	height: $d;
+	width: $d;
 }
 
 @mixin trans-prop-nice($props, $t: 500ms) {
-    @if $t == 0 {
-        @include transition-property(none);
-    } @else {
-        @include transition-property($props);
-        @include transition-duration($t);
-        @include transition-timing-function(ease-in-out);
-    }
+	@if $t == 0 {
+		@include transition-property(none);
+	} @else {
+		@include transition-property($props);
+		@include transition-duration($t);
+		@include transition-timing-function(ease-in-out);
+	}
 }
 
 @mixin trans-prop-nice-fade($t: 0.5s) {
-    @if $t == 0 {
-        @include transition-property(none);
-    } @else {
-        @include transition-property(visibility, opacity, background-color, border-color);
-        @include transition-duration($t);
-        @include transition-timing-function(ease-in-out);
-    }
+	@if $t == 0 {
+		@include transition-property(none);
+	} @else {
+		@include transition-property(visibility, opacity, background-color, border-color);
+		@include transition-duration($t);
+		@include transition-timing-function(ease-in-out);
+	}
 }
 
 @mixin trans-prop-nice-resize-h($t: 0.5s) {
-    @include transition-property(height, bottom, top);
-    @include transition-duration($t);
-    @include transition-timing-function(ease-in-out);
+	@include transition-property(height, bottom, top);
+	@include transition-duration($t);
+	@include transition-timing-function(ease-in-out);
 }
 
 @mixin trans-prop-nice-resize-w($t: 0.5s) {
-    @include transition-property(width, left, right);
-    @include transition-duration($t);
-    @include transition-timing-function(ease-in-out);
+	@include transition-property(width, left, right);
+	@include transition-duration($t);
+	@include transition-timing-function(ease-in-out);
 }
 
 @mixin triangle-right($size, $color) {
-    $size: $size/2;
-    $ratio: 1;
-    width: 0;
-    height: 0;
-    border-top: $size/$ratio solid transparent;
-    border-left: $size solid $color;
-    border-bottom: $size/$ratio solid transparent;
+	$size: $size/2;
+	$ratio: 1;
+	width: 0;
+	height: 0;
+	border-top: $size/$ratio solid transparent;
+	border-left: $size solid $color;
+	border-bottom: $size/$ratio solid transparent;
 }
 
 @mixin triangle-down($size, $color) {
-    $size: $size/2;
-    $ratio: 1;
-    width: 0;
-    height: 0;
-    border-left: $size/$ratio solid transparent;
-    border-top: $size solid $color;
-    border-right: $size/$ratio solid transparent;
+	$size: $size/2;
+	$ratio: 1;
+	width: 0;
+	height: 0;
+	border-left: $size/$ratio solid transparent;
+	border-top: $size solid $color;
+	border-right: $size/$ratio solid transparent;
 }
 
 @mixin triangle($dir: "left", $size: 5px, $ratio: 1, $color: red) {
-    //$size: $size*2;
-    width: 0;
-    height: 0;
-    $slopedB: $size/$ratio solid transparent;
-    $straightB: $size solid $color;
-    @if $dir == "up" {
-        border-left: $slopedB;
-        border-right: $slopedB;
-        border-bottom: $straightB;
-    } @else if $dir == "right" {
-        border-top: $slopedB;
-        border-bottom: $slopedB;
-        border-left: $straightB;
-    } @else if $dir == "down" {
-        border-left: $slopedB;
-        border-right: $slopedB;
-        border-top: $straightB;
-    } @else {
-        border-top: $slopedB;
-        border-bottom: $slopedB;
-        border-right: $straightB;
-    }
+	//$size: $size*2;
+	width: 0;
+	height: 0;
+	$slopedB: $size/$ratio solid transparent;
+	$straightB: $size solid $color;
+	@if $dir == "up" {
+		border-left: $slopedB;
+		border-right: $slopedB;
+		border-bottom: $straightB;
+	} @else if $dir == "right" {
+		border-top: $slopedB;
+		border-bottom: $slopedB;
+		border-left: $straightB;
+	} @else if $dir == "down"  {
+		border-left: $slopedB;
+		border-right: $slopedB;
+		border-top: $straightB;
+	} @else {
+		border-top: $slopedB;
+		border-bottom: $slopedB;
+		border-right: $straightB;
+	}
 }
 
 @mixin bgDiagonalStripes($c: yellow, $a: 0.1, $d: 40px) {
-    @include background-image(linear-gradient(-45deg,
-        rgba($c, $a) 25%, transparent 25%,
-        transparent 50%, rgba($c, $a) 50%,
-        rgba($c, $a) 75%, transparent 75%,
-        transparent 100%
-    ));
-    background-repeat: repeat;
-    background-size: $d $d;
+	@include background-image(linear-gradient(-45deg,
+		rgba($c, $a) 25%, transparent 25%,
+		transparent 50%, rgba($c, $a) 50%,
+		rgba($c, $a) 75%, transparent 75%,
+		transparent 100%
+	));
+	background-repeat: repeat;
+	background-size: $d $d;
 }
 
 @mixin bgTicks($c: $colorBodyFg, $repeatDir: 'x') {
-    $deg: 90deg;
-    @if ($repeatDir != 'x') {
-        $deg: 0deg;
-        $repeatDir: repeat-y;
-    } @else {
-        $repeatDir: repeat-x;
-    }
+	$deg: 90deg;
+	@if ($repeatDir != 'x') {
+		$deg: 0deg;
+		$repeatDir: repeat-y;
+	} @else {
+		$repeatDir: repeat-x;
+	}
 
-    @include background-image(linear-gradient($deg,
-        $c 1px, transparent 1px,
-        transparent 100%
-    ));
-    background-repeat: $repeatDir;
+	@include background-image(linear-gradient($deg,
+		$c 1px, transparent 1px,
+		transparent 100%
+	));
+	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) {
-    //$b: 1px solid lighten($bg, 30%);
+    $b: 1px solid lighten($bg, 30%);
     @include border-radius(2px);
     @include box-sizing(border-box);
     @include boxIncised(0.7);
     background-color: $bg;
-    //border-bottom: $b;
-    //border-right: $b;
+    border-bottom: $b;
+    border-right: $b;
 }
 
 @mixin controlGrippy($b, $direction: horizontal, $w: 1px, $style: dotted) {
-    &:before {
-        @include trans-prop-nice("border-color", 0.75s);
-        content: '';
-        display: block;
-        height: auto;
-        pointer-events: none;
-        position: absolute;
-        z-index: 2;
+	&:before {
+		@include trans-prop-nice("border-color",0.75s);
+		content: '';
+		display: block;
+		height: auto;
+		pointer-events: none;
+		position: absolute;
+		z-index: 2;
 
-        @if $direction == "horizontal" {
-            border-top: $w $style darken($b, 15%);
-            top: 2px;
-            left: 5px;
-            right: 5px;
+		@if $direction == "horizontal" {
+			border-top: $w $style darken($b, 15%);
+			top: 2px;
+			left: 5px;
+			right: 5px;
 
-        } @else if $direction == "vertical" {
-            border-left: $w $style darken($b, 15%);
-            left: 2px;
-            bottom: 5px;
-            top: 5px;
-        }
-    }
-    &:not(.disabled):hover:before {
-        @include trans-prop-nice("border-color", 25ms);
-        border-color: $colorGrippyInteriorHover;
-    }
+		} @else if $direction == "vertical" {
+			border-left: $w $style darken($b, 15%);
+			left: 2px;
+			bottom: 5px;
+			top: 5px;
+		}
+	}
+	&:not(.disabled):hover:before {
+		@include trans-prop-nice("border-color",50ms);
+		border-color: $colorKey;
+	}
 }
 
-@mixin boxIncised($sVal: 0.6, $inset: 5px) {
-    @include box-shadow(inset rgba(black, $sVal) 0 1px $inset);
+@mixin btnSubtle($bg: $colorBodyBg, $fg: $colorBodyFg) {
+	@include containerSubtle($bg, $fg, true);
+}
+
+@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%)) {
     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) {
-	@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) {
-	@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) {
-    @include box-shadow(rgba($color, $sVal) 0 0 30px);
+	@include box-shadow(rgba($color, $sVal) 0 0 30px);
 }
 
 @mixin linearGlow($deg: 0, $c: red, $a: 0.4) {
-    @include background-image(linear-gradient($deg, rgba($c, 0), rgba($c, $a) 100%));
+    @include background-image(linear-gradient($deg, rgba($c,0), rgba($c, $a) 100%));
 }
 
 @mixin subtleGrad($deg: 0, $c: red, $a0: 0.2, $a1: 0.3) {
-    @include background-image(linear-gradient($deg, rgba($c, $a0), rgba($c, $a1) 100%));
-}
-
-@mixin txtShdw($sVal) {
-	//@if $sVal != 'none' {
-		@include text-shadow($sVal);
-	//}
+	@include background-image(linear-gradient($deg, rgba($c,$a0), rgba($c, $a1) 100%));
 }
 
 @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) {
-    @include text-shadow(rgba(black, $sVal) 0 3px 7px);
-}
-
-@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);
-				}
-			}
-		}
-	}
+	@include text-shadow(rgba(black, $sVal) 0 3px 7px);
 }
 
+/*********************************************** FORM ELEMENTS */
 @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.4) 0 1px 3px);
-	background: $bg;
+	@include box-shadow(inset rgba(black, 0.65) 0 1px 4px);
+	//	background: lighten($bg, 20%);
+	background: rgba(#fff, 0.1);
 	border: none;
-	color: $fg;
+	//border-bottom: 1px solid rgba(#fff, 0.1);
+	color: lighten($fg, 20%);
 	outline: none;
 	&.error {
 		background: rgba(red, 0.5);
@@ -303,65 +281,50 @@
 	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) {
-    @include input-base($bg, $fg);
-    padding: $interiorMargin;
+	@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%);
+	@include nice-input($bg, $fg);
+	background: lighten($bg, 3%);
+	border-bottom: 1px solid lighten($bg, 10%);
 }
 
+/*
+@mixin invokeMenu($baseColor: $colorBodyFg) {
+	$c: $baseColor;
+	color: $c;
+	&:hover {
+		color: lighten($c, $ltGamma);
+	}
+}
+*/
+
 @mixin menuUlReset() {
     margin: 0;
     padding: 0;
     li {
         list-style-type: none;
-        margin: 0;
+        margin:0;
         padding: 0;
     }
 }
 
-@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 */
-    //position: relative;
-    top: 50%;
-    -webkit-transform: translateY(-50%);
-    -ms-transform: translateY(-50%);
-    transform: translateY(-50%);
-}
-
-@mixin verticalCenterBlock($holderH, $itemH) {
-    top: floor(($holderH - $itemH) / 2);
-    bottom: auto;
-    height: $itemH;
+@mixin vertical-align {
+	/* This doesn't work on an element inside an element with absolute positioning that has height: auto */
+	position: relative;
+	top: 50%;
+	-webkit-transform: translateY(-50%);
+	-ms-transform: translateY(-50%);
+	transform: translateY(-50%);
 }
 
 @mixin ellipsize() {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
 }
 
 @mixin scrollH($showBar: auto) {
@@ -375,26 +338,21 @@
 }
 
 @mixin wait-spinner($b: 5px, $c: $colorAlt1) {
-    display: block;
-    position: absolute;
-    -webkit-animation: rotation .6s infinite linear;
-    -moz-animation: rotation .6s infinite linear;
-    -o-animation: rotation .6s infinite linear;
-    animation: rotation .6s infinite linear;
-    border-color: rgba($c, 0.25);
-    border-top-color: rgba($c, 1.0);
-    border-style: solid;
-    border-width: $b;
-    border-radius: 100%;
+	display: block;
+	position: absolute;
+	-webkit-animation: rotation .6s infinite linear;
+	-moz-animation: rotation .6s infinite linear;
+	-o-animation: rotation .6s infinite linear;
+	animation: rotation .6s infinite linear;
+	border-color: rgba($c, 0.25);
+	border-top-color: rgba($c, 1.0);
+	border-style: solid;
+	border-width: $b;
+	border-radius: 100%;
 }
 
 @mixin test($c: #ffcc00, $a: 0.2) {
-    background-color: rgba($c, $a);
-}
-
-@mixin tmpBorder($c: #ffcc00, $a: 0.75) {
-    @include box-sizing(border-box);
-    border: 1px dotted rgba($c, $a);
+	background-color: rgba($c, $a);
 }
 
 @mixin testObj($w: 2000px, $h: 1000px, $c: black, $a: 0.1) {
@@ -415,6 +373,6 @@
 }
 
 @mixin s-stale($a: 0.5) {
-    color: rgba($colorTelemFresh, $a) !important;
-    font-style: italic;
-}
+	color: rgba($colorTelemFresh, $a) !important;
+	font-style: italic;
+}

platform/commonUI/general/res/sass/_text.scss

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

platform/commonUI/general/res/sass/controls/_buttons.scss

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

platform/commonUI/general/res/sass/controls/_controls.scss

@@ -100,6 +100,22 @@
 	}
 }
 
+.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 {
 	vertical-align: middle;
 	&.l-checkbox {
@@ -137,16 +153,55 @@
 	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 {
-	$bg: pullForward($colorBodyBg, 10%);
+	$bg: lighten($colorBodyBg, $ltGamma);
 	$d: $formRowCtrlsH;
+	//	@include vertical-align();
 	cursor: pointer;
 	display: inline-block;
 	line-height: $d;
 	margin-right: $interiorMargin * 4;
 	padding-left: $d + $interiorMargin;
 	position: relative;
-	vertical-align: middle; // was top
+	vertical-align: top;
 	em {
 		color: $colorBodyFg;
 		display: inline-block;
@@ -155,8 +210,7 @@ label.checkbox.custom {
 		&:before {
 			@include border-radius($basicCr * .75);
 			background: $bg;
-			//border-bottom: 1px solid lighten($bg, 10%);
-			@include box-shadow(inset rgba(black, 0.4) 0 1px 2px);
+			border-bottom: 1px solid lighten($bg, 10%);
 			box-sizing: border-box;
 			content: " ";
 			font-family: 'symbolsfont';
@@ -205,7 +259,7 @@ label.checkbox.custom {
 	}
 }
 
-.s-menu label.checkbox.custom {
+.btn-menu label.checkbox.custom {
 	margin-left: 5px;
 }
 
@@ -216,9 +270,88 @@ 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 {
 	$c: $colorKey;
 	color: $c;
+	//padding: 0 5px;
 	&:hover {
 		color: lighten($c, 10%);
 	}
@@ -230,58 +363,20 @@ label.checkbox.custom {
 
 /******************************************************** OBJECT-HEADER */
 .object-header {
-	//@include test();
+	display: inline-block;
 	font-size: 1em;
-
-	//> .title-label,
-	//> .type-icon,
-	//> .context-available {
-	//	//@include tmpBorder(#6666ff);
-	//	//vertical-align: middle;
-	//}
-
-	> .type-icon {
-		color: $colorObjHdrIc;
-		font-size: 120%;
-		float: left;
-		margin-right: $interiorMargin;
-	}
-
-	.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;
+	.label {
+		.title-label {
+			color: lighten($colorBodyFg, 40%);
+		}
+		.type-icon {
+			font-size: 120%;
+			margin-right: $interiorMargin;
+			vertical-align: middle;
 		}
-	}
-
-	.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 {
-		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;
+			font-size: 0.8em;
 		}
 		&:hover {
 			.context-available {
@@ -291,6 +386,16 @@ label.checkbox.custom {
 	}
 }
 
+.top-bar,
+.object-browse-bar {
+	.object-header {
+		font-size: 1.1em;
+		span {
+			display: inline-block;
+		}
+	}
+}
+
 /******************************************************** SLIDERS */
 
 .slider {
@@ -344,31 +449,24 @@ label.checkbox.custom {
 
 /******************************************************** BROWSER ELEMENTS */
 
-@include desktop {
-	::-webkit-scrollbar {
-		@include border-radius(2px);
-		@include box-sizing(border-box);
-		@include box-shadow(inset $scrollbarTrackShdw);
-		background-color: $scrollbarTrackColorBg;
-		height: $scrollbarTrackSize;
-		width: $scrollbarTrackSize;
-	}
+::-webkit-scrollbar {
+	@include sliderTrack();
+	height: $scrollbarTrackSize;
+	width: $scrollbarTrackSize;
+}
 
-	::-webkit-scrollbar-thumb {
-		$bg: $scrollbarThumbColor;
-		$hc: $scrollbarThumbColorHov;
-		$gr: 5%;
-		@include background-image(linear-gradient(lighten($bg, $gr), $bg 20px));
-		@include border-radius(2px);
-		@include box-sizing(border-box);
-		//@include boxShdwSubtle();
-		//border-top: 1px solid lighten($bg, 20%);
-		&:hover {
-			@include background-image(linear-gradient(lighten($hc, $gr), $hc 20px));
-		}
+::-webkit-scrollbar-thumb {
+	$bg: lighten($colorBodyBg, 10%);
+	@include background-image(linear-gradient(lighten($bg, 10%), lighten($bg, 5%) 20px));
+	@include border-radius(1px);
+	@include box-sizing(border-box);
+	@include boxShdwSubtle();
+	border-top: 1px solid lighten($bg, 20%);
+	&:hover {
+		@include background-image(linear-gradient(lighten($bg, 20%), lighten($bg, 15%) 20px));
 	}
+}
 
-	::-webkit-scrollbar-corner {
-		background: $scrollbarTrackColorBg;
-	}
+::-webkit-scrollbar-corner {
+	background: rgba(#000, 0.4);
 }

platform/commonUI/general/res/sass/controls/_menus.scss

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

platform/commonUI/general/res/sass/features/_imagery.scss

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

platform/commonUI/general/res/sass/forms.scss

@@ -19,28 +19,19 @@
  * this source code distribution or the Licensing information page available
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
-
 @import "compass";
-@import "compass/reset";
 @import "compass/css3";
+@import "compass/css3/border-radius";
+@import "compass/css3/opacity";
 @import "compass/utilities";
 
-@import "../../../../general/res/sass/_mixins";
-@import "../../../../general/res/sass/mobile/mixins";
-@import "mixins";
-
-@import "../../../../general/res/sass/constants";
-@import "../../../../general/res/sass/mobile/constants";
 @import "constants";
-
-@import "../../../../general/res/sass/main"; //
-@import "controls";
-
-
-
-
-
-
-
-
-
+@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";

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

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

platform/commonUI/general/res/sass/forms/_elems.scss

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

platform/commonUI/general/res/sass/forms/_mixins.scss

@@ -0,0 +1,52 @@
+/*****************************************************************************
+ * 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%);
+}

platform/commonUI/general/res/sass/forms/_selects.scss

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

platform/commonUI/general/res/sass/forms/_text-input.scss

@@ -19,31 +19,14 @@
  * this source code distribution or the Licensing information page available
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
-
-/*global define */
-
-define(
-    function () {
-        "use strict";
-
-        /**
-         * Adds a `location` property to newly-created domain objects.
-         * @constructor
-         * @augments {platform/commonUI/browse.CreationService}
-         * @memberof platform/entanglement
-         */
-        function LocatingCreationDecorator(creationService) {
-            this.creationService = creationService;
+input[type="text"] {
+	@include nice-input();
+    &.filter {
+        &.ng-dirty {
+//            background: red;
         }
-
-        LocatingCreationDecorator.prototype.createObject = function (model, parent) {
-            if (parent && parent.getId) {
-                model.location = parent.getId();
-            }
-            return this.creationService.createObject(model, parent);
-        };
-
-        return LocatingCreationDecorator;
     }
-);
-
+	&.numeric {
+		text-align: right;
+	}
+}

platform/commonUI/general/res/sass/forms/_textarea.scss

@@ -0,0 +1,28 @@
+/*****************************************************************************
+ * 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%;
+}

platform/commonUI/general/res/sass/forms/_validation.scss

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

platform/commonUI/general/res/sass/helpers/_bubbles.scss

@@ -75,32 +75,15 @@
 		margin-left: $bubbleArwSize*2;
 		.l-infobubble::before {
 			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 {
-        // 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 {
 			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);
 		}
 	}
 
@@ -139,12 +122,12 @@
 //************************************************* LOOK AND FEEL
 
 .l-thumbsbubble-wrapper {
-    .arw-up {
-        @include triangle('up', $bubbleArwSize, 1.5, $colorThumbsBubbleBg);
-    }
-    .arw-down {
-        @include triangle('down', $bubbleArwSize, 1.5, $colorThumbsBubbleBg);
-    }
+	.arw-up {
+		@include triangle('up', $bubbleArwSize, 1.5, $colorThumbsBubbleBg);
+	}
+	.arw-down {
+		@include triangle('down', $bubbleArwSize, 1.5, $colorThumbsBubbleBg);
+	}
 }
 
 .s-infobubble {

platform/commonUI/general/res/sass/helpers/_splitter.scss

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

platform/commonUI/general/res/sass/inspector/_inspector.scss

@@ -0,0 +1,123 @@
+/*****************************************************************************
+ * Open MCT Web, Copyright (c) 2014-2015, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT Web is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT Web includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+
+// Added by shale on 08/27/2015. Styling for the object inspector. 
+
+.holder.inspector-holder {
+    overflow-y: auto;
+    overflow-x: hidden;
+
+    .info-icon {
+        color: $colorKey;
+    }
+
+    .number-selected {
+        font-size: .8em;
+        padding: 6px;
+        background-color: lighten($colorBodyBg, 15%);
+        color: lighten($colorBodyBg, 45%);
+        border-radius: 4px;
+        margin-top: 4px;
+    }
+
+    ul li {
+        font-size: 0.9em;
+
+        // Add spacing between items
+        padding: 2px 0px;
+        margin: 2px 0px;
+        border-top: solid 1px grey;
+        &:first-child {
+            border-top-width: 0px;
+        }
+
+        // Style the titles
+        em {
+            font-weight: bold;
+            line-height: 1.25em;
+
+            &:after {
+                content: '\A';
+                white-space: pre;
+            }
+        }
+
+        // Style object labels 
+        .inspector-location {
+            display: inline-block;
+            max-width: 100%;
+
+            .label {
+                cursor: pointer;
+                display: inline-block;
+                white-space: nowrap;
+
+                // Colors
+                transition: background-color 0.2s;
+                &:hover {
+                    background-color: lighten($colorBodyBg, 5%);
+                }
+
+                // Sizing and spacing 
+                border-radius: 4px;
+                padding: 3px;
+                margin: 2px;
+
+                // Horizontal overflow 
+                max-width: 100%;
+                text-overflow: ellipsis;
+                overflow-x: hidden;
+
+                .icon.type-icon {
+                    font-size: 14px;
+
+                    .l-icon-link {
+                        color: $colorIconLink;
+
+                        font-size: 6px;
+                        margin-left: -22px;
+                        margin-right: 9px;
+
+                        @include txtShdwSubtle(1);
+                        z-index: 2;
+                    }
+                }
+            }
+
+            // Add arrows to indicate tree heirarchy 
+            &:after {
+                content: '>';
+                font-family: symbolsfont;
+                font-size: 8px;
+
+                //margin-left: -6px;
+                position: relative;
+                top: -8px;
+                left: -4px;
+            }
+            &:last-child:after {
+                content: '';
+                display: inline-block;
+            }
+        }
+    }
+}

platform/commonUI/general/res/sass/inspector/_plot.scss

@@ -20,24 +20,20 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 
-// Override the Create menu for mobile
-@include phoneandtablet {
-    .menu-element {
-        .super-menu {
-            $d: 250px;
-            width: $d;
-            height: $d;
+// Added by shale on 08/26/2015. Additional styling for inspection. 
 
-            .pane {
-                &.left {
-                    border-right: none;
-                    padding-right: 0;
-                    width: 100%;
-                }
-                &.right {
-                    display: none;
-                }
-            }
+// Make plot legend items clickable 
+.plot-legend-item {
+    cursor: pointer;
+    
+    &.inspected {
+        background-color: $colorKeySelectedBg;
+    
+        &.s-limit-upr-yellow:before,
+        &.s-limit-upr-red:before, 
+        &.s-limit-lwr-yellow:before, 
+        &.s-limit-lwr-red:before {
+            color: lighten($colorKeySelectedBg, 20%);
         }
     }
-}
+}

platform/commonUI/general/res/sass/items.scss

@@ -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.
+ *****************************************************************************/
+@import "compass";
+@import "compass/css3";
+@import "compass/css3/border-radius";
+@import "compass/css3/opacity";
+@import "compass/utilities";
+
+@import "constants";
+@import "mixins";
+@import "items/item";

platform/commonUI/general/res/sass/items/_item.scss

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

platform/commonUI/general/res/sass/lists/_tabular.scss

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

platform/commonUI/general/res/sass/mobile/_constants.scss

@@ -1,83 +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.
- *****************************************************************************/
-
-/************************** 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%;

platform/commonUI/general/res/sass/mobile/_item.scss

@@ -1,119 +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.
- *****************************************************************************/
-
-// 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;
-                    }
-                }
-            }
-        }
-    }
-}

platform/commonUI/general/res/sass/mobile/_layout.scss

@@ -1,174 +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.
- *****************************************************************************/
-
-@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;
-    }
-}