A sample application that demonstrates some simple achievements (normal, hidden, and incremental), as well as leaderboards. It also demonstrates Interactive Posts and Deep-Linking, allowing you to challenge your friends to beat your score on either the web or mobile version.
You can find the code that runs the game in the
js directory. The following
files are located there:
achievementManager.jshandles most of the game logic around achievements
achievementTable.jsdisplays the table when you click the "View Achievements" button
achievementWidget.jsdisplays the little "Achievement unlocked!" widget at the bottom of the page
challenge.jscontains some simple logic to display the challenge received via Interactive Posts
constants.jscontains some constants that you will want to change for your application
friendsTable.jsshows the "Find my friends!" page
game.jshandles the simple game logic and creates the "Beat my score!" Interative Post
leaderboardManager.jshandles most of the game logic around leaderboards
leaderboardsTable.jsdisplays the "All leaderboards" table
leaderboardTable.jsdisplays the high scores for an individual leaderboard
leaderboardWidget.jsdispalys the little "New high score!" widget at the bottom of the page
login.jshandles most of the initial login logic
player.jssimply handles loading the player information so we can say hello.
utils.jshas a function to roll a random number, and determine if a number is prime
welcome.jsmanages the simple logic around the welcome page
linkPage/index.phpis a server-generated page that populates its schema.org data (i.e. the stuff with the
Running the sample application
To run the Type-a-Number Challenge on your own server, you will need to create
your own version of the game in the Play Console. Once you have done that,
you will create achievements and leaderboards for this game, then copy over
all client IDs, achievement IDs and leaderboard IDs to your own
js/constants.js file. To follow this process, perform the following steps:
- If you have already created this application in the Play Console (because you
have created and run the Android or iOS version of the game, for example), you can
skip steps 2 through 5 below. All you will need to do is...
- Create a separate Client ID for the web version of the game, as described in the "Create a Client ID" section of the Console Documentation.
- Link the web version of your game, as described in the "Link Your Platform- Specific Apps" section of the console documentation
- Create your own application in the Play Console, as described in our Developer Documentation. Make sure you follow the "Web" instructions for creating your Client ID and linking your application.
- Make a note of your Client ID and Application ID as described in the documentation
- Create your own Achievements and Leaderboards as described in the
documentation. You are free to create you own Achievements and Leaderboards,
but if you want to match the ones in this sample application, they are...
- Prime: Receive a score that is a prime number
- Bored: Play 10 games (Incremental achievement)
- Humble: Request a score of 0
- Don't Get Cocky, Kid: Request a score of 9999
- OMG U R TEH UBER LEET!: Receive a score of 1337 (hidden achievement)
- Really Bored: Play 100 games (Incremental achievement)
- Hard mode
- Easy mode
- Feel free to use any score value for your achievements (we tended to keep them between 10 and 75 points per achievement). If you want placeholder icons, http://lorempixel.com is a great resource.
- Once that's done, you'll want to replace some of the constants defined in the
- In the
constants.jsfile, replace the following constants:
constants.CLIENT_ID(Replace this with your OAuth2.0 Client ID)
constants.APP_ID(Replace this with your Application ID)
- In the same
constants.jsfile, replace the following constants with the IDs for the corresponding achievements that you created:
- Finally, replace the following constants with the IDs for the
corresponding leaderboards that you created:
- In the
- To get Interactive Posts working properly, make sure you change your
That's it! Your application should be ready to run!
I see a some kind of
GET https://accounts.google.com/o/oauth2/auth.... What does that
This could be due to a number of different causes, but probably the most
common one is a
redirect_uri_mismatch error. This happens when the location
from which you are serving your application doesn't match up with the
- You're trying to load your app from a "file://" location. (You need to specify a http or https origin.)
- You have your
https://mixed up. (For instance, you're loading from
- Just a plain ol' mismatch. (For instance, you're loading from
To fix any of these issues...
- Go to your application in the Play Console's Game services page.
- Click the "This game is linked to the API console project called ''" link at the bottom of the page. This will take you to the Google API Console.
- Click on the "API Access" tab on the left.
- Game is ugly :)
- Game does not conform to Play game services branding recommendations (no game controller, achievement, or leaderboard icon)
- "Incremental" achievement progress doesn't get updated locally