Fixed #86: A newly created item is now initialized with `end` property when option `type`

is `"range"` or `"rangeoverflow"`.

HISTORY.md

@@ -10,6 +10,8 @@ http://visjs.org
 - Added function `repaint()` to force a repaint of the Timeline.
 - Some tweaks in snapping dragged items to nice dates.
 - Made the instance of moment.js packaged with vis.js accessibly via `vis.moment`.
+- A newly created item is initialized with `end` property when option `type`
+  is `"range"` or `"rangeoverflow"`.
 - Fixed a bug in replacing the DataSet of groups via `Timeline.setGroups(groups)`.
 - Fixed a bug when rendering the Timeline inside a hidden container. 
 

docs/timeline.html

@@ -588,7 +588,7 @@ var options = {
   <td>type</td>
   <td>String</td>
   <td>'box'</td>
-  <td>Specifies the type for the timeline items. Choose from 'box', 'point', 'range', and 'rangeoverflow'. Note that individual items can override this global type.
+  <td>Specifies the default type for the timeline items. Choose from 'box', 'point', 'range', and 'rangeoverflow'. Note that individual items can override this default type.
   </td>
 </tr>
 

src/timeline/Timeline.js

@@ -634,6 +634,11 @@ Timeline.prototype._onAddItem = function (event) {
       content: 'new item'
     };
 
+    // when default type is a range, add a default end date to the new item
+    if (this.options.type === 'range' || this.options.type == 'rangeoverflow') {
+      newItem.end = this.timeAxis.snap(this._toTime(x + this.rootPanel.width / 5));
+    }
+
     var id = util.randomUUID();
     newItem[this.itemsData.fieldId] = id;
 

test/timeline.html

@@ -69,9 +69,11 @@
     {_id: 1, content: 'item 1<br>start', start: now.clone().add('days', 4).toDate()},
     {_id: 2, content: 'item 2', start: now.clone().add('days', -2).toDate() },
     {_id: 3, content: 'item 3', start: now.clone().add('days', 2).toDate()},
-    {_id: 4, content: 'item 4',
+    {
+      _id: 4, content: 'item 4',
       start: now.clone().add('days', 0).toDate(),
-      end: now.clone().add('days', 7).toDate()},
+      end: now.clone().add('days', 7).toDate()
+    },
     {_id: 5, content: 'item 5', start: now.clone().add('days', 9).toDate(), type:'point'},
     {_id: 6, content: 'item 6', start: now.clone().add('days', 11).toDate()}
   ]);