Permalink
Browse files

Merge branch 'feature/property-proxy' into feature/gradients

  • Loading branch information...
eelco committed Jun 28, 2017
2 parents 272bb60 + 74062ab commit cfa6db33711eba1a9e05caf6d720fb8e46da70fd
Showing with 22 additions and 10 deletions.
  1. +4 −4 framer/Gradient.coffee
  2. +18 −6 framer/Layer.coffee
View
@@ -27,16 +27,16 @@ class exports.Gradient extends BaseClass
set: (value) ->
@_angle = value if _.isNumber(value)
toCSS: =>
return "linear-gradient(#{this.angle}deg, #{this.start}, #{this.end})"
toCSS: ->
return "linear-gradient(#{@angle}deg, #{@start}, #{@end})"
mix: (gradientB, fraction, model) =>
mix: (gradientB, fraction, model) ->
return Gradient.mix(@, gradientB, fraction, model)
isEqual: (gradientB) ->
return Gradient.equal(@, gradientB)
toInspect: =>
toInspect: ->
return "<#{@constructor.name} start:#{@start} end:#{@end} angle:#{@angle}>"
##############################################################
View
@@ -22,15 +22,18 @@ NoCacheDateKey = Date.now()
layerValueTypeError = (name, value) ->
throw new Error("Layer.#{name}: value '#{value}' of type '#{typeof(value)}' is not valid")
layerProperty = (obj, name, cssProperty, fallback, validator, transformer, options={}, set, targetElement, includeMainElement) ->
layerProperty = (obj, name, cssProperty, fallback, validator, transformer, options={}, set, targetElement, includeMainElement, useSubpropertyProxy) ->
result =
default: fallback
get: ->
# console.log "Layer.#{name}.get #{@_properties[name]}", @_properties.hasOwnProperty(name)
return @_properties[name] if @_properties.hasOwnProperty(name)
return fallback
value = @_properties[name] if @_properties.hasOwnProperty(name)
value ?= fallback
return layerProxiedValue(value, @, name) if useSubpropertyProxy
return value
set: (value) ->
@@ -76,6 +79,15 @@ layerProperty = (obj, name, cssProperty, fallback, validator, transformer, optio
exports.layerProperty = layerProperty
layerProxiedValue = (value, layer, property) ->
return value unless window.Proxy and _.isObject(value)
new Proxy value,
set: (proxiedValue, subProperty, subValue) ->
clone = Object.assign(new proxiedValue.constructor, proxiedValue)
clone[subProperty] = subValue
layer[property] = clone
return true
layerPropertyPointTransformer = (value, layer, property) ->
if _.isFunction(value)
value = value(layer, property)
@@ -325,9 +337,9 @@ class exports.Layer extends BaseClass
@define "color", layerProperty(@, "color", "color", null, Color.validColorValue, Color.toColor)
# Border properties
@define "borderRadius", layerProperty(@, "borderRadius", "borderRadius", 0, null, asBorderRadius, null, null, "_elementBorder", true)
@define "borderRadius", layerProperty(@, "borderRadius", "borderRadius", 0, null, asBorderRadius, null, null, "_elementBorder", true, true)
@define "borderColor", layerProperty(@, "borderColor", "borderColor", null, Color.validColorValue, Color.toColor, null, null, "_elementBorder")
@define "borderWidth", layerProperty(@, "borderWidth", "borderWidth", 0, null, asBorderWidth, null, null, "_elementBorder")
@define "borderWidth", layerProperty(@, "borderWidth", "borderWidth", 0, null, asBorderWidth, null, null, "_elementBorder", false, true)
@define "borderStyle", layerProperty(@, "borderStyle", "borderStyle", "solid", _.isString, null, null, null, "_elementBorder")
@define "force2d", layerProperty(@, "force2d", "webkitTransform", false, _.isBoolean)
@@ -958,7 +970,7 @@ class exports.Layer extends BaseClass
@define "gradient",
get: ->
return @image if Gradient.isGradient(@image)
return layerProxiedValue(@image, @, "gradient") if Gradient.isGradient(@image)
return null
set: (value) ->
if Gradient.isGradient(value)

0 comments on commit cfa6db3

Please sign in to comment.