How to get the value of the Gamepad axes?

912 views
Skip to first unread message

iris...@gmail.com

unread,
Apr 3, 2016, 10:48:07 PM4/3/16
to melonJS - A lightweight HTML5 game engine
Hello, I've been searching for info about the values of the gamepad axes, Im using the 3.0.1 release and it works great with gamepad buttons and D-pad, as I understand there is no current integration to the engine for the vaues of the joysticks in the same way as the buttons, is there a way to access theyr values?

Jay Oster

unread,
Apr 3, 2016, 10:59:05 PM4/3/16
to mel...@googlegroups.com
Sure, you can access the gamepad axes with the plain old HTML5 Gamepad API:

var gamepads = navigator.getGamepads();
console.log(gamepads[0].axes[0], gamepads[0].axes[1]);

It might be possible to use the melonjs-defined axis constants instead of static indices, but there's no guarantee that the UA vendor supports the standard mapping for all usable gamepads. Also, these raw axis values from the Gamepad API may need to be normalized.

On Sun, Apr 3, 2016 at 7:48 PM, <iris...@gmail.com> wrote:
Hello, I've been searching for info about the values of the gamepad axes, Im using the 3.0.1 release and it works great with gamepad buttons and D-pad, as I understand there is no current integration to the engine for the vaues of the joysticks in the same way as the buttons, is there a way to access theyr values?

--
You received this message because you are subscribed to the Google Groups "melonJS - A lightweight HTML5 game engine" group.
To unsubscribe from this group and stop receiving emails from it, send an email to melonjs+u...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

melonJS

unread,
Apr 3, 2016, 11:33:57 PM4/3/16
to melonJS - A lightweight HTML5 game engine
if you are a bit more adventurous, the current master branch (3.1.0) allows you to map buttons to axes, and additionally to get the axes raw value through the me.event.GAMEPAD_UPDATE event. Master branch is quite stable already, does not break any API, and should be released very soon now, it's just a matter of me finding the time to add and test the last howler build with Ejecta and release the whole thing.

see for example how I used the axes here for the platformer example :

(note that the bindGamepad function signature changes a bit to accomodate with the addtion of the axes, but the function is still backward compatible with the old signature)
To unsubscribe from this group and stop receiving emails from it, send an email to melonjs+unsubscribe@googlegroups.com.

iris...@gmail.com

unread,
Apr 3, 2016, 11:37:41 PM4/3/16
to melonJS - A lightweight HTML5 game engine
That worked, still trying to find a way to read the right stick on Chrome on Android.

iris...@gmail.com

unread,
Apr 3, 2016, 11:41:37 PM4/3/16
to melonJS - A lightweight HTML5 game engine
I'll try the master branch too, I'm really liking melonJS, now I need to find a way to read the right stick on Chrome because I want to use cocoonjs to export the game once it's ready.

melonJS

unread,
Apr 3, 2016, 11:56:56 PM4/3/16
to melonJS - A lightweight HTML5 game engine, iris...@gmail.com

Great, thanks ! if you have any other feedback (including negative ones for improvements) don’t hesitate to come back to us as well J

iris...@gmail.com

unread,
Apr 4, 2016, 12:25:37 PM4/4/16
to melonJS - A lightweight HTML5 game engine
Hi, how does the me.event.GAMEPAD_UPDATE works? is there any documentation?

I ask cause on Chrome on Android something is not working and I don't get the values or the right thumbstick, I tried this: http://html5gamepad.com/ and it doesn't show them either but shows there is some activity on the gamepad as I move that stick. I may better ask the guys on Chrome about this, but if I can access the raw data of the gamepad maybe I can do a workaround in the maintime.

Thanks for the help.

Jay Oster

unread,
Apr 4, 2016, 2:36:28 PM4/4/16
to mel...@googlegroups.com
You get one GAMEPAD_UPDATE event for each button binding and axis binding. If you don't bind buttons or axes, you don't get events for them.

--
You received this message because you are subscribed to the Google Groups "melonJS - A lightweight HTML5 game engine" group.
To unsubscribe from this group and stop receiving emails from it, send an email to melonjs+u...@googlegroups.com.

melonJS

unread,
Apr 5, 2016, 12:06:46 AM4/5/16
to melonJS - A lightweight HTML5 game engine
also make sure you have the 3.1.0 version (the previous one does not trigger this event for axes)
To unsubscribe from this group and stop receiving emails from it, send an email to melonjs+unsubscribe@googlegroups.com.

iris...@gmail.com

unread,
Apr 5, 2016, 3:32:15 PM4/5/16
to melonJS - A lightweight HTML5 game engine
Yeah, I'm using 3.1.0 version, the axes work, the problem is that on some browser on some devices some gamepads are not well mapped, tested a few gamepads on diferent browsers and devices and got diferent results, there are some tickets open for that on they'r respecetive browser development forums, I guess it's hard to have all the diferent hardware and software working.

On the other hand when a gamepad is mapped right the melonJS works good, gives all the axes, and the buttons of each gamepad conected, soo I guess it's just a matter of some time untill the browsers devs find a way to solve the problem.

Jay Oster

unread,
Apr 5, 2016, 4:05:55 PM4/5/16
to mel...@googlegroups.com
We are aware of UA gamepad mappings being broken. We've only been able to take into account the gamepads that we actually have access to. So e.g. we have auto-remapping support for the following devices:
  • PS3 controller
  • PS4 controller
  • Wired XBox 360 controller
  • Ouya controller
For all other controllers, you can add remapping at startup with the following method: http://melonjs.github.io/melonJS/docs/me.input.html#setGamepadMapping

On Tue, Apr 5, 2016 at 12:32 PM, <iris...@gmail.com> wrote:
Yeah, I'm using 3.1.0 version, the axes work, the problem is that on some browser on some devices some gamepads are not well mapped, tested a few gamepads on diferent browsers and devices and got diferent results, there are some tickets open for that on they'r respecetive browser development forums, I guess it's hard to have all the diferent hardware and software working.

On the other hand when a gamepad is mapped right the melonJS works good, gives all the axes, and the buttons of each gamepad conected, soo I guess it's just a matter of some time untill the browsers devs find a way to solve the problem.

iris...@gmail.com

unread,
Apr 6, 2016, 4:17:37 PM4/6/16
to melonJS - A lightweight HTML5 game engine
The bad mapping change depending on the gamepad, the android device, and the browser, the PS3 Controller for example works perfect on a JXD S5800, on Firefox, Chrome and on a Cocoon APK, but the same APK running on an Ouya lacks the right stick axes for both the PS3 and Ouya controllers, for now I will just use the left stick and my games untill Chromium (the base for Crosswalk) fix that, as I'm planning to release the game on the Ouya.

But the code on melonJS works good, it's just the way some devices and browsers read the gamepad imputs, thanks for your help I apreciate it.

Jay Oster

unread,
Apr 6, 2016, 4:31:00 PM4/6/16
to mel...@googlegroups.com
Wow, good find... Do you get any inputs for the right stick on the following site? The remapping can be made based on this data. http://luser.github.io/gamepadtest/

On Wed, Apr 6, 2016 at 1:17 PM, <iris...@gmail.com> wrote:
The bad mapping change depending on the gamepad, the android device, and the browser, the PS3 Controller for example works perfect on a JXD S5800, on Firefox, Chrome and on a Cocoon APK, but the same APK running on an Ouya lacks the right stick axes for both the PS3 and Ouya controllers, for now I will just use the left stick and my games untill Chromium (the base for Crosswalk) fix that, as I'm planning to release the game on the Ouya.

But the code on melonJS works good, it's just the way some devices and browsers read the gamepad imputs, thanks for your help I apreciate it.
--
You received this message because you are subscribed to the Google Groups "melonJS - A lightweight HTML5 game engine" group.
To unsubscribe from this group and stop receiving emails from it, send an email to melonjs+u...@googlegroups.com.

iris...@gmail.com

unread,
Apr 6, 2016, 4:45:02 PM4/6/16
to melonJS - A lightweight HTML5 game engine
Tried http://luser.github.io/gamepadtest/
No right stick axis data on CooconIO dev apk running on an Ouya, neither with the Ouya controller or the PS3 one.
The space for the axis appears but moving the stick cause nothing to change, the other buttons and axis do work, even the right stick push button.

Jay Oster

unread,
Apr 6, 2016, 7:18:15 PM4/6/16
to mel...@googlegroups.com
Yeah, that sounds like a platform issue. Maybe something like Cocoon and Chrome use the same Ouya gamepad API, and it doesn't expose more than two axes at a time ... If you're lucky, a bug ticket exists for these components, and you might find some extra info regarding progress. Although, I think Ouya has really been on the decline since the acquisition last year.

iris...@gmail.com

unread,
Apr 6, 2016, 7:59:27 PM4/6/16
to melonJS - A lightweight HTML5 game engine
Last year Cocoon (before crosswalk) had the two sticks working on Ouya on Canvas+, now something happend and the Canvas+ is not loading the new MelonJS soo I got to use Webview+ on the new Cocoon.

I know Ouya is getting to it's final lap, but I want to publish on it before whatever happend this summer, also I think I'll find similar problems on other microconsoles and Android devices, for example my Ouya's controllers are a complete mapping mess on my JXD S5800, even with melonJS having the remap, soo I'm trying to see what stuff is the most commonly supported.

I'll go with D-Pad and Right-Stick doing the same thing, and a few buttons excludind the analog triggers and not relying on those buttons being in a especific place. I saw that the controllers mapping is an open ticket on Chromium, soo maybe in the future they will find a solution that fix it all.

Jay Oster

unread,
Apr 8, 2016, 1:59:47 AM4/8/16
to mel...@googlegroups.com
Yeah, the remapping support relies on the advertised gamepad ID, which can be different for each UA. For example, the Ouya controller on Chrome is "OUYA Game Controller (Vendor: 2836 Product: 0001)" and the same controller on Firefox is "2836-1-OUYA Game Controller" -- similar, but we require exact match. The mappings are also different, so it works out for us. To create a new mapping, you just need the ID as reported by the UA, e.g. console.log(navigator.getGamepads()[0].id); and the button/axis values as reported by the gamepad tester site.

iris...@gmail.com

unread,
Apr 12, 2016, 12:51:58 AM4/12/16
to melonJS - A lightweight HTML5 game engine
I used http://html5gamepad.com/ to get the names of the controllers under Chrome on Android, couldn't use it for Firefox (it just said "Android").

But as Chromium is the base for Cordova(CocoonIO), it worked for me and I did two remapings, one for the JXD S5800 built-in gamepad, that was basicaly ordering the face buttons and the L1-L2 R1-R2, it still lacks right stick axes data and L2-R2 cause the data of those didn't showed up on the tester.

me.input.setGamepadMapping("jxdkey_driver", {
"axes" : [ 0, 1, 2, 3 ],
"buttons" : [ 1, 0, 3, 2, 6, 7, 4, 5, 8, 9, 10, 11, 12, 13, 14, 15, 16 ]
});

The OUYA gamepad works on the JXD S5800 under the name "hid-keyboard", I remaped it but got not had problems like buttons not showing data on the tester, and the R2 sending analog data to the right joystick X axis. The data from the axes had ranges from -257 to 257 soo I normanilzed them, also some buttons get stuck (even in the tester) if pressed at the same time.

me.input.setGamepadMapping("hid-keyboard", {
"axes" : [ 0, 1, -1, 3 ],
"buttons" : [ 0, 2, 1, -1, 3, -1, 16, 10, -1, -1, 6, 7, -1, -1, 8, 9, -1 ],
"normalize_fn" : function (value, axis, button) {
return ((axis === me.input.GAMEPAD.AXES.LX) ? (value / 257.0) : value) || 0;
return ((axis === me.input.GAMEPAD.AXES.LY) ? (value / 257.0) : value) || 0;
return ((axis === me.input.GAMEPAD.AXES.RX) ? (value / 257.0) : value) || 0;
return ((axis === me.input.GAMEPAD.AXES.RY) ? (value / 257.0) : value) || 0;
}
});

I share those remapings in case someone has a JXD S5800 and/or find them useful.

melonJS

unread,
Apr 12, 2016, 6:16:33 AM4/12/16
to melonJS - A lightweight HTML5 game engine, iris...@gmail.com
super, glad you had it working, thanks for the feedback ! :)
I feel like that's something that would easily has its own place somwhere in our wiki :P
Reply all
Reply to author
Forward
0 new messages