ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-01-19 03:06:54 +00:00
Code Issues Actions 9 Packages Projects Releases Wiki Activity

TOI working in time conductor

Browse Source
This commit is contained in:
Henry 2016-10-05 09:04:13 -07:00
parent 1650aae518
commit 430645b1f2
6 changed files with 146 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
platform/features/conductor-v2/conductor/bundle.js
View File

@ -25,6 +25,7 @@ define([
"./src/ui/TimeConductorController",
"./src/TimeConductor",
"./src/ui/ConductorAxisController",
"./src/ui/ConductorTOIController",
"./src/ui/MctConductorAxis",
"./src/ui/NumberFormat",
"text!./res/templates/time-conductor.html",
@ -36,6 +37,7 @@ define([
TimeConductorController,
TimeConductor,
ConductorAxisController,
ConductorTOIController,
MCTConductorAxis,
NumberFormat,
timeConductorTemplate,
@ -83,11 +85,13 @@ define([
]
},
{
"key": "ConductorAxisController",
"implementation": ConductorAxisController,
"key": "ConductorTOIController",
"implementation": ConductorTOIController,
"depends": [
"$scope",
"timeConductor",
"formatService"
"timeConductorViewService",
"$timeout"
]
}
],

4
platform/features/conductor-v2/conductor/res/sass/_time-conductor-base.scss
View File

@ -246,7 +246,9 @@
&:hover {
// Hide the cursor, because the TOI element essentially "becomes" the cursor
// when the user is hovering over the visualization area.
cursor: none;
// AH - not any more it doesn't?
//cursor: none;
.l-toi-holder.hover {
opacity: 1;
}

15
platform/features/conductor-v2/conductor/res/templates/conductor-data.html Normal file
View File

@ -0,0 +1,15 @@
<a class="l-page-button s-icon-button icon-pointer-left"></a>
<div class="l-data-visualization">
<!-- Note:
- val-to-right should be applied when l-toi-holder left < 160px
-->
<div class="l-toi-holder"
ng-class="{ 'pinned': true, 'val-to-right': false }"
ng-click="this.pinned = false"
style="left: 70%">
<div class="l-toi">
<div class="l-toi-val">2016-09-15 21:31:30.000Z</div>
</div>
</div>
</div>
<a class="l-page-button align-right s-icon-button icon-pointer-right"></a>

13
platform/features/conductor-v2/conductor/res/templates/time-conductor.html
View File

@ -95,19 +95,20 @@
</div>
<!-- Holds data visualization, time of interest -->
<div class="l-data-visualization-holder l-row-elem flex-elem">
<div class="l-data-visualization-holder l-row-elem flex-elem"
ng-controller="ConductorTOIController as toi"
ng-click="toi.click($event)">
<a class="l-page-button s-icon-button icon-pointer-left"></a>
<div class="l-data-visualization">
<!-- Note:
- val-to-right should be applied when l-toi-holder left < 160px
-->
<div class="l-toi-holder"
ng-class="{ 'pinned': true, 'val-to-right': false }"
ng-click="this.pinned = false"
style="left: 70%">
ng-class="{ 'pinned': toi.pinned, 'val-to-right': false }"
ng-style="{'left': toi.left + '%'}">
<div class="l-toi">
<a class="t-button-unpin icon-button" ng-click="unpin()"></a>
<span class="l-toi-val">21:31:30</span>
<a class="t-button-unpin icon-button" ng-click="toi.pinned = false"></a>
<div class="l-toi-val">2016-09-15 21:31:30.000Z</div>
</div>
</div>
</div>

114
platform/features/conductor-v2/conductor/src/ui/ConductorTOIController.js Normal file
View File

@ -0,0 +1,114 @@
/*****************************************************************************
* 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.
*****************************************************************************/
define(
["zepto"],
function ($) {
/**
* The mct-conductor-axis renders a horizontal axis with regular
* labelled 'ticks'. It requires 'start' and 'end' integer values to
* be specified as attributes.
*/
function ConductorTOIController($scope, conductor, conductorViewService, $timeout) {
this.conductor = conductor;
this.conductorViewService = conductorViewService;
//Bind all class functions to 'this'
Object.keys(ConductorTOIController.prototype).filter(function (key) {
return typeof ConductorTOIController.prototype[key] === 'function';
}).forEach(function (key) {
this[key] = ConductorTOIController.prototype[key].bind(this);
}.bind(this));
this.conductor.on('timeOfInterest', this.changeTimeOfInterest);
this.conductorViewService.on('zoom', this.setOffsetFromBounds);
this.conductorViewService.on('pan', this.setOffsetFromBounds);
this.$timeout = $timeout;
var generateRandomTOI = function () {
var bounds = conductor.bounds();
var range = bounds.end - bounds.start;
var toi = Math.random() * range + bounds.start;
console.log('calculated random TOI of ' + toi);
conductor.timeOfInterest(toi);
//this.timeoutHandle = $timeout(generateRandomTOI, 1000);
}.bind(this);
//this.timeoutHandle = $timeout(generateRandomTOI, 2000);
$scope.$on('$destroy', this.destroy);
}
ConductorTOIController.prototype.destroy = function () {
this.conductor.off('timeOfInterest', this.setOffsetFromBounds);
this.conductorViewService.off('zoom', this.setOffsetFromBounds);
this.conductorViewService.off('pan', this.setOffsetFromBounds);
this.$timeout.cancel(this.timeoutHandle);
};
ConductorTOIController.prototype.setOffsetFromBounds = function (bounds) {
var toi = this.conductor.timeOfInterest();
var offset = toi - bounds.start;
this.left = offset / (bounds.end - bounds.start) * 100;
};
ConductorTOIController.prototype.changeTimeOfInterest = function () {
var bounds = this.conductor.bounds();
if (bounds) {
this.setOffsetFromBounds(bounds);
this.pinned = true;
}
};
ConductorTOIController.prototype.click = function (e) {
if (e.altKey) {
var element = $(e.currentTarget);
var width = element.width();
var relativeX = e.pageX - element.offset().left;
var percX = relativeX / width;
var bounds = this.conductor.bounds();
var timeRange = bounds.end - bounds.start;
this.conductor.timeOfInterest(timeRange * percX + bounds.start);
}
};
/*
ConductorTOIController.prototype.zoom = function (bounds) {
this.changeTOI(bounds)
};
ConductorTOIController.prototype.pan = function (bounds) {
this.changeTOI(bounds)
};*/
ConductorTOIController.prototype.resize = function () {
//Do something
};
return ConductorTOIController;
}
);

1
platform/features/conductor-v2/conductor/src/ui/TimeConductorController.js
View File

@ -99,7 +99,6 @@ define(
// Watch scope for selection of mode or time system by user
this.$scope.$watch('modeModel.selectedKey', this.setMode);
this.conductorViewService.on('pan', this.pan);
this.conductorViewService.on('pan-stop', this.panStop);
this.$scope.$on('$destroy', this.destroy);