Merged #996

docs/timeline/index.html

@@ -585,6 +585,13 @@ function (option, path) {
       </td>
     </tr>
 
+    <tr>
+      <td>groupTemplate</td>
+      <td>function</td>
+      <td>none</td>
+      <td>A template function used to generate the contents of the groups. The function is called by the Timeline with a groups data as argument, and must return HTML code as result. When the option groupTemplate is specified, the groups do not need to have a field <code>content</code>. See section <a href="#Templates">Templates</a> for a detailed explanation.</td>
+    </tr>
+
     <tr>
       <td>height</td>
       <td>number or String</td>
@@ -1608,4 +1615,4 @@ var options = {
 <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
 <script src="../js/ie10-viewport-bug-workaround.js"></script>
 <!-- controller -->
-<script src="../js/main.js"></script>
+<script src="../js/main.js"></script>

lib/timeline/component/Group.js

@@ -81,8 +81,16 @@ Group.prototype._create = function() {
  */
 Group.prototype.setData = function(data) {
   // update contents
-  var content = data && data.content;
+  var content;
+  if (this.itemSet.options && this.itemSet.options.groupTemplate) {
+    content = this.itemSet.options.groupTemplate(data);
+  }
+  else {
+    content = data && data.content;
+  }
+
   if (content instanceof Element) {
+    this.dom.inner.appendChild(content);
     while (this.dom.inner.firstChild) {
       this.dom.inner.removeChild(this.dom.inner.firstChild);
     }

lib/timeline/component/ItemSet.js

@@ -280,7 +280,7 @@ ItemSet.prototype._create = function(){
 ItemSet.prototype.setOptions = function(options) {
   if (options) {
     // copy all options that we know
-    var fields = ['type', 'align', 'order', 'stack', 'selectable', 'multiselect', 'groupOrder', 'dataAttributes', 'template','hide', 'snap'];
+    var fields = ['type', 'align', 'order', 'stack', 'selectable', 'multiselect', 'groupOrder', 'dataAttributes', 'template','groupTemplate','hide', 'snap'];
     util.selectiveExtend(fields, this.options, options);
 
     if ('orientation' in options) {

lib/timeline/optionsTimeline.js

@@ -104,6 +104,7 @@ let allOptions = {
   snap: {'function': 'function', 'null': 'null'},
   start: {date, number, string, moment},
   template: {'function': 'function'},
+  groupTemplate: {'function': 'function'},
   timeAxis: {
     scale: {string,'undefined': 'undefined'},
     step: {number,'undefined': 'undefined'},