[Time Conductor] Added zoom level label

Author: akhenry

platform/commonUI/formats/src/UTCTimeFormat.js

@@ -95,6 +95,38 @@ define([
         })[0][0];
     }
 
+    UTCTimeFormat.prototype.timeUnits = function (timeRange) {
+        var momentified = moment.duration(timeRange);
+        return [
+            ["Decades", function (r) {
+                return r.years() > 15;
+            }],
+            ["Years", function (r) {
+                return r.years() > 0;
+            }],
+            ["Months", function (r) {
+                return r.months() > 0;
+            }],
+            ["Days", function (r) {
+                return r.days() > 0;
+            }],
+            ["Hours", function (r) {
+                return r.hours() > 0;
+            }],
+            ["Minutes", function (r) {
+                return r.minutes() > 0;
+            }],
+            ["Seconds", function (r) {
+                return r.seconds() > 0;
+            }],
+            ["Milliseconds", function (r) {
+                return true;
+            }]
+        ].filter(function (row){
+            return row[1](momentified);
+        })[0][0];
+    };
+
     /**
      *
      * @param value

platform/features/conductor-v2/conductor/bundle.js

@@ -69,7 +69,8 @@ define([
                         "$window",
                         "timeConductor",
                         "timeConductorViewService",
-                        "timeSystems[]"
+                        "timeSystems[]",
+                        "formatService"
                     ]
                 },
                 {

platform/features/conductor-v2/conductor/res/templates/time-conductor.html

@@ -115,7 +115,8 @@
             </mct-control>
             <!-- Zoom control -->
             <div class="l-time-conductor-zoom-w grows flex-elem l-flex-row">
-                <span class="time-conductor-zoom-current-range flex-elem flex-fixed holder"></span>
+                <span
+                        class="time-conductor-zoom-current-range flex-elem flex-fixed holder">{{timeUnits}}</span>
                 <input class="time-conductor-zoom flex-elem" type="range"
                        ng-model="currentZoom"
                        ng-mouseUp="tcController.zoomStop(currentZoom)"

platform/features/conductor-v2/conductor/src/ui/TimeConductorController.js

@@ -26,7 +26,7 @@ define(
     ],
     function (TimeConductorValidation) {
 
-        function TimeConductorController($scope, $window, timeConductor, conductorViewService, timeSystems) {
+        function TimeConductorController($scope, $window, timeConductor, conductorViewService, timeSystems, formatService) {
 
             var self = this;
 
@@ -43,6 +43,7 @@ define(
             this.conductor = timeConductor;
             this.modes = conductorViewService.availableModes();
             this.validation = new TimeConductorValidation(this.conductor);
+            this.formatService = formatService;
 
             // Construct the provided time system definitions
             this.timeSystems = timeSystems.map(function (timeSystemConstructor) {
@@ -129,6 +130,8 @@ define(
             this.$scope.boundsModel.end = bounds.end;
 
             this.$scope.currentZoom = this.toSliderValue(bounds.end - bounds.start);
+            this.toTimeUnits(bounds.end - bounds.start);
+
             if (!this.pendingUpdate) {
                 this.pendingUpdate = true;
                 this.$window.requestAnimationFrame(function () {
@@ -272,10 +275,16 @@ define(
             return {start: center - timeSpan / 2, end: center + timeSpan / 2};
         };
 
+        TimeConductorController.prototype.toTimeUnits = function (timeSpan) {
+            if (this.conductor.timeSystem()) {
+                var timeFormat = this.formatService.getFormat(this.conductor.timeSystem().formats()[0]);
+                this.$scope.timeUnits = timeFormat.timeUnits && timeFormat.timeUnits(timeSpan);
+            }
+        }
+
         TimeConductorController.prototype.zoom = function(sliderValue) {
             var bounds = this.toTimeSpan(sliderValue);
             this.setFormFromBounds(bounds);
-
             this.conductorViewService.emit("zoom", bounds);
         };