Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
RxJS Swipe Left Observable
const tolerance = 200; // swipe distance in pixels
const swipeLeft$ = Rx.Observable.fromEvent(document, "touchstart")
// Switch to listen to touchmove to determine position
.switchMap(startEvent =>
Rx.Observable.fromEvent(document, "touchmove")
// Listen until "touchend" is fired
.takeUntil(Rx.Observable.fromEvent(document, "touchend"))
// Output the pageX location
.map(event => event.touches[0].pageX)
// Accumulate the pageX difference from the start of the touch
.scan((acc, pageX) => Math.round(startEvent.touches[0].pageX - pageX), 0)
// Take the last output and filter it to output only swipes
// greater than the defined tolerance
.takeLast(1)
.filter(difference => difference >= tolerance)
)
// All of your subscribe logic
swipeLeft$.subscribe(val => console.log(`You swiped left by ${val} pixels!`))
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.