I am trying to recreate Gmail (on Android's) "swipe to delete" interface. In this GUI the user can
- Swipe left or swipe right, and the entire list item moves with the thumb.
- After it is swiped more than X distance, the item swooshes away and is replaced with an "undo" icon
- Releasing the row, if X distance hasn't been reached, should put the object in its original place.
- If a second item is swiped, and an undo box is showing from a previous swipe, that row is deleted, and the animation and logic starts all over from scratch.
I have a demo of this working here, but it doesn't seem to perform too well. http://jsbin.com/EWUbeTI/2/edit
Is there a more efficient way to handle this animation?