From d2cfa84df865b727643c3ed138edc8748c0e91d0 Mon Sep 17 00:00:00 2001
From: Francesco Stefanini <francesco.stefanini@getconnected.it>
Date: Fri, 5 Jan 2018 11:37:06 +0100
Subject: [PATCH] [Timeline] Align current time (#3718)

* add alignCurrentTime option

* update docs

* add available values
---
 docs/graph2d/index.html               |  7 +++++++
 docs/timeline/index.html              |  7 +++++++
 lib/timeline/component/CurrentTime.js | 10 +++++++++-
 lib/timeline/optionsGraph2d.js        |  2 ++
 lib/timeline/optionsTimeline.js       |  2 ++
 5 files changed, 27 insertions(+), 1 deletion(-)

diff --git a/docs/graph2d/index.html b/docs/graph2d/index.html
index ebe15083..e27d6de1 100644
--- a/docs/graph2d/index.html
+++ b/docs/graph2d/index.html
@@ -782,6 +782,13 @@ onRender: function(item, group, graph2d) {
             <th>Description</th>
         </tr>
 
+        <tr>
+            <td>alignCurrentTime</td>
+            <td>String</td>
+            <td>none</td>
+            <td>If set, the current time bar will be aligned to the start of the chosen unit of time. Available values are 'year', 'month', 'quarter', 'week', 'isoWeek', 'day', 'date', 'hour', 'minute' or 'second'. If not provided, the current time bar will be updated at every tick.</td>
+        </tr>
+
         <tr>
             <td>autoResize</td>
             <td>Boolean</td>
diff --git a/docs/timeline/index.html b/docs/timeline/index.html
index 505155d8..1a6b7c3c 100644
--- a/docs/timeline/index.html
+++ b/docs/timeline/index.html
@@ -515,6 +515,13 @@ var options = {
       <td>Alignment of items with type 'box', 'range', and 'background'. Available values are 'auto' (default), 'center', 'left', or 'right'. For 'box' items, the 'auto' alignment is 'center'. For 'range' items, the auto alignment is dynamic: positioned left and shifted such that the contents is always visible on screen.</td>
     </tr>
 
+    <tr>
+      <td>alignCurrentTime</td>
+      <td>String</td>
+      <td>none</td>
+      <td>If set, the current time bar will be aligned to the start of the chosen unit of time. Available values are 'year', 'month', 'quarter', 'week', 'isoWeek', 'day', 'date', 'hour', 'minute' or 'second'. If not provided, the current time bar will be updated at every tick.</td>
+    </tr>
+
     <tr>
       <td>autoResize</td>
       <td>boolean</td>
diff --git a/lib/timeline/component/CurrentTime.js b/lib/timeline/component/CurrentTime.js
index 27ec93bf..74d93fc9 100644
--- a/lib/timeline/component/CurrentTime.js
+++ b/lib/timeline/component/CurrentTime.js
@@ -8,6 +8,7 @@ var locales = require('../locales');
  * @param {{range: Range, dom: Object, domProps: Object}} body
  * @param {Object} [options]        Available parameters:
  *                                  {Boolean} [showCurrentTime]
+ *                                  {String}  [alignCurrentTime]
  * @constructor CurrentTime
  * @extends Component
  */
@@ -18,6 +19,7 @@ function CurrentTime (body, options) {
   this.defaultOptions = {
     rtl: false,
     showCurrentTime: true,
+    alignCurrentTime: undefined,
 
     moment: moment,
     locales: locales,
@@ -61,11 +63,12 @@ CurrentTime.prototype.destroy = function () {
  * Set options for the component. Options will be merged in current options.
  * @param {Object} options  Available parameters:
  *                          {boolean} [showCurrentTime]
+ *                          {String}  [alignCurrentTime]
  */
 CurrentTime.prototype.setOptions = function(options) {
   if (options) {
     // copy all options that we know
-    util.selectiveExtend(['rtl', 'showCurrentTime', 'moment', 'locale', 'locales'], this.options, options);
+    util.selectiveExtend(['rtl', 'showCurrentTime', 'alignCurrentTime', 'moment', 'locale', 'locales'], this.options, options);
   }
 };
 
@@ -87,6 +90,11 @@ CurrentTime.prototype.redraw = function() {
     }
 
     var now = this.options.moment(new Date().valueOf() + this.offset);
+
+    if (this.options.alignCurrentTime) {
+      now = now.startOf(this.options.alignCurrentTime);
+    }
+
     var x = this.body.util.toScreen(now);
 
     var locale = this.options.locales[this.options.locale];
diff --git a/lib/timeline/optionsGraph2d.js b/lib/timeline/optionsGraph2d.js
index 0caaf2d2..30fed2cf 100644
--- a/lib/timeline/optionsGraph2d.js
+++ b/lib/timeline/optionsGraph2d.js
@@ -25,6 +25,7 @@ let allOptions = {
   },
 
   //globals :
+  alignCurrentTime: {string, 'undefined': 'undefined'},  
   yAxisOrientation: {string:['left','right']},
   defaultGroup: {string},
   sort: {'boolean': bool},
@@ -169,6 +170,7 @@ let allOptions = {
 
 let configureOptions = {
   global: {
+    alignCurrentTime: ['none', 'year', 'month', 'quarter', 'week', 'isoWeek', 'day', 'date', 'hour', 'minute', 'second'],   
     //yAxisOrientation: ['left','right'], // TDOO: enable as soon as Grahp2d doesn't crash when changing this on the fly
     sort: true,
     sampling: true,
diff --git a/lib/timeline/optionsTimeline.js b/lib/timeline/optionsTimeline.js
index dc9b3518..5f2a2f59 100644
--- a/lib/timeline/optionsTimeline.js
+++ b/lib/timeline/optionsTimeline.js
@@ -25,6 +25,7 @@ let allOptions = {
 
   //globals :
   align: {string},
+  alignCurrentTime: {string, 'undefined': 'undefined'},
   rtl: { 'boolean': bool, 'undefined': 'undefined'},
   rollingMode: {
     follow: { 'boolean': bool },
@@ -179,6 +180,7 @@ let allOptions = {
 let configureOptions = {
   global: {
     align:  ['center', 'left', 'right'],
+    alignCurrentTime: ['none', 'year', 'month', 'quarter', 'week', 'isoWeek', 'day', 'date', 'hour', 'minute', 'second'],
     direction:  false,
     autoResize: true,
     clickToUse: false,