@standard-library/galvo-dom-surface

galvo-dom-surface

A function that, given an element, creates streams for swiping around. Currently supports swiping left and right and generic swiping. (Pull requests welcome.)

Implemented using Kefir.js and Hammer.js.

Installation

yarn add @standard-library/galvo-dom-surface

Usage

import surface from "@standard-library/galvo-dom-surface";

const touchpad = surface(document.querySelector(".touchpad"));

touchpad.swipe
// => Kefir.Stream
touchpad.swipe.left
// => Kefir.Stream
touchpad.swipe.right
// => Kefir.Stream

Using galvo this event stream can be used to move forward and backward in a sequence of elements:

import galvo from "@standard-library/galvo";
import surface from "@standard-library/galvo-dom-surface";

const { swipe } = surface(document.querySelector(".touchpad"));
const sequence = galvo({
  advance: swipe.right,
  recede: swipe.left
}, ["a", "b", "c"]);

// Do a few swipes right, then one left

sequence.current
// => a---b---c---b