Jump to content
Search Community

onComplete firing when .seek('label', true)

DannyT 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

Sorry me again with more weirdness I'm sure being caused by my abusing of the library! I'm struggling to simplify into a jsfiddle again but I will keep trying but thought I'd see if I can get some clues from you guys in the meantime.

 

I have something like the following:

var runnerTimeline = new TimelineMax();
for(var i=0; i<15; i++)
{
    runnerTimeline.to(assets.oct_run_frame1_face1, 0.2, {top:"+=50", left:"+=20", ease:Back.easeOut});
    runnerTimeline.to(assets.oct_run_frame1_face1, 0.2, {top:"-=50", left:"+=20", ease:Back.easeOut});
}
mainTimeline.add(runnerTimeline);
mainTimeline.call(myFunc);

The idea being that an object bobs along the screen for 15 iterations and then myFunc gets called. This is all fine and works how I'd expect.

 

But, I also have a means of skipping past this which seeks to the next part of my animation. With the code as above, myFunc will get called as soon as I seek (which I don't expect as the default is to suppress events and even if I explicitly say seek('something', true) it still gets called. I've tried replacing the .call() with an onComplete event but that exhibits exactly the same behaviour so I assume .call() is just some convenience method to an appropriate event(?).

 

What really boggles my mind is that if change the loop to be:

 

for(var i=0; i<=15; i++)

 

i.e. 16 iterations, then it suppresses the call/event exactly as I want!

 

Can you offer any clues as to what might be the problem based on this info or will you need (as I suspect) a demonstrable fiddle/pen?

 

Sorry to be vague but if you can offer any insight as to what's going on internally I'd be most grateful :)

 

Dan

Link to comment
Share on other sites

Ok I tried to mock this one up and see what I could find.

See the Pen qsaHo by jamiejefferson (@jamiejefferson) on CodePen

:

 

Seek to the same time as the .call()                - call not supressed

Seek to the same time as the onComplete      - onComplete supressed

Seek to a time after the .call()                         - call supressed

Seek to a time after the onComplete               - onComplete supressed

 

(I can't get any different behaviour changing the 15 to 16 though)

 

I'll let the experts make the judgement on correct behaviour here though.

  • Like 1
Link to comment
Share on other sites

This all looks like the correct behavior to me (in Jamie's codepen). 

 

To clarify, if you suppress events during a seek(), it suppresses all the events between the old and new position, but if there's a callback directly on the seek() position where you land, it will indeed be suppressed during the seek() but when the playhead starts moving again, the callback will be triggered. That is very purposeful (in fact, a lot of effort when into making that happen). Otherwise, imagine a case where you rewind a timeline with pause(0) and you've got a bunch of callbacks that are sitting on the 0 position - you'd probably expect those to fire when you resume(). Or even if you just seek(0). 

 

So again, all the behavior I'm seeing is expected as far as I can tell, but please let me know if there's something you think is broken (and of course a simple codepen demonstration is greatly appreciated)

  • Like 2
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...