Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
fb-nyc

get Draggable Snap Distance before onThrowComplete

Recommended Posts

I have a draggable instance that snaps to y position based on an array.

I would like to send out a global event onDragEnd as to what the final snapped position would be.

 

I 'm using this approach, which currently is a little buggy, but I can probably make it more robust.

Is there a more elegant method?

 

const closest = (array, num) => {

    let i = 0;

    let minDiff = 1000;

    let ans;

    for (i in array) {

        let m = Math.abs(num - array);

        if (m < minDiff) {

            minDiff = m;

            ans = array;

        }

    }

    return ans;

}

 

 

 

onDragCompleteY(e) {

    let y = e.layerY;

    let arr = this.generateSnapDistances();

    let finalNum = closest(arr, y);

    let SNAPPED_INDEX = arr.indexOf(finalNum);

}

Link to comment
Share on other sites

Having trouble understanding the code. In the future please try to make a demo. 

 

When you have throwProps:true your Draggable instance has access to a tween property which represents the ThrowProps tween that is created.

If I understand the question properly, you can advance that tween to a progress(1), grab the x value and then restart the tween. 

Draggable.create("div", {  snap:[100, 200, 300, 400, 500, 600, 700, 800, 900, 1000, 1100, 1200],
type:"x",
  throwProps:true,
onDragEnd:function() {
this.tween.progress(1);
    console.log("onDragEnd and this end x =", this.x)
    this.tween.progress(0);
},
  onThrowComplete:function() {
    console.log("onThrowComplete and this x =", this.x);
  }
});
  • Like 2
Link to comment
Share on other sites

Actually, it's even easier; Draggable has an "endX" property that it'll populate for you onDragEnd when you've got throwProps enabled :)

onDragEnd: function() {
   console.log(this.endX); //BOOM
}

Enjoy!

  • Like 2
Link to comment
Share on other sites

I didn't know that. I gotta start reading the documentation more.

 

I usually leave reading the manual for anything as a last resort when I'm really desperate.  :lol:  

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