End multi touch session on window leave

framer/Extras/TouchEmulator.coffee

@@ -54,6 +54,7 @@ class TouchEmulator extends BaseClass
		@wrap(document).addEventListener("mousedown", @mousedown, true)
		@wrap(document).addEventListener("mousemove", @mousemovePosition, true)
		@wrap(document).addEventListener("keydown", @keydown, true)
		@wrap(document).addEventListener("mouseout", @mouseout, true)
		
		@isMouseDown = false
		@isPinchKeyDown = false
@@ -68,28 +69,8 @@ class TouchEmulator extends BaseClass
				image: @touchPointerImage
				opacity: 0
	
	showTouchCursor: ->
		@touchPointLayer.animateStop()
		@touchPointLayer.midX = @point.x
		@touchPointLayer.midY = @point.y
		@touchPointLayer.scale = 1.8
		@touchPointLayer.animate
			properties:
				opacity: 1
				scale: 1
				# midX: @point.x + @touchPointerInitialOffset.x
				# midY: @point.y + @touchPointerInitialOffset.y
			time: 0.1
			curve: "ease-out"
	# Event handlers

	hideTouchCursor: ->
		@touchPointLayer.animateStop()
		@touchPointLayer.animate
			properties:
				opacity: 0
				scale: 1.2
			time: 0.08
	
	keydown: (event) =>

		if event.keyCode is @keyPinchCode	
@@ -137,11 +118,6 @@ class TouchEmulator extends BaseClass
			dispatchTouchEvent("touchstart", @target, event)
		
		@touchPointLayer.image = @touchPointerImageActive

	mousemovePosition: (event) =>
		@point =
			x: event.pageX
			y: event.pageY
	
	mousemove: (event) =>
		
@@ -175,19 +151,58 @@ class TouchEmulator extends BaseClass
			dispatchTouchEvent("touchmove", @target, event)

	mouseup: (event) =>
		
		@isMouseDown = false
		
			
		cancelEvent(event)
		
		@wrap(document).removeEventListener("mousemove", @mousemove, true)
		@wrap(document).removeEventListener("mouseup", @mouseup, true)

		if @isPinchKeyDown or @isPanKeyDown
			dispatchTouchEvent("touchend", @target, event, @touchPointDelta)
		else
			dispatchTouchEvent("touchend", @target, event)

		@endMultiTouch()
	
	mouseout: (event) =>

		fromElement = event.relatedTarget or event.toElement

		if not fromElement or fromElement.nodeName is "HTML"
			@endMultiTouch()

	# Utilities

	showTouchCursor: ->
		@touchPointLayer.animateStop()
		@touchPointLayer.midX = @point.x
		@touchPointLayer.midY = @point.y
		@touchPointLayer.scale = 1.8
		@touchPointLayer.animate
			properties:
				opacity: 1
				scale: 1
				# midX: @point.x + @touchPointerInitialOffset.x
				# midY: @point.y + @touchPointerInitialOffset.y
			time: 0.1
			curve: "ease-out"

	hideTouchCursor: ->
		@touchPointLayer.animateStop()
		@touchPointLayer.animate
			properties:
				opacity: 0
				scale: 1.2
			time: 0.08

	mousemovePosition: (event) =>
		@point =
			x: event.pageX
			y: event.pageY

	endMultiTouch: ->

		@wrap(document).removeEventListener("mousemove", @mousemove, true)
		@wrap(document).removeEventListener("mouseup", @mouseup, true)
		
		@isMouseDown = false
		@touchPointLayer.image = @touchPointerImage
		@hideTouchCursor()