Get the full commented source code of

HTML5 Suika Watermelon Game

Talking about Tutorials and WordPress.

Now that you have a WordPress theme and plugin in order to set uo your own MochiAds arcade site like triqui.com, let’s see how we can add some interesting features with the Publisher Bridge.

Every step explained in this tutorial will be included in the next upgrade of Triqui MochiAds Arcade theme, but it’s very interesting to see how does it work in order to custom it or install it in your own arcade site.

First, let me explain why you should use the Publisher Bridge… the reasons are listed in the official page:

  1. Leverage the hundreds of MochiAds leaderboard enabled games to attract new players.
  2. Receive new traffic – MochiAds’ Challenges feature will drive new players back to your site to compete in top scores.
  3. Build exciting site features – Save player scoring info for all MochiAds leaderboard-enabled games.
  4. Encourage competition – In-game scores are listed for your community only.
  5. Maintain consistency – Display your own community usernames when players post scores.
  6. Promote your brand – Put your site logo directly in the game.

but, as usual, it’s up to your creativity finding the best way to use them.

Cross-domain policy

From the Cross-domain policy file specification you cana cross-domain policy file is an XML document that grants a web client – such as Adobe Flash Player (though not necessarily limited to it) – permission to handle data across multiple domains. When a client hosts content from a particular source domain and that content makes requests directed towards a domain other than its own, the remote domain would need to host a cross-domain policy file that grants access to the source domain, allowing the client to continue with the transaction.

So the first thing you should do is to create a file called crossdomain.xml in your root, with this content:




     
     
     

This will allow Mochi client to communicate with your server.

Javascript call

Once your server is able to communicate, you need to insert the javascript provided by Mochi in the same page where you host (or leech) a game.

You don’t need to know if the game has a leaderboard, if the game does not support highscores, nothing will happen.

This is the one I used:


               

I used only a few options among the ones provided by Mochi, let me explain them:

partnerID: this is the ID MochiAds gave you when you signed up as a publisher. Remember: the Publisher ID, not the Publisher Secret Key!!!

id: The id of the HTML element you want to place the Bridge SWF into. Place such element wherever you want, it’s not important since it does not contain anything.

globalScores: Set to true if you wish to display global scores and not just those submitted from your site. I recommend to set it to true if your portal does not have that much visits per day (under 10,000).

gateway: the absolute path of a file that will receive posted data with POST method. I’ll explain how to use such data in next tutorial

callback: a JavaScript function which will be called when the player submits a score. In my case, I simply display in the page the latest score the player got, but obviously you can use Ajax to improve the interactivity.

Try to see it in action playing a leaderboard enabled game on Triqui.com, such as Mazeroll and see what happens when you submit a score.

But the most exciting feature lies in the gateway: having all score data in the POST array will allow you to create custom leaderboards and some other interesting things I’ll explain during next tutorial.

Meanwhile, look at the variables the bridge passes to postscores.php page when I submit a score, obtained with a simple var_dump:

array(14) {
  ["signature"]=>
  string(32) "(had to omit it)"
  ["sessionID"]=>
  string(0) ""
  ["userID"]=>
  string(0) ""
  ["username"]=>
  string(0) ""
  ["scoreLabel"]=>
  string(6) "Points"
  ["sortOrder"]=>
  string(4) "desc"
  ["datatype"]=>
  string(6) "number"
  ["description"]=>
  string(0) ""
  ["title"]=>
  string(10) "Highscores"
  ["gameID"]=>
  string(16) "98c536dbf70a1cbc"
  ["boardID"]=>
  string(32) "4b2ac948de239f8853a3bc6a1b771d9d"
  ["name"]=>
  string(4) "ququ"
  ["score"]=>
  string(3) "520"
  ["lcId"]=>
  string(1) "1"
}

Next time I’ll show you how to use these values.

Never miss an update! Subscribe, and I will bother you by email only when a new game or full source code comes out.