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

Merge open933 latest, resolve conflicts

Browse Source 
Fixes #933
Fair amount of manual fixing in time-conductor.html
This commit is contained in:
Charles Hacskaylo 2016-07-13 19:16:00 -07:00
commit 8214c8e895
3 changed files with 85 additions and 96 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,4 +1,3 @@
<!-- Parent holder for time conductor. follow-mode | fixed-mode --> <!-- Parent holder for time conductor. follow-mode | fixed-mode -->
<div ng-controller="TimeConductorController as tcController" <div ng-controller="TimeConductorController as tcController"
class="holder grows flex-elem l-flex-row l-time-conductor {{modeModel.selected}}-mode"> class="holder grows flex-elem l-flex-row l-time-conductor {{modeModel.selected}}-mode">
@ -10,77 +9,68 @@
<div class="flex-elem holder grows l-flex-col l-time-conductor-inner"> <div class="flex-elem holder grows l-flex-col l-time-conductor-inner">
<!-- Holds inputs and ticks --> <!-- Holds inputs and ticks -->
<div class="l-time-conductor-ticks l-row-elem l-flex-row flex-elem no-margin"> <div class="l-time-conductor-ticks l-row-elem l-flex-row flex-elem no-margin">
<form class="abs l-time-conductor-inputs-holder" <form class="abs l-time-conductor-inputs-holder"
ng-submit="tcController.updateBoundsFromForm(formModel)"> ng-submit="tcController.updateBoundsFromForm(formModel)">
<span class="l-time-range-w start-w"> <span class="l-time-range-input-w start-date">
<span class="l-time-range-input-w start-date"> <mct-control key="'datetime-field'"
<mct-control key="'datetime-field'" structure="{
structure="{ format: 'utc',
format: 'utc', validate: tcController.validateStart
validate: tcController.validateStart }"
}" ng-model="formModel"
ng-model="formModel" ng-mouseup="tcController.changing['start'] = true"
ng-mouseup="tcController.changing['start'] = true" ng-blur="tcController.changing['start'] = false; tcController.updateBoundsFromForm(formModel)"
ng-blur="tcController.changing['start'] = false; tcController.updateBoundsFromForm(formModel)" field="'start'"
field="'start'" class="time-range-start">
class="time-range-input"> </mct-control>
</mct-control> </span>
</span> <span class="l-time-range-input-w start-delta"
<span class="l-time-range-input-w time-delta start-delta" ng-class="{'hide':(modeModel.selected === 'fixed')}">
ng-class="{'hide':(modeModel.selected === 'fixed')}"> <mct-control key="'datetime-field'"
- structure="{
<mct-control key="'datetime-field'" format: 'duration',
structure="{ validate: tcController.validateStartDelta
format: 'duration', }"
validate: tcController.validateStartDelta ng-model="formModel"
}" ng-mouseup="tcController.changing['startDelta'] = true"
ng-model="formModel" ng-blur="tcController.changing['startDelta'] = false; tcController.updateDeltasFromForm(formModel)"
ng-mouseup="tcController.changing['startDelta'] = true" field="'startDelta'"
ng-blur="tcController.changing['startDelta'] = false; tcController.updateDeltasFromForm(formModel)" class="time-delta-start">
field="'startDelta'" </mct-control>
class="hrs-min-input"> </span>
</mct-control> <span class="l-time-range-input-w end-delta"
</span> ng-class="{'hide':(modeModel.selected === 'fixed')}">
</span> <mct-control key="'datetime-field'"
structure="{
format: 'duration',
<span class="l-time-range-w end-w"> validate: tcController.validateEndDelta
<span class="l-time-range-input-w time-delta end-delta" }"
ng-class="{'hide':(modeModel.selected === 'fixed')}"> ng-model="formModel"
+ ng-mouseup="tcController.changing['endDelta'] = true"
<mct-control key="'datetime-field'" ng-blur="tcController.changing['endDelta'] = false; tcController.updateDeltasFromForm(formModel)"
structure="{ field="'endDelta'"
format: 'duration', class="time-delta-end">
validate: tcController.validateEndDelta </mct-control>
}" </span>
ng-model="formModel" <span class="l-time-range-input-w end-date"
ng-mouseup="tcController.changing['endDelta'] = true" ng-controller="ToggleController as t2">
ng-blur="tcController.changing['endDelta'] = false; tcController.updateDeltasFromForm(formModel)" <mct-control key="'datetime-field'"
field="'endDelta'" structure="{
class="hrs-min-input"> format: 'utc',
</mct-control> validate: tcController.validateEnd
</span> }"
<span class="l-time-range-input-w end-date" ng-model="formModel"
ng-controller="ToggleController as t2"> ng-mouseup="tcController.changing['end'] = true"
<mct-control key="'datetime-field'" ng-blur="tcController.changing['end'] = false; tcController.updateBoundsFromForm(formModel)"
structure="{ field="'end'"
format: 'utc', class="time-range-end">
validate: tcController.validateEnd </mct-control>
}" </span>
ng-model="formModel" <input type="submit" class="hidden">
ng-mouseup="tcController.changing['end'] = true" </form>
ng-blur="tcController.changing['end'] = false; tcController.updateBoundsFromForm(formModel)" <mct-conductor-axis></mct-conductor-axis>
field="'end'" </div>
class="time-range-input">
</mct-control>
</span>
</span>
<input type="submit" class="hidden">
</form>
<mct-conductor-axis></mct-conductor-axis>
</div>
<!-- Holds data availability, time of interest --> <!-- Holds data availability, time of interest -->
<div class="l-data-visualization l-row-elem l-flex-row flex-elem"></div> <div class="l-data-visualization l-row-elem l-flex-row flex-elem"></div>

2
platform/features/conductor-v2/src/MctConductorAxis.js
View File

@ -48,7 +48,7 @@ define(
.append('svg:svg') .append('svg:svg')
.attr('width', '100%') .attr('width', '100%')
.attr('height', height); .attr('height', height);
var xScale = d3.scaleTime(); var xScale = d3.scaleUtc();
var xAxis = d3.axisTop(); var xAxis = d3.axisTop();
// draw x axis with labels and move to the bottom of the chart area // draw x axis with labels and move to the bottom of the chart area
var axisElement = vis.append("g") var axisElement = vis.append("g")

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

@ -32,16 +32,18 @@ define(
this.$scope = $scope; this.$scope = $scope;
this.$timeout = $timeout; this.$timeout = $timeout;
this.conductor = conductor; this.conductor = conductor;
this.startDelta = FIFTEEN_MINUTES;
this.endDelta = 0; this.endDelta = 0;
this.changing = { this.changing = {
'start': false, 'start': false,
'startDelta': false, 'end': false
'end': false,
'endDelta': false
}; };
$scope.formModel = {}; $scope.formModel = {
startDelta: this.startDelta,
endDelta: this.endDelta
};
conductor.on('bounds', function (bounds) { conductor.on('bounds', function (bounds) {
if (!self.changing['start']) { if (!self.changing['start']) {
@ -50,13 +52,6 @@ define(
if (!self.changing['end']) { if (!self.changing['end']) {
$scope.formModel.end = bounds.end; $scope.formModel.end = bounds.end;
} }
if (!self.changing['startDelta']) {
$scope.formModel.startDelta = bounds.end - bounds.start;
}
if (!self.changing['endDelta']) {
$scope.formModel.endDelta = 0;
}
}); });
conductor.on('follow', function (follow){ conductor.on('follow', function (follow){
@ -148,11 +143,17 @@ define(
TimeConductorController.prototype.updateDeltasFromForm = function (formModel) { TimeConductorController.prototype.updateDeltasFromForm = function (formModel) {
if (this.validateDeltas(formModel)) { if (this.validateDeltas(formModel)) {
var oldBounds = this.conductor.bounds(), //Calculate the previous 'true' end value (without delta)
newBounds = { var oldEnd = this.conductor.bounds().end - this.endDelta || 0;
start: oldBounds.end - formModel.startDelta,
end: oldBounds.end + formModel.endDelta this.startDelta = formModel.startDelta;
}; this.endDelta = formModel.endDelta;
var newBounds = {
start: oldEnd - this.startDelta,
end: oldEnd + this.endDelta
};
this.conductor.bounds(newBounds); this.conductor.bounds(newBounds);
} }
}; };
@ -172,22 +173,20 @@ define(
var tickInterval = 1000; var tickInterval = 1000;
var conductor = this.conductor; var conductor = this.conductor;
var $timeout = this.$timeout; var $timeout = this.$timeout;
var self = this;
conductor.follow(true); conductor.follow(true);
setToNowMinus(FIFTEEN_MINUTES); setBoundsToNow(self.startDelta, self.endDelta);
var timeoutPromise = $timeout(tick, tickInterval); var timeoutPromise = $timeout(tick, tickInterval);
function setToNowMinus(delta) { function setBoundsToNow(startDelta, endDelta) {
var now = Math.ceil(Date.now() / 1000) * 1000; var now = Math.ceil(Date.now() / 1000) * 1000;
conductor.bounds({start: now - delta, end: now}); conductor.bounds({start: now - startDelta, end: now + endDelta});
} }
function tick() { function tick() {
var bounds = conductor.bounds(); setBoundsToNow(self.startDelta, self.endDelta);
var delta = bounds.end - bounds.start;
setToNowMinus(delta);
timeoutPromise = $timeout(tick, tickInterval) timeoutPromise = $timeout(tick, tickInterval)
} }