Skip to content

Commit

Permalink
Refactoring and comments
Browse files Browse the repository at this point in the history
  • Loading branch information
Nurumoto committed May 12, 2019
1 parent dadab38 commit 43a3995
Showing 1 changed file with 25 additions and 20 deletions.
45 changes: 25 additions & 20 deletions index.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import React from 'react'

const noop = () => {}

const stateKeys = { onDrag: 'drag', onHover: 'move', onMove: 'move', onPinch: 'pinch', onScroll: 'scroll', onWheel: 'wheel' }
Expand Down Expand Up @@ -135,15 +134,16 @@ export function useGesture(props, config) {

const getKinematics = (mov_x, mov_y, event, stateKey, isDelta = false) => {
const lastLocal = state.current[stateKey].lastLocal || initialState[stateKey].lastLocal
const { xy, initial, delta, time, transform } = state.current[stateKey]
const { xy, initial, time, transform } = state.current[stateKey]
const t = transform || event.transform || configRef.current.transform

const delta_t = event.timeStamp - time

const x = isDelta ? mov_x + xy[0] : mov_x
const y = isDelta ? mov_y + xy[1] : mov_y
const delta_x = t.x(isDelta ? mov_x + delta[0] : x - initial[0])
const delta_y = t.y(isDelta ? mov_y + delta[1] : y - initial[1])

const delta_x = t.x(x - initial[0])
const delta_y = t.y(y - initial[1])

const x_dist = t.x(x - xy[0])
const y_dist = t.y(y - xy[1])
Expand Down Expand Up @@ -393,6 +393,7 @@ export function useGesture(props, config) {

const onWheel = event => {
if (!configRef.current.enabled || !configRef.current.wheel) return

clearTimeout(timeouts.current.wheel)
timeouts.current.wheel = setTimeout(onWheelEnd, 100)
const { mov_x, mov_y, ...rest } = getWheelEventData(event)
Expand Down Expand Up @@ -435,36 +436,36 @@ export function useGesture(props, config) {
const listeners = {}

if (actions.has('onMove')) {
pushEventProp(listeners, pointerEvents ? 'onPointerMove' : 'onMouseMove', onMove)
pushInKeys(listeners, pointerEvents ? 'onPointerMove' : 'onMouseMove', onMove)
}

if (actions.has('onDrag')) {
if (pointerEvents) {
pushEventProp(listeners, 'onPointerDown', onDragStart)
pushEventProp(listeners, 'onPointerMove', onDragMove)
pushEventProp(listeners, ['onPointerUp', 'onPointerCancel'], onDragEnd)
pushInKeys(listeners, 'onPointerDown', onDragStart)
pushInKeys(listeners, 'onPointerMove', onDragMove)
pushInKeys(listeners, ['onPointerUp', 'onPointerCancel'], onDragEnd)
} else {
pushEventProp(listeners, ['onMouseDown', 'onTouchStart'], onDragStart)
pushInKeys(listeners, ['onMouseDown', 'onTouchStart'], onDragStart)
}
}

if (actions.has('onPinch')) {
pushEventProp(listeners, 'onTouchStart', onPinchStart)
pushEventProp(listeners, 'onTouchMove', onPinchMove)
pushEventProp(listeners, ['onTouchEnd', 'onTouchCancel'], onPinchEnd)
pushInKeys(listeners, 'onTouchStart', onPinchStart)
pushInKeys(listeners, 'onTouchMove', onPinchMove)
pushInKeys(listeners, ['onTouchEnd', 'onTouchCancel'], onPinchEnd)
}

if (actions.has('onHover')) {
pushEventProp(listeners, pointerEvents ? 'onPointerEnter' : 'onMouseEnter', onEnter)
pushEventProp(listeners, pointerEvents ? 'onPointerLeave' : 'onMouseLeave', onLeave)
pushInKeys(listeners, pointerEvents ? 'onPointerEnter' : 'onMouseEnter', onEnter)
pushInKeys(listeners, pointerEvents ? 'onPointerLeave' : 'onMouseLeave', onLeave)
}

if (actions.has('onScroll')) {
pushEventProp(listeners, 'onScroll', onScroll)
pushInKeys(listeners, 'onScroll', onScroll)
}

if (actions.has('onWheel')) {
pushEventProp(listeners, 'onWheel', onWheel)
pushInKeys(listeners, 'onWheel', onWheel)
}

if (domTarget) {
Expand All @@ -482,13 +483,17 @@ export function useGesture(props, config) {

/*** UTILS ***/

const chain = (...fns) => (...args) => fns.forEach(a => a(...args))
const pushEventProp = (l, keys, fn) => {
// returns a function that chains all functions given as parameters
const chain = (...fns) => (...args) => fns.forEach(fn => fn(...args))

// utility function that pushes values in object keys which are in fact arrays
const pushInKeys = (obj, keys, value) => {
if (!Array.isArray(keys)) keys = [keys]
keys.forEach(key => (l[key] = l[key] ? [...l[key], fn] : [fn]))
keys.forEach(key => (obj[key] = obj[key] ? [...obj[key], value] : [value]))
}

const clearTimeouts = timeouts => Object.values(timeouts).forEach(clearTimeout)
// clears timeouts in keys
const clearTimeouts = timeoutsObj => Object.values(timeoutsObj).forEach(clearTimeout)

const setListeners = add => (el, listeners, options) => {
const action = add ? 'addEventListener' : 'removeEventListener'
Expand Down

0 comments on commit 43a3995

Please sign in to comment.