Introduction to the HTML5 Gamepad API

Code

As the popularity of HTML games slowly increases, vendors are starting to introduce exciting new APIs to make games a little more enjoyable for both us developers and our end players. One of them is the GamepadAPI, which allows you to connect a good old-fashioned console gamepad to your computer and use it for browser-based, plug-and-play style games. Let’s dive in!

In short, the Gamepad API allows you to interact with your browser using a game console controller, also known as a gamepad. It doesn’t require a special driver or plugin to work, it’s as simple as plug and play!

As a console gamer rather than a desktop gamer, I prefer to interact with games using a gamepad, and with the upcoming rise of HTML and JavaScript-based games, this will be a really useful tool to make games more accessible to your users.

The Gamepad API is not available for public release, but we can start using it for ourselves with pre-release versions of Firefox. So before we get stuck in, we need a few things.

You need to first get yourself a Nightly build of Firefox and make sure you have the Firebug add-on installed (for debugging purposes only).

Also, you can’t forget the gamepad! I’m going to use a PlayStation 3 controller for this tutorial, but an Xbox controller will work just fine.

Nightly – Download for Windows, Mac and Linux
Firebug – Download.
Gamepad – A PlayStation or Xbox controller will work fine
USB cable to connect your controller to your computer

Once you’ve installed Nightly and added Firebug, you’re ready to go!