[Frontend] CSS tweaks

#445
Modified selector for .t-object-label to
only match first child, hopefully to prevent
nested application of the class;
Modified .loading spinner to use a fixed
size (padding) instead of percentage,
which will work better with wide, short
objects;

.gitignore

@@ -4,8 +4,11 @@
 *.tgz
 *.DS_Store
 
+# Compiled CSS, unless directly added
 *.sass-cache
 *COMPILE.css
+*.css
+*.css.map
 
 # Intellij project configuration files
 *.idea

.npmignore

@@ -0,0 +1,35 @@
+*.scssc
+*.zip
+*.gzip
+*.tgz
+*.DS_Store
+
+*.sass-cache
+*COMPILE.css
+
+# Intellij project configuration files
+*.idea
+*.iml
+
+# External dependencies
+
+# Build output
+target
+
+# Mac OS X Finder
+.DS_Store
+
+# Closed source libraries
+closed-lib
+
+# Node, Bower dependencies
+node_modules
+bower_components
+
+Procfile
+
+# Protractor logs
+protractor/logs
+
+# npm-debug log
+npm-debug.log

LICENSES.md

@@ -416,6 +416,66 @@ CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 
 ---
 
+### CSV.js
+
+#### Info
+
+* Link: https://github.com/knrz/CSV.js
+
+* Version: 3.6.4
+
+* Authors: Kash Nouroozi
+
+* Description: Encoder for CSV (comma separated values) export
+
+#### License
+
+Copyright (c) 2014 Kash Nouroozi
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+
+---
+
+### FileSaver.js
+
+#### Info
+
+* Link: https://github.com/eligrey/FileSaver.js/
+
+* Version: 0.0.2
+
+* Authors: Eli Grey
+
+* Description: File download initiator (for file exports)
+
+#### License
+
+Copyright © 2015 Eli Grey.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+---
+
 ### Json.NET
 
 #### Info

README.md

@@ -45,7 +45,7 @@ When `npm test` is run, test results will be written as HTML to
 
 The tests described above are all at the unit-level; an additional
 test suite using [Protractor](https://angular.github.io/protractor/)
-us under development, in the `protractor` folder.
+is under development, in the `protractor` folder.
 
 To run:
 

app.js

@@ -14,7 +14,8 @@
         options = require('minimist')(process.argv.slice(2)),
         express = require('express'),
         app = express(),
-        fs = require('fs');
+        fs = require('fs'),
+        request = require('request');
 
     // Defaults
     options.port = options.port || options.p || 8080;
@@ -61,6 +62,14 @@
         res.send(JSON.stringify(bundles));
     });
 
+    app.use('/proxyUrl', function proxyRequest(req, res, next) {
+        console.log('Proxying request to: ', req.query.url);
+        req.pipe(request({
+            url: req.query.url,
+            strictSSL: false
+        }).on('error', next)).pipe(res);
+    });
+
     // Expose everything else as static files
     app.use(express['static']('.'));
 

bower.json

@@ -15,6 +15,8 @@
     "text": "requirejs-text#^2.0.14",
     "es6-promise": "^3.0.2",
     "screenfull": "^3.0.0",
-    "node-uuid": "^1.4.7"
+    "node-uuid": "^1.4.7",
+    "comma-separated-values": "^3.6.4",
+    "FileSaver.js": "^0.0.2"
   }
 }

circle.yml

@@ -13,3 +13,6 @@ deployment:
     branch: mobile
     heroku:
       appname: openmctweb-staging-deux
+test:
+  post:
+    - npm run jshint --silent

docs/src/guide/index.md

@@ -910,7 +910,24 @@ A capability's implementation may also expose a static method `appliesTo(model)`
 which should return a boolean value, and will be used by the platform to filter 
 down capabilities to those which should be exposed by specific domain objects, 
 based on their domain object models. 
- 
+
+## Containers Category
+
+Containers provide options for the `mct-container` directive.
+
+The definition for an extension in the `containers` category should include:
+
+* `key`: An identifier for the container.
+* `template`: An Angular template for the container, including an
+  `ng-transclude` where contained content should go.
+* `attributes`: An array of attribute names. The values associated with
+   these attributes will be exposed in the template's scope under the
+   name provided by the `alias` property.
+* `alias`: The property name in scope under which attributes will be
+  exposed. Optional; defaults to "container".
+
+Note that `templateUrl` is not supported for `containers`.
+
 ## Controls Category
 
 Controls provide options for the `mct-control` directive. 

example/export/ExportTelemetryAsCSVAction.js

@@ -0,0 +1,89 @@
+/*****************************************************************************
+ * Open MCT Web, Copyright (c) 2014-2015, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT Web is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT Web includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+/*global define*/
+
+define([], function () {
+    'use strict';
+
+    /**
+     * An example of using the `exportService`; queries for telemetry
+     * and provides the results as a CSV file.
+     * @param {platform/exporters.ExportService} exportService the
+     *        service which will handle the CSV export
+     * @param {ActionContext} context the action's context
+     * @constructor
+     * @memberof example/export
+     * @implements {Action}
+     */
+    function ExportTelemetryAsCSVAction(exportService, context) {
+        this.exportService = exportService;
+        this.context = context;
+    }
+
+    ExportTelemetryAsCSVAction.prototype.perform = function () {
+        var context = this.context,
+            domainObject = context.domainObject,
+            telemetry = domainObject.getCapability("telemetry"),
+            metadata = telemetry.getMetadata(),
+            domains = metadata.domains,
+            ranges = metadata.ranges,
+            exportService = this.exportService;
+
+        function getName(domainOrRange) {
+            return domainOrRange.name;
+        }
+
+        telemetry.requestData({}).then(function (series) {
+            var headers = domains.map(getName).concat(ranges.map(getName)),
+                rows = [],
+                row,
+                i;
+
+            function copyDomainsToRow(row, index) {
+                domains.forEach(function (domain) {
+                    row[domain.name] = series.getDomainValue(index, domain.key);
+                });
+            }
+
+            function copyRangesToRow(row, index) {
+                ranges.forEach(function (range) {
+                    row[range.name] = series.getRangeValue(index, range.key);
+                });
+            }
+
+            for (i = 0; i < series.getPointCount(); i += 1) {
+                row = {};
+                copyDomainsToRow(row, i);
+                copyRangesToRow(row, i);
+                rows.push(row);
+            }
+            exportService.exportCSV(rows, { headers: headers });
+        });
+    };
+
+    ExportTelemetryAsCSVAction.appliesTo = function (context) {
+        return context.domainObject &&
+            context.domainObject.hasCapability("telemetry");
+    };
+
+    return ExportTelemetryAsCSVAction;
+});

example/export/bundle.js

@@ -0,0 +1,45 @@
+/*****************************************************************************
+ * Open MCT Web, Copyright (c) 2014-2015, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT Web is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT Web includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+/*global define*/
+
+define([
+    'legacyRegistry',
+    './ExportTelemetryAsCSVAction'
+], function (legacyRegistry, ExportTelemetryAsCSVAction) {
+    "use strict";
+
+    legacyRegistry.register("example/export", {
+        "name": "Example of using CSV Export",
+        "extensions": {
+            "actions": [
+                {
+                    "key": "example.export",
+                    "name": "Export Telemetry as CSV",
+                    "implementation": ExportTelemetryAsCSVAction,
+                    "category": "contextual",
+                    "glyph": "\u0033",
+                    "depends": [ "exportService" ]
+                }
+            ]
+        }
+    });
+});

example/imagery/bundle.js

@@ -60,7 +60,7 @@ define([
                             {
                                 "name": "Time",
                                 "key": "time",
-                                "format": "timestamp"
+                                "format": "utc"
                             }
                         ],
                         "ranges": [

example/mobile/res/config.rb

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

example/mobile/res/css/mobile-example.css

@@ -1,103 +0,0 @@
-/*****************************************************************************
- * Open MCT Web, Copyright (c) 2014-2015, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT Web is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT Web includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-/*****************************************************************************
- * Open MCT Web, Copyright (c) 2014-2015, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT Web is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT Web includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-/************************** FEATURES */
-/************************** VERY INFLUENTIAL GLOBAL DIMENSIONS */
-/************************** RATIOS */
-/************************** LAYOUT */
-/************************** CONTROLS */
-/************************** PATHS */
-/************************** TIMINGS */
-/************************** LIMITS */
-/*****************************************************************************
- * 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 */
-/************************** MOBILE TREE MENU DIMENSIONS */
-/************************** WINDOW DIMENSIONS FOR RWD */
-/************************** MEDIA QUERIES: WINDOW CHECKS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
-/************************** MEDIA QUERIES: WINDOWS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
-/************************** DEVICE PARAMETERS FOR MENUS/REPRESENTATIONS */
-/*****************************************************************************
- * 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.
- *****************************************************************************/
-/* REQUIRES mobile/_constants */
-@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
-  /* line 28, ../sass/mobile-example.scss */
-  .create-btn-holder {
-    display: block !important; } }

example/msl/README.md

@@ -0,0 +1,20 @@
+To use this bundle, add the following paths to /main.js -
+'./platform/features/conductor/bundle',
+'./example/msl/bundle',
+
+An example plugin that integrates with public data from the Curiosity rover. 
+The data shown used by this plugin is published by the Centro de 
+Astrobiología (CSIC-INTA) at http://cab.inta-csic.es/rems/
+
+Fetching data from this source requires a cross-origin request which will 
+fail on most modern browsers due to restrictions on such requests. As such, 
+it is proxied through a local proxy defined in app.js. In order to use this 
+example you will need to run app.js locally.
+
+This example shows integration with an historical telemetry source, as 
+opposed to a real-time data source that is streaming back current information 
+about the state of a system. This example is atypical of a historical data 
+source in that it fetches all data in one request. The server infrastructure 
+of an historical telemetry source should ideally allow queries bounded by 
+time and other data attributes.
+

example/msl/bundle.js

@@ -0,0 +1,118 @@
+/*****************************************************************************
+ * Open MCT Web, Copyright (c) 2014-2015, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT Web is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT Web includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+/*global define*/
+
+define([
+    "./src/RemsTelemetryServerAdapter",
+    "./src/RemsTelemetryInitializer",
+    "./src/RemsTelemetryModelProvider",
+    "./src/RemsTelemetryProvider",
+    'legacyRegistry',
+    "module"
+], function (
+    RemsTelemetryServerAdapter,
+    RemsTelemetryInitializer,
+    RemsTelemetryModelProvider,
+    RemsTelemetryProvider,
+    legacyRegistry
+) {
+    "use strict";
+    legacyRegistry.register("example/notifications", {
+        "name" : "Mars Science Laboratory Data Adapter",
+        "extensions" : {
+        "types": [
+            {
+                "name":"Mars Science Laboratory",
+                "key": "msl.curiosity",
+                "glyph": "o"
+            },
+            {
+                "name": "Instrument",
+                "key": "msl.instrument",
+                "glyph": "o",
+                "model": {"composition": []}
+            },
+            {
+                "name": "Measurement",
+                "key": "msl.measurement",
+                "glyph": "T",
+                "model": {"telemetry": {}},
+                "telemetry": {
+                    "source": "rems.source",
+                    "domains": [
+                        {
+                            "name": "Time",
+                            "key": "timestamp",
+                            "format": "utc"
+                        }
+                    ]
+                }
+            }
+        ],
+        "constants": [
+            {
+                "key": "REMS_WS_URL",
+                "value": "/proxyUrl?url=http://cab.inta-csic.es/rems/wp-content/plugins/marsweather-widget/api.php"
+            }
+        ],
+        "roots": [
+            {
+                "id": "msl:curiosity",
+                "priority" : "preferred",
+                "model": {
+                    "type": "msl.curiosity",
+                    "name": "Mars Science Laboratory",
+                    "composition": []
+                }
+            }
+        ],
+        "services": [
+            {
+                "key":"rems.adapter",
+                "implementation": RemsTelemetryServerAdapter,
+                "depends": ["$q", "$http", "$log", "REMS_WS_URL"]
+            }
+        ],
+        "runs": [
+            {
+                "implementation": RemsTelemetryInitializer,
+                "depends": ["rems.adapter", "objectService"]
+            }
+        ],
+        "components": [
+            {
+                "provides": "modelService",
+                "type": "provider",
+                "implementation": RemsTelemetryModelProvider,
+                "depends": ["rems.adapter"]
+            },
+            {
+                "provides": "telemetryService",
+                "type": "provider",
+                "implementation": RemsTelemetryProvider,
+                "depends": ["rems.adapter", "$q"]
+            }
+        ]
+    }
+    });
+});
+

example/msl/src/MSLDataDictionary.js

@@ -0,0 +1,79 @@
+/*****************************************************************************
+ * 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(
+    [],
+    /**
+     * A data dictionary describes the telemetry available from a data
+     * source and its data types. The data dictionary will be parsed by a custom
+     * server provider for this data source (in this case
+     * {@link RemsTelemetryServerAdapter}).
+     *
+     * Typically a data dictionary would be made available alongside the
+     * telemetry data source itself.
+     */
+    function () {
+        return {
+            "name": "Mars Science Laboratory",
+            "identifier": "msl",
+            "instruments": [
+                {
+                    "name":"rems",
+                    "identifier": "rems",
+                    "measurements": [
+                        {
+                            "name": "Min. Air Temperature",
+                            "identifier": "min_temp",
+                            "units": "degrees",
+                            "type": "float"
+                        },
+                        {
+                            "name": "Max. Air Temperature",
+                            "identifier": "max_temp",
+                            "units": "degrees",
+                            "type": "float"
+                        },
+                        {
+                            "name": "Atmospheric Pressure",
+                            "identifier": "pressure",
+                            "units": "pascals",
+                            "type": "float"
+                        },
+                        {
+                            "name": "Min. Ground Temperature",
+                            "identifier": "min_gts_temp",
+                            "units": "degrees",
+                            "type": "float"
+                        },
+                        {
+                            "name": "Max. Ground Temperature",
+                            "identifier": "max_gts_temp",
+                            "units": "degrees",
+                            "type": "float"
+                        }
+                    ]
+                }
+            ]
+        };
+    }
+);

example/msl/src/RemsTelemetryInitializer.js

@@ -0,0 +1,71 @@
+/*****************************************************************************
+ * 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 TAXONOMY_ID = "msl:curiosity",
+            PREFIX = "msl_tlm:";
+
+        /**
+         * Function that is executed on application startup and populates
+         * the navigation tree with objects representing the MSL REMS
+         * telemetry points. The tree is populated based on the data
+         * dictionary on the provider.
+         *
+         * @param {RemsTelemetryServerAdapter} adapter The server adapter
+         * (necessary in order to retrieve data dictionary)
+         * @param objectService the ObjectService which allows for lookup of
+         * objects by ID
+         * @constructor
+         */
+        function RemsTelemetryInitializer(adapter, objectService) {
+            function makeId(element) {
+                return PREFIX + element.identifier;
+            }
+
+            function initializeTaxonomy(dictionary) {
+                function getTaxonomyObject(domainObjects) {
+                    return domainObjects[TAXONOMY_ID];
+                }
+
+                function populateModel (taxonomyObject) {
+                    return taxonomyObject.useCapability(
+                        "mutation",
+                        function (model) {
+                            model.name = dictionary.name;
+                            model.composition = dictionary.instruments.map(makeId);
+                        }
+                    );
+                }
+
+                objectService.getObjects([TAXONOMY_ID])
+                    .then(getTaxonomyObject)
+                    .then(populateModel);
+            }
+            initializeTaxonomy(adapter.dictionary);
+        }
+        return RemsTelemetryInitializer;
+    }
+);

example/msl/src/RemsTelemetryModelProvider.js

@@ -0,0 +1,87 @@
+/*****************************************************************************
+ * 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 PREFIX = "msl_tlm:",
+            FORMAT_MAPPINGS = {
+                float: "number",
+                integer: "number",
+                string: "string"
+            };
+
+        function RemsTelemetryModelProvider(adapter){
+
+            function isRelevant(id) {
+                return id.indexOf(PREFIX) === 0;
+            }
+
+            function makeId(element){
+                return PREFIX + element.identifier;
+            }
+
+            function buildTaxonomy(dictionary){
+                var models = {};
+
+                function addMeasurement(measurement){
+                    var format = FORMAT_MAPPINGS[measurement.type];
+                    models[makeId(measurement)] = {
+                        type: "msl.measurement",
+                        name: measurement.name,
+                        telemetry: {
+                            key: measurement.identifier,
+                            ranges: [{
+                                key: "value",
+                                name: measurement.units,
+                                units: measurement.units,
+                                format: format
+                            }]
+                        }
+                    };
+                }
+
+                function addInstrument(subsystem) {
+                    var measurements = (subsystem.measurements || []);
+                    models[makeId(subsystem)] = {
+                        type: "msl.instrument",
+                        name: subsystem.name,
+                        composition: measurements.map(makeId)
+                    };
+                    measurements.forEach(addMeasurement);
+                }
+
+                (dictionary.instruments || []).forEach(addInstrument);
+                return models;
+            }
+
+            return {
+                getModels: function (ids) {
+                    return ids.some(isRelevant) ? buildTaxonomy(adapter.dictionary) : {};
+                }
+            };
+        }
+        return RemsTelemetryModelProvider;
+    }
+);

example/msl/src/RemsTelemetryProvider.js

@@ -0,0 +1,83 @@
+/*****************************************************************************
+ * Open MCT Web, Copyright (c) 2014-2015, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT Web is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT Web includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+/*global define */
+define (
+    ['./RemsTelemetrySeries'],
+    function (RemsTelemetrySeries) {
+        "use strict";
+
+        var SOURCE = "rems.source";
+
+        function RemsTelemetryProvider(adapter, $q) {
+            this.adapter = adapter;
+            this.$q = $q;
+        }
+
+        /**
+         * Retrieve telemetry from this telemetry source.
+         * @memberOf example/msl
+         * @param {Array<TelemetryRequest>} requests An array of all request
+         * objects (which needs to be filtered to only those relevant to this
+         * source)
+         * @returns {Promise} A {@link Promise} resolved with a {@link RemsTelemetrySeries}
+         * object that wraps the telemetry returned from the telemetry source.
+         */
+        RemsTelemetryProvider.prototype.requestTelemetry = function (requests) {
+            var packaged = {},
+                relevantReqs,
+                adapter = this.adapter;
+
+            function matchesSource(request) {
+                return (request.source === SOURCE);
+            }
+
+            function addToPackage(history) {
+                packaged[SOURCE][history.id] =
+                    new RemsTelemetrySeries(history.values);
+            }
+
+            function handleRequest(request) {
+                return adapter.history(request).then(addToPackage);
+            }
+
+            relevantReqs = requests.filter(matchesSource);
+            packaged[SOURCE] = {};
+
+            return this.$q.all(relevantReqs.map(handleRequest))
+                .then(function () {
+                    return packaged;
+                });
+        };
+
+        /**
+         * This data source does not support real-time subscriptions
+         */
+        RemsTelemetryProvider.prototype.subscribe = function (callback, requests) {
+            return function() {};
+        };
+        RemsTelemetryProvider.prototype.unsubscribe = function (callback, requests) {
+            return function() {};
+        };
+
+        return RemsTelemetryProvider;
+    }
+);

example/msl/src/RemsTelemetrySeries.js

@@ -0,0 +1,84 @@
+/*****************************************************************************
+ * 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";
+
+        /**
+         * @typedef {Object} RemsTelemetryValue
+         * @memberOf example/msl
+         * @property {number} date The date/time of the telemetry value. Constitutes the domain value of this value pair
+         * @property {number} value The value of this telemetry datum.
+         * A floating point value representing some observable quantity (eg.
+         * temperature, air pressure, etc.)
+         */
+
+        /**
+         * A representation of a collection of telemetry data. The REMS
+         * telemetry data is time ordered, with the 'domain' value
+         * constituting the time stamp of each data value and the
+         * 'range' being the value itself.
+         *
+         * TelemetrySeries will typically wrap an array of telemetry data,
+         * and provide an interface for retrieving individual an telemetry
+         * value.
+         * @memberOf example/msl
+         * @param {Array<RemsTelemetryValue>} data An array of telemetry values
+         * @constructor
+         */
+        function RemsTelemetrySeries(data) {
+            this.data = data;
+        }
+
+        /**
+         * @returns {number} A count of the number of data values available in
+         * this series
+         */
+        RemsTelemetrySeries.prototype.getPointCount = function() {
+                    return this.data.length;
+        };
+        /**
+         * The domain value at the given index. The Rems telemetry data is
+         * time ordered, so the domain value is the time stamp of each data
+         * value.
+         * @param index
+         * @returns {number} the time value in ms since 1 January 1970
+         */
+        RemsTelemetrySeries.prototype.getDomainValue = function(index) {
+                    return this.data[index].date;
+        };
+
+        /**
+         * The range value of the REMS data set is the value of the thing
+         * being measured, be it temperature, air pressure, etc.
+         * @param index The datum in the data series to return the range
+         * value of.
+         * @returns {number} A floating point number
+         */
+        RemsTelemetrySeries.prototype.getRangeValue = function(index) {
+                    return this.data[index].value;
+        };
+
+        return RemsTelemetrySeries;
+    }
+);

example/msl/src/RemsTelemetryServerAdapter.js

@@ -0,0 +1,142 @@
+/*****************************************************************************
+ * 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*/
+/*jslint es5: true */
+
+define(
+    [
+        "./MSLDataDictionary",
+        "module"
+    ],
+    function (MSLDataDictionary, module) {
+        "use strict";
+
+        var TERRESTRIAL_DATE = "terrestrial_date",
+            LOCAL_DATA = "../data/rems.json";
+
+        /**
+         * Fetches historical data from the REMS instrument on the Curiosity
+         * Rover.
+         * @memberOf example/msl
+         * @param $q
+         * @param $http
+         * @param REMS_WS_URL The location of the REMS telemetry data.
+         * @constructor
+         */
+        function RemsTelemetryServerAdapter($q, $http, $log, REMS_WS_URL) {
+            this.localDataURI = module.uri.substring(0, module.uri.lastIndexOf('/') + 1) + LOCAL_DATA;
+            this.deferreds = {};
+            this.REMS_WS_URL = REMS_WS_URL;
+            this.$q = $q;
+            this.$http = $http;
+            this.$log = $log;
+            this.cache = undefined;
+        }
+
+        /**
+         * The data dictionary for this data source.
+         * @type {MSLDataDictionary}
+         */
+        RemsTelemetryServerAdapter.prototype.dictionary = MSLDataDictionary;
+
+        /**
+         * Fetches historical data from source, and associates it with the
+         * given request ID.
+         * @private
+         */
+        RemsTelemetryServerAdapter.prototype.requestHistory = function(request) {
+            var self = this,
+                id = request.key,
+                deferred = this.$q.defer();
+
+            function processResponse(response){
+                var data = [];
+                /*
+                 * Currently all data is returned for entire history of the mission. Cache response to avoid unnecessary re-queries.
+                 */
+                self.cache = response;
+                /*
+                 * History data is organised by Sol. Iterate over sols...
+                 */
+                response.data.soles.forEach(function(solData){
+                    /*
+                     * Check that valid data exists
+                     */
+                    if (!isNaN(solData[id])) {
+                        /*
+                         * Append each data point to the array of values
+                         * for this data point property (min. temp, etc).
+                         */
+                        data.unshift({
+                            date: Date.parse(solData[TERRESTRIAL_DATE]),
+                            value: solData[id]
+                        });
+                    }
+                });
+                return data;
+            }
+
+            function fallbackToLocal() {
+                self.$log.warn("Loading REMS data failed, probably due to" +
+                    " cross origin policy. Falling back to local data");
+                return self.$http.get(self.localDataURI);
+            }
+
+            //Filter results to match request parameters
+            function filterResults(results) {
+                return results.filter(function(result){
+                    return result.date >= (request.start || Number.MIN_VALUE) &&
+                        result.date <= (request.end || Number.MAX_VALUE);
+                });
+            }
+
+            function packageAndResolve(results){
+                deferred.resolve({id: id, values: results});
+            }
+
+
+            this.$q.when(this.cache || this.$http.get(this.REMS_WS_URL))
+                .catch(fallbackToLocal)
+                .then(processResponse)
+                .then(filterResults)
+                .then(packageAndResolve);
+
+            return deferred.promise;
+        };
+
+        /**
+         * Requests historical telemetry for the named data attribute. In
+         * the case of REMS, this data source exposes multiple different
+         * data variables from the REMS instrument, including temperature
+         * and others
+         * @param id The telemetry data point key to be queried.
+         * @returns {Promise | Array<RemsTelemetryValue>} that resolves with an Array of {@link RemsTelemetryValue} objects for the request data key.
+         */
+        RemsTelemetryServerAdapter.prototype.history = function(request) {
+            var id = request.key;
+            return this.requestHistory(request);
+        };
+
+        return RemsTelemetryServerAdapter;
+    }
+);
+

example/notifications/res/dialog-launch.html

@@ -1,10 +1,9 @@
 <span class="status block ok" ng-controller="DialogLaunchController">
-    <span class="ui-symbol status-indicator">&#xe600;</span>
-    <span class="label">
+    <!-- DO NOT ADD SPACES BETWEEN THE SPANS - IT ADDS WHITE SPACE!! -->
+    <span class="ui-symbol status-indicator">&#xe600;</span><span class="label">
         <a ng-click="launchProgress(true)">Known</a> |
         <a ng-click="launchProgress(false)">Unknown</a> |
         <a ng-click="launchError()">Error</a> |
         <a ng-click="launchInfo()">Info</a>
-    </span>
-    <span class="count">Dialogs</span>
+    </span><span class="count">Dialogs</span>
 </span>

example/notifications/res/notification-launch.html

@@ -1,10 +1,9 @@
 <span class="status block ok" ng-controller="NotificationLaunchController">
-    <span class="ui-symbol status-indicator">&#xe600;</span>
-    <span class="label">
+    <!-- DO NOT ADD SPACES BETWEEN THE SPANS - IT ADDS WHITE SPACE!! -->
+    <span class="ui-symbol status-indicator">&#xe600;</span><span class="label">
         <a ng-click="newInfo()">Success</a> |
         <a ng-click="newError()">Error</a> |
         <a ng-click="newAlert()">Alert</a> |
         <a ng-click="newProgress()">Progress</a>
-    </span>
-    <span class="count">Notifications</span>
+    </span><span class="count">Notifications</span>
 </span>

example/plotOptions/bundle.js

@@ -0,0 +1,145 @@
+/*****************************************************************************
+ * 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([
+    'legacyRegistry',
+    '../../platform/commonUI/browse/src/InspectorRegion',
+    '../../platform/commonUI/regions/src/Region'
+], function (
+    legacyRegistry,
+    InspectorRegion,
+    Region
+) {
+    "use strict";
+
+    /**
+     * Add a 'plot options' region part to the inspector region for the
+     * Telemetry Plot type only. {@link InspectorRegion} is a default region
+     * implementation that is added automatically to all types. In order to
+     * customize what appears in the inspector region, you can start from a
+     * blank slate by using Region, or customize the default inspector
+     * region by using {@link InspectorRegion}.
+     */
+    var plotInspector = new InspectorRegion(),
+     /**
+      * Two region parts are defined here. One that appears only in browse
+      * mode, and one that appears only in edit mode. For not they both point
+      * to the same representation, but a different key could be used here to
+      * include a customized representation for edit mode.
+      */
+        plotOptionsBrowseRegion = new Region({
+            name: "plot-options",
+            title: "Plot Options",
+            modes: ['browse'],
+            content: {
+                key: "plot-options-browse"
+            }
+        }),
+        plotOptionsEditRegion = new Region({
+            name: "plot-options",
+            title: "Plot Options",
+            modes: ['edit'],
+            content: {
+                key: "plot-options-browse"
+            }
+        });
+
+    /**
+     * Both parts are added, and policies of type 'region' will determine
+     * which is shown based on domain object state. A default policy is
+     * provided which will check the 'modes' attribute of the region part
+     * definition.
+     */
+    plotInspector.addRegion(plotOptionsBrowseRegion);
+    plotInspector.addRegion(plotOptionsEditRegion);
+
+    legacyRegistry.register("example/plotType", {
+        "name": "Plot Type",
+        "description": "Example illustrating registration of a new object type",
+        "extensions": {
+            "types": [
+                {
+                    "key": "plot",
+                    "name": "Telemetry Plot",
+                    "glyph": "t",
+                    "description": "A plot for displaying telemetry",
+                    "delegates": [
+                        "telemetry"
+                    ],
+                    "features": "creation",
+                    "contains": [
+                        {
+                            "has": "telemetry"
+                        }
+                    ],
+                    "model": {
+                        "composition": []
+                    },
+                    "inspector": plotInspector,
+                    "telemetry": {
+                        "source": "generator",
+                        "domains": [
+                            {
+                                "key": "time",
+                                "name": "Time"
+                            },
+                            {
+                                "key": "yesterday",
+                                "name": "Yesterday"
+                            },
+                            {
+                                "key": "delta",
+                                "name": "Delta",
+                                "format": "example.delta"
+                            }
+                        ],
+                        "ranges": [
+                            {
+                                "key": "sin",
+                                "name": "Sine"
+                            },
+                            {
+                                "key": "cos",
+                                "name": "Cosine"
+                            }
+                        ]
+                    },
+                    "properties": [
+                        {
+                            "name": "Period",
+                            "control": "textfield",
+                            "cssclass": "l-small l-numeric",
+                            "key": "period",
+                            "required": true,
+                            "property": [
+                                "telemetry",
+                                "period"
+                            ],
+                            "pattern": "^\\d*(\\.\\d*)?$"
+                        }
+                    ]
+                }
+            ]
+        }
+    });
+});

gulpfile.js

@@ -24,7 +24,9 @@
 var gulp = require('gulp'),
     requirejsOptimize = require('gulp-requirejs-optimize'),
     sourcemaps = require('gulp-sourcemaps'),
-    compass = require('gulp-compass'),
+    rename = require('gulp-rename'),
+    sass = require('gulp-sass'),
+    bourbon = require('node-bourbon'),
     jshint = require('gulp-jshint'),
     jscs = require('gulp-jscs'),
     replace = require('gulp-replace-task'),
@@ -38,7 +40,7 @@ var gulp = require('gulp'),
         main: 'main.js',
         dist: 'dist',
         assets: 'dist/assets',
-        scss: 'platform/**/*.scss',
+        scss: ['./platform/**/*.scss', './example/**/*.scss'],
         scripts: [ 'main.js', 'platform/**/*.js', 'src/**/*.js' ],
         static: [
             'index.html',
@@ -57,9 +59,8 @@ var gulp = require('gulp'),
             configFile: path.resolve(__dirname, 'karma.conf.js'),
             singleRun: true
         },
-        compass: {
-            sass: __dirname,
-            css: paths.assets
+        sass: {
+            includePaths: bourbon.includePaths
         },
         replace: {
             variables: {
@@ -85,9 +86,15 @@ gulp.task('test', function (done) {
 });
 
 gulp.task('stylesheets', function () {
-    return gulp.src(paths.scss)
-        .pipe(compass(options.compass))
-        .pipe(gulp.dest(paths.assets));
+    return gulp.src(paths.scss, {base: '.'})
+        .pipe(sourcemaps.init())
+        .pipe(sass(options.sass).on('error', sass.logError))
+        .pipe(rename(function (file) {
+            file.dirname = file.dirname.replace('/sass', '/css');
+            return file;
+        }))
+        .pipe(sourcemaps.write('.'))
+        .pipe(gulp.dest(__dirname));
 });
 
 gulp.task('lint', function () {
@@ -110,11 +117,22 @@ gulp.task('fixstyle', function () {
         .pipe(gulp.dest('.'));
 });
 
-gulp.task('static', function () {
+gulp.task('static', ['stylesheets'], function () {
     return gulp.src(paths.static, { base: '.' })
         .pipe(gulp.dest(paths.dist));
 });
 
+gulp.task('watch', function () {
+    gulp.watch(paths.scss, ['stylesheets']);
+});
+
+gulp.task('serve', function () {
+    console.log('Running development server with all defaults');
+    var app = require('./app.js');
+});
+
+gulp.task('develop', ['serve', 'stylesheets', 'watch']);
+
 gulp.task('install', [ 'static', 'scripts' ]);
 
 gulp.task('verify', [ 'lint', 'test' ]);

index.html

@@ -33,13 +33,18 @@
             mct.run();
         });
     </script>
+    <link rel="stylesheet" href="platform/commonUI/general/res/css/startup-base.css">
+    <link rel="stylesheet" href="platform/commonUI/general/res/css/openmct.css">
 	<link rel="icon" type="image/png" href="platform/commonUI/general/res/images/favicons/favicon-32x32.png" sizes="32x32">
 	<link rel="icon" type="image/png" href="platform/commonUI/general/res/images/favicons/favicon-96x96.png" sizes="96x96">
 	<link rel="icon" type="image/png" href="platform/commonUI/general/res/images/favicons/favicon-16x16.png" sizes="16x16">
 	<link rel="shortcut icon" href="platform/commonUI/general/res/images/favicons/favicon.ico">
 </head>
-<body class="user-environ" ng-view>
-
+<body class="user-environ">
+    <div class="l-splash-holder s-splash-holder">
+        <div class="l-splash s-splash"></div>
+    </div>
 
+    <div ng-view></div>
 </body>
 </html>

karma.conf.js

@@ -20,7 +20,7 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 
-/*global module*/
+/*global module,process*/
 module.exports = function(config) {
     config.set({
 
@@ -39,6 +39,7 @@ module.exports = function(config) {
             {pattern: 'example/**/*.js', included: false},
             {pattern: 'platform/**/*.js', included: false},
             {pattern: 'warp/**/*.js', included: false},
+            {pattern: 'platform/**/*.html', included: false},
             'test-main.js'
         ],
 
@@ -57,7 +58,7 @@ module.exports = function(config) {
         // Test results reporter to use
         // Possible values: 'dots', 'progress'
         // Available reporters: https://npmjs.org/browse/keyword/karma-reporter
-        reporters: ['progress', 'coverage', 'html'],
+        reporters: ['progress', 'coverage', 'html', 'junit'],
 
         // Web server port.
         port: 9876,
@@ -78,7 +79,9 @@ module.exports = function(config) {
 
         // Code coverage reporting.
         coverageReporter: {
-            dir: "dist/coverage"
+            dir: process.env.CIRCLE_ARTIFACTS ?
+                process.env.CIRCLE_ARTIFACTS + '/coverage' :
+                "dist/coverage"
         },
 
         // HTML test reporting.
@@ -88,6 +91,10 @@ module.exports = function(config) {
             foldAll: false
         },
 
+        junitReporter: {
+            outputDir: process.env.CIRCLE_TEST_REPORTS || 'target/junit'
+        },
+
         // Continuous Integration mode.
         // If true, Karma captures browsers, runs the tests and exits.
         singleRun: true

main.js

@@ -26,9 +26,11 @@ requirejs.config({
         "legacyRegistry": "src/legacyRegistry",
         "angular": "bower_components/angular/angular.min",
         "angular-route": "bower_components/angular-route/angular-route.min",
+        "csv": "bower_components/comma-separated-values/csv.min",
         "es6-promise": "bower_components/es6-promise/promise.min",
         "moment": "bower_components/moment/moment",
         "moment-duration-format": "bower_components/moment-duration-format/lib/moment-duration-format",
+        "saveAs": "bower_components/FileSaver.js/FileSaver.min",
         "screenfull": "bower_components/screenfull/dist/screenfull.min",
         "text": "bower_components/text/text",
         "uuid": "bower_components/node-uuid/uuid"
@@ -65,6 +67,7 @@ define([
     './platform/commonUI/notification/bundle',
     './platform/containment/bundle',
     './platform/execution/bundle',
+    './platform/exporters/bundle',
     './platform/telemetry/bundle',
     './platform/features/clock/bundle',
     './platform/features/events/bundle',
@@ -83,6 +86,7 @@ define([
     './platform/entanglement/bundle',
     './platform/search/bundle',
     './platform/status/bundle',
+    './platform/commonUI/regions/bundle',
 
     './example/imagery/bundle',
     './example/eventGenerator/bundle',

package.json

@@ -1,21 +1,23 @@
 {
   "name": "openmctweb",
-  "version": "0.9.1-SNAPSHOT",
+  "version": "0.9.2-SNAPSHOT",
   "description": "The Open MCT Web core platform",
   "dependencies": {
     "express": "^4.13.1",
-    "minimist": "^1.1.1"
+    "minimist": "^1.1.1",
+    "request": "^2.69.0"
   },
   "devDependencies": {
     "bower": "^1.7.7",
     "git-rev-sync": "^1.4.0",
     "glob": ">= 3.0.0",
     "gulp": "^3.9.0",
-    "gulp-compass": "^2.1.0",
     "gulp-jscs": "^3.0.2",
     "gulp-jshint": "^2.0.0",
+    "gulp-rename": "^1.2.2",
     "gulp-replace-task": "^0.11.0",
     "gulp-requirejs-optimize": "^0.3.1",
+    "gulp-sass": "^2.2.0",
     "gulp-sourcemaps": "^1.6.0",
     "jasmine-core": "^2.3.0",
     "jsdoc": "^3.3.2",
@@ -26,21 +28,23 @@
     "karma-coverage": "^0.5.3",
     "karma-html-reporter": "^0.2.7",
     "karma-jasmine": "^0.1.5",
-    "karma-phantomjs-launcher": "^0.2.3",
+    "karma-junit-reporter": "^0.3.8",
+    "karma-phantomjs-launcher": "^1.0.0",
     "karma-requirejs": "^0.2.2",
     "lodash": "^3.10.1",
     "markdown-toc": "^0.11.7",
     "marked": "^0.3.5",
     "mkdirp": "^0.5.1",
     "moment": "^2.11.1",
-    "phantomjs": "^1.9.19",
+    "node-bourbon": "^4.2.3",
+    "phantomjs-prebuilt": "^2.1.0",
     "requirejs": "^2.1.17",
     "split": "^1.0.0"
   },
   "scripts": {
     "start": "node app.js",
     "test": "karma start --single-run",
-    "jshint": "jshint platform example || exit 0",
+    "jshint": "jshint platform example",
     "watch": "karma start",
     "jsdoc": "jsdoc -c jsdoc.json -r -d target/docs/api",
     "otherdoc": "node docs/gendocs.js --in docs/src --out target/docs --suppress-toc 'docs/src/index.md|docs/src/process/index.md'",

platform/commonUI/about/bundle.js

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

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

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

platform/commonUI/browse/bundle.js

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

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

@@ -44,7 +44,7 @@
         </div>
     </div>
     <div class="holder l-flex-col flex-elem grows l-object-wrapper">
-        <div class="holder l-flex-col flex-elem grows l-object-wrapper-inner">
+        <div ng-if="isEditable" class="holder l-flex-col flex-elem grows l-object-wrapper-inner">
             <!-- Toolbar and Save/Cancel buttons -->
             <div class="l-edit-controls flex-elem l-flex-row flex-align-end">
                 <mct-toolbar name="mctToolbar"
@@ -63,6 +63,20 @@
                                 class="abs flex-elem grows object-holder-main scroll"
                                 toolbar="toolbar">
             </mct-representation>
-        </div><!--/ l-object-wrapper-inner -->
+        </div>
+        <div ng-if="!isEditable" class="holder l-flex-col flex-elem grows l-object-wrapper-inner">
+            <!-- Toolbar and Save/Cancel buttons -->
+            <div class="l-edit-controls flex-elem l-flex-row flex-align-end">
+                <mct-representation key="'edit-action-buttons'"
+                                    mct-object="domainObject"
+                                    class='flex-elem conclude-editing'>
+                </mct-representation>
+
+            </div>
+            <mct-representation key="representation.selected.key"
+                                mct-object="representation.selected.key && domainObject"
+                                class="abs flex-elem grows object-holder-main scroll">
+            </mct-representation>
+        </div>
     </div>
 </div>

platform/commonUI/browse/res/templates/browse/inspector-region.html

@@ -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.
+-->
+<div ng-controller="InspectorController">
+    <div ng-repeat="region in regions">
+        <mct-representation
+                key="region.content.key"
+                mct-object="domainObject"
+                ng-model="ngModel">
+        </mct-representation>
+    </div>
+</div>

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

@@ -0,0 +1,60 @@
+<!--
+ Open MCT Web, Copyright (c) 2014-2015, United States Government
+ as represented by the Administrator of the National Aeronautics and Space
+ Administration. All rights reserved.
+
+ Open MCT Web is licensed under the Apache License, Version 2.0 (the
+ "License"); you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+ http://www.apache.org/licenses/LICENSE-2.0.
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ License for the specific language governing permissions and limitations
+ under the License.
+
+ Open MCT Web includes source code licensed under additional open source
+ licenses. See the Open Source Licenses file (LICENSES.md) included with
+ this source code distribution or the Licensing information page available
+ at runtime from the About dialog for additional information.
+-->
+<div ng-controller="ObjectInspectorController as controller">
+    <ul class="flex-elem grows l-inspector-part">
+        <li>
+            <em class="t-inspector-part-header">Properties</em>
+            <div class="inspector-properties"
+                 ng-repeat="data in metadata"
+                 ng-class="{ first:$index === 0 }">
+                <div class="label">{{ data.name }}</div>
+                <div class="value">{{ data.value }}</div>
+            </div>
+        </li>
+        <li ng-if="contextutalParents.length > 0">
+            <em class="t-inspector-part-header" title="The location of this linked object.">Location</em>
+            <span class="inspector-location"
+                  ng-repeat="parent in contextutalParents"
+                  ng-class="{ last:($index + 1) === contextualParents.length }">
+                <mct-representation key="'label'"
+                                    mct-object="parent"
+                                    ng-model="ngModel"
+                                    ng-click="ngModel.selectedObject = parent"
+                                    class="location-item">
+                </mct-representation>
+            </span>
+        </li>
+        <li ng-if="primaryParents.length > 0">
+            <em class="t-inspector-part-header" title="The location of the original object that this was linked from.">Original Location</em>
+            <span class="inspector-location"
+                  ng-repeat="parent in primaryParents"
+                  ng-class="{ last:($index + 1) === primaryParents.length }">
+                <mct-representation key="'label'"
+                                    mct-object="parent"
+                                    ng-model="ngModel"
+                                    ng-click="ngModel.selectedObject = parent"
+                                    class="location-item">
+                </mct-representation>
+            </span>
+        </li>
+    </ul>
+</div>

platform/commonUI/browse/src/BrowseController.js

@@ -34,7 +34,6 @@ define(
         "use strict";
 
         var ROOT_ID = "ROOT",
-            DEFAULT_PATH = "mine",
             CONFIRM_MSG = "Unsaved changes will be lost if you leave this page.";
 
         /**
@@ -47,9 +46,18 @@ define(
          * @memberof platform/commonUI/browse
          * @constructor
          */
-        function BrowseController($scope, $route, $location, $q, objectService, navigationService, urlService) {
+        function BrowseController(
+            $scope,
+            $route,
+            $location,
+            $q,
+            objectService,
+            navigationService,
+            urlService,
+            defaultPath
+        ) {
             var path = [ROOT_ID].concat(
-                ($route.current.params.ids || DEFAULT_PATH).split("/")
+                ($route.current.params.ids || defaultPath).split("/")
             );
 
             function isDirty(){
@@ -143,6 +151,12 @@ define(
                             } else {
                                 doNavigate(nextObject, index + 1);
                             }
+                        } else if (index === 1 && c.length > 0) {
+                            // Roots are in a top-level container that we don't
+                            // want to be selected, so if we couldn't find an
+                            // object at the path we wanted, at least select
+                            // one of its children.
+                            navigateTo(c[c.length - 1]);
                         } else {
                             // Couldn't find the next element of the path
                             // so navigate to the last path object we did find

platform/commonUI/browse/src/InspectorRegion.js

@@ -0,0 +1,69 @@
+/*****************************************************************************
+ * Open MCT Web, Copyright (c) 2014-2015, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT Web is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT Web includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+/*global define,window*/
+
+define(
+    [
+        '../../regions/src/Region'
+    ],
+    function (Region) {
+        "use strict";
+
+        /**
+         * Defines the a default Inspector region. Captured in a class to
+         * allow for modular extension and customization of regions based on
+         * the typical case.
+         * @memberOf platform/commonUI/regions
+         * @constructor
+         */
+        function InspectorRegion() {
+            Region.call(this, {'name': 'Inspector'});
+
+            this.buildRegion();
+        }
+
+        InspectorRegion.prototype = Object.create(Region.prototype);
+        InspectorRegion.prototype.constructor = Region;
+
+        /**
+         * @private
+         */
+        InspectorRegion.prototype.buildRegion = function() {
+            var metadataRegion = {
+                name: 'metadata',
+                title: 'Metadata Region',
+                // Which modes should the region part be visible in? If
+                // nothing provided here, then assumed that part is visible
+                // in both. The visibility or otherwise of a region part
+                // should be decided by a policy. In this case, 'modes' is a
+                // shortcut that is used by the EditableRegionPolicy.
+                modes: ['browse', 'edit'],
+                content: {
+                    key: 'object-properties'
+                }
+            };
+            this.addRegion(new Region(metadataRegion), 0);
+        };
+
+        return InspectorRegion;
+    }
+);

platform/commonUI/browse/test/BrowseControllerSpec.js

@@ -40,6 +40,7 @@ define(
                 mockUrlService,
                 mockDomainObject,
                 mockNextObject,
+                testDefaultRoot,
                 controller;
 
             function mockPromise(value) {
@@ -50,7 +51,21 @@ define(
                 };
             }
 
+            function instantiateController() {
+                controller = new BrowseController(
+                    mockScope,
+                    mockRoute,
+                    mockLocation,
+                    mockObjectService,
+                    mockNavigationService,
+                    mockUrlService,
+                    testDefaultRoot
+                );
+            }
+
             beforeEach(function () {
+                testDefaultRoot = "some-root-level-domain-object";
+
                 mockScope = jasmine.createSpyObj(
                     "$scope",
                     [ "$on", "$watch" ]
@@ -101,41 +116,28 @@ define(
                 ]));
                 mockNextObject.useCapability.andReturn(undefined);
                 mockNextObject.getId.andReturn("next");
-                mockDomainObject.getId.andReturn("mine");
+                mockDomainObject.getId.andReturn(testDefaultRoot);
 
-                controller = new BrowseController(
-                    mockScope,
-                    mockRoute,
-                    mockLocation,
-                    mockObjectService,
-                    mockNavigationService,
-                    mockUrlService
-                );
+                instantiateController();
             });
 
             it("uses composition to set the navigated object, if there is none", function () {
-                controller = new BrowseController(
-                    mockScope,
-                    mockRoute,
-                    mockLocation,
-                    mockObjectService,
-                    mockNavigationService,
-                    mockUrlService
-                );
+                instantiateController();
+                expect(mockNavigationService.setNavigation)
+                    .toHaveBeenCalledWith(mockDomainObject);
+            });
+
+            it("navigates to a root-level object, even when default path is not found", function () {
+                mockDomainObject.getId
+                    .andReturn("something-other-than-the-" + testDefaultRoot);
+                instantiateController();
                 expect(mockNavigationService.setNavigation)
                     .toHaveBeenCalledWith(mockDomainObject);
             });
 
             it("does not try to override navigation", function () {
                 mockNavigationService.getNavigation.andReturn(mockDomainObject);
-                controller = new BrowseController(
-                    mockScope,
-                    mockRoute,
-                    mockLocation,
-                    mockObjectService,
-                    mockNavigationService,
-                    mockUrlService
-                );
+                instantiateController();
                 expect(mockScope.navigatedObject).toBe(mockDomainObject);
             });
 
@@ -162,14 +164,8 @@ define(
             });
 
             it("uses route parameters to choose initially-navigated object", function () {
-                mockRoute.current.params.ids = "mine/next";
-                controller = new BrowseController(
-                    mockScope,
-                    mockRoute,
-                    mockLocation,
-                    mockObjectService,
-                    mockNavigationService
-                );
+                mockRoute.current.params.ids = testDefaultRoot + "/next";
+                instantiateController();
                 expect(mockScope.navigatedObject).toBe(mockNextObject);
                 expect(mockNavigationService.setNavigation)
                     .toHaveBeenCalledWith(mockNextObject);
@@ -179,14 +175,8 @@ define(
                 // Idea here is that if we get a bad path of IDs,
                 // browse controller should traverse down it until
                 // it hits an invalid ID.
-                mockRoute.current.params.ids = "mine/junk";
-                controller = new BrowseController(
-                    mockScope,
-                    mockRoute,
-                    mockLocation,
-                    mockObjectService,
-                    mockNavigationService
-                );
+                mockRoute.current.params.ids = testDefaultRoot + "/junk";
+                instantiateController();
                 expect(mockScope.navigatedObject).toBe(mockDomainObject);
                 expect(mockNavigationService.setNavigation)
                     .toHaveBeenCalledWith(mockDomainObject);
@@ -196,14 +186,8 @@ define(
                 // Idea here is that if we get a path which passes
                 // through an object without a composition, browse controller
                 // should stop at it since remaining IDs cannot be loaded.
-                mockRoute.current.params.ids = "mine/next/junk";
-                controller = new BrowseController(
-                    mockScope,
-                    mockRoute,
-                    mockLocation,
-                    mockObjectService,
-                    mockNavigationService
-                );
+                mockRoute.current.params.ids = testDefaultRoot + "/next/junk";
+                instantiateController();
                 expect(mockScope.navigatedObject).toBe(mockNextObject);
                 expect(mockNavigationService.setNavigation)
                     .toHaveBeenCalledWith(mockNextObject);

platform/commonUI/browse/test/InspectorRegionSpec.js

@@ -0,0 +1,45 @@
+/*****************************************************************************
+ * Open MCT Web, Copyright (c) 2014-2015, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT Web is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT Web includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+/*global define,Promise,describe,it,expect,beforeEach,waitsFor,jasmine*/
+
+/**
+ * MCTIncudeSpec. Created by vwoeltje on 11/6/14.
+ */
+define(
+    ["../src/InspectorRegion"],
+    function (InspectorRegion) {
+        "use strict";
+
+        describe("The inspector region", function () {
+            var inspectorRegion;
+
+            beforeEach(function () {
+                inspectorRegion = new InspectorRegion();
+            });
+
+            it("creates default region parts", function () {
+                expect(inspectorRegion.regions.length).toBe(1);
+            });
+
+        });
+    }
+);

platform/commonUI/dialog/bundle.js

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

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

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

platform/commonUI/edit/bundle.js

@@ -36,6 +36,12 @@ define([
     "./src/policies/EditActionPolicy",
     "./src/representers/EditRepresenter",
     "./src/representers/EditToolbarRepresenter",
+    "text!./res/templates/edit.html",
+    "text!./res/templates/library.html",
+    "text!./res/templates/edit-object.html",
+    "text!./res/templates/edit-action-buttons.html",
+    "text!./res/templates/elements.html",
+    "text!./res/templates/topbar-edit.html",
     'legacyRegistry'
 ], function (
     EditController,
@@ -52,6 +58,12 @@ define([
     EditActionPolicy,
     EditRepresenter,
     EditToolbarRepresenter,
+    editTemplate,
+    libraryTemplate,
+    editObjectTemplate,
+    editActionButtonsTemplate,
+    elementsTemplate,
+    topbarEditTemplate,
     legacyRegistry
 ) {
     "use strict";
@@ -61,7 +73,7 @@ define([
             "routes": [
                 {
                     "when": "/edit",
-                    "templateUrl": "templates/edit.html"
+                    "template": editTemplate
                 }
             ],
             "controllers": [
@@ -185,27 +197,27 @@ define([
             "templates": [
                 {
                     "key": "edit-library",
-                    "templateUrl": "templates/library.html"
+                    "template": libraryTemplate
                 }
             ],
             "representations": [
                 {
                     "key": "edit-object",
-                    "templateUrl": "templates/edit-object.html",
+                    "template": editObjectTemplate,
                     "uses": [
                         "view"
                     ]
                 },
                 {
                     "key": "edit-action-buttons",
-                    "templateUrl": "templates/edit-action-buttons.html",
+                    "template": editActionButtonsTemplate,
                     "uses": [
                         "action"
                     ]
                 },
                 {
                     "key": "edit-elements",
-                    "templateUrl": "templates/elements.html",
+                    "template": elementsTemplate,
                     "uses": [
                         "composition"
                     ],
@@ -215,7 +227,7 @@ define([
                 },
                 {
                     "key": "topbar-edit",
-                    "templateUrl": "templates/topbar-edit.html"
+                    "template": topbarEditTemplate
                 }
             ],
             "representers": [

platform/commonUI/edit/src/representers/EditRepresenter.js

@@ -109,6 +109,8 @@ define(
             // Track the represented object
             this.domainObject = representedObject;
 
+            this.scope.isEditable = representedObject.getCapability('status').get('editing');
+
             // Ensure existing watches are released
             this.destroy();
         };

platform/commonUI/edit/test/representers/EditRepresenterSpec.js

@@ -33,6 +33,8 @@ define(
                 testRepresentation,
                 mockDomainObject,
                 mockPersistence,
+                mockCapabilities,
+                mockStatusCapability,
                 representer;
 
             function mockPromise(value) {
@@ -57,11 +59,20 @@ define(
                 ]);
                 mockPersistence =
                     jasmine.createSpyObj("persistence", ["persist"]);
+                mockStatusCapability =
+                    jasmine.createSpyObj("status", ["get"]);
+                mockStatusCapability.get.andReturn(false);
+                mockCapabilities = {
+                    'persistence': mockPersistence,
+                    'status': mockStatusCapability
+                };
 
                 mockDomainObject.getModel.andReturn({});
                 mockDomainObject.hasCapability.andReturn(true);
                 mockDomainObject.useCapability.andReturn(true);
-                mockDomainObject.getCapability.andReturn(mockPersistence);
+                mockDomainObject.getCapability.andCallFake(function(capability){
+                    return mockCapabilities[capability];
+                });
 
                 representer = new EditRepresenter(mockQ, mockLog, mockScope);
                 representer.represent(testRepresentation, mockDomainObject);

platform/commonUI/general/bundle.js

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

platform/commonUI/general/res/config.rb

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

platform/commonUI/general/res/css/reset.css

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

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

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

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

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

platform/commonUI/general/res/images/logo-app-shdw.svg

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

platform/commonUI/general/res/images/logo-app.svg

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

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

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

platform/commonUI/general/res/images/logo-openmctweb.svg

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

platform/commonUI/general/res/sass/_logo-and-bg.scss

@@ -0,0 +1,64 @@
+/*****************************************************************************
+ * Open MCT Web, Copyright (c) 2014-2015, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT Web is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT Web includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+.l-splash,
+.l-splash:before,
+.l-splash:after {
+    background-position: center;
+    background-repeat: no-repeat;
+    position: absolute;
+}
+
+.l-splash {
+    background-size: cover;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    &:before,
+    &:after {
+        background-size: contain;
+        content: '';
+    }
+
+    &:before {
+        // NASA logo, dude
+        $w: 5%;
+        $m: 10px;
+        background-image: url('../images/logo-nasa.svg');
+        top: $m;
+        right: auto;
+        bottom: auto;
+        left: $m;
+        height: auto;
+        width: $w * 2;
+        padding-bottom: $w;
+        padding-top: $w;
+    }
+
+    &:after {
+        // App logo
+        top: 0;
+        right: 15%;
+        bottom: 0;
+        left: 15%;
+    }
+}

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

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

platform/commonUI/general/res/sass/_object-label.scss

@@ -35,29 +35,25 @@
     }
 }
 
-mct-representation {
-    &.s-status-pending {
-        .t-object-label {
-            .t-item-icon {
-                &:before {
-                    $spinBW: 4px;
-                    @include spinner($spinBW);
-                    content: "";
-                    padding: 30%;
-                }
-                .t-item-icon-glyph {
-                    display: none;
-                }
-            }
-            .t-title-label {
-                font-style: italic;
-                opacity: 0.6;
-            }
+mct-representation.s-status-pending > .t-object-label {
+    .t-item-icon {
+        &:before {
+            $spinBW: 4px;
+            @include spinner($spinBW);
+            content: "";
+            padding: 30%;
         }
+        .t-item-icon-glyph {
+            display: none;
+        }
+    }
+    .t-title-label {
+        font-style: italic;
+        opacity: 0.6;
     }
 }
 
-.selected mct-representation.s-status-pending .t-object-label .t-item-icon:before {
+.selected mct-representation.s-status-pending > .t-object-label .t-item-icon:before {
     border-color: rgba($colorItemTreeSelectedFg, 0.25) !important;
     border-top-color: rgba($colorItemTreeSelectedFg, 1.0) !important;
 }

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

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

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

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

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

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

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

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

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

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

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

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

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

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

platform/commonUI/general/res/sass/edit/_editor.scss

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

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

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

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

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

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

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

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

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

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

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

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

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

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

@@ -34,8 +34,8 @@
     @include animation-duration(0.5s);
     @include animation-iteration-count(infinite);
     @include animation-timing-function(linear);
-    @include border-radius(100%);
-    @include box-sizing(border-box);
+    border-radius: 100%;
+    box-sizing: border-box;
     border-color: rgba($c, 0.25);
     border-top-color: rgba($c, 1.0);
     border-style: solid;
@@ -78,7 +78,7 @@
     }
 	&:before {
         @include spinner(5px, $colorLoadingFg);
-        padding: 5%;
+        padding: 15px;
         z-index: 10;
 	}
     &:after {
@@ -87,8 +87,4 @@
         display: block;
         z-index: 9;
     }
-    &.tree-item:before {
-        padding: $menuLineH / 4;
-        border-width: 2px;
-    }
 }

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

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

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

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

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

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

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

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

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

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

platform/commonUI/general/res/sass/mobile/overlay/_overlay.scss

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

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

@@ -0,0 +1,39 @@
+/*****************************************************************************
+ * Open MCT Web, Copyright (c) 2014-2015, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT Web is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT Web includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+.app-logo {
+    background: url('../images/logo-app.svg') no-repeat center center;
+}
+
+.l-splash-holder {
+    background: #333;
+    .s-splash {
+        border-radius: 10px;
+        box-shadow: 0 5px 50px 25px rgba(255, 255, 255, 0.1);
+    }
+}
+
+.s-splash {
+    background-image: url('../images/bg-splash.jpg');
+    &:after {
+        background-image: url('../images/logo-app-shdw.svg');
+    }
+}

platform/commonUI/general/res/sass/overlay/_overlay.scss

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

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

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

platform/commonUI/general/res/sass/search/_search.scss

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

platform/commonUI/general/res/sass/startup-base.scss

@@ -0,0 +1,70 @@
+/*****************************************************************************
+ * Open MCT Web, Copyright (c) 2014-2015, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT Web is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT Web includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+@import "bourbon";
+@import "logo-and-bg";
+
+@mixin splashElem($m: 20%) {
+    top: $m; right: $m * 1.25; bottom: $m; left: $m * 1.25;
+}
+
+.l-splash-holder {
+    // Main outer holder.
+    @include transition-property(opacity);
+    @include transition-duration(500ms);
+    @include transition-timing-function(ease-in-out);
+    @include transition-delay(1s);
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    z-index: 10000;
+    opacity: 1;
+    &.fadeout {
+        opacity: 0;
+        pointer-events: none;
+    }
+    .l-splash {
+        // The splash element.
+        @include splashElem();
+    }
+}
+
+@media only screen and (max-device-width: 767px) {
+    .l-splash-holder .l-splash {
+        @include splashElem(0);
+        border-radius: 0;
+        box-shadow: none;
+    }
+}
+
+@media only screen and (max-device-width: 767px) and (orientation: portrait) {
+    .l-splash-holder .l-splash {
+        &:before {
+            // Make the NASA logo a bit bigger when we're in portrait mode.
+            $w: 12%;
+            width: $w * 2;
+            padding-bottom: $w;
+            padding-top: $w;
+        }
+    }
+}

platform/commonUI/general/res/sass/tree/_tree.scss

@@ -35,9 +35,9 @@ ul.tree {
 .tree-item,
 .search-result-item {
     @extend .l-flex-row;
-	@include box-sizing(border-box);
-	@include border-radius($basicCr);
-	@include single-transition(background-color, 0.25s);
+	box-sizing: border-box;
+	border-radius: $basicCr;
+	@include transition(background-color, 0.25s);
 	font-size: 0.8rem;
 	height: $menuLineH;
 	line-height: $menuLineH;
@@ -63,11 +63,6 @@ ul.tree {
                 @include transform(rotate(90deg));
             }
         }
-		@include desktop {
-			&:hover {
-				color: $colorItemTreeVCHover !important;
-			}
-		}
 	}
 
 	.t-object-label {
@@ -94,18 +89,6 @@ ul.tree {
 		}
 	}
 
-	&:not(.selected) {
-		@include desktop {
-			&:hover {
-				background: $colorItemTreeHoverBg;
-				color: $colorItemTreeHoverFg;
-				.t-item-icon {
-					color: $colorItemTreeIconHover;
-				}
-			}
-		}
-	}
-
 	&:not(.loading) {
 		cursor: pointer;
 	}
@@ -123,6 +106,26 @@ ul.tree {
 	}
 }
 
+body.desktop {
+    .tree-item,
+    .search-result-item {
+        .view-control {
+            &:hover {
+                color: $colorItemTreeVCHover !important;
+            }
+        }
+        &:not(.selected) {
+            &:hover {
+                background: $colorItemTreeHoverBg;
+                color: $colorItemTreeHoverFg;
+                .t-item-icon {
+                    color: $colorItemTreeIconHover;
+                }
+            }
+        }
+    }
+}
+
 mct-representation {
     &.s-status-pending {
         .t-object-label {
@@ -155,7 +158,7 @@ mct-representation {
             .t-item-icon,
             .t-title-label {
                 color: $colorItemTreeEditingFg;
-                @include text-shadow(none);
+                text-shadow: none;
             }
             .t-title-label {
                 font-style: italic;

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

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

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

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