Permalink
Browse files

Add shadow animating

  • Loading branch information...
koenbok committed Jun 27, 2014
1 parent 0839b4b commit e3be3639da0f21fcf1b2cd5bd62a5baa148295d5
Showing with 52 additions and 2 deletions.
  1. +11 −1 framer/Layer.coffee
  2. +8 −1 framer/LayerStyle.coffee
  3. +33 −0 test/tests/LayerTest.coffee
@@ -26,7 +26,7 @@ layerProperty = (name, cssProperty, fallback, validator, set) ->
# if not validator
# console.log "Missing validator for Layer.#{name}", validator
if validator(value) is false
if validator?(value) is false
throw Error "value '#{value}' of type #{typeof value} is not valid for a Layer.#{name} property"
@_setPropertyValue name, value
@@ -150,9 +150,19 @@ class exports.Layer extends BaseClass
@define "grayscale", layerProperty "grayscale", "webkitFilter", 0, _.isNumber
@define "sepia", layerProperty "sepia", "webkitFilter", 0, _.isNumber
# Shadow properties
@define "shadowX", layerProperty "shadowX", "boxShadow", 0, _.isNumber
@define "shadowY", layerProperty "shadowY", "boxShadow", 0, _.isNumber
@define "shadowBlur", layerProperty "shadowBlur", "boxShadow", 0, _.isNumber
@define "shadowSpread", layerProperty "shadowSpread", "boxShadow", 0, _.isNumber
@define "shadowColor", layerProperty "shadowColor", "boxShadow", ""
# Mapped style properties
@define "backgroundColor", layerStyleProperty "backgroundColor"
@define "color", layerStyleProperty "color"
# Border properties
@define "borderRadius", layerStyleProperty "borderRadius"
@define "borderColor", layerStyleProperty "borderColor"
@define "borderWidth", layerStyleProperty "borderWidth"
@@ -106,8 +106,15 @@ exports.LayerStyle =
pointerEvents: (layer) ->
if layer.ignoreEvents
return "none"
"auto"
else
return "auto"
boxShadow: (layer) ->
if not layer.shadowColor
return ""
return "#{layer.shadowX}px #{layer.shadowY}px #{layer.shadowBlur}px #{layer.shadowSpread}px #{layer.shadowColor}"
# css: ->
# css = {}
@@ -252,6 +252,39 @@ describe "Layer", ->
layer.contrast.should.equal 50
layer.style.webkitFilter.should.equal "blur(10px) contrast(50%)"
describe "Shadow Properties", ->
it "should set nothing on defaults", ->
layer = new Layer
layer.style.boxShadow.should.equal ""
it "should set the shadow", ->
layer = new Layer
layer.shadowX = 10
layer.shadowY = 10
layer.shadowBlur = 10
layer.shadowSpread = 10
layer.shadowX.should.equal 10
layer.shadowY.should.equal 10
layer.shadowBlur.should.equal 10
layer.shadowSpread.should.equal 10
layer.style.boxShadow.should.equal ""
# Only after we set a color a shadow should be drawn
layer.shadowColor = "red"
layer.shadowColor.should.equal "red"
layer.style.boxShadow.should.equal "red 10px 10px 10px 10px"
# Only after we set a color a shadow should be drawn
layer.shadowColor = null
layer.style.boxShadow.should.equal ""
describe "Events", ->
it "should set pointer events", ->

0 comments on commit e3be363

Please sign in to comment.