From 111de0be49c41190c7ba671ee5cb9604cd229db9 Mon Sep 17 00:00:00 2001 From: DallasFraser Date: Wed, 8 Jan 2020 17:04:23 -0500 Subject: [PATCH 1/6] Attempt at configuring the long press time The default is 251 since I beleive that is the default of hammer Added it to the documentation I had to set it at Core and ItemSet --- docs/timeline/index.html | 10 ++++++++++ lib/timeline/Core.js | 8 +++++++- lib/timeline/component/ItemSet.js | 5 ++++- lib/timeline/optionsTimeline.js | 2 ++ 4 files changed, 23 insertions(+), 2 deletions(-) diff --git a/docs/timeline/index.html b/docs/timeline/index.html index a5590a291e..a725426b83 100644 --- a/docs/timeline/index.html +++ b/docs/timeline/index.html @@ -917,6 +917,16 @@

Configuration Options

+ + multiselectLongPressTime + number + 1000 + + The minimal press time in ms for an event to be considered a (long) press. + Only applicable when option selectable and multiselect are true. + + + onAdd function diff --git a/lib/timeline/Core.js b/lib/timeline/Core.js index 995b3755ac..d6a0b9f2c0 100644 --- a/lib/timeline/Core.js +++ b/lib/timeline/Core.js @@ -404,7 +404,8 @@ class Core { const fields = [ 'width', 'height', 'minHeight', 'maxHeight', 'autoResize', 'start', 'end', 'clickToUse', 'dataAttributes', 'hiddenDates', - 'locale', 'locales', 'moment', 'preferZoom', 'rtl', 'zoomKey', 'horizontalScroll', 'verticalScroll' + 'locale', 'locales', 'moment', 'preferZoom', 'rtl', 'zoomKey', + 'horizontalScroll', 'verticalScroll', 'multiselectLongPressTime' ]; util.selectiveExtend(fields, this.options, options); @@ -1044,6 +1045,11 @@ class Core { direction: contentsOverflow ? Hammer.DIRECTION_ALL : Hammer.DIRECTION_HORIZONTAL }); + // set the long press time + this.hammer.get('press').set({ + time: this.options.multiselectLongPressTime + }); + // redraw all components this.components.forEach(component => { resized = component.redraw() || resized; diff --git a/lib/timeline/component/ItemSet.js b/lib/timeline/component/ItemSet.js index 1b89b0db89..9c2223f64b 100644 --- a/lib/timeline/component/ItemSet.js +++ b/lib/timeline/component/ItemSet.js @@ -56,6 +56,7 @@ class ItemSet extends Component { selectable: true, multiselect: false, + multiselectLongPressTime: 251, itemsAlwaysDraggable: { item: false, range: false, @@ -392,7 +393,7 @@ class ItemSet extends Component { // copy all options that we know const fields = [ 'type', 'rtl', 'align', 'order', 'stack', 'stackSubgroups', 'selectable', 'multiselect', 'sequentialSelection', - 'multiselectPerGroup', 'groupOrder', 'dataAttributes', 'template', 'groupTemplate', 'visibleFrameTemplate', + 'multiselectPerGroup', 'multiselectLongPressTime', 'groupOrder', 'dataAttributes', 'template', 'groupTemplate', 'visibleFrameTemplate', 'hide', 'snap', 'groupOrderSwap', 'showTooltips', 'tooltip', 'tooltipOnItemUpdateTime', 'groupHeightMode', 'onTimeout' ]; util.selectiveExtend(fields, this.options, options); @@ -870,6 +871,8 @@ class ItemSet extends Component { this.dom.axis.style.left = '0'; } + this.hammer.get('press').set({time: this.options.multiselectLongPressTime}); + this.initialItemSetDrawn = true; // check if this component is resized resized = this._isResized() || resized; diff --git a/lib/timeline/optionsTimeline.js b/lib/timeline/optionsTimeline.js index c74a18e776..b16479c303 100644 --- a/lib/timeline/optionsTimeline.js +++ b/lib/timeline/optionsTimeline.js @@ -124,6 +124,7 @@ let allOptions = { moveable: { 'boolean': bool}, multiselect: { 'boolean': bool}, multiselectPerGroup: { 'boolean': bool}, + multiselectLongPressTime: { 'number': number}, onAdd: {'function': 'function'}, onDropObjectOnItem: {'function': 'function'}, onUpdate: {'function': 'function'}, @@ -250,6 +251,7 @@ let configureOptions = { moveable: false, multiselect: false, multiselectPerGroup: false, + multiselectLongPressTime: false, //onAdd: {'function': 'function'}, //onUpdate: {'function': 'function'}, //onMove: {'function': 'function'}, From 1f6f301aef235f438efe3b1bb87260c9c655a758 Mon Sep 17 00:00:00 2001 From: DallasFraser Date: Thu, 9 Jan 2020 09:49:20 -0500 Subject: [PATCH 2/6] Add the type --- types/index.d.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/types/index.d.ts b/types/index.d.ts index 1574379f81..0a5bc5cb0a 100644 --- a/types/index.d.ts +++ b/types/index.d.ts @@ -282,6 +282,7 @@ export interface TimelineOptions { moveable?: boolean; multiselect?: boolean; multiselectPerGroup?: boolean; + multiselectLongPressTime?: number; onAdd?: TimelineOptionsItemCallbackFunction; onAddGroup?: TimelineOptionsGroupCallbackFunction; onDropObjectOnItem?: any; // TODO From 4b1094cd81656cf823040b5de948e2658215176a Mon Sep 17 00:00:00 2001 From: Yotam Berkowitz Date: Sat, 18 Jan 2020 22:15:03 +0200 Subject: [PATCH 3/6] Update index.html --- docs/timeline/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/timeline/index.html b/docs/timeline/index.html index a725426b83..610efa25a0 100644 --- a/docs/timeline/index.html +++ b/docs/timeline/index.html @@ -920,7 +920,7 @@

Configuration Options

multiselectLongPressTime number - 1000 + 251 The minimal press time in ms for an event to be considered a (long) press. Only applicable when option selectable and multiselect are true. From ade68ab8f832314b1e910781aee42fdb346ba1de Mon Sep 17 00:00:00 2001 From: DallasFraser Date: Thu, 23 Jan 2020 13:04:25 -0500 Subject: [PATCH 4/6] Change the variable to longSelectPressTime Did some testing against the default and 251 does seem to be the default right now --- docs/timeline/index.html | 20 +++++++++----------- lib/timeline/Core.js | 11 +++++++---- lib/timeline/Timeline.js | 1 + lib/timeline/component/ItemSet.js | 6 +++--- lib/timeline/optionsTimeline.js | 4 ++-- types/index.d.ts | 2 +- 6 files changed, 23 insertions(+), 21 deletions(-) diff --git a/docs/timeline/index.html b/docs/timeline/index.html index f88842daad..bc43d7eb8e 100644 --- a/docs/timeline/index.html +++ b/docs/timeline/index.html @@ -807,6 +807,15 @@

Configuration Options

A map with i18n locales. See section Localization for more information. + + longSelectPressTime + number + 251 + + The minimal press time in ms for an event to be considered a (long) press. + + + moment function @@ -916,17 +925,6 @@

Configuration Options

Only applicable when option selectable and multiselect are true. - - - multiselectLongPressTime - number - 1000 - - The minimal press time in ms for an event to be considered a (long) press. - Only applicable when option selectable and multiselect are true. - - - onAdd function diff --git a/lib/timeline/Core.js b/lib/timeline/Core.js index 428cbdbab1..d630ab3f7a 100644 --- a/lib/timeline/Core.js +++ b/lib/timeline/Core.js @@ -411,10 +411,9 @@ class Core { 'width', 'height', 'minHeight', 'maxHeight', 'autoResize', 'start', 'end', 'clickToUse', 'dataAttributes', 'hiddenDates', 'locale', 'locales', 'moment', 'preferZoom', 'rtl', 'zoomKey', - 'horizontalScroll', 'verticalScroll', 'multiselectLongPressTime' + 'horizontalScroll', 'verticalScroll', 'longSelectPressTime' ]; - util.selectiveExtend(fields, this.options, options); - + util.selectiveExtend(fields, this.options, options); this.dom.rollingModeBtn.style.visibility = 'hidden'; if (this.options.rtl) { @@ -1052,8 +1051,12 @@ class Core { }); // set the long press time + console.log(options); + console.log(this.options); + console.log("Define" ,this.options.longSelectPressTime); + console.trace(); this.hammer.get('press').set({ - time: this.options.multiselectLongPressTime + time: this.options.longSelectPressTime }); // redraw all components diff --git a/lib/timeline/Timeline.js b/lib/timeline/Timeline.js index 9fbddf2aac..a7f450b89c 100644 --- a/lib/timeline/Timeline.js +++ b/lib/timeline/Timeline.js @@ -53,6 +53,7 @@ export default class Timeline extends Core { const me = this; this.defaultOptions = { autoResize: true, + longSelectPressTime: 251, orientation: { axis: 'bottom', // axis orientation: 'bottom', 'top', or 'both' item: 'bottom' // not relevant diff --git a/lib/timeline/component/ItemSet.js b/lib/timeline/component/ItemSet.js index e25e21642c..9e1a5ebfec 100644 --- a/lib/timeline/component/ItemSet.js +++ b/lib/timeline/component/ItemSet.js @@ -56,7 +56,7 @@ class ItemSet extends Component { selectable: true, multiselect: false, - multiselectLongPressTime: 251, + longSelectPressTime: 251, itemsAlwaysDraggable: { item: false, range: false, @@ -393,7 +393,7 @@ class ItemSet extends Component { // copy all options that we know const fields = [ 'type', 'rtl', 'align', 'order', 'stack', 'stackSubgroups', 'selectable', 'multiselect', 'sequentialSelection', - 'multiselectPerGroup', 'multiselectLongPressTime', 'groupOrder', 'dataAttributes', 'template', 'groupTemplate', 'visibleFrameTemplate', + 'multiselectPerGroup', 'longSelectPressTime', 'groupOrder', 'dataAttributes', 'template', 'groupTemplate', 'visibleFrameTemplate', 'hide', 'snap', 'groupOrderSwap', 'showTooltips', 'tooltip', 'tooltipOnItemUpdateTime', 'groupHeightMode', 'onTimeout' ]; util.selectiveExtend(fields, this.options, options); @@ -871,7 +871,7 @@ class ItemSet extends Component { this.dom.axis.style.left = '0'; } - this.hammer.get('press').set({time: this.options.multiselectLongPressTime}); + this.hammer.get('press').set({time: this.options.longSelectPressTime}); this.initialItemSetDrawn = true; // check if this component is resized diff --git a/lib/timeline/optionsTimeline.js b/lib/timeline/optionsTimeline.js index b16479c303..1a0d0ba934 100644 --- a/lib/timeline/optionsTimeline.js +++ b/lib/timeline/optionsTimeline.js @@ -107,6 +107,7 @@ let allOptions = { __any__: {any}, __type__: {object} }, + longSelectPressTime: {number}, margin: { axis: {number}, item: { @@ -124,7 +125,6 @@ let allOptions = { moveable: { 'boolean': bool}, multiselect: { 'boolean': bool}, multiselectPerGroup: { 'boolean': bool}, - multiselectLongPressTime: { 'number': number}, onAdd: {'function': 'function'}, onDropObjectOnItem: {'function': 'function'}, onUpdate: {'function': 'function'}, @@ -236,6 +236,7 @@ let configureOptions = { height: '', //hiddenDates: {object, array}, locale: '', + longSelectPressTime: 251, margin: { axis: [20, 0, 100, 1], item: { @@ -251,7 +252,6 @@ let configureOptions = { moveable: false, multiselect: false, multiselectPerGroup: false, - multiselectLongPressTime: false, //onAdd: {'function': 'function'}, //onUpdate: {'function': 'function'}, //onMove: {'function': 'function'}, diff --git a/types/index.d.ts b/types/index.d.ts index 0a5bc5cb0a..5c32a14ce7 100644 --- a/types/index.d.ts +++ b/types/index.d.ts @@ -272,6 +272,7 @@ export interface TimelineOptions { itemsAlwaysDraggable?: TimelineOptionsItemsAlwaysDraggableType; locale?: string; locales?: any; // TODO + longSelectPressTime?: number, moment?: MomentConstructor; margin?: TimelineOptionsMarginType; max?: DateType; @@ -282,7 +283,6 @@ export interface TimelineOptions { moveable?: boolean; multiselect?: boolean; multiselectPerGroup?: boolean; - multiselectLongPressTime?: number; onAdd?: TimelineOptionsItemCallbackFunction; onAddGroup?: TimelineOptionsGroupCallbackFunction; onDropObjectOnItem?: any; // TODO From 3b78fc30bac31086178d97f349ab5f74e1aa9724 Mon Sep 17 00:00:00 2001 From: DallasFraser Date: Thu, 23 Jan 2020 13:05:07 -0500 Subject: [PATCH 5/6] Merge branch 'master' of https://github.com/fras2560/vis-timeline.git Conflicts: docs/timeline/index.html --- docs/timeline/index.html | 1 + 1 file changed, 1 insertion(+) diff --git a/docs/timeline/index.html b/docs/timeline/index.html index bc43d7eb8e..8b1112e673 100644 --- a/docs/timeline/index.html +++ b/docs/timeline/index.html @@ -925,6 +925,7 @@

Configuration Options

Only applicable when option selectable and multiselect are true. + onAdd function From fe7bb595d96f7dc38add396a6c0e5c0a57f8e1b2 Mon Sep 17 00:00:00 2001 From: DallasFraser Date: Thu, 23 Jan 2020 13:09:05 -0500 Subject: [PATCH 6/6] Remove the logging I was using during debugging --- lib/timeline/Core.js | 4 ---- 1 file changed, 4 deletions(-) diff --git a/lib/timeline/Core.js b/lib/timeline/Core.js index d630ab3f7a..9772a0bf7c 100644 --- a/lib/timeline/Core.js +++ b/lib/timeline/Core.js @@ -1051,10 +1051,6 @@ class Core { }); // set the long press time - console.log(options); - console.log(this.options); - console.log("Define" ,this.options.longSelectPressTime); - console.trace(); this.hammer.get('press').set({ time: this.options.longSelectPressTime });