JavaScript Gamepad API, si esiste!

- Firefox, HTML5, JavaScript, Programmazione, Risorse, Senza categoria, Video

I joystick. Il mondo dei videogiocatori da console. Un mondo che non mi è mai piaciuto per gli sparatutto, per gli altri giochi i joystick sono perfetti. Si non ho mai avuto console a parte il mitico gameboy color.

WebGL ha portato il 3D su JavaScript ma mancava un modo per permettere ai giocatori di usare i loro amati joystick!

I vantaggi sono interessanti, per giocare basterà attaccare il joystick, connettersi ad un sito, aspettare il caricamento del materiale e premere su play. Pensa poi con i WebSockets ai giochi multiplayer.
Si insomma non ti alzerai mai più dalla poltrona.

Con il 3D ed i joystick il vero web si sta prendendo un campo in cui non è mai stato così interattivo.
Mte90 – Daniele Scasciafratte

Pensate a console come Xbox o PlayStation che supportino questa funzionalità oppure lo stesso Steam per i pc.

Prima di farvi provare una demo divertente anzi un gioco qualche dettaglio tecnico.

Questa API è in draft è stata integrata in Firefox 29 ed in Chrome 21. Per Internet Explorer invece è in sviluppo. Per i browser mobile al momento non è prevista (credo che aspettino una standardizzazione ufficiale ed un buon numero di giochi prima di integrarla).

Potrebbe evolversi nel futuro ma oramai è ben standardizzata e come sempre MDN ha un’ottimo tutorial che spiega come usare questa API.

Questa API riconosce molti joystick da quelli della Xbox, alla PlayStation e quelli da 10 euro presi al supermercato (io uso questi).

Dopo le mie esperienze agli eventi ho sentito la necessità di demo per mostrare alle persone queste nuove API e tecnologie quindi sono partito alla ricerca sul web.

Mi sono imbattuto in questo gioco Boxes Wot Shoot (non apritelo subito che non ho finito), usa Three.JS per gli oggetti 3D, la API html5 per l’audio, localforage.JS per il salvataggio delle configurazioni ed ovviamente la Gamepad API.

Il gioco è molto semplice ti muovi in un’area circolare e spari verso i blocchi che si muovono verso di te. Con i due stick del joystick puoi muoverti e sparare a 360 gradi il che è molto comodo.

Mi piace e lo forko (non perchè mi piace ma per aggiungere alcune feature, si voi maledetti che forkate e poi non fate niente siete delle brutte persone).

Ho aggiunto delle feature:

  • Reset della configurazione (se ti sbagli nella configurazione al primo avvio è difficile fare un reset) premendo il tasto R della tastiera
  • Il multilingua sfruttando webl10n di Gaia ovvero dell’interfaccia di Firefox OS
  • Il salvataggio del miglior punteggio

Con queste piccole feature la nuova demo esiste e funziona (ho fatto la pull request al progetto originario, sono in attesa dell’integrazione). Le mie modifiche sono state minime ma servono per mostrare questa nuova API.

Collega il tuo joystick al computer (è multipiattaforma e gira pure su linux :-D), apri Firefox o Chrome, e clicca qui.
Segui le istruzioni e gioca.

Questo oltre ad essere una demo è un gioco completo che utilizzerò sicuramente nelle mie presentazioni e negli eventi (portandomi un joystick). Inoltre anche se è webGl non richiede grandi caratteristiche hardware per la sua semplicità.

Ideale per una demo insomma 🙂

Per il gameplay o video lo puoi vedere sulla destra.

Riferimenti

HTML5 Gamepad Tester – http://html5gamepad.com/

Esempi di codice – http://gamedevelopment.tutsplus.com/tutorials/using-the-html5-gamepad-api-to-add-controller-support-to-browser-games–cms-21345

Esempi interattivi con introduzione – http://www.html5rocks.com/en/tutorials/doodles/gamepad/

Altra documentazione – http://docs.webplatform.org/wiki/tutorials/gamepad

Liked it? Take a second to support Mte90 on Patreon!

Become a Patreon
All the stuff released in this website, where the author is Daniele Scasciafratte, is under the GPL 2.0 license except when the resources have their licenses.

Una risposta a “JavaScript Gamepad API, si esiste!”

Lascia un commento