onCompleteAll function throw error.

[hughred22]

I am following the iHateTomato course and try to modify something. I want the main timeline to stop at the end of all the stagger effect like so: 

 

.staggerFromTo($pixel, 1, {autoAlpha: 0, cycle: {

    scale: ['0.5', '2']

    }}, {autoAlpha: 1, scale: '1', ease: Elastic.easeOut.config(1, 0.3)}, 0.3, pauseProjects, [projectClass])

    .add('pixelsIn')

 

And the pauseProject function is

 

function pauseProjects(projectClass){

 

console.log ("Main timeline pause!");

tlProjects.pause();

 

}

 

It is throwing this error: TweenMax.min.js:16 Uncaught TypeError: b[a].apply is not a function

 

And the console never log. What is wrong?! 

 

[Jonathan]

Hello hughred22, and Welcome to the GreenSock Forum!

 

You can go to this link and send ihatetomatoes a message:

 

http://greensock.com/forums/user/15167-ihatetomatoes/

 

Also here are the Docs to the staggerFromTo() method.

 

http://greensock.com/docs/#/HTML5/GSAP/TimelineMax/staggerFromTo/

 

What s happening is you are only using 7 parameters in your staggerFromTo() method, when it accepts 9 parameters. 

 

It looks like you are passing onCompleteAllParams in the onCompleteAll parameter, which only accepts a function. You are also missing the position parameter!

.staggerFromTo( targets:Array, duration:Number, fromVars:Object, toVars:Object, stagger:Number, position:*, onCompleteAll:Function, onCompleteAllParams:Array, onCompleteScope:* )

Parameters for staggerFromTo() and what you have as their parameter.

1. targets:Array  = $pixel
2. duration:Number = 1
3. fromVars:Object = {autoAlpha: 0, cycle: { scale: ['0.5', '2'] }
4. toVars:Object =  {autoAlpha: 1, scale: '1', ease: Elastic.easeOut.config(1, 0.3)}
5. stagger:Number = 0.3
6. position:* = pauseProjects
7. onCompleteAll:Function = [projectClass]  ( this should be a function not params for the function )
8. onCompleteAllParams:Array
9. onCompleteScope:*

It should be this:

1. targets:Array  = $pixel
2. duration:Number = 1
3. fromVars:Object = {autoAlpha: 0, cycle: { scale: ['0.5', '2'] }
4. toVars:Object =  {autoAlpha: 1, scale: '1', ease: Elastic.easeOut.config(1, 0.3)}
5. stagger:Number = 0.3
6. position:* = 0  ( add the position parameter )
7. onCompleteAll:Function = pauseProjects  ( now this is a function )
8. onCompleteAllParams:Array [projectClass]
9. onCompleteScope:*

.staggerFromTo($pixel, 1, {autoAlpha: 0, cycle: {
    scale: ['0.5', '2']
    }}, {autoAlpha: 1, scale: '1', ease: Elastic.easeOut.config(1, 0.3)}, 0.3, 0, pauseProjects, [projectClass])
    .add('pixelsIn')

Hope this helps!