Merge pull request #1354 from hansmaulwurf23/multiselectFiltersGroup

added option multiselectFiltersGroup

docs/timeline/index.html

@@ -769,6 +769,16 @@ function (option, path) {
         Only applicable when option <code>selectable</code> is <code>true</code>.
       </td>
     </tr>
+    
+    <tr>
+      <td style="font-size: 0.9em">multiselectPerGroup</td>
+      <td>boolean</td>
+      <td><code>false</code></td>
+      <td>
+        If true, selecting multiple items using shift+click will only select items residing in the same group as the <i>first</i> selected item.
+        Only applicable when option <code>selectable</code> and <code>multiselect</code> are <code>true</code>.
+      </td>
+    </tr>
 
     <tr>
       <td>onAdd</td>

lib/timeline/component/ItemSet.js

@@ -307,7 +307,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', 'groupTemplate', 'hide', 'snap', 'groupOrderSwap'];
+    var fields = ['type', 'align', 'order', 'stack', 'selectable', 'multiselect', 'multiselectPerGroup', 'groupOrder', 'dataAttributes', 'template', 'groupTemplate', 'hide', 'snap', 'groupOrderSwap'];
     util.selectiveExtend(fields, this.options, options);
 
     if ('orientation' in options) {
@@ -1759,23 +1759,37 @@ ItemSet.prototype._onMultiSelectItem = function (event) {
 
     if (shiftKey && this.options.multiselect) {
       // select all items between the old selection and the tapped item
-
+      var itemGroup = this.itemsData.get(item.id).group;
+    	
+      // when filtering get the group of the last selected item
+      var lastSelectedGroup = undefined;
+      if (this.options.multiselectPerGroup) {
+        if (selection.length > 0) {
+          lastSelectedGroup = this.itemsData.get(selection[0]).group;
+        }
+      }
+    	
       // determine the selection range
-      selection.push(item.id);
+      if (!this.options.multiselectPerGroup || lastSelectedGroup == undefined || lastSelectedGroup == itemGroup) {
+        selection.push(item.id);
+      }
       var range = ItemSet._getItemRange(this.itemsData.get(selection, this.itemOptions));
-
-      // select all items within the selection range
-      selection = [];
-      for (var id in this.items) {
-        if (this.items.hasOwnProperty(id)) {
-          var _item = this.items[id];
-          var start = _item.data.start;
-          var end = (_item.data.end !== undefined) ? _item.data.end : start;
-
-          if (start >= range.min &&
-              end <= range.max &&
-              !(_item instanceof BackgroundItem)) {
-            selection.push(_item.id); // do not use id but item.id, id itself is stringified
+      
+      if (!this.options.multiselectPerGroup || lastSelectedGroup == itemGroup) {
+        // select all items within the selection range
+        selection = [];
+        for (var id in this.items) {
+          if (this.items.hasOwnProperty(id)) {
+            var _item = this.items[id];
+            var start = _item.data.start;
+            var end = (_item.data.end !== undefined) ? _item.data.end : start;
+
+            if (start >= range.min &&
+                end <= range.max &&
+                (!this.options.multiselectPerGroup || lastSelectedGroup == this.itemsData.get(_item.id).group) &&
+                !(_item instanceof BackgroundItem)) {
+              selection.push(_item.id); // do not use id but item.id, id itself is stringified
+            }
           }
         }
       }

lib/timeline/optionsTimeline.js

@@ -98,6 +98,7 @@ let allOptions = {
   minHeight: {number, string},
   moveable: {boolean},
   multiselect: {boolean},
+  multiselectPerGroup: {boolean},
   onAdd: {'function': 'function'},
   onUpdate: {'function': 'function'},
   onMove: {'function': 'function'},
@@ -191,6 +192,7 @@ let configureOptions = {
     minHeight: '',
     moveable: false,
     multiselect: false,
+    multiselectPerGroup: false,
     //onAdd: {'function': 'function'},
     //onUpdate: {'function': 'function'},
     //onMove: {'function': 'function'},