[Migrating to GSAP 3 - dealing with undefined values.]

40 minutes ago, OSUblake said:

There is a timeline type. No need to do gsap.core.Timeline.

(tl: GSAPTimelime, animData: Animation[])

 

I don't think you should be using Animation as class name. That already exists.

https://developer.mozilla.org/en-US/docs/Web/API/Animation

 

If you want to use a class like that, then you should provide default values.

class MyAnimation {
  x: number = 0
  y: number = 0
  rotation: number = 0
  duration: number = 0
  
  constructor(...) {}
}

 

But I would recommend just using plain old JavaScript objects. GSAP adds properties to the object, like delay, ease, and overwrite.

 

Thanks, the code was just an example of the code I am using. The real class name is not 'Animation' . 

Thank you all, what I will do is manually clean the objects from the undefined values, just to make things work. 
And later think of a way to refactor the logic when using GSAP. 

[Migrating to GSAP 3 - dealing with undefined values.]

Thank you for the responses!

I learned from you suggestions, However they still neglect the undefined values. 
While using GSAP 2 I used classes to store the animation information. 
For example:  
 

class Animation {
  x: number
  y: number
  rotation: number
  duration: number
  
  constructor(...) {}
}

const createAnimation = (tl: gsap.core.Timelime, animData: Animation[]) => {
  for( let i = 0; i < animData.length ; i++ ) {
    tl.to(someElement, {...animData[i]}) // Doesn't work if the Animation object containes undefined value.
  }
}

Once the animation has some undefined value, (because it is not needed) the animation stops.

Before changing the logic to work with GSAP 3, I wanted to be sure I am not missing something.

Thanks again!

[Migrating to GSAP 3 - dealing with undefined values.]

Hi GreenSock forum!

I am working on migrating some code-base to GSAP 3. However, I noticed a difference in behaviour that makes my life a little difficult and maybe there is a solution I am not aware of. 

While using GSAP 2, I used the assumption that undefined values are ignored and does not effect the animation.
As can be seen in this codepen I created: 

Quote

So some of the code has objects that part of the time contains 'undefined' values in case they does not interest me. 

When trying to migrate to GSAP 3 I noticed that when an undefined value is encountered the timelines just stops or behaves undefined. Forcing me to create 'clean' object for every scenario and make sure there are no undefined values.
As can be seen in this codepen:  

See the Pen yLeqBJq by Nisanez (@Nisanez) on CodePen

Is there a way I can migrate without the huge change of code? 

Thanks!
Nissim

See the Pen YzwLjvd by Nisanez (@Nisanez) on CodePen