Skip to content

Commit

Permalink
Merge open933 latest, resolve conflicts
Browse files Browse the repository at this point in the history 
Fixes #933
Fair amount of manual fixing in time-conductor.html
  • Loading branch information
@charlesh88
charlesh88 committed Jul 14, 2016
2 parents 33b2225 + 14463d3 commit 8214c8e
Show file tree
Hide file tree
Showing 3 changed files with 85 additions and 96 deletions.
134 changes: 62 additions & 72 deletions platform/features/conductor-v2/res/templates/time-conductor.html
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@

<!-- Parent holder for time conductor. follow-mode | fixed-mode -->
<div ng-controller="TimeConductorController as tcController"
class="holder grows flex-elem l-flex-row l-time-conductor {{modeModel.selected}}-mode">
Expand All @@ -10,77 +9,68 @@

<div class="flex-elem holder grows l-flex-col l-time-conductor-inner">
<!-- Holds inputs and ticks -->
<div class="l-time-conductor-ticks l-row-elem l-flex-row flex-elem no-margin">
<form class="abs l-time-conductor-inputs-holder"
ng-submit="tcController.updateBoundsFromForm(formModel)">
<span class="l-time-range-w start-w">
<span class="l-time-range-input-w start-date">
<mct-control key="'datetime-field'"
structure="{
format: 'utc',
validate: tcController.validateStart
}"
ng-model="formModel"
ng-mouseup="tcController.changing['start'] = true"
ng-blur="tcController.changing['start'] = false; tcController.updateBoundsFromForm(formModel)"
field="'start'"
class="time-range-input">
</mct-control>
</span>
<span class="l-time-range-input-w time-delta start-delta"
ng-class="{'hide':(modeModel.selected === 'fixed')}">
-
<mct-control key="'datetime-field'"
structure="{
format: 'duration',
validate: tcController.validateStartDelta
}"
ng-model="formModel"
ng-mouseup="tcController.changing['startDelta'] = true"
ng-blur="tcController.changing['startDelta'] = false; tcController.updateDeltasFromForm(formModel)"
field="'startDelta'"
class="hrs-min-input">
</mct-control>
</span>
</span>


<span class="l-time-range-w end-w">
<span class="l-time-range-input-w time-delta end-delta"
ng-class="{'hide':(modeModel.selected === 'fixed')}">
+
<mct-control key="'datetime-field'"
structure="{
format: 'duration',
validate: tcController.validateEndDelta
}"
ng-model="formModel"
ng-mouseup="tcController.changing['endDelta'] = true"
ng-blur="tcController.changing['endDelta'] = false; tcController.updateDeltasFromForm(formModel)"
field="'endDelta'"
class="hrs-min-input">
</mct-control>
</span>
<span class="l-time-range-input-w end-date"
ng-controller="ToggleController as t2">
<mct-control key="'datetime-field'"
structure="{
format: 'utc',
validate: tcController.validateEnd
}"
ng-model="formModel"
ng-mouseup="tcController.changing['end'] = true"
ng-blur="tcController.changing['end'] = false; tcController.updateBoundsFromForm(formModel)"
field="'end'"
class="time-range-input">
</mct-control>
</span>
</span>

<input type="submit" class="hidden">
</form>
<mct-conductor-axis></mct-conductor-axis>
</div>
<div class="l-time-conductor-ticks l-row-elem l-flex-row flex-elem no-margin">
<form class="abs l-time-conductor-inputs-holder"
ng-submit="tcController.updateBoundsFromForm(formModel)">
<span class="l-time-range-input-w start-date">
<mct-control key="'datetime-field'"
structure="{
format: 'utc',
validate: tcController.validateStart
}"
ng-model="formModel"
ng-mouseup="tcController.changing['start'] = true"
ng-blur="tcController.changing['start'] = false; tcController.updateBoundsFromForm(formModel)"
field="'start'"
class="time-range-start">
</mct-control>
</span>
<span class="l-time-range-input-w start-delta"
ng-class="{'hide':(modeModel.selected === 'fixed')}">
<mct-control key="'datetime-field'"
structure="{
format: 'duration',
validate: tcController.validateStartDelta
}"
ng-model="formModel"
ng-mouseup="tcController.changing['startDelta'] = true"
ng-blur="tcController.changing['startDelta'] = false; tcController.updateDeltasFromForm(formModel)"
field="'startDelta'"
class="time-delta-start">
</mct-control>
</span>
<span class="l-time-range-input-w end-delta"
ng-class="{'hide':(modeModel.selected === 'fixed')}">
<mct-control key="'datetime-field'"
structure="{
format: 'duration',
validate: tcController.validateEndDelta
}"
ng-model="formModel"
ng-mouseup="tcController.changing['endDelta'] = true"
ng-blur="tcController.changing['endDelta'] = false; tcController.updateDeltasFromForm(formModel)"
field="'endDelta'"
class="time-delta-end">
</mct-control>
</span>
<span class="l-time-range-input-w end-date"
ng-controller="ToggleController as t2">
<mct-control key="'datetime-field'"
structure="{
format: 'utc',
validate: tcController.validateEnd
}"
ng-model="formModel"
ng-mouseup="tcController.changing['end'] = true"
ng-blur="tcController.changing['end'] = false; tcController.updateBoundsFromForm(formModel)"
field="'end'"
class="time-range-end">
</mct-control>
</span>
<input type="submit" class="hidden">
</form>
<mct-conductor-axis></mct-conductor-axis>
</div>

<!-- Holds data availability, time of interest -->
<div class="l-data-visualization l-row-elem l-flex-row flex-elem"></div>
Expand Down
2 changes: 1 addition & 1 deletion platform/features/conductor-v2/src/MctConductorAxis.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ define(
.append('svg:svg')
.attr('width', '100%')
.attr('height', height);
var xScale = d3.scaleTime();
var xScale = d3.scaleUtc();
var xAxis = d3.axisTop();
// draw x axis with labels and move to the bottom of the chart area
var axisElement = vis.append("g")
Expand Down
45 changes: 22 additions & 23 deletions platform/features/conductor-v2/src/TimeConductorController.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,16 +32,18 @@ define(
this.$scope = $scope;
this.$timeout = $timeout;
this.conductor = conductor;
this.startDelta = FIFTEEN_MINUTES;
this.endDelta = 0;

this.changing = {
'start': false,
'startDelta': false,
'end': false,
'endDelta': false
'end': false
};

$scope.formModel = {};
$scope.formModel = {
startDelta: this.startDelta,
endDelta: this.endDelta
};

conductor.on('bounds', function (bounds) {
if (!self.changing['start']) {
Expand All @@ -50,13 +52,6 @@ define(
if (!self.changing['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){
Expand Down Expand Up @@ -148,11 +143,17 @@ define(
TimeConductorController.prototype.updateDeltasFromForm = function (formModel) {

if (this.validateDeltas(formModel)) {
var oldBounds = this.conductor.bounds(),
newBounds = {
start: oldBounds.end - formModel.startDelta,
end: oldBounds.end + formModel.endDelta
};
//Calculate the previous 'true' end value (without delta)
var oldEnd = this.conductor.bounds().end - this.endDelta || 0;

this.startDelta = formModel.startDelta;
this.endDelta = formModel.endDelta;

var newBounds = {
start: oldEnd - this.startDelta,
end: oldEnd + this.endDelta
};

this.conductor.bounds(newBounds);
}
};
Expand All @@ -172,22 +173,20 @@ define(
var tickInterval = 1000;
var conductor = this.conductor;
var $timeout = this.$timeout;
var self = this;

conductor.follow(true);
setToNowMinus(FIFTEEN_MINUTES);
setBoundsToNow(self.startDelta, self.endDelta);

var timeoutPromise = $timeout(tick, tickInterval);

function setToNowMinus(delta) {
function setBoundsToNow(startDelta, endDelta) {
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() {
var bounds = conductor.bounds();
var delta = bounds.end - bounds.start;
setToNowMinus(delta);

setBoundsToNow(self.startDelta, self.endDelta);
timeoutPromise = $timeout(tick, tickInterval)
}

Expand Down

0 comments on commit 8214c8e

Please sign in to comment.