Jump to content
Search Community

Tween nested property of array

FlashDev2007 test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Ok well I know I can tween one object in my array like so:

 

 

// tween y prop of ball.position object

TweenMax.to(balls[0].position, 1, {y: 50});

 

 

I am trying to tween all of my objects in an array like so.

 

// try to tween all balls y prop of position object - DOESN'T WORK

TweenMax.to(balls, 1, {position:{y: 50}});

 

The reason I thought this would work is because it is similar to css syntax on the site:

 

//tweens multiple objects simultaneously

TweenLite.to([e1, e2, e3], 1, {css:{autoAlpha:0}});

 

What is the syntax for this, I don't want to store "ball.position" in the array, just the ball.

 

Thanks

Neil

Link to comment
Share on other sites

That actually isn't how the css syntax works (there's no "css" property on the target), but I totally see what you're saying. You have 2 options:

 

1) Make your own plugin that recognizes the "position" keyword/property and handles it however you please. This would require more up-front effort, but it would make your tweening code more concise.

 

2) Just do a loop, like:

for (var i = 0; i < balls.length; i++) {
   TweenMax.to(balls[i].position, 1, {y:50});
}

Link to comment
Share on other sites

I was using a loop as you had suggested, but I am now inspired to create a plugin.

 

Although I have read the docs on TweenPlugin, would you offer a few pointers to get me started regarding adding a bespoke property? I can see me wanting to create plugins in the future.

 

Many thanks

Neil

Link to comment
Share on other sites

Although I have read the docs on TweenPlugin, would you offer a few pointers to get me started regarding adding a bespoke property? I can see me wanting to create plugins in the future.

Hmm...I'm not quite sure what you're asking for here. I put a bunch of notes in the TweenPlugin ASDocs - are you asking me to come up with more? Is there something specific that is unclear? I'd be happy to help - just not quite sure what you're looking for.

Link to comment
Share on other sites

Well I guess there is plenty of information in the USAGE section of TweenPlugin. Like a lot of your users I am coming from primarily a flash background. I have looked at the RoundPropsPlugin.js (docs say look at ScalePlugin but this isn't in the src) and there are things going on that I don't understand and I can't relate them to your notes.

 

eg: you mention calling super in point 1, surely this is the flash version not js?

 

In the RoundPropsPlugin it starts out with:

 

_gsDefine("plugins.RoundPropsPlugin", ["plugins.TweenPlugin"], function(TweenPlugin)

 

I am assuming i would need to add my plugin name in place of any RoundPropPlugin name in this file.

 

I think what I would like, and possibly others, is some kind of js plugin template, which shows us the basics.

 

I know I'm asking a lot here, but most people coming from flash to js will love your library as much as the AS version, but may struggle understanding how to write plugins for it.

 

Thanks

Neil

Link to comment
Share on other sites

Ah yes, sorry about that - the docs you saw were taken directly from the ActionScript version, but that definitely created some confusion here. I just updated them to make more sense, plus I added a TEMPLATE_Plugin.js file to the plugins directory that serves as a jumping-off point for you (and others) to create plugins. Hopefully that makes things a lot easier. I put some comments in there too. Let me know if that clears things up.

 

http://api.greensock.com/js/com/greensock/plugins/TweenPlugin.html

  • Like 2
Link to comment
Share on other sites

Well you certainly don't hang about Jack. The TEMPLATE_Plugin.js was exactly what I needed to create the middle man between my position object in Three.js and the Tween which controls them. I followed your docs and also the comments in the template file without any problems.

 

If I can do it, anyone can..

 

Thanks

Neil

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...