diff --git a/platform/features/conductor-v2/res/templates/time-conductor.html b/platform/features/conductor-v2/res/templates/time-conductor.html index d0cff37f095..32e9bb04481 100644 --- a/platform/features/conductor-v2/res/templates/time-conductor.html +++ b/platform/features/conductor-v2/res/templates/time-conductor.html @@ -1,4 +1,3 @@ -
@@ -10,77 +9,68 @@
-
-
- - - - - - - - - - - - - - - - - + - - - - - - - - - - -
- -
+
+
+ + + + + + + + + + + + + + + + + +
+ +
diff --git a/platform/features/conductor-v2/src/MctConductorAxis.js b/platform/features/conductor-v2/src/MctConductorAxis.js index e9c2fe61adb..2cec353836d 100644 --- a/platform/features/conductor-v2/src/MctConductorAxis.js +++ b/platform/features/conductor-v2/src/MctConductorAxis.js @@ -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") diff --git a/platform/features/conductor-v2/src/TimeConductorController.js b/platform/features/conductor-v2/src/TimeConductorController.js index 50667cf0311..d7c4e091bfc 100644 --- a/platform/features/conductor-v2/src/TimeConductorController.js +++ b/platform/features/conductor-v2/src/TimeConductorController.js @@ -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']) { @@ -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){ @@ -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); } }; @@ -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) }