Mouserelease
Updated on September 20, 2024Source codeTests
createMouserelease is a factory that returns Recognizeable effects for recognizing mouse releases.
A mouse release is a sequence of a mousedown and a mouseup, and allows for mousemove in between those events, but denies the event on mouseout.
createMouserelease attempts to recognize the gesture when mouseup fires. The gesture is recognized at on mouseup if the mouse has been down for a minimum duration and has moved a minimum distance, both of which are configurable.
Create mouserelease
Call createMouserelease with these parameters to create your mousedown, mouseout, and mouseup effects:
optionsmousedown, mouseout, and mouseup effects. See the Options section for more guidance.Options
minDuration0minDistance0minVelocity0onDownundefinedA function that is called when the mouse is pressed down.
onDown receives the mouserelease hook API as its only parameter.
onMoveundefinedA function that is called when the mouse moves.
onMove receives the mouserelease hook API as its only parameter.
onOutundefinedA function that is called when the mouse leaves the target.
onOut receives the mouserelease hook API as its only parameter.
onUpundefinedA function that is called when the mouse is released.
onUp receives the mouserelease hook API as its only parameter.
Hook API
The hook API is an object that is passed to the onDown, onMove, onOut, and onUp options as their only parameter. It contains the following properties:
statusrecognized, denied, or recognizing.sequenceMetadata
Your created mouserelease effects store data in the Recognizeable instance's metadata property.
Mouserelease metadata includes all pointer metadata.
Using with Listenable
The easiest way to use createMouserelease with Listenable is to use the Mouserelease class, which is a very minimal subclass of Listenable that handles configuration for you.
Here's an example of how to use Mouserelease to nicely combine createMouserelease with Listenable:
import { Mouserelease } from '@baleada/logic'
const mouserelease = new Mouserelease([mousereleaseOptions])
mouserelease.listen(() => {
console.log(mouserelease.metadata.velocity)
})
