node package manager



Auto-Detect Controllers component for A-Frame.

Image of Controllers

The auto-detect-controllers component interfaces with the Gamepad API to detect Oculus Touch or Vive tracked-position controllers, and when discovered it injects the appropriate controls e.g. tracked-controls, oculus-touch-controls or vive-controls.

If gearvr-controls is included, it will also detect and inject that component. See for more information on that component.

By default, the appropriate controls will be injected with their built-in model enabled, so the user will see Vive or Oculus Touch controller models depending on which is detected. (Note however that gearvr-controls does not supply a controller model.)

In some cases, it may be desirable for the developer to build their own model and/or functionality atop the detected controller component, in which case there are two options:

  • Set model to false, in which case the injected component is instructed not to use its built-in model.
  • Set trackedcontrols to true, in which case the more generic component without model will be injected.


<a-entity auto-detect-controllers></a-entity>

To also use gearvr-controls:

<!-- include gearvr-controls component... -->
<script src=""></script>
<!-- then somewhere inside a-scene... -->
<a-entity auto-detect-controllers></a-entity>


Property Description Default Value
hand When detected, inject controls with this hand. 'right'
singlehand Single-hand controllers inject with this hand. 'right'
trackedcontrols Inject tracked-controls not e.g. vive-controls false
model Inject with this model property value. true


Event Name Description



Install and use by directly including the browser files:

  <title>My A-Frame Scene</title>
  <script src=""></script> 
  <script src=""></script> 
    <!-- If detected, will use built-in controller model (e.g. Oculus Touch or Vive) -->
    <a-entity id="lefthand" auto-detect-controllers="hand:left"></a-entity>
    <a-entity id="righthand" auto-detect-controllers="hand:right"></a-entity>


Install via npm:

npm install aframe-auto-detect-controllers-component

Then register and use.