[Timeline] Add zoom-to-fit button

platform/features/timeline/res/templates/timeline.html

@@ -103,6 +103,13 @@
         <!-- TOP PANE GANTT BARS -->
         <div class="split-pane-component l-timeline-pane t-pane-h l-pane-top t-timeline-gantt l-timeline-gantt s-timeline-gantt">
             <div class="l-hover-btns-holder s-hover-btns-holder t-btns-zoom">
+                <a class="t-btn l-btn s-btn"
+                   ng-click="zoomController.fit()"
+                   ng-show="true"
+                   title="Zoom to fit">
+                    <span class="ui-symbol icon zoom-in">I</span>
+                </a>
+
                 <a class="t-btn l-btn s-btn"
                    ng-click="zoomController.zoom(-1, scroll)"
                    ng-show="true"

platform/features/timeline/src/controllers/TimelineZoomController.js

@@ -32,6 +32,7 @@ define(
             var zoomLevels = ZOOM_CONFIGURATION.levels || [1000],
                 zoomIndex = Math.floor(zoomLevels.length / 2),
                 tickWidth = ZOOM_CONFIGURATION.width || 200,
+                bounds = { x: 0, width: tickWidth },
                 duration = 86400000; // Default duration in view
 
             // Round a duration to a larger value, to ensure space for editing
@@ -42,6 +43,14 @@ define(
                 return Math.ceil(value / sz) * sz;
             }
 
+            function toMillis(pixels) {
+                return (pixels / tickWidth) * zoomLevels[zoomIndex];
+            }
+
+            function toPixels(millis) {
+                return tickWidth * millis / zoomLevels[zoomIndex];
+            }
+
             // Get/set zoom level
             function setZoomLevel(level) {
                 if (!isNaN(level)) {
@@ -66,6 +75,27 @@ define(
                 }
             }
 
+            function initializeZoomFromTimespan(timespan) {
+                var duration = timespan.getDuration();
+                zoomIndex = 0;
+                while (toMillis(bounds.width) < duration &&
+                        zoomIndex < zoomLevels.length) {
+                    zoomIndex += 1;
+                }
+                bounds.x = toPixels(timespan.getStart());
+            }
+
+            function initializeZoom(domainObject) {
+                if (domainObject) {
+                    domainObject.useCapability('timespan')
+                        .then(initializeZoomFromTimespan);
+                }
+            }
+
+            $scope.$watch("scroll", function (scroll) {
+                bounds = scroll;
+            });
+            $scope.$watch("domainObject", initializeZoom);
             $scope.$watch("configuration.zoomLevel", setZoomLevel);
 
             return {
@@ -80,7 +110,7 @@ define(
                  * @returns {number} current zoom level (as the size of a
                  *          major tick mark, in pixels)
                  */
-                zoom: function (amount, bounds) {
+                zoom: function (amount) {
                     // Update the zoom level if called with an argument
                     if (arguments.length > 0 && !isNaN(amount)) {
                         var center = this.toMillis(bounds.x + bounds.width / 2);
@@ -90,22 +120,24 @@ define(
                     }
                     return zoomLevels[zoomIndex];
                 },
+                fit: function () {
+                    if ($scope.domainObject) {
+                        initializeZoom($scope.domainObject);
+                        storeZoom();
+                    }
+                },
                 /**
                  * Get the width, in pixels, of a specific time duration at
                  * the current zoom level.
                  * @returns {number} the number of pixels
                  */
-                toPixels: function (millis) {
+                toPixels: toPixels,
-                    return tickWidth * millis / zoomLevels[zoomIndex];
-                },
                 /**
                  * Get the time duration, in milliseconds, occupied by the
                  * width (specified in pixels) at the current zoom level.
                  * @returns {number} the number of pixels
                  */
-                toMillis: function (pixels) {
+                toMillis: toMillis,
-                    return (pixels / tickWidth) * zoomLevels[zoomIndex];
-                },
                 /**
                  * Get or set the current displayed duration. If used as a
                  * setter, this will typically be rounded up to ensure extra