Jump to content
Search Community

Advanced Listeners "ticker"

ody test
Moderator Tag

Recommended Posts

Hello,

I want to know how to manage "ticker" in GSAP3. the previous version was well documented... but with "gsap.ticker" we lost the whole parameters except "callback:function". So can we have an example of how to migrate previous code to the new architecture?

Best Regard!

image.thumb.png.60641d17ab325f502e49fb7cd6723a85.png

Link to comment
Share on other sites

9 minutes ago, ody said:

I want to know how to manage "ticker" in GSAP3.

 

Forgot to say this. There's just add and remove.

 

Straight from the source code.

add(callback) {
  _listeners.indexOf(callback) < 0 && _listeners.push(callback);
  _wake();
},
remove(callback) {
  let i;
  ~(i = _listeners.indexOf(callback)) && _listeners.splice(i, 1);
},

 

  • Like 3
Link to comment
Share on other sites

  • 3 months later...

i'm using bind, but I can't remove the function.

Comparing the basic example and the bind method i use, the function name in the listener is different.

for example.. myFunction() name is "myFunction" in the listener list, but the bind method check2() name is "bound check2"?

I'm not sure if just removing the object from the listeners would be the same as using gsap.ticker.remove

Screenshot_2.jpg.eb435ea570ddc01cf959c6b9164a1371.jpg

Link to comment
Share on other sites


init():void{ 
  gsap.ticker.add(this.check2.bind(this, body));
 }

    protected check2($body): void
    {
        if ($body.x === 0 && $body.y === 0)
        {
            gsap.ticker.remove(this.check2);
        }
    }

basically like this. if using without the bind method, it could work, but it doesn't looks pretty next time if i need to override it

Link to comment
Share on other sites

23 minutes ago, OSUblake said:

What does your code look like?

 

If you do it just like this, you shouldn't have any problems.

 


var onTick = myCallback.bind(myScope, "param1", "param2");

gsap.ticker.add(onTick);

...
gsap.ticker.remove(onTick);

 

this work, though will need to have it as an var rather than targeting the function directly.  

Link to comment
Share on other sites

When you do bind inline like that, you don't have a reference to the new function, so you can't remove it. That's just how it works, and isn't related to gsap.

 

So you either need store the bound function.

init():void{ 
  this.boundCheck2 = this.check2.bind(this, body)
  gsap.ticker.add(this.boundCheck2);
 }

    protected check2($body): void
    {
        if ($body.x === 0 && $body.y === 0)
        {
            gsap.ticker.remove(this.boundCheck2);
        }
    }

 

Or use a class field arrow function.

 

check2 = () => {

  if (body.x === 0 && body.y === 0)
  {
     gsap.ticker.remove(this.check2);
  }
}

init():void{ 
  gsap.ticker.add(this.check2);
}

 

 

  • Like 3
  • Thanks 1
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...