This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Marcos Navarro
Posted Nov 07 - Read on Facebook

Hullo Framers!

I'm having issues doing one of the simplest prototypes. I'm trying to make the cards swipe if the reach a certain threshold. I'm failing to see the error on my code :(

>> TypeError: 320 is not a function (evaluating 'screenMidX({
curve: "spring(200,10,10)"

# Pato Landing prototype
BGLayer = new Layer
width:640, height:1136, image:"images/BG.png"

# General Variables
scaleVal = 1
screenWidth = 640
screenHeight = 1136
screenMidX = screenWidth / 2

# 1st Card
cardOne = new Layer
x: 16

card = cardOne

# Make the layer draggable
card.draggable.enabled = true

card.on Events.DragEnd, ->
if card.x > (screenWidth * 0.70)
x: screenMidX * 2.2
curve: "spring(200,10,10)"
midX: screenMidX << ERROR SHOWS HERE
curve: "spring(200,10,10)"


Chris Lee

Do the last two lines not have the same indentation?

Seoh Char

View(on Menubar) > Show Invisibles. it helps you check indentations in your code.

Marcos Navarro

Marcos Navarro

Fixed (sort of).
It didn't come as clean in the end. Or as polish as my UXclips in Motion. But it'll be enough to get the point across tomorrow.

Andreas Mitschke

I guess you should set BGLayer as a superLayer in your cardOne creation.

cardOne = new Layer ({superLayer: BGLayer})

and then you could simply call the centerX function in card.animate

curve: "spring(200,10,10)"

I'm not sure if you can animate midX() that way you tried.

I don't like coffeescript either, that's why I don't know if your query is correct there as well. Seems like the syntax is interpreted as using screenMidX as a function instead a variable, which most certainly is a coffee script indentation thing.

Marcos Navarro

Awesome! Thanks for the explanation, at least I kind of understand why it wasn't working.
I'll try to clean it up.

Read the entire post on Facebook