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

What is Framer? Join the Community
Return to index
Danny White
Posted Nov 08 - Read on Facebook

How could I target/act-upon all layers inside an array, except for one? I'm thinking splice() and then re-targeting array is the way to go, but not having much luck.

I'm re-writing Djordje Vanjek's drag and drop prototype, trying to get more familiar with using arrays.

Original:
http://share.framerjs.com/9nrr5kq2pcxi/

My version thus far (lines 90-104 is where the issue lies):
http://share.framerjs.com/upt2ru81dm6x/

See commented-out text for a detailed explanation. Basically what I'm trying to do is animate the scale of all layers inside the array, apart from the one I'm interacting with.

Thanks!

14 Comments

Jordan Robert Dobson

So just do a conditional.

Jordan Robert Dobson

for i in Buckets where i isnt mainCircle

Jordan Robert Dobson

Instead of mainCircle you could use "@" or "this" in its place.

Danny White

Jordan Robert Dobson thanks. mainCircle is a separate element (not i, and not in the Buckets array either)

Jordan Robert Dobson

Another option that might be more clear... Is inside your for loop to have an if statement such as

If i isn't mainCircle
__ if ((i.y - yMargin)....)

Jordan Robert Dobson

So how do I know which one to exclude from Buckets?

Danny White

the mainCircle is used more or less as a 'cursor' over the three 'buckets'. If I drag over a bucket, it should scale up (line 88). Once I drag away from one bucket to another, the old bucket should go back to scale:1, and the new bucket should scale up.

My conditionals on 86 & 87 are a check to see which bucket the mainCircle is over

Danny White

so in plain language, you know which one to exclude from buckets, because mainCircle is within it's margins

Danny White

I'm making a simplified example as we speak!

Jordan Robert Dobson

If it was me... I'd move those conditionals to variables to start.

Like this:

containsX = ((i.x - xMargin) < mainCircle.x < (i.x + xMargin))

containsY = (...same for y...)

Jordan Robert Dobson

Then you can write your if statements like this...

If containsX and containsY
unless i.scale is 1.5
i.animate bigger
Else
unless i.scale is 1
i.animate smaller

Danny White

Thanks again—works great! The 'unless' keyword is pretty nifty. I'd still like to know (out of curiosity), is it possible to easily target all members of an array, except for one?

E.g, with the example linked below, how could I make the two 'unhovered' squares drop down y:100 whilst the 'hovered' square does it's thing? Sorry if you covered this above, can't make the connection.

http://share.framerjs.com/jz4btjgllabd/

Jordan Robert Dobson

Yeah you would just use a conditional to exclude it with a simple if statement to skip it.

Jordan Robert Dobson

No need to pull it out of the array if you can just skip it.

Read the entire post on Facebook