Permalink
Browse files

Make layer.screenFrame a property

You can now directly get/set the screenFrame for each layer (layer.screenFrame used to be a function). I also got rid of the Frame object in many places in favor of a normal object.
  • Loading branch information...
koenbok committed Aug 19, 2014
1 parent 689cbb4 commit f13bd7ff554f6e26d19a8ebc5f86a2cbba27f35b
Showing with 86 additions and 54 deletions.
  1. +15 −9 extras/CactusFramer/static/app.coffee
  2. +45 −36 framer/Layer.coffee
  3. +1 −4 framer/Utils.coffee
  4. +6 −5 test/tests/ImporterTest.coffee
  5. +19 −0 test/tests/LayerTest.coffee
@@ -1,17 +1,23 @@
layerA = new Layer x:100, y:100, width:100, height:100
layerA.clip = false
layerB = new Layer x:300, y:300, width:100, height:100, backgroundColor:"red", superLayer:layerA
# assert.equal layerB.screenFrame.x, 400
# assert.equal layerB.screenFrame.y, 400
# print _.pick(layerA, ["x", "y", "width", "height"])
newFrame = Utils.convertPoint({x:200, y:200}, null, layerA)
print newFrame
layerA = new Layer
width: 100
height: 100
layerB.frame = newFrame
layerB = new Layer
width: 20
height: 20
superLayer: layerA
print layerB.x
layerB.draggable.enabled = true
layerB.draggable.maxDragFrame = layerA.frame
layerB.superLayer = null
# assert.equal layerB.screenFrame.x, 1000
# assert.equal layerB.screenFrame.y, 1000
View
@@ -42,14 +42,6 @@ layerStyleProperty = (cssProperty) ->
@style[cssProperty] = value
@emit "change:#{cssProperty}", value
frameProperty = (name) ->
exportable: false
get: -> @frame[name]
set: (value) ->
frame = @frame
frame[name] = value
@frame = frame
class exports.Layer extends BaseClass
constructor: (options={}) ->
@@ -64,6 +56,9 @@ class exports.Layer extends BaseClass
@_createElement()
@_setDefaultCSS()
if options.hasOwnProperty "frame"
options = _.extend(options, options.frame)
options = Defaults.getDefaults "Layer", options
super options
@@ -74,13 +69,9 @@ class exports.Layer extends BaseClass
# We need to explicitly set the element id again, becuase it was made by the super
@_element.id = "FramerLayer-#{@id}"
# Extract the frame from the options, so we support minX, maxX etc.
if options.hasOwnProperty "frame"
frame = new Frame options.frame
else
frame = new Frame options
@frame = frame
for k in ["minX", "midX", "maxX", "minY", "midY", "maxY"]
if options.hasOwnProperty k
@[k] = options[k]
# Insert the layer into the dom or the superLayer element
if not options.superLayer
@@ -190,47 +181,65 @@ class exports.Layer extends BaseClass
# Geometry
@define "frame",
get: ->
new Frame @
get: -> _.pick(@, ["x", "y", "width", "height"])
set: (frame) ->
return if not frame
for k in ["x", "y", "width", "height"]
@[k] = frame[k]
if frame.hasOwnProperty(k)
@[k] = frame[k]
@define "minX",
get: -> @x
set: (value) -> @x = value
@define "midX",
get: -> Utils.frameGetMidX @
set: (value) -> Utils.frameSetMidX @, value
@define "minX", frameProperty "minX"
@define "midX", frameProperty "midX"
@define "maxX", frameProperty "maxX"
@define "minY", frameProperty "minY"
@define "midY", frameProperty "midY"
@define "maxY", frameProperty "maxY"
@define "maxX",
get: -> Utils.frameGetMaxX @
set: (value) -> Utils.frameSetMaxX @, value
@define "minY",
get: -> @y
set: (value) -> @y = value
@define "midY",
get: -> Utils.frameGetMidY @
set: (value) -> Utils.frameSetMidY @, value
@define "maxY",
get: -> Utils.frameGetMaxY @
set: (value) -> Utils.frameSetMaxY @, value
convertPoint: (point) ->
# Convert a point on screen to this views coordinate system
# TODO: needs tests
Utils.convertPoint point, null, @
screenFrame: ->
# Get this views absolute frame on the screen
# TODO: needs tests
Utils.convertPoint @frame, @, null
@define "screenFrame",
get: ->
Utils.convertPoint(@frame, @, null)
set: (frame) ->
if not @superLayer
@frame = frame
else
@frame = Utils.convertPoint(frame, null, @superLayer)
contentFrame: ->
Utils.frameMerge @subLayers.map (layer) -> layer.frame.properties
Utils.frameMerge(_.pluck(@subLayers, "frame"))
centerFrame: ->
# Get the centered frame for its superLayer
# We always make these pixel perfect
# TODO: needs tests
if @superLayer
frame = @frame
frame.midX = parseInt @superLayer.width / 2.0
frame.midY = parseInt @superLayer.height / 2.0
Utils.frameSetMidX(frame, parseInt(@superLayer.width / 2.0))
Utils.frameSetMidY(frame, parseInt(@superLayer.height / 2.0))
return frame
else
frame = @frame
frame.midX = parseInt window.innerWidth / 2.0
frame.midY = parseInt window.innerHeight / 2.0
Utils.frameSetMidX(frame, parseInt(window.innerWidth / 2.0))
Utils.frameSetMidY(frame, parseInt(window.innerHeight / 2.0))
return frame
center: ->
View
@@ -483,10 +483,7 @@ Utils.convertPoint = (input, layerA, layerB) ->
# Convert a point between two layer coordinate systems
point = {}
for k in ["x", "y", "width", "height"]
point[k] = input[k]
point = _.defaults(input, {x:0, y:0})
superLayersA = layerA?.superLayers() or []
superLayersB = layerB?.superLayers() or []
@@ -13,17 +13,18 @@ describe "ExternalDocument", ->
for layerName, layer of layers
dataB[layerName] =
frame: layer.frame.properties
frame: layer.frame
superLayerName: layer.superLayer?.layerName
subLayerNames: layer.subLayers.map (l) -> l.name
jsonA = JSON.stringify dataA, null, "\t"
jsonB = JSON.stringify dataB, null, "\t"
# Uncomment this to see current dump
# console.log ""
# console.log "Name: #{name}"
# console.log jsonB
if jsonA != jsonB
# Uncomment this to see current dump
console.log ""
console.log "Name: #{name}"
console.log jsonB
assert.equal jsonA, jsonB
@@ -575,6 +575,25 @@ describe "Layer", ->
layer.maxY = 200
layer.y.should.equal 100
it "should get and set screenFrame", ->
layerA = new Layer x:100, y:100, width:100, height:100
layerB = new Layer x:300, y:300, width:100, height:100, superLayer:layerA
assert.equal layerB.screenFrame.x, 400
assert.equal layerB.screenFrame.y, 400
layerB.screenFrame = {x:1000, y:1000}
assert.equal layerB.screenFrame.x, 1000
assert.equal layerB.screenFrame.y, 1000
assert.equal layerB.x, 900
assert.equal layerB.y, 900
layerB.superLayer = null
assert.equal layerB.screenFrame.x, 900
assert.equal layerB.screenFrame.y, 900
describe "Center", ->
it "should center", ->

0 comments on commit f13bd7f

Please sign in to comment.