Skip to content
Permalink
Browse files

Pinchable, Rotatable

  • Loading branch information...
Koen Bok
Koen Bok committed Jan 18, 2016
1 parent 4d0ce3e commit ba7cf3c427d5e1229a15c39e4e0a3a33dd93037b
Showing with 80 additions and 38 deletions.
  1. +3 −0 framer/GestureManager.coffee
  2. +17 −11 framer/Layer.coffee
  3. +0 −27 framer/LayerDraggable.coffee
  4. +29 −0 framer/LayerPinchable.coffee
  5. +31 −0 framer/LayerRotatable.coffee
@@ -26,6 +26,9 @@ class exports.GestureManager extends EventEmitter

_addListener: (eventName, listener) ->

throw new Error("No event name defined") unless eventName
throw new Error("No listener defined") unless listener

# Make sure we have a hammer instance and layer listeners enabled
@layer.ignoreEvents = false

@@ -8,11 +8,13 @@ Utils = require "./Utils"
{BaseClass} = require "./BaseClass"
{EventEmitter} = require "./EventEmitter"
{Color} = require "./Color"
{Matrix} = require "./Matrix"
{Animation} = require "./Animation"
{LayerStyle} = require "./LayerStyle"
{LayerStates} = require "./LayerStates"
{LayerDraggable} = require "./LayerDraggable"
{Matrix} = require "./Matrix"
{LayerRotatable} = require "./LayerRotatable"
{LayerPinchable} = require "./LayerPinchable"
{GestureManager} = require "./GestureManager"

NoCacheDateKey = Date.now()
@@ -886,21 +888,25 @@ class exports.Layer extends BaseClass
get: -> @_states ?= new LayerStates @

#############################################################################
## Draggable
## Draggable, Rotatable, Pinchable

@define "draggable",
importable: false
exportable: false
get: ->
@_draggable ?= new LayerDraggable(@)
set: (value) ->
@draggable.enabled = value if _.isBoolean(value)
get: -> @_draggable ?= new LayerDraggable(@)
set: (value) -> @draggable.enabled = value if _.isBoolean(value)

# anchor: ->
# if not @_anchor
# @_anchor = new LayerAnchor(@, arguments...)
# else
# @_anchor.updateRules(arguments...)
@define "rotatable",
importable: false
exportable: false
get: -> @_rotatable ?= new LayerRotatable(@)
set: (value) -> @rotatable.enabled = value if _.isBoolean(value)

@define "pinchable",
importable: false
exportable: false
get: -> @_pinchable ?= new LayerPinchable(@)
set: (value) -> @pinchable.enabled = value if _.isBoolean(value)

##############################################################
## SCROLLING
@@ -43,9 +43,6 @@ class exports.LayerDraggable extends BaseClass
@define "horizontal", @simpleProperty("horizontal", true)
@define "vertical", @simpleProperty("vertical", true)

@define "pinchable", @simpleProperty("pinchable", false)
@define "rotatable", @simpleProperty("rotatable", false)

@define "momentumVelocityMultiplier", @simpleProperty("momentumVelocityMultiplier", 800)
@define "directionLock", @simpleProperty("directionLock", true)
@define "directionLockThreshold", @simpleProperty("directionLockThreshold", {x:10, y:10})
@@ -159,15 +156,6 @@ class exports.LayerDraggable extends BaseClass
@layer._context.domEventManager.wrap(document).addEventListener(Events.TouchMove, @_touchMove)
@layer._context.domEventManager.wrap(document).addEventListener(Events.TouchEnd, @_touchEnd)

if @pinchable
@_scaleStart = null
@layer.gestures.on(Gestures.Pinch, @_pinch)

if @rotatable
@_rotationStart = null
@_rotationOffset = null
@layer.gestures.on(Gestures.Rotate, @_rotate)

@emit(Events.DragStart, event)

_touchMove: (event) =>
@@ -249,19 +237,6 @@ class exports.LayerDraggable extends BaseClass
# # and because @_start currently calls calculateVelocity().
@_isDragging = false

_pinch: (event) =>
return unless @pinchable
@_scaleStart ?= @layer.scale
@layer.scale = event.scale * @_scaleStart
@emit(Events.Pinch, event)

_rotate: (event) =>
return unless @rotatable
@_rotationStart ?= @layer.rotation
@_rotationOffset ?= event.rotation
@layer.rotation = event.rotation - @_rotationOffset + @_rotationStart
@emit(Events.Rotate, event)


##############################################################
# Constraints
@@ -556,6 +531,4 @@ class exports.LayerDraggable extends BaseClass
onDragAnimationDidStart: (cb) -> @on(Events.DragAnimationDidStart, cb)
onDragAnimationDidEnd: (cb) -> @on(Events.DragAnimationDidEnd, cb)
onDirectionLockDidStart: (cb) -> @on(Events.DirectionLockDidStart, cb)
onPinch: -> @on(Events.Pinch, cb)
onRotate: -> @on(Events.Rotate, cb)

@@ -0,0 +1,29 @@
{BaseClass} = require "./BaseClass"
{Events} = require "./Events"
{Gestures} = require "./Gestures"

Events.PinchStart = Gestures.PinchStart
Events.PinchEnd = Gestures.PinchEnd
Events.Pinch = Gestures.Pinch

class exports.LayerPinchable extends BaseClass

@define "enabled", @simpleProperty("enabled", true)

constructor: (@layer) ->
super
@layer.gestures.on(Gestures.PinchStart, @_pinch)
@layer.gestures.on(Gestures.Pinch, @_pinch)
@layer.gestures.on(Gestures.PinchEnd, @_pinchEnd)

_pinchStart: (event) =>
@_scaleStart = null
@emit(Events.PinchStart, event)

_pinch: (event) =>
@_scaleStart ?= @layer.scale
@layer.scale = event.scale * @_scaleStart
@emit(Events.Pinch, event)

_pinchEnd: (event) =>
@emit(Events.PinchEnd, event)
@@ -0,0 +1,31 @@
{BaseClass} = require "./BaseClass"
{Events} = require "./Events"
{Gestures} = require "./Gestures"

Events.RotateStart = Gestures.RotateStart
Events.RotateEnd = Gestures.RotateEnd
Events.Rotate = Gestures.Rotate

class exports.LayerRotatable extends BaseClass

@define "enabled", @simpleProperty("enabled", true)

constructor: (@layer) ->
super
@layer.gestures.on(Gestures.RotateStart, @_rotateStart)
@layer.gestures.on(Gestures.Rotate, @_rotate)
@layer.gestures.on(Gestures.RotateEnd, @_rotateEnd)

_rotateStart: (event) =>
@_rotationStart = null
@_rotationOffset = null
@emit(Events.RotateStart, event)

_rotate: (event) =>
@_rotationStart ?= @layer.rotation
@_rotationOffset ?= event.rotation
@layer.rotation = event.rotation - @_rotationOffset + @_rotationStart
@emit(Events.Rotate, event)

_rotateEnd: (event) =>
@emit(Events.RotateEnd, event)

0 comments on commit ba7cf3c

Please sign in to comment.
You can’t perform that action at this time.