How to take input from quest 2 controllers

I have a working three.js game and I want to use the quest 2 controllers instead of a keyboard, but I would need to get button inputs and joystick inputs from the controllers, how would I do that?

You need to retrieve gamepad events

Here is a basic exemple with the controller 1, more or less the same as three.js base exemple
excepted the last line. I added some handedness too, always useful to know which hand controller is assigned to.

controller1.addEventListener( 'connected', ( event ) => {
if ( == "left" ){
	//do something here
if ( == "right" ){
	//do something here
//get buttons inputs from controller 1
	controller1.gamepad =;	

Next, to detect button press: This exemple target the thumbStick, it’s the most complex one.

			//thumbstick full press forward = -1.0 press backward = 1.0   release = 0.0
			if ( controller1.gamepad.axes[3] < 0 ){
			 //do something here

Official reference guide for webXR gamepad object

1 Like

oh, thanks! what’s button 7?

This is helpful. Any reason this isn’t included anywhere in threejs docs or examples?

some devices doesn’t include advanced controllers (if they even exist at all)
and writing universal code for all these exotic devices is quite the task (framework like A-frame still struggle with it)

My guess is three.js examples always target the most common denominators, this way everyone can enjoy them :smiling_face_with_three_hearts:

this.controller.addEventListener( 'connected', ( event )=> {
    if('gamepad' in{
        if('axes' in{ //we have a modern controller
            this.controller.gamepad =;

Maybe this is all u need for detecting a modern gamepad controller

1 Like