Gamepad.buttons

The Gamepad.buttons property of the Gamepad interface returns an array of gamepadButton objects representing the buttons present on the device.

Each entry in the array is 0 if the button is not pressed, and non-zero (typically 1.0) if the button is pressed. Each gamepadButton object has two properties: pressed and value:

  • The pressed property is a boolean indicating whether the button is currently pressed (true) or unpressed (false).
  • The value property is a floating point value used to enable representing analog buttons, such as the triggers on many modern gamepads. The values are normalized to the range 0.0 – 1.0, with 0.0 representing a button that is not pressed, and 1.0 representing a button that is fully pressed.

Syntax

readonly    attribute GamepadButton[]     buttons;

Example

The following code is taken from my Gamepad API button demo (you can view the demo live, and find the source code on Github.) Note the code fork — in Chrome Navigator.getGamepads needs a webkit prefix and the button values are stores as an array of double values, whereas in Firefox Navigator.getGamepads doesn't need a prefix, and the button values are stored as an array of GamepadButton objects; it is the GamepadButton.value or GamepadButton.pressed properties of these we need to access, depending on what type of buttons they are. In this simple example I've just allowed either.

function gameLoop() {
  if(navigator.webkitGetGamepads) {
    var gp = navigator.webkitGetGamepads()[0];

    if(gp.buttons[0] == 1) {
      b--;
    } else if(gp.buttons[1] == 1) {
      a++;
    } else if(gp.buttons[2] == 1) {
      b++;
    } else if(gp.buttons[3] == 1) {
      a--;
    }
  } else {
    var gp = navigator.getGamepads()[0];

    if(gp.buttons[0].value > 0 || gp.buttons[0].pressed == true) {
      b--;
    } else if(gp.buttons[1].value > 0 || gp.buttons[1].pressed == true) {
      a++;
    } else if(gp.buttons[2].value > 0 || gp.buttons[2].pressed == true) {
      b++;
    } else if(gp.buttons[3].value > 0 || gp.buttons[3].pressed == true) {
      a--;
    }
  }

  ball.style.left = a*2 + "px";
  ball.style.top = b*2 + "px";

  var start = rAF(gameLoop);
};

Value

An array of gamepadButton objects.

Specifications

Specification Status Comment
Gamepad
The definition of 'Gamepad.buttons' in that specification.
Working Draft Initial definition

Browser compatibility

FeatureChromeEdgeFirefoxInternet ExplorerOperaSafari
Basic support

35

21 — 34 webkit

12

29

24 — 281

No

22

15 — 21 webkit

No
FeatureAndroid webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
Basic support No

35

25 — 34 webkit

Yes32

22

15 — 21 webkit

No Yes

1. From version 24 until version 28 (exclusive): this feature is behind the dom.gamepad.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.

 

See also

Using the Gamepad API

Document Tags and Contributors

Last updated by: connorshea,