Playing with the Gamepad API: Using Game Controllers with JS

on YouTube ↗25m

" summary

Explains concrete behavior and gotchas: only two events fire so code polls with navigator.getGamepads on requestAnimationFrame; Chrome often returns an array of four with null slots; Firefox exposes six axes on some sticks; axes are -1..1 and need a deadzone (recommend ~0.2); buttons deliver continuous pressed state so track previous value; vibration APIs vary by browser; demos include Super Pepper Bros, an arenoid, and a Wacamo-style music game built in vanilla JavaScript and running locally.

AI-written summary · about

" chapters (15)

1. 0:00Gamepad API intro
2. 1:04What is Gamepad API
3. 2:08Gamepad API events
4. 3:32Proactive gamepad state
5. 4:13Getting gamepads
6. 5:18Gamepad properties
7. 8:35Standard vs non-standard
8. 9:37Multiple gamepads
9. 10:41requestAnimationFrame vs setInterval
10. 12:51Button press states
11. 14:15Joystick axis values
12. 16:46Vibration actuator
13. 18:12Library recommendations
14. 18:33Live demos
15. 22:59Q&A

" related talks

• 38mMaking Music With JavaScript and GamepadsJan Monschke · Reject.JS 2013
• 29mControlling the web with a PS5 controllerHarshil Agrawal · Armada JS 2023
• 25mJavascript as Play A Primer on Getting Started with Video GamesRachel White · CascadiaFest 2016
• 18mExploring alternative interactions in JavaScriptCharlie Gerard · Web AI Summit 2025
• 29mOnce Upon A Time, Somewhere Between Your Console And BrowserMichal Budzynski · JSConf.Asia 2013
• 42mExploring Alternative Interactions in JavaScriptCharlie Gerard · beyond tellerrand Berlin 2023
• 29mMIDI A New Dimension in Controlling Your BrowserArmagan Amcalar · You Gotta Love Frontend 2019
• 46mMonsters, lightbulbs and robots: having fun with WebBluetoothNiels Leenheer · code.talks 2017