Fixed scrolling, dragging and pinching again

koenbok · Dec 21, 2017 · 206fb0e · 206fb0e
1 parent 3d6094a
commit 206fb0e
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 27 deletions.
diff --git a/framer/LayerDraggable.coffee b/framer/LayerDraggable.coffee
@@ -157,11 +157,10 @@ class exports.LayerDraggable extends BaseClass
 		# Extract the event (mobile may have multiple)
 		touchEvent = Events.touchEvent(event)
 
-
 		# TODO: we should use the event velocity
 		@_eventBuffer.push
-			x: event.point.x
+			x: touchEvent.clientX
-			y: event.point.y
+			y: touchEvent.clientY
 			t: Date.now()
 
 		# Store original layer position
@@ -197,16 +196,13 @@ class exports.LayerDraggable extends BaseClass
 
 		event.preventDefault()
 		event.stopPropagation() if @propagateEvents is false
-		# print event.touches[0].identifier, event.touches[1].identifier
+
 		touchEvent = Events.touchEvent(event)
-		point = {x: touchEvent.clientX, y: touchEvent.clientY}
-		touchEvent.point = Utils.convertPointFromContext(point, @layer, true)
-		touchEvent.contextPoint = Utils.convertPointFromContext(point, @layer.context, true)
 		@_lastEvent = touchEvent
 
 		@_eventBuffer.push
-			x: touchEvent.point.x
+			x: touchEvent.clientX
-			y: touchEvent.point.y
+			y: touchEvent.clientY
 			t: Date.now() # We don't use timeStamp because it's different on Chrome/Safari
 
 		point = _.clone(@_point)

diff --git a/framer/LayerPinchable.coffee b/framer/LayerPinchable.coffee
@@ -52,10 +52,12 @@ class exports.LayerPinchable extends BaseClass
 		#@_centerOrigin(event) if @centerOrigin
 
 	_centerOrigin: (event) =>
+
 		topInSuperBefore = Utils.convertPoint({}, @layer, @layer.superLayer)
-		pinchLocation = Screen.convertPointToLayer(event.touchCenter, @layer)
+		pinchLocation = Utils.convertPointFromContext(event.touchCenter, @layer, true, true)
 		@layer.originX = pinchLocation.x / @layer.width
 		@layer.originY = pinchLocation.y / @layer.height
+
 		topInSuperAfter = Utils.convertPoint({}, @layer, @layer.superLayer)
 		originDelta =
 			x: topInSuperAfter.x - topInSuperBefore.x

diff --git a/test/tests/LayerDraggableTest.coffee b/test/tests/LayerDraggableTest.coffee
@@ -15,8 +15,7 @@ describe "Layer", ->
 			a2.isAnimating.should.equal true
 			a3.isAnimating.should.equal true
 
-			event = Framer.GestureInputRecognizer._getGestureEvent(document.createEvent("MouseEvent"))
+			layer.draggable.touchStart(document.createEvent("MouseEvent"))
-			layer.draggable.touchStart(event)
 
 			a1.isAnimating.should.equal false
 			a2.isAnimating.should.equal false
@@ -25,25 +24,20 @@ describe "Layer", ->
 		describe "Simulation", ->
 			it "should be cancelled when animating the same property", (done) ->
 				layerA = new Layer
-				start = document.createEvent("MouseEvent")
-				event = Framer.GestureInputRecognizer._getGestureEvent(start)
-				layerA.draggable._touchStart(start)
 				time = 0.001
 				for i in [0..3]
 					do (i) ->
 						Utils.delay i*time, ->
 							move = document.createEvent("MouseEvent")
-							move.touches = [
+							move.delta =
-								{pageX: i, pageY: 0}
-							]
-							event = Framer.GestureInputRecognizer._getGestureEvent(move)
-							event.delta =
 								x: i
 								y: 0
-							layerA.draggable._touchMove(event)
+							move.touches = [
+								{clientX: i, clientY: 0}
+							]
+							layerA.draggable._touchMove(move)
 				Utils.delay i*time, ->
-					event = Framer.GestureInputRecognizer._getGestureEvent(document.createEvent("MouseEvent"))
+					layerA.draggable._touchEnd(document.createEvent("MouseEvent"))
-					layerA.draggable._touchEnd(event)
 				layerA.onDragEnd ->
 					simulation = layerA.draggable._simulation.x
 					a = @animate

diff --git a/test/tests/ScrollComponentTest.coffee b/test/tests/ScrollComponentTest.coffee
@@ -119,13 +119,13 @@ describe "ScrollComponent", ->
 					done("expected up+, down+, null+, but got: #{moves}")
 
 				# TODO instead of actually taking time, trick time
-				draggable._touchStart({point: {x: 100, y: 100}, preventDefault: (->), stopPropagation: (->)})
+				draggable._touchStart({clientX: 100, clientY: 100, preventDefault: (->), stopPropagation: (->)})
 				Utils.delay 0.01, ->
-					draggable._touchMove({clientX: 100, clientY: 111, point: {x: 100, y: 111}, preventDefault: (->), stopPropagation: (->), delta: {x: 0, y: 11}})
+					draggable._touchMove({clientX: 100, clientY: 111, preventDefault: (->), stopPropagation: (->), delta: {x: 0, y: 11}})
 				Utils.delay 0.20, -> # enough time to set velocity to zero
-					draggable._touchMove({clientX: 100, clientY: 112, point: {x: 100, y: 112}, preventDefault: (->), stopPropagation: (->), delta: {x: 0, y: 1}})
+					draggable._touchMove({clientX: 100, clientY: 112, preventDefault: (->), stopPropagation: (->), delta: {x: 0, y: 1}})
 				Utils.delay 0.21, ->
-					draggable._touchEnd({clientX: 100, clientY: 112, point: {x: 100, y: 112}, preventDefault: (->), stopPropagation: (->), delta: {x: 0, y: 0}})
+					draggable._touchEnd({clientX: 100, clientY: 112, preventDefault: (->), stopPropagation: (->), delta: {x: 0, y: 0}})
 
 		describe "PageComponent", ->
 			it "should fire scroll events", (done) ->