Gaming/GameCenter: Difference between revisions

From MozillaWiki
Jump to navigation Jump to search
 
(28 intermediate revisions by 3 users not shown)
Line 1: Line 1:
== Documents ==
* [https://docs.google.com/document/d/1Zac3OJDsY0QwqN4t68UqD5B4dRQwxYsI-m0JOWXlgZI/edit?usp=sharing Explainer]
* [https://docs.google.com/spreadsheets/d/1FvuBbTtd4wjNaSxmfqCVztZanBEOcPw9GgvAFCgAFY4/edit#gid=0 List of competing game center/HTML5 distributors]
* [https://docs.google.com/spreadsheets/d/1x6ZWaynxaD6MQfuEZs1uOoZ3w5Hnv3QvDWAcBQDW7Kk/edit#gid=0 List of good HTML5 (WebGL/asm.js) games]
* [http://people.mozilla.org/~cwiemeersch/galaxy/mobile_controllers.html List of mobile game controllers in the wild]
* [[Gaming/GameCenter/History|History of Galaxy: A Trip Down Memory Lane]]
* [[Gaming/GameCenter/Architecture|Technical Architecture (Wiki)]]
* [https://docs.google.com/presentation/d/1SbgiFtGJmBAR0SloXBcT25Ov7FqJ0-IdEsl32TBlDeg/edit Technical Architecture (Presentation)]
* [[Gaming/GameCenter/Controllers|Controller Lab]]
== Communications ==
== Communications ==
=== irc.mozilla.org backchannels ===
=== irc.mozilla.org backchannels ===
Line 6: Line 16:


== Roadmap ==
== Roadmap ==
* (games||gaming).firefox.com launch with splash page and directory: 9/15/2014 (post-Humble Bundle at the beginning of September)
Given that:
* v0.5 of galaxy: 9/15/2014
* HB is curious about the galaxy controllers
* Stumbler is going to check out leaderboards


=== Questions ===
Therefore, our priorities are:
* length of run of directory metrics (used for gauging interest): 3 months
# Leaderboards
* risk of directory undercutting galaxy? Have to make sure we have sufficient games for galaxy.
# Off-the-shelf controllers
# Load-testing
# Localizations
 
=== Status ===
* '''Leaderboards:''' Complete and documented, awaiting feedback from MozStumbler contractors.
* '''Controllers:''' Complete but needs more documentation. We should encourage people to contribute to the wrapper for galaxy.getGamepads. cvan has a fork of commits to upstream and a bunch of controllers to add controller mappings. cvan wants to make a standalone Controller Configuration tool that we can deploy to crowdsource controller mappings in the wild.
* '''Login:''' Awaiting UX and integration help with Services.
 
=== Activities ===
* cvan: documentation
** overall approach/backgrounder -- completing week of 20140902
** REST API docs -- complete at [http://docs.galaxy.apiary.io/]
** galaxy.js docs -- in progress at [http://mozilla.github.io/galaxy.js/docs/]. Working on after overall approach/backgrounder.
* rfkelly: fxa integration, general backend helping-out
 
==== Game Center Roadmap ====
* In lieu of a lobby, keep the list of games private.
* Build a page for each game to show potential with API (e.g. show leaderboard, show who's playing); we can work with the game developers to skin/customize it as needed.
* The "lobby" as previously envisioned, should be justified with interest stemming from HB, Stumbler, etc.


== Projects ==
== Projects ==
Line 18: Line 48:


=== [https://github.com/mozilla/galaxy Catalogue] ===
=== [https://github.com/mozilla/galaxy Catalogue] ===
[[File:Galaxy_homepage_august_2014.png|left|500px|link=https://galaxy.dev.mozaws.net/|thumb|Homepage of Galaxy games lobby (circa August 2014)]]


==== Summary ====
==== Summary ====
Line 23: Line 55:


During the build step, via Gulp and Metalsmith, the HTML is generated from static JSON files, Markdown files, and HTML templates. The compiled HTML talks to the backend API (`galaxy-api`) via WebSockets to render any user-specific information (i.e., leaderboards and friends' activity).
During the build step, via Gulp and Metalsmith, the HTML is generated from static JSON files, Markdown files, and HTML templates. The compiled HTML talks to the backend API (`galaxy-api`) via WebSockets to render any user-specific information (i.e., leaderboards and friends' activity).
<div style="clear: left"></div>


==== Technologies used ====
==== Technologies used ====
Line 34: Line 68:
==== Servers ====
==== Servers ====
* '''Staging:''' https://galaxy.dev.mozaws.net/directory/
* '''Staging:''' https://galaxy.dev.mozaws.net/directory/
==== Resources ====
* [https://docs.google.com/spreadsheets/d/1x6ZWaynxaD6MQfuEZs1uOoZ3w5Hnv3QvDWAcBQDW7Kk/edit#gid=0 Tentative list of games]
<hr>


=== [https://github.com/mozilla/galaxy-api REST/WebSocket API] ===
=== [https://github.com/mozilla/galaxy-api REST/WebSocket API] ===
Line 39: Line 80:
==== Summary ====
==== Summary ====
Contains the REST API server and the WebSocket server that the catalogue (`galaxy`) talks to and the in-game services (`galaxy.js`) talk to.
Contains the REST API server and the WebSocket server that the catalogue (`galaxy`) talks to and the in-game services (`galaxy.js`) talk to.
Such services include game, leaderboard, and leaderboard score creation.


==== Technologies used ====
==== Technologies used ====
Line 45: Line 88:
==== Repository ====
==== Repository ====
* https://github.com/mozilla/galaxy-api
* https://github.com/mozilla/galaxy-api
* [https://github.com/mozilla/galaxy-api/issues?q=is%3Aopen+is%3Aissue+milestone%3A%22The+Big+Bang%22 View open issues]
* [https://github.com/mozilla/galaxy-api/issues?q=is%3Aopen+is%3Aissue View open issues]
* [https://github.com/mozilla/galaxy-api/issues/new File an issue]
* [https://github.com/mozilla/galaxy-api/issues/new File an issue]


Line 51: Line 94:
* '''Staging:''' https://api-galaxy.dev.mozaws.net
* '''Staging:''' https://api-galaxy.dev.mozaws.net


=== [https://github.com/mozilla/galaxy.js <tt>galaxy.js</tt>] ===
=== Benchmarks ===
* [[Gaming/GameCenter/API/Benchmarks|Click here!]]
 
=== Documentation ===
* [http://docs.galaxy.apiary.io/ REST API Docs on Apiary]
 
=== Example Code ===
* [https://github.com/mozilla/galaxy-api-python-client/blob/master/examples/play_game.py Python] (and [https://github.com/mozilla/galaxy-api-python-client/blob/master/README.md#example-output example output])
 
 
<hr>
 
 
=== [https://github.com/mozilla/galaxy.js <code>galaxy.js</code>] ===


==== Summary ====
==== Summary ====
Line 61: Line 117:
==== Repository ====
==== Repository ====
* https://github.com/mozilla/galaxy.js
* https://github.com/mozilla/galaxy.js
* [https://github.com/mozilla/galaxy.js/issues?q=is%3Aopen+is%3Aissue+milestone%3A%22The+Big+Bang%22 View open issues]
* [https://github.com/mozilla/galaxy.js/issues?q=is%3Aopen+is%3Aissue View open issues]
* [https://github.com/mozilla/galaxy.js/issues/new File an issue]
* [https://github.com/mozilla/galaxy.js/issues/new File an issue]


== Technical Architecture ==
 
* [[Gaming/GameCenter/Architecture|Read Wiki page for Architecture]]
<hr>
* [https://docs.google.com/presentation/d/1SbgiFtGJmBAR0SloXBcT25Ov7FqJ0-IdEsl32TBlDeg/edit Presentation of Galaxy Architecture (with diagrams)]
 
 
=== [https://github.com/mozilla/galaxy.js-mobile-gamepad <code>galaxy.js-mobile-gamepad</code>] ===
 
==== Summary ====
A drop-in JavaScript library for controlling an HTML5 game using WebRTC data channels.
 
==== Technologies used ====
JavaScript, WebRTC, WebSockets, Browserify (with Node), Gulp.
 
==== Repository ====
* https://github.com/mozilla/galaxy.js-mobile-gamepad
* [https://github.com/mozilla/galaxy.js-mobile-gamepad/issues?q=is%3Aopen+is%3Aissue View open issues]
* [https://github.com/mozilla/galaxy.js-mobile-gamepad/issues/new File an issue]


== Screencasts & Demos ==
== Screencasts & Demos ==
Line 72: Line 141:
=== USB/Bluetooth Gamepads ===
=== USB/Bluetooth Gamepads ===


[[File:Galaxy_gamepad_controller_demo_thumb.png|left|link=https://wiki.mozilla.org/images/d/d7/Galaxy_gamepad_controller_demo.webm|thumb|Gameplay with USB controllers]]
[[File:Galaxy_gamepad_controller_demo_thumb.png|left|300px|link=https://wiki.mozilla.org/images/d/d7/Galaxy_gamepad_controller_demo.webm|thumb|Gameplay with USB controllers]]




A demo of cvan using two USB-based controllers (N64 and NES) to play a version of [http://hexgl.bkcore.com/ HexGL], a WebGL-based racing game, which has been modified to work with <tt>galaxy.js</tt>. Included in <tt>galaxy.js</tt> is <tt>galaxy.getGamepads</tt>, a simple, cross-browser wrapper around <tt>navigator.getGamepads</tt>, also providing mappings for various controllers on the market. Instead of writing lots of boilerplate code, game developers can simply listen to events (when buttons get pressed or axes change) or inspect a state object in their game loop.
A demo of cvan using two USB-based controllers (N64 and NES) to play a version of [http://hexgl.bkcore.com/ HexGL], a WebGL-based racing game, which has been modified to work with <code>galaxy.js</code>. Included in <code>galaxy.js</code> is <code>galaxy.getGamepads</code>, a simple, cross-browser wrapper around <code>navigator.getGamepads</code>, also providing mappings for various controllers on the market. Instead of writing lots of boilerplate code, game developers can simply listen to events (when buttons get pressed or axes change) or inspect a state object in their game loop.


<div style="clear: left"></div>
<div style="clear: left"></div>
Line 81: Line 150:
=== Mobile Gamepads ===
=== Mobile Gamepads ===


[[File:Galaxy_websockets_mobile_controller_demo_thumb.png|left|link=https://wiki.mozilla.org/images/0/00/Galaxy_websockets_mobile_controller_demo.webm|thumb|Gameplay with Firefox OS mobile phone]]
[[File:Galaxy_websockets_mobile_controller_demo_thumb.png|left|300px|link=https://wiki.mozilla.org/images/0/00/Galaxy_websockets_mobile_controller_demo.webm|thumb|Gameplay with Firefox OS mobile phone]]




A demo of cvan using a Firefox OS phone to play HexGL with <tt>galaxy.js</tt>. Also included in <tt>galaxy.js</tt> is <tt>galaxy.getMobileGamepads</tt>, an interface for pairing a mobile device with the Galaxy in-game services to provide accelerometer gameplay controls. Using the browser's <tt>deviceorientation</tt> events, we identify which direction the player is turning and whether the player is accelerating.
A demo of cvan using a Firefox OS phone to play HexGL with <code>galaxy.js</code>. Also included in <code>galaxy.js</code> is <code>galaxy.getMobileGamepads</code>, an interface for pairing a mobile device with the Galaxy in-game services to provide accelerometer gameplay controls. Using the browser's <code>deviceorientation</code> events, we identify which direction the player is turning and whether the player is accelerating.


<div style="clear: left"></div>
<div style="clear: left"></div>


=== Screen Sharing ===
=== Screen Sharing ===


[[File:Galaxy_webrtc_screen_sharing_thumb.png|left|link=https://wiki.mozilla.org/images/f/fa/Galaxy_webrtc_screen_sharing.webm|thumb|Streaming gameplay to a friend]]
[[File:Galaxy_webrtc_screen_sharing_thumb.png|left|300px|link=https://wiki.mozilla.org/images/f/fa/Galaxy_webrtc_screen_sharing.webm|thumb|Streaming gameplay to a friend]]




A demo of Sathya playing HexGL whilst sharing his screen with a friend. Using Chrome's <tt>desktopCapture</tt> API from an extension, the screen is turned into a Media Stream,
A demo of Sathya playing HexGL whilst sharing his screen with a friend. Using Chrome's <code>desktopCapture</code> API from an extension, the screen is turned into a Media Stream,
which is then streamed to another browser using WebRTC. (The API will be available soon in Firefox Nightly.)
which is then streamed to another browser using WebRTC. (The API will be available soon in Firefox Nightly.)


Line 100: Line 168:


<div style="clear: left"></div>
<div style="clear: left"></div>
== Documents ==
* [https://docs.google.com/spreadsheets/d/1FvuBbTtd4wjNaSxmfqCVztZanBEOcPw9GgvAFCgAFY4/edit#gid=0 List of competing game center/HTML5 distributors]


== Archives ==
== Archives ==
Line 111: Line 175:
* [https://github.com/mozilla/galaxy-api/issues/new File bugs for REST/WebSocket API (and docs)]
* [https://github.com/mozilla/galaxy-api/issues/new File bugs for REST/WebSocket API (and docs)]
* [https://github.com/mozilla/galaxy/issues/new File bugs for front-end catalogue (and docs)]
* [https://github.com/mozilla/galaxy/issues/new File bugs for front-end catalogue (and docs)]
* [https://github.com/mozilla/galaxy.js/issues/new File bugs for <tt>galaxy.js</tt> (and docs)]
* [https://github.com/mozilla/galaxy.js/issues/new File bugs for <code>galaxy.js</code> (and docs)]

Latest revision as of 05:14, 7 October 2014

Documents

Communications

irc.mozilla.org backchannels

  • #galaxy

Meetings

Roadmap

Given that:

  • HB is curious about the galaxy controllers
  • Stumbler is going to check out leaderboards

Therefore, our priorities are:

  1. Leaderboards
  2. Off-the-shelf controllers
  3. Load-testing
  4. Localizations

Status

  • Leaderboards: Complete and documented, awaiting feedback from MozStumbler contractors.
  • Controllers: Complete but needs more documentation. We should encourage people to contribute to the wrapper for galaxy.getGamepads. cvan has a fork of commits to upstream and a bunch of controllers to add controller mappings. cvan wants to make a standalone Controller Configuration tool that we can deploy to crowdsource controller mappings in the wild.
  • Login: Awaiting UX and integration help with Services.

Activities

  • cvan: documentation
    • overall approach/backgrounder -- completing week of 20140902
    • REST API docs -- complete at [1]
    • galaxy.js docs -- in progress at [2]. Working on after overall approach/backgrounder.
  • rfkelly: fxa integration, general backend helping-out

Game Center Roadmap

  • In lieu of a lobby, keep the list of games private.
  • Build a page for each game to show potential with API (e.g. show leaderboard, show who's playing); we can work with the game developers to skin/customize it as needed.
  • The "lobby" as previously envisioned, should be justified with interest stemming from HB, Stumbler, etc.

Projects

Below are the following GitHub repositories that comprise the Galaxy services.

Catalogue

Homepage of Galaxy games lobby (circa August 2014)

Summary

Contains the catalogue, a static web page, that showcases the games, leaderboards, and friends' activity.

During the build step, via Gulp and Metalsmith, the HTML is generated from static JSON files, Markdown files, and HTML templates. The compiled HTML talks to the backend API (`galaxy-api`) via WebSockets to render any user-specific information (i.e., leaderboards and friends' activity).

Technologies used

HTML, CSS, JavaScript, WebSockets, Node.js, Gulp, Metalsmith.

Repository

Servers

Resources



REST/WebSocket API

Summary

Contains the REST API server and the WebSocket server that the catalogue (`galaxy`) talks to and the in-game services (`galaxy.js`) talk to.

Such services include game, leaderboard, and leaderboard score creation.

Technologies used

Node.js, Koa, Chai, Mocha, Redis, PostgreSQL, WebSockets, Gulp.

Repository

Servers

Benchmarks

Documentation

Example Code



galaxy.js

Summary

Contains the JavaScript file that developers can include in their games to get access to the Galaxy in-game services.

Technologies used

JavaScript, WebSockets, Gulp.

Repository



galaxy.js-mobile-gamepad

Summary

A drop-in JavaScript library for controlling an HTML5 game using WebRTC data channels.

Technologies used

JavaScript, WebRTC, WebSockets, Browserify (with Node), Gulp.

Repository

Screencasts & Demos

USB/Bluetooth Gamepads

Gameplay with USB controllers


A demo of cvan using two USB-based controllers (N64 and NES) to play a version of HexGL, a WebGL-based racing game, which has been modified to work with galaxy.js. Included in galaxy.js is galaxy.getGamepads, a simple, cross-browser wrapper around navigator.getGamepads, also providing mappings for various controllers on the market. Instead of writing lots of boilerplate code, game developers can simply listen to events (when buttons get pressed or axes change) or inspect a state object in their game loop.

Mobile Gamepads

Gameplay with Firefox OS mobile phone


A demo of cvan using a Firefox OS phone to play HexGL with galaxy.js. Also included in galaxy.js is galaxy.getMobileGamepads, an interface for pairing a mobile device with the Galaxy in-game services to provide accelerometer gameplay controls. Using the browser's deviceorientation events, we identify which direction the player is turning and whether the player is accelerating.

Screen Sharing

Streaming gameplay to a friend


A demo of Sathya playing HexGL whilst sharing his screen with a friend. Using Chrome's desktopCapture API from an extension, the screen is turned into a Media Stream, which is then streamed to another browser using WebRTC. (The API will be available soon in Firefox Nightly.)

Code available on GitHub.

Archives

Contact Information

Retrieved from "https://wiki.mozilla.org/index.php?title=Gaming/GameCenter&oldid=1022853"