https://github.com/natemoo-re/gamepad
Provides a simple, event-based API for Gamepads on the web
https://github.com/natemoo-re/gamepad
controller gamepad gamepad-api gamepad-controller
Last synced: 12 months ago
JSON representation
Provides a simple, event-based API for Gamepads on the web
- Host: GitHub
- URL: https://github.com/natemoo-re/gamepad
- Owner: natemoo-re
- Created: 2019-02-12T14:25:56.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2019-02-14T00:32:21.000Z (over 7 years ago)
- Last Synced: 2025-05-04T10:16:22.397Z (about 1 year ago)
- Topics: controller, gamepad, gamepad-api, gamepad-controller
- Language: TypeScript
- Homepage:
- Size: 104 KB
- Stars: 4
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🕹 Gamepad
The goal of Gamepad is to provide normalized behavior and a higher-level API for interacting with the web's [Gamepad API](https://developer.mozilla.org/en-US/docs/Web/API/Gamepad_API).
Using a plugin-based architecture, Gamepad provides button and axis mappings for common controllers, allowing you to easily add support for any subset of controllers.
## Installation
- CDN global utility via https://unpkg.com/@gamepad/core
- ESM via `import { GamepadEventEmitter } from '@gamepad/core'`
- CJS via `const { GamepadEventEmitter } = require('@gamepad/core')`
## Examples
**Simple**
By default, `@gamepad/core` supports any controller with a [`standard`](https://w3c.github.io/gamepad/#remapping) mapping defined on the `Gamepad.mapping` property.
```js
import { GamepadEventEmitter } from '@gamepad/core';
new GamepadEventEmitter();
window.addEventListener('gamepadbuttondown', (event) => {
// The value of the button pressed, considering controller layout
// Similar to `KeyboardEvent.key`
console.log(event.detail.button);
// The physical button pressed
// Similar to `KeyboardEvent.code`
console.log(event.detail.code);
})
```
**Plugins**
Without a `standard` controller mapping, `@gamepad/core` can support any controller using a plugin to map the controller's buttons and axes. Here's an example using `@gamepad/plugin-joycon`.
```js
import { GamepadEventEmitter } from '@gamepad/core';
import joycon from '@gamepad/plugin-joycon';
new GamepadEventEmitter({
plugins: [
joycon()
]
});
window.addEventListener('gamepadbuttondown', (event) => {
console.log(event.detail.button);
console.log(event.detail.code);
})
```