this.hitTest in onDragEnd but for final position

[phoenixrip 2 Likes (Newbie)]

Is there a smart way of performing a hitTest when then drag part of a throw finishes (onDragEnd), but hit testing what will be the final position of the element once the throwprops tween has finished? I know I can access the end x and end y in onDragEnd but don't know how I would go about using the this.hittest with that

 

Thanks in advance

[OSUblake 9,990 Likes (Superhero)]

Using throwProps creates a tween. Set its progress to 1, run your hit test, then reset the tween. The green box will turn red if it's going to land on the blue.

See the Pen d1687bdbb9d06162e9ad804996979691?editors=0010 by osublake (@osublake) on CodePen

 

.

[phoenixrip 2 Likes (Newbie)]

That is super smart! Thanks!

[phoenixrip 2 Likes (Newbie)]

That is super smart! Thanks!

 

For anyone coming here looking for the same solution, it should maybe be noted that the code Blake very helpfully posted will cause any onThrowEnd function you have to be called at the same time as onDragEnd as it sets the throw tween progress to 1 (ie finished so fire the onThrowEnd) and then back again.

 

I got round this by using 0.99 progress to do the hitTest, almost exactly the same as the final position, but without accidentally triggering my onThrowEnd before the throw has really begun

onDragEnd: function(){
	var hit = false
	if (this.tween) {
	this.tween.progress(0.99)
	hit = this.hitTest(centerpoint, '5%')
	this.tween.progress(0)
}
},

[OSUblake 9,990 Likes (Superhero)]

You can set a flag. I just made one up called `isHitTesting`, and if that's true, it will exit the throw complete callback.

See the Pen 9ba8e7dbdfb259c096ed281e8f517374?editors=0011 by osublake (@osublake) on CodePen

 

.

[phoenixrip 2 Likes (Newbie)]

Much more elegant Thanks man!