This past week I got to learn and play with the Gamepad API (which allows to control gamepads/joysticks on the browser using JavaScript)... and I must say, it was a lot of fun.
After running tests and creating some demos, the result was GameController.js: a lightweight JS library to simplify the API interface and make it easier to use on web applications and games. Still at an early stage, but fully working.
...But I have a problem: the gamepad I used for testing is a SNES replica that only has 8 buttons and 1 joystick/axe, and the API supports a standard 17-button and 2 joysticks/axes gamepad. So I haven't been able to test the whole functionality 😅
If you have a gamepad/joystick for your computer, please give it a try. Test the demo page below or the ones on github, and let me know what you think. All feedback is welcome.
Thanks! 😊
Demo (you may need to open it on a new page):
- Select button will reset the game
- Start button will start a new game after reset
- Right/Left joystick/buttons to move the paddle
If you don't have a gamepad, you can see a video of the API at work here and another video here.
Top comments (10)
Cool library! With my Logitech Attack 3 (amazon.com/9632910403-Logitech-Win...
Alvanoid works well (tilting the stick left/right moves the ship, Button 9 resets the game, and Button 10 starts it)
The gamepad connects properly and is recognized
According to the button-mapper example, all of the buttons (including the trigger - maps to Button 0) map to the button one below them (i.e. Button 3 -> Button 2) from 0 until 10 (except button 7, strangely, though I tested it with html5gamepad.com/ and it didn't register so it may be broken). Moving the stick maps to the left analog stick, but the slider doesn't register (html5gamepad.com/ saw it as "Analog 2")
With a cheapy usb "SNES" controller:
Wow. That's some thorough testing. Thanks a lot! I will definitely need to create a mapping system, so users can "redefine" the buttons because it seems that the different gamepads all follow different layouts. Thanks again for your help.
By the way, we might have the same cheap USB "SNES" controller, because mine has the same issue with those buttons.
I have an xbox 360 controller clone from speedlink, the buttons match all fine (except 16, because that launches the windows game control center) - the joysticks don't light up at all though.
Thanks for testing! Which example did you try? Was it this one?
Interestingly enough: the one you linked works for joystick presses, but none of the joystick examples have the movement working.
Hmmm... I need to create a way to map the gamepads. I was able to test with an original PS3, and it works fine; but all the clones give me some type of trouble.
Maybe it would help to have just a key dump on screen, so lots of people could submit you what their controller sends to the browser? similar to how desktop mapping tools do it, not sure if that transfers over to web though.
I may need to do something like that. I followed the layout specified in the standard, but not all the gamepads follow it :-/
Nice library! Don't have gamepad with me atm, but I'll give it a go once I'm back in my flat.