From 3c95c095f195c51fb9df8ad46936f27ba4db0915 Mon Sep 17 00:00:00 2001 From: Henry Date: Thu, 22 Sep 2016 17:22:25 -0700 Subject: [PATCH] [Time Conductor] Refactored out use of angular event bus in favor of making TimeConductorViewService an event emitter. --- .../features/conductor-v2/conductor/bundle.js | 3 ++- .../src/ui/ConductorAxisController.js | 23 +++++++++++-------- .../conductor/src/ui/MctConductorAxis.js | 2 +- .../src/ui/TimeConductorController.js | 22 ++++++++++-------- .../src/ui/TimeConductorViewService.js | 8 ++++++- 5 files changed, 36 insertions(+), 22 deletions(-) diff --git a/platform/features/conductor-v2/conductor/bundle.js b/platform/features/conductor-v2/conductor/bundle.js index 1fbeebdea7..7c49ccd7c4 100644 --- a/platform/features/conductor-v2/conductor/bundle.js +++ b/platform/features/conductor-v2/conductor/bundle.js @@ -77,7 +77,8 @@ define([ "implementation": ConductorAxisController, "depends": [ "timeConductor", - "formatService" + "formatService", + "timeConductorViewService" ] } ], diff --git a/platform/features/conductor-v2/conductor/src/ui/ConductorAxisController.js b/platform/features/conductor-v2/conductor/src/ui/ConductorAxisController.js index 83aff959da..2fbe958e45 100644 --- a/platform/features/conductor-v2/conductor/src/ui/ConductorAxisController.js +++ b/platform/features/conductor-v2/conductor/src/ui/ConductorAxisController.js @@ -32,11 +32,12 @@ define( * labelled 'ticks'. It requires 'start' and 'end' integer values to * be specified as attributes. */ - function ConductorAxisController(conductor, formatService) { + function ConductorAxisController(conductor, formatService, conductorViewService) { // Dependencies this.d3 = d3; this.formatService = formatService; this.conductor = conductor; + this.conductorViewService = conductorViewService; // Runtime properties (set by 'link' function) this.target = undefined; @@ -53,8 +54,8 @@ define( Object.keys(ConductorAxisController.prototype).filter(function (key) { return typeof ConductorAxisController.prototype[key] === 'function'; }).forEach(function (key) { - self[key] = self[key].bind(self); - }); + this[key] = ConductorAxisController.prototype[key].bind(this); + }.bind(this)); } ConductorAxisController.prototype.destroy = function () { @@ -137,7 +138,7 @@ define( if (this.timeSystem !== undefined) { this.changeTimeSystem(this.timeSystem); - this.setScale(this.bounds); + this.setScale(); } //Respond to changes in conductor @@ -146,15 +147,17 @@ define( this.scope.$on("$destroy", this.destroy); - scope.$on("zoom", function (evt, bounds){ - this.changeBounds(bounds); - }.bind(this)); + this.conductorViewService.on("zoom", this.zoom); }; - ConductorAxisController.prototype.panEnd = function () { + ConductorAxisController.prototype.panStop = function () { //resync view bounds with time conductor bounds this.conductor.bounds(this.bounds); - this.scope.$emit("pan-stop"); + this.conductorViewService.emit("pan-stop"); + }; + + ConductorAxisController.prototype.zoom = function (bounds) { + this.changeBounds(bounds); }; ConductorAxisController.prototype.pan = function (delta) { @@ -168,7 +171,7 @@ define( end: end }; this.setScale(); - this.scope.$emit("pan", this.bounds); + this.conductorViewService.emit("pan", this.bounds); } }; diff --git a/platform/features/conductor-v2/conductor/src/ui/MctConductorAxis.js b/platform/features/conductor-v2/conductor/src/ui/MctConductorAxis.js index 8b874badf2..d664057af6 100644 --- a/platform/features/conductor-v2/conductor/src/ui/MctConductorAxis.js +++ b/platform/features/conductor-v2/conductor/src/ui/MctConductorAxis.js @@ -41,7 +41,7 @@ define([], function () { template: '
' } diff --git a/platform/features/conductor-v2/conductor/src/ui/TimeConductorController.js b/platform/features/conductor-v2/conductor/src/ui/TimeConductorController.js index f6aff18469..5c8dabb112 100644 --- a/platform/features/conductor-v2/conductor/src/ui/TimeConductorController.js +++ b/platform/features/conductor-v2/conductor/src/ui/TimeConductorController.js @@ -97,14 +97,9 @@ define( // Watch scope for selection of mode or time system by user this.$scope.$watch('modeModel.selectedKey', this.setMode); - this.$scope.$on('pan', function (e, bounds) { - this.$scope.panning = true; - this.setFormFromBounds(bounds); - }.bind(this)); + this.conductorViewService.on('pan', this.pan); - this.$scope.$on('pan-stop', function () { - this.$scope.panning = false; - }.bind(this)); + this.conductorViewService.on('pan-stop', this.panStop); this.$scope.$on('$destroy', this.destroy); }; @@ -114,6 +109,15 @@ define( this.conductor.off('timeSystem', this.changeTimeSystem); }; + TimeConductorController.prototype.pan = function (bounds) { + this.$scope.panning = true; + this.setFormFromBounds(bounds); + }; + + TimeConductorController.prototype.panStop = function () { + this.$scope.panning = false; + }; + /** * Called when the bounds change in the time conductor. Synchronizes * the bounds values in the time conductor with those in the form @@ -123,7 +127,7 @@ define( TimeConductorController.prototype.setFormFromBounds = function (bounds) { this.$scope.boundsModel.start = bounds.start; this.$scope.boundsModel.end = bounds.end; - //this.$scope.currentZoom = bounds.end - bounds.start; + this.$scope.currentZoom = this.toSliderValue(bounds.end - bounds.start); if (!this.pendingUpdate) { this.pendingUpdate = true; @@ -272,7 +276,7 @@ define( var bounds = this.toTimeSpan(sliderValue); this.setFormFromBounds(bounds); - this.$scope.$broadcast("zoom", bounds); + this.conductorViewService.emit("zoom", bounds); }; TimeConductorController.prototype.zoomStop = function (sliderValue) { diff --git a/platform/features/conductor-v2/conductor/src/ui/TimeConductorViewService.js b/platform/features/conductor-v2/conductor/src/ui/TimeConductorViewService.js index 8cbc349520..9796e2bc3b 100644 --- a/platform/features/conductor-v2/conductor/src/ui/TimeConductorViewService.js +++ b/platform/features/conductor-v2/conductor/src/ui/TimeConductorViewService.js @@ -22,9 +22,10 @@ define( [ + 'EventEmitter', './TimeConductorMode' ], - function (TimeConductorMode) { + function (EventEmitter, TimeConductorMode) { /** * A class representing the state of the time conductor view. This @@ -36,6 +37,9 @@ define( * @constructor */ function TimeConductorViewService(conductor, timeSystems) { + + EventEmitter.call(this); + this.systems = timeSystems.map(function (timeSystemConstructor) { return timeSystemConstructor(); }); @@ -97,6 +101,8 @@ define( } } + TimeConductorViewService.prototype = Object.create(EventEmitter.prototype); + /** * Getter/Setter for the Time Conductor Mode. Modes determine the * behavior of the time conductor, especially with regards to the