diff --git a/docs/timeline/index.html b/docs/timeline/index.html
index 92823b52..8987c78b 100644
--- a/docs/timeline/index.html
+++ b/docs/timeline/index.html
@@ -769,6 +769,16 @@ function (option, path) {
Only applicable when option selectable
is true
.
+
+
+ multiselectPerGroup |
+ boolean |
+ false |
+
+ If true, selecting multiple items using shift+click will only select items residing in the same group as the first selected item.
+ Only applicable when option selectable and multiselect are true .
+ |
+
onAdd |
diff --git a/lib/timeline/component/ItemSet.js b/lib/timeline/component/ItemSet.js
index 094dbc6a..e688bf11 100644
--- a/lib/timeline/component/ItemSet.js
+++ b/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
+ }
}
}
}
diff --git a/lib/timeline/optionsTimeline.js b/lib/timeline/optionsTimeline.js
index 5d0ad3c1..e3e9c3f3 100644
--- a/lib/timeline/optionsTimeline.js
+++ b/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'},