# 📚 References

# ⚡ Events

You can listen to each of the following on the document. Because these are events the data will be in event.detail:

// Listen on the document...
document.addEventListener('handsfree-data', event => {
  console.log(event.detail)
})

// ...or through the .on() method (without the 'handsfree-' prefix)
handsfree.on('data', ({detail}) => {
  console.log(detail)
})

handsfree-data - Called anytime a model updates it's data
handsfree-gotUserMedia - Called when the webcam stream is started
handsfree-init - Called after Handsfree has been instantiated with new Handsfree()
handsfree-loading - Called after handsfree.start() but before the models are loaded
handsfree-modelError - Called when an error occurs while loading a model
handsfree-modelReady - Called when a model is loaded and ready to be used

# 💻 Methods

Each of the following are accessed through your instance, for example:

const handsfree = new Handsfree({hands: true})

// Accessing the start method
handsfree.start()

.disablePlugins() - Disables plugins by plugin tag
.emit() - Triggers an event on the document with a handsfree- namespace
.enablePlugins() - Enables plugins by plugin tag
.hideDebugger() - Hides the visual feedback and adds helper classes to the body
.normalize() - A helper method to normalize values between 0 and 1
.on() - A helper method for listening to .emit() or browser events prefixed with handsfree-
.pause() - Pauses the main loop without shutting off the webcam stream
.runPlugins() - Manually sets handsfree.data and runs all active plugins
.showDebugger() - Shows the visual feedback and adds helper classes to the body
.start() - Starts the main loop and begins tracking
.stop() - Stops the main loop and tracking
.throttle() - An alias to lodash.throttle (opens new window) function which is used to throttle (or limit the number of times) the passed function is called over a given amount of milliseconds
.TweenMax() - An alias to gsap's TweenMax (opens new window) function which is used to tween (or smoothen) values over time
.unpause() - Unpauses the main loop
.update() - Updates your handsfree.config and loads any missing dependencies
.use() - Adds callback functions to the main loop that can be toggled on/off

# 🔌 Plugin

# Model: Weboji

faceClick - Click on things with a face gesture
facePointer - Move a pointer on the screen by moving your head
faceScroll - Scroll the page by moving the facePointer above and below the screen

# Model: Hands

palmPointers - Move a pointer on the screen with your hands
pinchers - A collection of events, properties, and helper styles for finger pinching
pinchScroll - Scroll the page by pinching together your thumb and pointer finger

# 🧬 Properties

Each of the following are accessed through your instance, for example:

const handsfree = new Handsfree({hands: true})

// Checking the current version
console.log(handsfree.version)

config - Contains the sanitized object you passed into new Handsfree(config)
data - Contains data for all the active models
debug - Contains references to the video and canvas elements that contain the webcam stream and skeleton and keypoint overlays
id - The ID for the current Handsfree instance
isLooping - Whether the main loop is looping
model - A collection of all the models
plugin - A collection of all the plugins
taggedPlugins - A collection of all tagged plugins by tag
version - Your version of Handsfree.js

# 🧰 Utilities

🎨 Classes - A collection of helpful classes for automatically hiding and showing things based on which models and plugins are running

← 📋 Guides 🤝 Community →