From eca47f7629ea748c448c43ccbe30f7cf310a6ca8 Mon Sep 17 00:00:00 2001 From: Bono-Stebler Date: Mon, 19 Nov 2018 10:54:21 +0100 Subject: [PATCH 1/3] feat: cancel drag on Esc press --- src/Selection.js | 11 ++++++++++- src/addons/dragAndDrop/EventContainerWrapper.js | 5 +++++ 2 files changed, 15 insertions(+), 1 deletion(-) diff --git a/src/Selection.js b/src/Selection.js index 36acbff60..72b334de8 100644 --- a/src/Selection.js +++ b/src/Selection.js @@ -94,6 +94,7 @@ class Selection { this._onTouchMoveWindowListener && this._onTouchMoveWindowListener.remove() this._onInitialEventListener && this._onInitialEventListener.remove() this._onEndListener && this._onEndListener.remove() + this._onEscListener && this._onEscListener.remove() this._onMoveListener && this._onMoveListener.remove() this._onKeyUpListener && this._onKeyUpListener.remove() this._onKeyDownListener && this._onKeyDownListener.remove() @@ -237,6 +238,10 @@ class Selection { 'mouseup', this._handleTerminatingEvent ) + this._onEscListener = addEventListener( + 'keydown', + this._handleTerminatingEvent + ) this._onMoveListener = addEventListener( 'mousemove', this._handleMoveEvent @@ -274,6 +279,10 @@ class Selection { this._initialEventData = null + if (e.key === 'Escape') { + return this.emit('reset') + } + if (click && !inRoot) { return this.emit('reset') } @@ -318,7 +327,7 @@ class Selection { _handleMoveEvent(e) { if (this._initialEventData === null) { - return; + return } let { x, y } = this._initialEventData diff --git a/src/addons/dragAndDrop/EventContainerWrapper.js b/src/addons/dragAndDrop/EventContainerWrapper.js index e0d0afdcd..d2cfec621 100644 --- a/src/addons/dragAndDrop/EventContainerWrapper.js +++ b/src/addons/dragAndDrop/EventContainerWrapper.js @@ -151,6 +151,11 @@ class EventContainerWrapper extends React.Component { }) selector.on('click', () => this.context.draggable.onEnd(null)) + + selector.on('reset', () => { + this.reset() + this.context.draggable.onEnd(null) + }) } handleInteractionEnd = () => { From c21d4d8d0ed46738625061e634a9c74603e86654 Mon Sep 17 00:00:00 2001 From: Bono-Stebler Date: Mon, 19 Nov 2018 10:55:48 +0100 Subject: [PATCH 2/3] fix: always reset drag when an event happens out of bounds --- src/Selection.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Selection.js b/src/Selection.js index 72b334de8..29b7b3e6e 100644 --- a/src/Selection.js +++ b/src/Selection.js @@ -283,7 +283,7 @@ class Selection { return this.emit('reset') } - if (click && !inRoot) { + if (!inRoot) { return this.emit('reset') } From a0d9617b42e262076dae98974306e099e7d4f858 Mon Sep 17 00:00:00 2001 From: Bono-Stebler Date: Mon, 19 Nov 2018 11:09:03 +0100 Subject: [PATCH 3/3] feat: cancel selection on Esc press --- src/DayColumn.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/src/DayColumn.js b/src/DayColumn.js index 75eeedeaf..de823199f 100644 --- a/src/DayColumn.js +++ b/src/DayColumn.js @@ -188,7 +188,7 @@ class DayColumn extends React.Component { events, accessors, slotMetrics, - minimumStartDifference: Math.ceil(step * timeslots / 2), + minimumStartDifference: Math.ceil((step * timeslots) / 2), }) return styledEvents.map(({ event, style }, idx) => { @@ -318,6 +318,12 @@ class DayColumn extends React.Component { this.setState({ selecting: false }) } }) + + selector.on('reset', () => { + if (this.state.selecting) { + this.setState({ selecting: false }) + } + }) } _teardownSelectable = () => {