Skip to content

Commit

Permalink
LinearGradient -> Gradient
Browse files Browse the repository at this point in the history
  • Loading branch information
eelco authored and Jonas Treub committed Jun 28, 2017
1 parent 0d40d08 commit ae0b628
Show file tree
Hide file tree
Showing 8 changed files with 38 additions and 38 deletions.
12 changes: 6 additions & 6 deletions framer/Animation.coffee
Expand Up @@ -278,7 +278,7 @@ class exports.Animation extends BaseClass
for k, v of @_stateB for k, v of @_stateB
if Color.isColorObject(v) or Color.isColorObject(@_stateA[k]) if Color.isColorObject(v) or Color.isColorObject(@_stateA[k])
@_valueUpdaters[k] = @_updateColorValue @_valueUpdaters[k] = @_updateColorValue
else if LinearGradient.isLinearGradient(v) or LinearGradient.isLinearGradient(@_stateA[k]) else if Gradient.isGradient(v) or Gradient.isGradient(@_stateA[k])
@_valueUpdaters[k] = @_updateGradientValue @_valueUpdaters[k] = @_updateGradientValue
else else
@_valueUpdaters[k] = @_updateNumberValue @_valueUpdaters[k] = @_updateNumberValue
Expand All @@ -294,9 +294,9 @@ class exports.Animation extends BaseClass
@_target[key] = Color.mix(@_stateA[key], @_stateB[key], value, false, @options.colorModel) @_target[key] = Color.mix(@_stateA[key], @_stateB[key], value, false, @options.colorModel)


_updateGradientValue: (key, value) => _updateGradientValue: (key, value) =>
gradientA = LinearGradient._asPlainObject(@_stateA[key]) gradientA = Gradient._asPlainObject(@_stateA[key])
gradientB = LinearGradient._asPlainObject(@_stateB[key]) gradientB = Gradient._asPlainObject(@_stateB[key])
@_target[key] = LinearGradient.mix( @_target[key] = Gradient.mix(
_.defaults(gradientA, gradientB) _.defaults(gradientA, gradientB)
_.defaults(gradientB, gradientA) _.defaults(gradientB, gradientA)
value value
Expand All @@ -307,7 +307,7 @@ class exports.Animation extends BaseClass
return _.pick(@layer, _.keys(@properties)) return _.pick(@layer, _.keys(@properties))


@isAnimatable = (v) -> @isAnimatable = (v) ->
_.isNumber(v) or _.isFunction(v) or isRelativeProperty(v) or Color.isColorObject(v) or LinearGradient.isLinearGradient(v) _.isNumber(v) or _.isFunction(v) or isRelativeProperty(v) or Color.isColorObject(v) or Gradient.isGradient(v)


@filterAnimatableProperties = (properties) -> @filterAnimatableProperties = (properties) ->
# Function to filter only animatable properties out of a given set # Function to filter only animatable properties out of a given set
Expand All @@ -330,7 +330,7 @@ class exports.Animation extends BaseClass
animatableProperties[k] = v animatableProperties[k] = v
else if Color.isValidColorProperty(k, v) else if Color.isValidColorProperty(k, v)
animatableProperties[k] = new Color(v) animatableProperties[k] = new Color(v)
else if k is "gradient" and not _.isEmpty(LinearGradient._asPlainObject(v)) else if k is "gradient" and not _.isEmpty(Gradient._asPlainObject(v))
animatableProperties[k] = v animatableProperties[k] = v


return animatableProperties return animatableProperties
Expand Down
2 changes: 1 addition & 1 deletion framer/Framer.coffee
Expand Up @@ -6,7 +6,7 @@ Framer = {}
Framer._ = _ Framer._ = _
Framer.Utils = (require "./Utils") Framer.Utils = (require "./Utils")
Framer.Color = (require "./Color").Color Framer.Color = (require "./Color").Color
Framer.LinearGradient = (require "./LinearGradient").LinearGradient Framer.Gradient = (require "./Gradient").Gradient
Framer.Layer = (require "./Layer").Layer Framer.Layer = (require "./Layer").Layer
Framer._Layer = Framer.Layer # So it won't be overridden by MobileScrollFix Framer._Layer = Framer.Layer # So it won't be overridden by MobileScrollFix
Framer.BackgroundLayer = (require "./BackgroundLayer").BackgroundLayer Framer.BackgroundLayer = (require "./BackgroundLayer").BackgroundLayer
Expand Down
16 changes: 8 additions & 8 deletions framer/LinearGradient.coffee → framer/Gradient.coffee
Expand Up @@ -2,7 +2,7 @@
{BaseClass} = require "./BaseClass" {BaseClass} = require "./BaseClass"
{Color} = require "./Color" {Color} = require "./Color"


class exports.LinearGradient extends BaseClass class exports.Gradient extends BaseClass
constructor: (options = {}) -> constructor: (options = {}) ->
options.start ?= "black" options.start ?= "black"
options.end ?= "white" options.end ?= "white"
Expand All @@ -28,10 +28,10 @@ class exports.LinearGradient extends BaseClass
return "linear-gradient(#{this.angle}deg, #{this.start}, #{this.end})" return "linear-gradient(#{this.angle}deg, #{this.start}, #{this.end})"


mix: (gradientB, fraction, model) => mix: (gradientB, fraction, model) =>
return LinearGradient.mix(@, gradientB, fraction, model) return Gradient.mix(@, gradientB, fraction, model)


isEqual: (gradientB) -> isEqual: (gradientB) ->
return LinearGradient.equal(@, gradientB) return Gradient.equal(@, gradientB)


toInspect: => toInspect: =>
return "<#{@constructor.name} start:#{@start} end:#{@end} angle:#{@angle}>" return "<#{@constructor.name} start:#{@start} end:#{@end} angle:#{@angle}>"
Expand All @@ -51,7 +51,7 @@ class exports.LinearGradient extends BaseClass
endAngle = normalizer(endAngle) endAngle = normalizer(endAngle)
angle = startAngle + (endAngle - startAngle) * fraction angle = startAngle + (endAngle - startAngle) * fraction


return new LinearGradient return new Gradient
start: start start: start
end: end end: end
angle: angle angle: angle
Expand All @@ -60,16 +60,16 @@ class exports.LinearGradient extends BaseClass
hue = Math.random() * 360 hue = Math.random() * 360
colorA = new Color h: hue colorA = new Color h: hue
colorB = new Color h: hue + 40 colorB = new Color h: hue + 40
return new LinearGradient return new Gradient
start: colorA start: colorA
end: colorB end: colorB
angle: Math.random() * 360 angle: Math.random() * 360


@isLinearGradient: (gradient) -> return gradient instanceof LinearGradient @isGradient: (gradient) -> return gradient instanceof Gradient


@equal: (gradientA, gradientB) -> @equal: (gradientA, gradientB) ->
return false unless LinearGradient.isLinearGradient(gradientA) return false unless Gradient.isGradient(gradientA)
return false unless LinearGradient.isLinearGradient(gradientB) return false unless Gradient.isGradient(gradientB)
equalAngle = Math.abs(gradientA.angle - gradientB.angle) % 360 is 0 equalAngle = Math.abs(gradientA.angle - gradientB.angle) % 360 is 0
equalStart = Color.equal(gradientA.start, gradientB.start) equalStart = Color.equal(gradientA.start, gradientB.start)
equalEnd = Color.equal(gradientA.end, gradientB.end) equalEnd = Color.equal(gradientA.end, gradientB.end)
Expand Down
12 changes: 6 additions & 6 deletions framer/Layer.coffee
Expand Up @@ -8,7 +8,7 @@ Utils = require "./Utils"
{BaseClass} = require "./BaseClass" {BaseClass} = require "./BaseClass"
{EventEmitter} = require "./EventEmitter" {EventEmitter} = require "./EventEmitter"
{Color} = require "./Color" {Color} = require "./Color"
{LinearGradient} = require "./LinearGradient" {Gradient} = require "./Gradient"
{Matrix} = require "./Matrix" {Matrix} = require "./Matrix"
{Animation} = require "./Animation" {Animation} = require "./Animation"
{LayerStyle} = require "./LayerStyle" {LayerStyle} = require "./LayerStyle"
Expand Down Expand Up @@ -890,7 +890,7 @@ class exports.Layer extends BaseClass
defaults = Defaults.getDefaults "Layer", {} defaults = Defaults.getDefaults "Layer", {}
isBackgroundColorDefault = @backgroundColor?.isEqual(defaults.backgroundColor) isBackgroundColorDefault = @backgroundColor?.isEqual(defaults.backgroundColor)


if LinearGradient.isLinearGradient(value) if Gradient.isGradient(value)
@emit("change:gradient", value, currentValue) @emit("change:gradient", value, currentValue)
@emit("change:image", value, currentValue) @emit("change:image", value, currentValue)
@_setPropertyValue("image", value) @_setPropertyValue("image", value)
Expand Down Expand Up @@ -958,15 +958,15 @@ class exports.Layer extends BaseClass


@define "gradient", @define "gradient",
get: -> get: ->
return @image if LinearGradient.isLinearGradient(@image) return @image if Gradient.isGradient(@image)
return null return null
set: (value) -> set: (value) ->
if LinearGradient.isLinearGradient(value) if Gradient.isGradient(value)
@image = value @image = value
else else
gradientOptions = LinearGradient._asPlainObject(value) gradientOptions = Gradient._asPlainObject(value)
if not _.isEmpty(gradientOptions) if not _.isEmpty(gradientOptions)
@image = new LinearGradient(gradientOptions) @image = new Gradient(gradientOptions)


############################################################## ##############################################################
## HIERARCHY ## HIERARCHY
Expand Down
4 changes: 2 additions & 2 deletions framer/LayerStates.coffee
Expand Up @@ -62,7 +62,7 @@ class LayerStates
stateProperties[k] = new Color(v) stateProperties[k] = new Color(v)
continue continue


if LinearGradient.isLinearGradient(v) if Gradient.isGradient(v)
stateProperties[k] = v stateProperties[k] = v
continue continue


Expand All @@ -77,7 +77,7 @@ class LayerStates
return true if _.isBoolean(v) return true if _.isBoolean(v)
return true if _.isString(v) return true if _.isString(v)
return true if Color.isColorObject(v) return true if Color.isColorObject(v)
return true if LinearGradient.isLinearGradient(v) return true if Gradient.isGradient(v)
return true if v is null return true if v is null
return true if v?.constructor?.name is "Layer" return true if v?.constructor?.name is "Layer"
return false return false
Expand Down
8 changes: 4 additions & 4 deletions framer/SVGLayer.coffee
Expand Up @@ -15,19 +15,19 @@ class exports.SVGLayer extends Layer
get: -> get: ->
return @_gradient return @_gradient
set: (value) -> set: (value) ->
if LinearGradient.isLinearGradient(value) if Gradient.isGradient(value)
@_gradient = value @_gradient = value
else else
gradientOptions = LinearGradient._asPlainObject(value) gradientOptions = Gradient._asPlainObject(value)
if not _.isEmpty(gradientOptions) if not _.isEmpty(gradientOptions)
@_gradient = new LinearGradient(gradientOptions) @_gradient = new Gradient(gradientOptions)
else else
@_gradient = null @_gradient = null
@updateGradientSVG() @updateGradientSVG()


updateGradientSVG: => updateGradientSVG: =>


isGradient = LinearGradient.isLinearGradient @_gradient isGradient = Gradient.isGradient @_gradient


if not @_elementGradientSVG and isGradient if not @_elementGradientSVG and isGradient
@_elementGradientSVG = document.createElementNS("http://www.w3.org/2000/svg", "svg") @_elementGradientSVG = document.createElementNS("http://www.w3.org/2000/svg", "svg")
Expand Down
2 changes: 1 addition & 1 deletion test/tests.coffee
Expand Up @@ -46,7 +46,7 @@ require "./tests/TextLayerTest"
require "./tests/PageComponentTest" require "./tests/PageComponentTest"
require "./tests/VersionTest" require "./tests/VersionTest"
require "./tests/ColorTest" require "./tests/ColorTest"
require "./tests/LinearGradientTest" require "./tests/GradientTest"
require "./tests/DeviceComponentTest" require "./tests/DeviceComponentTest"
require "./tests/SliderComponentTest" require "./tests/SliderComponentTest"
require "./tests/RangeSliderComponentTest" require "./tests/RangeSliderComponentTest"
Expand Down
Expand Up @@ -6,7 +6,7 @@ describe "Linear Gradient", ->
end = "orange" end = "orange"
angle = 20 angle = 20


gradient = new LinearGradient gradient = new Gradient
start: start start: start
end: end end: end
angle: angle angle: angle
Expand All @@ -17,25 +17,25 @@ describe "Linear Gradient", ->


it "should compare for equality", -> it "should compare for equality", ->


gradient = new LinearGradient gradient = new Gradient
angle: 360 angle: 360
start: "red" start: "red"
equalGradient = new LinearGradient equalGradient = new Gradient
angle: 0 angle: 0
start: "red" start: "red"
LinearGradient.equal(gradient, equalGradient).should.be.true Gradient.equal(gradient, equalGradient).should.be.true


unequalGradient = new LinearGradient unequalGradient = new Gradient
angle: 90 angle: 90
unequalGradient.isEqual(gradient).should.be.false unequalGradient.isEqual(gradient).should.be.false


it "should mix gradients", -> it "should mix gradients", ->


colorA = "red" colorA = "red"
colorB = "yellow" colorB = "yellow"
gradientA = new LinearGradient gradientA = new Gradient
start: colorA start: colorA
gradientB = new LinearGradient gradientB = new Gradient
start: colorB start: colorB
angle: 90 angle: 90
mixed = gradientA.mix(gradientB) mixed = gradientA.mix(gradientB)
Expand All @@ -44,9 +44,9 @@ describe "Linear Gradient", ->


it "should take the shortest route when animating to a new angle", -> it "should take the shortest route when animating to a new angle", ->


gradientA = new LinearGradient gradientA = new Gradient
angle: 0 angle: 0
gradientB = new LinearGradient gradientB = new Gradient
angle: 405 angle: 405
mixed = LinearGradient.mix(gradientA, gradientB, 1) mixed = Gradient.mix(gradientA, gradientB, 1)
mixed.angle.should.equal 45 mixed.angle.should.equal 45

0 comments on commit ae0b628

Please sign in to comment.