diff --git a/platform/features/conductor-v2/bundle.js b/platform/features/conductor-v2/bundle.js
index 279e4904589..06d02d41cad 100644
--- a/platform/features/conductor-v2/bundle.js
+++ b/platform/features/conductor-v2/bundle.js
@@ -52,6 +52,7 @@ define([
"implementation": TimeConductorController,
"depends": [
"$scope",
+ "$timeout",
"timeConductor"
]
}
@@ -60,7 +61,9 @@ define([
{
"key": "mctConductorAxis",
"implementation": MCTConductorAxis,
- "depends": ["$timeout"]
+ "depends": [
+ "timeConductor"
+ ]
}
],
"representations": [
diff --git a/platform/features/conductor-v2/res/templates/time-conductor.html b/platform/features/conductor-v2/res/templates/time-conductor.html
index dd24b09a1bf..15917a08f80 100644
--- a/platform/features/conductor-v2/res/templates/time-conductor.html
+++ b/platform/features/conductor-v2/res/templates/time-conductor.html
@@ -25,8 +25,6 @@
stroke: #A0A0A0;
}
- .l-axis-holder svg>g
-
@@ -56,7 +54,7 @@
validate: tcController.validateEnd
}"
ng-model="formModel"
- ng-blur="trCtrl.updateBoundsFromForm()"
+ ng-blur="tcController.updateBoundsFromForm(formModel)"
field="'end'"
class="time-range-end">
diff --git a/platform/features/conductor-v2/src/MctConductorAxis.js b/platform/features/conductor-v2/src/MctConductorAxis.js
index 54bf4520ae2..e12903f77e2 100644
--- a/platform/features/conductor-v2/src/MctConductorAxis.js
+++ b/platform/features/conductor-v2/src/MctConductorAxis.js
@@ -37,41 +37,34 @@ define(
* @constructor
* @memberof platform/forms
*/
- function MCTConductorAxis($timeout) {
+ function MCTConductorAxis(conductor) {
function link(scope, element, attrs, ngModelController) {
- $timeout(function () {
- var target = element[0].firstChild,
- width = target.offsetWidth,
- height = target.offsetHeight,
- padding = 1;
+ var target = element[0].firstChild,
+ height = target.offsetHeight,
+ padding = 1;
- var vis = d3.select(target)
- .append('svg:svg')
- //.attr('viewBox', '0 0 ' + width + ' ' +
- // height)
- .attr('width', '100%')
- .attr('height', height);
- //.attr('preserveAspectRatio', 'xMidYMid meet');
+ var vis = d3.select(target)
+ .append('svg:svg')
+ .attr('width', '100%')
+ .attr('height', height);
+ var xScale = d3.scaleTime();
+ var xAxis = d3.axisTop();
+ // draw x axis with labels and move to the bottom of the chart area
+ var axisElement = vis.append("g")
+ .attr("transform", "translate(0," + (height - padding) + ")");
- // define the x scale (horizontal)
- var mindate = new Date(2012,0,1),
- maxdate = new Date(2016,0,1);
-
- var xScale = d3.scaleTime()
- .domain([mindate, maxdate])
+ function setBounds(start, end) {
+ var width = target.offsetWidth;
+ xScale.domain([new Date(start), new Date(end)])
.range([padding, width - padding * 2]);
-
- var xAxis = d3.axisTop()
- .scale(xScale);
-
- // draw x axis with labels and move to the bottom of the chart area
- var axisElement = vis.append("g")
- .attr("class", "xaxis") // give it a class so it can be used to select only xaxis labels below
- .attr("transform", "translate(0," + (height - padding) + ")");
-
+ xAxis.scale(xScale);
axisElement.call(xAxis);
- }, 1000);
+ }
+
+ conductor.on('bounds', function (bounds) {
+ setBounds(bounds.start, bounds.end);
+ });
}
return {
diff --git a/platform/features/conductor-v2/src/TimeConductorController.js b/platform/features/conductor-v2/src/TimeConductorController.js
index 6b714d2ba2a..cdbc00ebd4a 100644
--- a/platform/features/conductor-v2/src/TimeConductorController.js
+++ b/platform/features/conductor-v2/src/TimeConductorController.js
@@ -24,31 +24,53 @@ define(
[],
function () {
- function TimeConductorController($scope, conductor) {
+ var SIX_HOURS = 6 * 60 * 60 * 1000;
+
+ function TimeConductorController($scope, $timeout, conductor) {
+ var now = Date.now();
+ var self = this;
+
this.$scope = $scope;
this.conductor = conductor;
- /*
- Stuff to put on scope
- - parameters
- - formModel
- */
- this.$scope.formModel = {
- start: '2012-01-01 00:00:00.000Z',
- end: '2016-01-01 00:00:00.000Z'
- };
+ $scope.formModel = {};
+
+ conductor.on('bounds', function (bounds) {
+ $scope.formModel = {
+ start: bounds.start,
+ end: bounds.end
+ };
+ });
+
+ //Temporary workaround for resizing issue
+ $timeout(function() {
+ //Set the time conductor to some default
+ conductor.bounds({start: now - SIX_HOURS, end: now});
+ }, 1000);
+
+ Object.keys(TimeConductorController.prototype).filter(function (key){
+ return typeof TimeConductorController.prototype[key] === 'function';
+ }).forEach(function (key) {
+ self[key] = self[key].bind(self);
+ });
}
- TimeConductorController.prototype.validateStart = function () {
- return true;
+ TimeConductorController.prototype.validateStart = function (start) {
+ var bounds = this.conductor.bounds();
+ return this.conductor.validateBounds({start: start, end: bounds.end}) === true;
};
- TimeConductorController.prototype.validateEnd = function () {
- return true;
+ TimeConductorController.prototype.validateEnd = function (end) {
+ var bounds = this.conductor.bounds();
+ return this.conductor.validateBounds({start: bounds.start, end: end}) === true;
};
- TimeConductorController.prototype.updateBoundsFromForm = function () {
+ TimeConductorController.prototype.updateBoundsFromForm = function (formModel) {
+ var newBounds = {start: formModel.start, end: formModel.end};
+ if (this.conductor.validateBounds(newBounds) === true) {
+ this.conductor.bounds(newBounds);
+ }
};
return TimeConductorController;