From 787f3815df1e4606f465d358c61c0e3ead8f604c Mon Sep 17 00:00:00 2001
From: Victor Woeltjen <victor.woeltjen@nasa.gov>
Date: Tue, 31 May 2016 16:12:49 -0700
Subject: [PATCH] [Timeline] Expose width from ZoomController

...and ensure that the width exposed is not excessively
large; fixes #981
---
 .../timeline/res/templates/timeline.html      |  6 ++--
 .../src/controllers/TimelineZoomController.js | 29 ++++++-------------
 2 files changed, 12 insertions(+), 23 deletions(-)

diff --git a/platform/features/timeline/res/templates/timeline.html b/platform/features/timeline/res/templates/timeline.html
index 0bb53d1196..7582a515c8 100644
--- a/platform/features/timeline/res/templates/timeline.html
+++ b/platform/features/timeline/res/templates/timeline.html
@@ -128,7 +128,7 @@
             <div style="overflow: hidden; position: absolute; left: 0; top: 0; right: 0; height: 30px;" mct-scroll-x="scroll.x">
                 <mct-include key="'timeline-ticks'"
                              parameters="{
-                                         fullWidth: timelineController.width(zoomController),
+                                         fullWidth: zoomController.width(timelineController.end()),
                                          start: scroll.x,
                                          width: scroll.width,
                                          step: zoomController.toPixels(zoomController.zoom()),
@@ -141,7 +141,7 @@
                  mct-scroll-x="scroll.x"
                  mct-scroll-y="scroll.y">
                 <div class="l-width-control"
-                     ng-style="{ width: timelineController.width(zoomController) + 'px' }">
+                     ng-style="{ width: zoomController.width(timelineController.end()) + 'px' }">
                     <div class="t-swimlane s-swimlane l-swimlane"
                          ng-repeat="swimlane in timelineController.swimlanes()"
                          ng-class="{
@@ -197,7 +197,7 @@
             <div mct-scroll-x="scroll.x"
                  class="t-pane-r-scroll-h-control l-scroll-control s-scroll-control">
                 <div class="l-width-control"
-                     ng-style="{ width: timelineController.width(zoomController) + 'px' }">
+                     ng-style="{ width: zoomController.width(timelineController.end()) + 'px' }">
                 </div>
             </div>
         </div>
diff --git a/platform/features/timeline/src/controllers/TimelineZoomController.js b/platform/features/timeline/src/controllers/TimelineZoomController.js
index 990a83a5b3..5482891004 100644
--- a/platform/features/timeline/src/controllers/TimelineZoomController.js
+++ b/platform/features/timeline/src/controllers/TimelineZoomController.js
@@ -22,6 +22,7 @@
 define(
     [],
     function () {
+        var PADDING = 0.25;
 
         /**
          * Controls the pan-zoom state of a timeline view.
@@ -32,17 +33,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
-            function roundDuration(value) {
-                // Ensure there's always an extra day or so
-                var tickCount = bounds.width / tickWidth,
-                    sz = zoomLevels[zoomLevels.length - 1] * tickCount;
-                value *= 1.25; // Add 25% padding to start
-                return Math.ceil(value / sz) * sz;
-            }
+                bounds = { x: 0, width: tickWidth }; // Default duration in view
 
             function toMillis(pixels) {
                 return (pixels / tickWidth) * zoomLevels[zoomIndex];
@@ -124,16 +115,14 @@ define(
                  */
                 toMillis: toMillis,
                 /**
-                 * Get or set the current displayed duration. If used as a
-                 * setter, this will typically be rounded up to ensure extra
-                 * space is available at the right.
-                 * @returns {number} duration, in milliseconds
+                 * Get the pixel width necessary to fit the specified
+                 * timestamp, expressed as an offset in milliseconds from
+                 * the start of the timeline.
+                 * @param {number} timestamp the time to display
                  */
-                duration: function (value) {
-                    if (arguments.length > 0) {
-                        duration = roundDuration(value);
-                    }
-                    return duration;
+                width: function (timestamp) {
+                    var pixels = Math.ceil(toPixels(timestamp * (1 + PADDING)));
+                    return Math.max(bounds.width, pixels)
                 }
             };
         }