Jump to content
GreenSock

mimeartist

onThrowUpdate

Go to solution Solved by GreenSock,

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

I'm finding that when I use onThrowUpdate as it is being called, other items are not able to be dragged?  Does it lock out other drags whilst it's doing it's thing?

Link to comment
Share on other sites

here is the codepen for it... 

See the Pen ogavpy by anon (@anon) on CodePen

 

Note that you can only drag item 2 when the throwUpdate has completed, how do I override that?

Link to comment
Share on other sites

Hi mimeartist  :)

 

Nope , everything works correctly . pls check your onThrowUpdate function logic , and check this out :

 

See the Pen jEpjRv by MAW (@MAW) on CodePen

Link to comment
Share on other sites

I think it has something to do with me update the position of the other item that is draggable / throwable during the update

Link to comment
Share on other sites

Yep, it's just a logic problem in your code. I'm not entirely sure what you're trying to do, but you might want to only run your "moveFunction" logic if the Draggable's "isDragging" property is false. 

Link to comment
Share on other sites

See the Pen ogavpy by anon (@anon) on CodePen

 

I've updated it to show what it should do... so I should put a isDragging where it updates the position of the other div?

Link to comment
Share on other sites

  • Solution

Any particular reason you're using "left" instead of "x"? The logic would be a bit easier if it was "x" and you'd probably get better performance. Example: http://codepen.io/anon/pen/dPgypE?editors=001

 

Also, if you want them to move together, why not just wrap them in a <div> and apply the Draggable to that? Seems like it'd be a lot cleaner, especially in terms of applying bounds. 

 

To make your demo work, you could just add an onPress that kills the tweens of ".box" elements, as shown here: http://codepen.io/anon/pen/PwyoGP?editors=001but it seems to me like you'll still have to solve the bounds issue because you're applying your own movement logic to the "other" element and not preventing it from exceeding the bounds. It's certainly possible with some work, but I think it'd be WAY more elegant to just wrap things in a <div> and apply the Draggable on that. 

  • Like 3
Link to comment
Share on other sites

Thanks Jack,

 

The reason for not putting it in a div is because these panels actually appear both behind and infront of some other panels in one form of the site, so their z-index's  need to be easily adjusted.

 

I've gone down the road of everything being set with 'left' now, and changing to x is a possibility, but I'll need to adjust everything of what is a quite big complicated project (by my standards anyway), also not keen on having to reset everything all the time, as the panels have a lot of predetermined positions when in certain modes of the site. I'm basically pretty much building a WIMP environment.

Link to comment
Share on other sites

Understood, but you may find it easier and more efficient to just re-nest things on-the-fly in the DOM to get your z-index effect. In other words, group things in a single <div> that should be dragged together in the moment, and then return them to their original nesting in the DOM after the drag. Not sure if that's doable in your particular situation. Just an idea. 

 

Otherwise, you'll need to adjust the bounds for each Draggable to factor in all the other co-dragging elements. Again, totally doable, but tedious. 

Link to comment
Share on other sites

I've got it working pretty much, i've tried to avoid too much nesting, as I'm trying to track where things are as some of the elements are operating on their proximity to other things... I always find there are easier / better ways to do things after the fact, but I'm more comfortable with the logic in my head :)

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.
×