Skip to content
Permalink
Browse files

Rename animateTo to animate

  • Loading branch information
nvh committed Sep 15, 2016
1 parent f9d6ef3 commit d5a82c270440ea016c8d592cf4914dd8c402870d
@@ -905,9 +905,9 @@ class exports.Layer extends BaseClass
options.completion = =>
@_stateMachine.emit(Events.StateDidSwitch, @_stateMachine.previousName, @_stateMachine.currentName, @)
finished?()
@animateTo properties, options
@animate properties, options

animateTo: (properties,options={}) ->
animate: (properties,options={}) ->
if typeof properties == 'string'
stateName = properties
return @animateToState stateName, options
@@ -942,7 +942,7 @@ class exports.Layer extends BaseClass

switchTo: (properties,options={}) ->
options = _.defaults({instant:true},options)
@animateTo(properties,options)
@animate properties, options

animateToNext: (stateNames=[],options) ->
if not Array.isArray(stateNames)
@@ -953,7 +953,7 @@ class exports.Layer extends BaseClass
stateNames = Utils.arrayFromArguments arguments
options = {}
nextState = @_stateMachine.next(stateNames)
@animateTo nextState, options
@animate nextState, options

animations: ->
# Current running animations on this layer
@@ -47,16 +47,16 @@ valueLayer.options = curve: "spring(300,30,0)"

# Visualize output
sliderA.knob.on Events.DragStart, ->
valueLayer.animateTo "scaleUp"
valueLayer.animate "scaleUp"

# Test proper output
sliderA.on "change:value", ->
valueLayer.html = Math.round(this.value)
valueLayer.animateTo "fade25" if this.value is 0
valueLayer.animateTo "fade50" if this.value >= 25
valueLayer.animateTo "fade75" if this.value >= 50
valueLayer.animateTo "nofade" if this.value >= 75
valueLayer.animate "fade25" if this.value is 0
valueLayer.animate "fade50" if this.value >= 25
valueLayer.animate "fade75" if this.value >= 50
valueLayer.animate "nofade" if this.value >= 75

# Return after DragEnd
sliderA.knob.on Events.DragAnimationEnd, ->
valueLayer.animateTo "scaleDown"
valueLayer.animate "scaleDown"
@@ -47,16 +47,16 @@ valueLayer.options = curve: "spring(300,30,0)"

# Visualize output
sliderA.knob.on Events.DragStart, ->
valueLayer.animateTo "scaleUp"
valueLayer.animate "scaleUp"

# Test proper output
sliderA.on "change:value", ->
valueLayer.html = Math.round(this.value)
valueLayer.animateTo "fade25" if this.value is 0
valueLayer.animateTo "fade50" if this.value >= 25
valueLayer.animateTo "fade75" if this.value >= 50
valueLayer.animateTo "nofade" if this.value >= 75
valueLayer.animate "fade25" if this.value is 0
valueLayer.animate "fade50" if this.value >= 25
valueLayer.animate "fade75" if this.value >= 50
valueLayer.animate "nofade" if this.value >= 75

# Return after DragEnd
sliderA.knob.on Events.DragAnimationEnd, ->
valueLayer.animateTo "scaleDown"
valueLayer.animate "scaleDown"
@@ -132,7 +132,7 @@ describe "Context", ->

context.run ->
layer = new Layer
animation = layer.animateTo
animation = layer.animate
x: 100

# We should have a click listener
@@ -61,7 +61,7 @@ describe "LayerAnimation", ->
curve: "linear"
time: AnimationTime

animation = layer.animateTo properties, options
animation = layer.animate properties, options
animation.options.curve.should.equal "linear"
layer.on "end", ->
layer[p].should.equal 100
@@ -76,7 +76,7 @@ describe "LayerAnimation", ->
curve: "linear"
time: AnimationTime

animation = layer.animateTo properties
animation = layer.animate properties
animation.options.curve.should.equal "linear"

layer.on "end", ->
@@ -91,7 +91,7 @@ describe "LayerAnimation", ->
properties = {}
properties[p] = '+=50'

layer.animateTo properties,
layer.animate properties,
curve: "linear"
time: AnimationTime

@@ -108,7 +108,7 @@ describe "LayerAnimation", ->
properties = {}
properties[p] = '+=50'

layer.animateTo properties,
layer.animate properties,
curve: "linear"
time: AnimationTime

@@ -122,7 +122,7 @@ describe "LayerAnimation", ->

layer = new Layer()

layer.animateTo
layer.animate
scale: -> layer.scale + 1
options:
curve: "linear"
@@ -137,7 +137,7 @@ describe "LayerAnimation", ->
color = "red"
layer = new Layer()

layer.animateTo
layer.animate
backgroundColor: color
options:
curve: "linear"
@@ -151,7 +151,7 @@ describe "LayerAnimation", ->
layerA = new Layer
layerB = new Layer
parent: layerA
layerB.animateTo
layerB.animate
parent: null
options:
instant: true
@@ -209,7 +209,7 @@ describe "LayerAnimation", ->
it "should list running animations", ->

layer = new Layer()
animation = layer.animateTo
animation = layer.animate
x: 100
options:
time: 0.5
@@ -222,7 +222,7 @@ describe "LayerAnimation", ->

layer = new Layer()

animation = layer.animateTo
animation = layer.animate
x: 100
options:
time: 0.5
@@ -242,7 +242,7 @@ describe "LayerAnimation", ->
it "should tell you if animations are running", ->

layer = new Layer()
animation = layer.animateTo
animation = layer.animate
x: 100
options:
time: 0.5
@@ -387,21 +387,21 @@ describe "LayerAnimation", ->

layerA = new Layer width:80, height:80
layerA.name = "layerA"
layerA.animateTo
layerA.animate
y:300
options:
time: 2 * AnimationTime

layerB = new Layer width:80, height:80, x:100, backgroundColor:"red"
layerB.name = "layerB"
layerB.animateTo
layerB.animate
y:300
options:
time: 5 * AnimationTime

layerC = new Layer width:80, height:80, x:200, backgroundColor:"orange"
layerC.name = "layerC"
layerC.animateTo
layerC.animate
y:300
options:
time: 2 * AnimationTime
@@ -562,7 +562,7 @@ describe "LayerAnimation", ->
calledEvents.should.eql(["start", "end", "stop"])

it "should listen to instant: true to disable animation", ->
animation = @layer.animateTo
animation = @layer.animate
x: 100
options:
curve: "spring"
@@ -20,7 +20,7 @@ describe "LayerStates", ->
done()

@layer.on Events.StateWillSwitch, test
@layer.animateTo 'a', instant: true
@layer.animate 'a', instant: true

it "should emit didSwitch when switching", (done) ->

@@ -32,7 +32,7 @@ describe "LayerStates", ->
done()

@layer.on Events.StateDidSwitch, test
@layer.animateTo 'a', instant: true
@layer.animate 'a', instant: true


describe "Defaults", ->
@@ -41,7 +41,7 @@ describe "LayerStates", ->

layer = new Layer
layer.states.test = {x:123}
animation = layer.animateTo "test"
animation = layer.animate "test"

animation.options.curve.should.equal Framer.Defaults.Animation.curve

@@ -50,7 +50,7 @@ describe "LayerStates", ->

layer = new Layer
layer.states.test = {x:456}
animation = layer.animateTo "test"
animation = layer.animate "test"

animation.options.curve.should.equal "spring(1, 2, 3)"

@@ -104,20 +104,20 @@ describe "LayerStates", ->
layer = new Layer
html: "fff"
layer.states.stateA = {x: 100}
layer.animateTo 'stateA', instant: true
layer.animate 'stateA', instant: true
layer.html.should.equal "fff"

it "should switch non animatable properties", ->
layer = new Layer
layer.states.stateA = {x: 100, image:"static/test2.png"}
layer.animateTo 'stateA', instant: true
layer.animate 'stateA', instant: true
layer.x.should.equal 100
layer.image.should.equal "static/test2.png"

it "should not convert html to a color value if used in a state", ->
layer = new Layer
layer.states.stateA = {x: 100, html: 'aaa'}
layer.animateTo 'stateA', instant: true
layer.animate 'stateA', instant: true
layer.html.should.equal "aaa"

it "should not change style when going back to initial", ->
@@ -128,20 +128,20 @@ describe "LayerStates", ->
layer.states =
test: {x: 500}

layer.animateTo "test", instant: true
layer.animate "test", instant: true
layer.x.should.equal 500
layer.style.fontFamily = "Helvetica"
layer.style.fontFamily.should.equal "Helvetica"

layer.animateTo "initial", instant: true
layer.animate "initial", instant: true
layer.x.should.equal 0
layer.style.fontFamily.should.equal "Helvetica"

it "should be a no-op to change to the current state", ->
layer = new Layer
layer.states.stateA = {x: 100}
layer.switchTo 'stateA'
animation = layer.animateTo 'stateA', time: 0.05
animation = layer.animate 'stateA', time: 0.05
assert.equal(animation,null)

it "should change to a state when the properties defined are not the current", (done) ->
@@ -152,7 +152,7 @@ describe "LayerStates", ->
layer.onStateDidSwitch ->
layer.x.should.equal 100
done()
animation = layer.animateTo 'stateA', time: 0.05
animation = layer.animate 'stateA', time: 0.05

describe "Properties", ->

@@ -190,13 +190,13 @@ describe "LayerStates", ->
stateA: {scroll:true}
stateB: {scroll:false}

layer.animateTo "stateA", instant: true
layer.animate "stateA", instant: true
layer.scroll.should.equal true

layer.animateTo "stateB", instant: true
layer.animate "stateB", instant: true
layer.scroll.should.equal false

layer.animateTo "stateA", instant: true
layer.animate "stateA", instant: true
layer.scroll.should.equal true

it "should set non numeric properties with animation", (done) ->
@@ -212,7 +212,7 @@ describe "LayerStates", ->
layer.style.backgroundColor.should.equal new Color("red").toString()
done()

layer.animateTo "stateA"
layer.animate "stateA"

it "should set non and numeric properties with animation", (done) ->

@@ -229,7 +229,7 @@ describe "LayerStates", ->
layer.style.backgroundColor.should.equal new Color("red").toString()
done()

layer.animateTo "stateA", {curve:"linear", time:0.1}
layer.animate "stateA", {curve:"linear", time:0.1}

it "should restore the initial state when using non exportable properties", ->

@@ -239,10 +239,10 @@ describe "LayerStates", ->

layer.x.should.equal 0

layer.animateTo "stateA", instant: true
layer.animate "stateA", instant: true
layer.x.should.equal 200 - (layer.width // 2)

layer.animateTo "initial", instant: true
layer.animate "initial", instant: true
layer.x.should.equal 0

it "should set the parent", ->
@@ -259,12 +259,12 @@ describe "LayerStates", ->
parent: layerC

assert.equal(layerB.parent, layerA)
layerB.animateTo "parentC", instant: true
layerB.animate "parentC", instant: true
assert.equal(layerB.parent, layerC)
layerB.animateTo "noParent", instant: true
layerB.animate "noParent", instant: true
assert.equal(layerB.parent, null)

layerB.animateTo "initial", instant: true
layerB.animate "initial", instant: true
# assert.equal(layerB.parent, layerA)

it "should set the current and previous states when switching", ->
@@ -275,11 +275,11 @@ describe "LayerStates", ->

assert.equal(layer.states.previous, null)
assert.equal(layer.states.current, layer.states.initial)
layer.animateTo('first')
layer.animate 'first'
assert.equal(layer.states.previous, layer.states.initial)
layer.states.current.should.equal layer.states.first
layer.x.should.equal 100
layer.animateTo('second')
layer.animate 'second'
assert.equal(layer.states.previous, layer.states.first)
layer.states.current.should.equal layer.states.second
layer.y.should.equal 200
@@ -338,6 +338,6 @@ describe "LayerStates", ->
layer = new Layer
layer.options =
time: 4
animation = layer.animateTo
animation = layer.animate
x: 100
animation.options.time.should.equal 4

0 comments on commit d5a82c2

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