Halhan Development #1: The mapping system (An RPG written in PHP/Javascript)

The mapping of system in Halhan has several parts which all work together to create a unique experience, first off we have our current position in the world unique for each player. This is dictated by the variables north, east, south, and west. These coordinates determine where the player is located in the world, such as as a town, a mine, or traveling through the forest! each of these rows in the database have unique coordinates, and each contain the data to draw the 2d map! For example: (0n,0s,0e,0w) is the starting point for all new players. These coordinates would be a row in the database containing a description of the location, a name such as "Halibon City" or "Route 2", we're using the coordinates for the location, 0,0,0,0 in this example.

A sneak peak at some of the world map currently in development

0,0,0,0 is the starting point for all new players, it is also our first row in our 'location' table, and looks something like this:

Name: Halibon City
Description: The city of Halibon is a thriving area that is well protected by its walls and guards, much commerce seems to be taking place inside the city walls.
north: 0
south: 0
east: 0
west: 0
map: A multi dimensional array containing the 2d map exported from the map maker "Tiled".

The results looking something like this:

As you would expect, we want this data when the game loads, so once the document has been loaded and the games tile set has been pre loaded, we make an ajax request to our game server, and once the map data we need is returned, we're then able to draw the map! The location.php server code is quite simple and only needs to be called upon each time the player moves North, South, East, or West thus changing their coordinates. Changing coordinates in any direction is throttled to the exact time it takes me to move from one side of the map to the other, thus rendering any speed hackers etc futile., I used to bot on Runescape for years, so my bot prevention techniques will be fairly advanced, and there is zero tolerance for botting.

---

The next part of our mapping system is the real-time multiplayer movement, this allows you to see everyone else moving on the map, to do this we use websockets that keep track of yours, and other players x,y location on the map. I think this adds a lot to the game as it gives you the ability to travel with other players, start trades, initiate duels, and work together on quest in real time.

I will be going in depth on this part of the project in part 2!

I enjoy writing these logs as it lets me grasp everything much more when I go over it again in my head, So I will continue to keep you guys in the loop as far as development like this, and you will be able to learn a thing or two and maybe even start your own game with what you've learned!

Here's a list of resources:
ratchet websockets library for real time player movement
enchant.js is a 2d graphics library with built in s upport for 2d maps
Jquery is used for all ajax calls in the game, as well as
several other aspects of Halhan such as the inventory and in-shop carts etc.
w3.css is a simple css library that allows you to easily make mobile friendly layouts.

follow us! @goldpieces