From feafba45a253959a5f276c875c5bc33df9c49b69 Mon Sep 17 00:00:00 2001
From: Karen Collins <karen.collins@duke.edu>
Date: Fri, 29 Jul 2016 09:38:40 -0400
Subject: [PATCH 1/2] fix for ipad

---
 lib/DraggableCore.es6 | 23 ++++++++++++++++++++++-
 1 file changed, 22 insertions(+), 1 deletion(-)

diff --git a/lib/DraggableCore.es6 b/lib/DraggableCore.es6
index 1e630dd3..d18355be 100644
--- a/lib/DraggableCore.es6
+++ b/lib/DraggableCore.es6
@@ -28,6 +28,7 @@ let dragEventFor = eventsFor.mouse;
 
 type CoreState = {
   dragging: boolean,
+  scrolling: boolean,
   lastX: number,
   lastY: number,
   touchIdentifier: ?number
@@ -174,6 +175,8 @@ export default class DraggableCore extends React.Component {
 
   state: CoreState = {
     dragging: false,
+    // Used in fix for ipad so we can keep up with when we've stopped scrolling.
+    scrolling: true,
     // Used while dragging to determine deltas.
     lastX: NaN, lastY: NaN,
     touchIdentifier: null
@@ -187,10 +190,13 @@ export default class DraggableCore extends React.Component {
     removeEvent(ownerDocument, eventsFor.touch.move, this.handleDrag);
     removeEvent(ownerDocument, eventsFor.mouse.stop, this.handleDragStop);
     removeEvent(ownerDocument, eventsFor.touch.stop, this.handleDragStop);
+    removeEvent(ownerDocument, eventsFor.touch.move, this.removeScroll);
+    this.setState({scrolling: true});
     if (this.props.enableUserSelectHack) removeUserSelectStyles(ownerDocument.body);
   }
 
   handleDragStart: EventHandler<MouseEvent> = (e) => {
+
     // Make it possible to attach event handlers on top of this one.
     this.props.onMouseDown(e);
 
@@ -252,7 +258,12 @@ export default class DraggableCore extends React.Component {
   };
 
   handleDrag: EventHandler<MouseEvent> = (e) => {
-
+    // Stop scrolling on touch devices while user is dragging as this is an issue for ipad.
+    if (this.state.dragging && this.state.scrolling) {
+      const {ownerDocument} = ReactDOM.findDOMNode(this);
+      addEvent(ownerDocument, eventsFor.touch.move, this.removeScroll);
+      this.setState({scrolling: false})
+    }
     // Get the current drag point from the event. This is used as the offset.
     const position = getControlPosition(e, this.state.touchIdentifier, this);
     if (position == null) return;
@@ -295,6 +306,7 @@ export default class DraggableCore extends React.Component {
   };
 
   handleDragStop: EventHandler<MouseEvent> = (e) => {
+
     if (!this.state.dragging) return;
 
     const position = getControlPosition(e, this.state.touchIdentifier, this);
@@ -336,6 +348,11 @@ export default class DraggableCore extends React.Component {
     return this.handleDragStop(e);
   };
 
+  removeScroll: EventHandler<MouseEvent> =  (e) => {
+    e.preventDefault();
+    return false;
+  };
+
   // Same as onMouseDown (start drag), but now consider this a touch device.
   onTouchStart: EventHandler<MouseEvent> = (e) => {
     // We're on a touch device now, so change the event handlers
@@ -347,6 +364,10 @@ export default class DraggableCore extends React.Component {
   onTouchEnd: EventHandler<MouseEvent> = (e) => {
     // We're on a touch device now, so change the event handlers
     dragEventFor = eventsFor.touch;
+    // Remove the event listener that stopped document scrolling on touch devices
+    const {ownerDocument} = ReactDOM.findDOMNode(this);
+    removeEvent(ownerDocument, eventsFor.touch.move, this.removeScroll);
+    this.setState({scrolling: true});
 
     return this.handleDragStop(e);
   };

From 67480b8856b18099c82cd0c69d83837f9337cd5a Mon Sep 17 00:00:00 2001
From: Karen Collins <karen.collins@duke.edu>
Date: Fri, 29 Jul 2016 09:43:39 -0400
Subject: [PATCH 2/2] removing added blank lines

---
 lib/DraggableCore.es6 | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/lib/DraggableCore.es6 b/lib/DraggableCore.es6
index d18355be..835aae61 100644
--- a/lib/DraggableCore.es6
+++ b/lib/DraggableCore.es6
@@ -196,7 +196,6 @@ export default class DraggableCore extends React.Component {
   }
 
   handleDragStart: EventHandler<MouseEvent> = (e) => {
-
     // Make it possible to attach event handlers on top of this one.
     this.props.onMouseDown(e);
 
@@ -258,6 +257,7 @@ export default class DraggableCore extends React.Component {
   };
 
   handleDrag: EventHandler<MouseEvent> = (e) => {
+
     // Stop scrolling on touch devices while user is dragging as this is an issue for ipad.
     if (this.state.dragging && this.state.scrolling) {
       const {ownerDocument} = ReactDOM.findDOMNode(this);
@@ -306,7 +306,6 @@ export default class DraggableCore extends React.Component {
   };
 
   handleDragStop: EventHandler<MouseEvent> = (e) => {
-
     if (!this.state.dragging) return;
 
     const position = getControlPosition(e, this.state.touchIdentifier, this);