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

What is Framer? Join the Community
Return to index
Ash Adamson
Posted Apr 23 - Read on Facebook

I added a few more tickets for tonight's Framer Session!

Entry Tickets & Info: http://bit.ly/1IIJskL

Live Stream (Archived Afterwards): http://ccst.io/e/framersessions01

15 Comments

Alexander Tran

Please do run this again!!

Sindu Narasimhan

come to Seattle !!!

Jordan Robert Dobson

@sindu - I'll be doing a prototype talk in May and a few of us are talking about doing some meet ups in Seattle.

Sindu Narasimhan

That's awesome. Looking forward to it Jordan !!

Neema Mahdavi

dang it, i can't sign up for the notes!

George Kedenburg III
Andrew Nalband

thanks Jordan Robert Dobson for the tips/help/hangout last night

Giovanni Caruso

George Kedenburg III Thx for sharing. Looking at your implementation I realised how bad was mine :) (btw: used your restore() function to fix a problem I had with my exercise). Here my code: http://share.framerjs.com/6n2kx1s7c8y9/

Nick Bewley

Awesome event. Thanks for organizing Ben. Following up on what we were talking about with Tisho regarding closures, and applying that to what George made above. If we wanted to take George's prototype and use a loop to add states to every button rather than writing each explicitly, this works:

Nick Bewley

But this does not... Is the syntax wrong to map "i" to the buttons?

Tisho Georgiev

Nick, there are no closures in the first screenshot you posted (notice that there are no -> signs). The `button` variable gets assigned to the next layer in the array on every iteration and `.states.add` is called on each individual button. You're safe using a `for` loop in this case.

In the second example, you're trying to use .button as a function with `i` as the parameter (you have parentheses after it, which makes coffeescript think you're executing a function), which is why this isn't working. A quick way to solve this would be to rewrite the line that says `t.button(i).states.add` to `buttons[i].states.add`. In plain English, this translates to "add a state to the layer at index i in the array buttons".

Jordan Robert Dobson

Yeah closures in coffeescript are tricky and not entirely obvious at first.

Tisho Georgiev

Nick, I just noticed that you didn't actually have the `buttons` array in the second example. In that case, you can try appending the index to the name "button", which is what I believe you were originally trying to do. Here's the way to do that: `t["button#{i}"].states.add`. You will also need to change your range to not include the zero, so [1..6]. The reason this works is because you have two ways of accessing properties in javascript - with the dot notation, or with a key string. Here are two equivalent examples:

myLayer.x = 10 # dot notation
myLayer["x"] = 10 # key string

What I'm using in the code I mentioned is a key string that I'm putting together on the fly. I know that I need to access the t.button1 property. To access it using a key string, I'd write `t["button1"]`. But I need to change the numeric part of button1 on every iteration, so I use string interpolation to piece together a string from another string and a number (we talked about this last night also). "button#{i}" will place the value of `i` directly after `button`, so in the different iterations, I'll have the strings "button1", "button2", etc. So `t["button#{i}"] lets me access each button layer named button + an index from 1 to 6.

Nick Bewley

Thanks a ton. Tisho makes sense after you break it down in that fashion. Truly appreciate it!

Jordan Robert Dobson

Awesome Tisho - I spoke about that a bit last night when talking about setting up a basic carousel. I used it to build up states while I looped through and created panes for the carousel.

Read the entire post on Facebook