GamepadButton

This article is in need of a technical review.

This article is in need of an editorial review.

« GamepadButton

The GamepadButton interface  defines an individual button of a gamepad or other controller, allowing access to the current state of different types of button available on the control device.

A GamepadButton object is returned by querying any value of the array returned by the buttons property of the Gamepad interface.

Note: this is the case in Firefox Gecko 28 and later; Chrome and earlier Firefox versions still return an array of double values when this property is accesssed.

Properties

GamepadButton.value Read only
A double value used to enable represent the current state of 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.
GamepadButton.pressed Read only
A boolean indicating whether the button is currently pressed (true) or unpressed (false).

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);
};

Specifications

Specification Status Comment
Gamepad Working Draft  

Browser compatibility

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
General support 21.0 webkit 24.0 (24.0) moz
28.0 (28.0)
Not supported Not supported Not supported
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
General support Not supported Not supported Not supported Not supported Not supported

See also

Using the Gamepad API

Document Tags and Contributors

Contributors to this page: teoli, chrisdavidmills
Last updated by: teoli,