Feature Request: Allow Draggable to emit events

[usheeen 6 Likes (Newbie)]

This came up in my thread from earlier today and ties into another recent thread about events in TweenMax.

 

I'd like to make a feature request for Draggable to emit events (onPress, onDrag, onThrow, etc.). 

 

This feature will allow the decoupling of our code from the create function and encourage good coding practice and organisation. 

Unlike TweenMax, Draggable is heavily tied to the DOM and so I think this is a reasonable request.

 

At the moment I'm doing this using pub/sub to emit the events from within the Draggable init code. It works but it is an extra step.

 

Here is a good example - the PageModule and the HeaderModule are logically separate pieces of code. The PageModule doesn't know about the HeaderModule, it just emits events.

 

Jack, Carl, what do you think?

See the Pen pJgpBw by oisinlavery (@oisinlavery) on CodePen

[GreenSock 18,877 Likes (Superhero)]

Thanks for the suggestion, usheeen. Just to make sure I understand correctly, are you saying that you'd want Draggable to have 2 extra methods (something like subscribe() and publish()) that are leveraged for ALL Draggable instances across the board? So, for example, you subscribe to "drag" events and every time any element is Dragged (using Draggable), it publishes an event? 

 

For the record, Draggable already has event dispatching on an instance level. For example:

yourDraggable.addEventListener("drag", function() {
  console.log("Dragged");
});

And of course you can removeEventListener(). 

 

But it sounds like you're wanting a global "let me subscribe to a particular type of event for ALL instances with a single call". Is that right? It would certainly have an impact on performance, although perhaps it wouldn't be terribly noticeable. It's just that for every event, it'd have to perform a lookup and loop through any findings. As you know, I tend to obsess about performance, so it's tough for me to add things that negatively impact it

[usheeen 6 Likes (Newbie)]

Ooops, how did I miss this! Marking solved.

[OSUblake 18,534 Likes (Superhero)]

Isn't addEventListener just for actual DOM events? So you can't listen for GSAP ones like throwUpdate or throwComplete, correct?

[GreenSock 18,877 Likes (Superhero)]

Nope, it's just for GreenSock events like "drag", "dragend", "dragstart", "press", etc. But you're right - it's not for the TWEEN events, that's true. Only callbacks are available for those. 

[usheeen 6 Likes (Newbie)]

I assumed all. Would it be a big deal to add throwUpdate and throwComplete?

[GreenSock 18,877 Likes (Superhero)]

Let me explore this a bit and get back to you.