TUTORIAL – Create realtime multiplayer games using Player.IO (PART 4 – Lobby)

part 1 ] – [ part 2 ] – [ part 3 ] – [ part 4 ]

STEP 1 – List rooms

So far, we’ve hardcoded the name of the room “Paris”, but in case your game becomes wildly popular, you wouldn’t want everyone in just one room. In fact, Player.io has a limit of 45 people per room. This might seem limiting, but 45 people is very crowded. If you want to create some kind of massive multiplayer “World of Warcraft” kind of game, you would have to divide you world into separate rooms. Note that room is just a concept, it doesn’t have to be a place with 4 walls, so you can just say “every 10 meters is a new room”.

So remember in the previous examples, the handleConnect function had a line like this:

client.multiplayer.createJoinRoom(roomName,roomType,true,{},{},onJoin,handleError);

The roomName was always hardcoded as Paris, but let’s say now you can have more than one room for your game. You would want a way to list them all. For that, use the following code:

private function listRooms(roomType:String):void {
client.multiplayer.listRooms(roomType,{},100,0,onListRooms);
}

private function onListRooms(array:Array):void {
   for each(var room:RoomInfo in array) {
      // code to display room
}
}

The name of the room is room.id, which can be used as a parameter for roomName when calling createJoinRoom. Also note that you can call joinRoom instead of createJoinRoom since the room already exists.

 

STEP 2 – Filter list

One thing that could be useful is to filter the list of rooms by some parameters. Perhaps the lobby includes different games or different types of games, where the play can choose which one to join. For that, you need to make sure the room has enough information when it gets created. Change the createJoinRoom call as follow:

client.multiplayer.createJoinRoom(roomName,roomType,true,{game:"MyGameType"},{},onJoin,handleError);

Now, when you list the room in the onListRooms function, the room object will have the game type saved as room.data.game.

private function onListRooms(array:Array):void {
   for each(var room:RoomInfo in array) {
      trace(room.id,"type is:",room.data.game);
}
}

Adding a parameter to the room also allows you to filter by game types on the server side when listing the room. For that, you will need to change a setting by going on the Player.IO (aka yahoo game network) web page.

First, navigate to your game inside the [My Game] section, and click on [Multiplayer] in the sidebar on the left. Then click settings, and enter “game” as one of the Search Columns. Now when you call listRooms, you can filter by game type:

private function listRooms(roomType:String):void {
client.multiplayer.listRooms(roomType,{game:"MyGameType"},100,0,onListRooms);
}

To see a demo of a lobby with the Tutorial, DrawingBoard and Shoot-Em-Up example, click here.

As a reminder, the source code for all the examples in this tutorial is on GitHub.

This is it for now. I hope you enjoyed this tutorial. Eventually, to produce better multiplayer games, you will need to work on the server side, so I might produce another tutorial at a later time.

Meanwhile, check out this flash game that uses Player.IO, released online and on both Apple App Store and Google Play store:

Blink Pong (Android, IPhone/iPad, Source code on GitHub)

 


part 1 ] – [ part 2 ] – [ part 3 ] – [ part 4 ]

Advertisements

About jacklehamster

Technocraft and internet developer

Posted on June 10, 2014, in Flash, Game Development, Making Games, PlayerIO Tutorial and tagged , , , , , . Bookmark the permalink. 4 Comments.

  1. Awesome tutorial! It’s great to see people still making awesome things with the flash platform. I think mmo browser games are an area of interactive media where flash completely dominates. I am using this playerio sdk too ever since Electroserver was bought and shut down. I’m considering making some tutorials myself 🙂

  1. Pingback: TUTORIAL – Create realtime multiplayer games using Player.IO (PART 1 – Server) | Jack

  2. Pingback: TUTORIAL – Create realtime multiplayer games using Player.IO (PART 2 – Client) | Jack

  3. Pingback: TUTORIAL – Create realtime multiplayer games using Player.IO (PART 3 – Game example) | Jack

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: