[Plots] #638 New plot display options
This commit is contained in:
@@ -25,15 +25,45 @@ define([
|
||||
"./src/LayoutController",
|
||||
"./src/FixedController",
|
||||
"./src/LayoutCompositionPolicy",
|
||||
"../../commonUI/browse/src/InspectorRegion",
|
||||
"./src/PlotOptionsController",
|
||||
'legacyRegistry'
|
||||
], function (
|
||||
LayoutController,
|
||||
FixedController,
|
||||
LayoutCompositionPolicy,
|
||||
InspectorRegion,
|
||||
PlotOptionsController,
|
||||
legacyRegistry
|
||||
) {
|
||||
"use strict";
|
||||
|
||||
/**
|
||||
* Customize and extend the default 'Inspector' region for the panel
|
||||
* type, to add display options for plots. This should be moved to a
|
||||
* dedicated type.
|
||||
* @type {InspectorRegion}
|
||||
*/
|
||||
var plotInspector = new InspectorRegion(),
|
||||
plotOptionsBrowsePart = {
|
||||
name: "plot-options",
|
||||
title: "Plot Options",
|
||||
modes: ['browse'],
|
||||
content: {
|
||||
key: "plot-options-browse"
|
||||
}
|
||||
},
|
||||
plotOptionsEditPart = {
|
||||
name: "plot-options",
|
||||
title: "Plot Options",
|
||||
modes: ['edit'],
|
||||
content: {
|
||||
key: "plot-options-browse"
|
||||
}
|
||||
};
|
||||
plotInspector.addPart(plotOptionsBrowsePart);
|
||||
plotInspector.addPart(plotOptionsEditPart);
|
||||
|
||||
legacyRegistry.register("platform/features/layout", {
|
||||
"name": "Layout components.",
|
||||
"description": "Plug in adding Layout capabilities.",
|
||||
@@ -192,6 +222,10 @@ define([
|
||||
{
|
||||
"key": "frame",
|
||||
"templateUrl": "templates/frame.html"
|
||||
},
|
||||
{
|
||||
"key": "plot-options-browse",
|
||||
"templateUrl": "templates/plot-options-browse.html"
|
||||
}
|
||||
],
|
||||
"controllers": [
|
||||
@@ -213,6 +247,13 @@ define([
|
||||
"telemetryFormatter",
|
||||
"throttle"
|
||||
]
|
||||
},
|
||||
{
|
||||
"key": "PlotOptionsController",
|
||||
"implementation": PlotOptionsController,
|
||||
"depends": [
|
||||
"$scope"
|
||||
]
|
||||
}
|
||||
],
|
||||
"templates": [
|
||||
@@ -312,7 +353,12 @@ define([
|
||||
"property": "layoutGrid",
|
||||
"conversion": "number[]"
|
||||
}
|
||||
]
|
||||
],
|
||||
"regions": {
|
||||
"inspector": plotInspector
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
@@ -0,0 +1,57 @@
|
||||
<style>
|
||||
.l-inspect .inspector-plot-options .plot-options-form .label {
|
||||
text-transform: none;
|
||||
}
|
||||
.l-inspect .inspector-plot-options .plot-options-form .form .controls {
|
||||
width: 50%;
|
||||
}
|
||||
.l-inspect .inspector-plot-options .plot-options-form .form .label {
|
||||
width: 50%;
|
||||
min-width: 50px;
|
||||
color: #bfbfbf;
|
||||
}
|
||||
.l-inspect .inspector-plot-options .plot-options-form {
|
||||
padding-left: 20px;
|
||||
}
|
||||
.l-inspect .inspector-plot-options .plot-options-form .form-row {
|
||||
border-top: none;
|
||||
}
|
||||
.l-inspect .inspector-plot-options .plot-options-form .form .form-row.first {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
</style>
|
||||
<div ng-controller="PlotOptionsController" class="inspector-plot-options">
|
||||
<em>Display</em>
|
||||
<ul class="first flex-elem grows vscroll">
|
||||
<ul class="tree">
|
||||
<li ng-repeat="child in children">
|
||||
<span ng-controller="ToggleController as toggle">
|
||||
<span ng-controller="TreeNodeController as treeNode">
|
||||
<span class="tree-item menus-to-left">
|
||||
<span
|
||||
class='ui-symbol view-control flex-elem'
|
||||
ng-class="{ 'has-children': model.composition !== undefined, expanded: toggle.isActive() }"
|
||||
ng-click="toggle.toggle(); treeNode.trackExpansion()">
|
||||
</span>
|
||||
<mct-representation
|
||||
class="rep-object-label"
|
||||
key="'label'"
|
||||
mct-object="child">
|
||||
</mct-representation>
|
||||
</span>
|
||||
</span>
|
||||
<div class="plot-options-form">
|
||||
<mct-form
|
||||
ng-class="{hidden: !toggle.isActive()}"
|
||||
ng-model="plotOptionsModel"
|
||||
structure="plotOptionsStructure"
|
||||
name="plotOptionsState"
|
||||
class="flex-elem">
|
||||
</mct-form>
|
||||
</div>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</ul>
|
||||
</div>
|
||||
87
platform/features/layout/src/PlotOptionsController.js
Normal file
87
platform/features/layout/src/PlotOptionsController.js
Normal file
@@ -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*/
|
||||
|
||||
/**
|
||||
* This bundle implements object types and associated views for
|
||||
* display-building.
|
||||
* @namespace platform/features/layout
|
||||
*/
|
||||
define(
|
||||
[],
|
||||
function () {
|
||||
"use strict";
|
||||
|
||||
/**
|
||||
* The LayoutController is responsible for supporting the
|
||||
* Layout view. It arranges frames according to saved configuration
|
||||
* and provides methods for updating these based on mouse
|
||||
* movement.
|
||||
* @memberof platform/features/layout
|
||||
* @constructor
|
||||
* @param {Scope} $scope the controller's Angular scope
|
||||
*/
|
||||
function PlotOptionsController($scope) {
|
||||
var self = this,
|
||||
plotOptionsStructure = {
|
||||
'name':'Plot Options',
|
||||
'sections': [{
|
||||
'rows':[
|
||||
{
|
||||
'name': 'Markers',
|
||||
'control': 'checkbox',
|
||||
'key': 'markers'
|
||||
},
|
||||
{
|
||||
'name': 'No Line',
|
||||
'control': 'checkbox',
|
||||
'key': 'noLine'
|
||||
},
|
||||
{
|
||||
'name': 'Step Line',
|
||||
'control': 'checkbox',
|
||||
'key': 'stepLine'
|
||||
},
|
||||
{
|
||||
'name': 'Linear Line',
|
||||
'control': 'checkbox',
|
||||
'key': 'linearLine'
|
||||
}
|
||||
]
|
||||
}]},
|
||||
plotOptionsModel = {};
|
||||
|
||||
$scope.plotOptionsStructure = plotOptionsStructure;
|
||||
$scope.plotOptionsModel = plotOptionsModel;
|
||||
|
||||
$scope.domainObject.useCapability('composition').then(function(children){
|
||||
$scope.children = children;
|
||||
});
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
return PlotOptionsController;
|
||||
}
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user