Persistent Browser-Based Games Blog

Tip of the Week

Here’s the ‘tip of the week’! (Even though there hasn’t been a new post in weeks :P)

Do you want to display item/unit/building information on your PBBG, but find that your tables are getting too big, and your divs are cluttering up the page? Use tooltips to display this information in a compact and stylish way!

There are several ways to do this, and of course you can customize your tooltips so they fit right into your PBBG. There are already a few javascript libraries available on the internet which will allow you to use tooltips easily, so I will introduce two of these libraries. If you don’t like them, I’m sure there are more on the Internet!

BoxOver
This is a javascript library that is used by Google on Google Sites (read more about BoxOver on its wikipedia article). Unfortunately, at the time of writing the official BoxOver website is not available. I did find a copy of the Javascript file however. With this library, you set all the tooltip texts/header/styles/other options by using the title attribute in your HTML tags, so it is possible to use these tooltips on many HTML elements.
Examples: http://www.norfolk.gov/cultural_affairs/boxover/example.html

Walter Zorn Tooltip
This library is a bit more advanced than the BoxOver library, and allows you to write your own extensions to create amazing tooltips! However, it may be slightly harder to use/set up, as you must use the onmouseover and onmouseout triggers to display/close tooltips.

Here are some ideas you might want to try out when using tooltips:

• Create your own tooltip! Make it match your game’s style and theme so it will be unique!
• You could also try using AJAX to directly fetch information from a database, so that the information you present will never be out of date and will require little maintenance!
• Use HTML! The libraries I introduced above allow HTML in the actual tooltip text, so don’t hesitate to add images and tables.

Posted in PBBG Coding, PBBG General | Related Content | 5 Comments »

Call for Collaboration

A Call for Collaboration

The idea of sharing characters, objects and user information across multiple games and environments has always interested me.

I’ve got a simplistic idea on how this could be done and wanted to share it.

Some assumptions:

Let’s assume we have 3 environments (games) Game A, B and C. They are similar in some concepts and vastly different in others.

Let’s assume we have one user, Joe, who wants to play in all three environments.

Step 1:

Joe signs up for Game A and plays it. All information is stored within Game A as normal.

When Joe logs out of Game A. He is given a url that will contain all his information.
www.GameA.com/userInfo.php?userID=10

Next Step:

Joe now wants to play Game B. He has the option of entering in his url or registering as normal.

Once given a url Game B will request Joe’s information from Game A.

Game A will response with pair values, like so:

UserName=Joe
Email=joe@somewhere.com
Score=1000
Money=500
CharacterName=Killer
CharacterHP=50
CharacterMagic=40
etc…
etc…

Game A will also record the fact that Game B requested information. This will come into play when Joe goes back to playing Game A.

Game B will take the values it can use and create/update Joe’s account within it’s game environment. Such as UserName, Score and Money. (Maybe this game does not have characters)

Next Step:

Joe is done playing Game B. As he logs out he is given the opportunity to get a new URL or he can update Game A.

If Joe decided to update Game A, Game B will send a request to Game A letting it know the url it can find an update at.
www.GameB.com/userInfo.php?userID=99

Game A will go to that url and process all of Joe’s information, updating it’s stats as needed.

Thoughts:

One of the advantages of this system is that if Site A were to disappear or be unavailable, Joe still retains all the information from Game B. It’s even possible for him to save information from Game A, if the site does disappear, if Game B has it saved.

For those who are worried about malicious use of the system, it would be quite easy to code the update process to only allow updates from certain game sites. If you did not want to see updates from Game C, you could exclude that site from your updates by looking at the request url.

Alternatively someone could offer a service where “trusted” games can exchange information.

The user information could be in an XML document, but I have found that the ease with which you can build key pair values is easier to build and search then XML documents. I know the advantages, I personally don’t think the advantages out weigh the disadvantages in this case.

This is a stab in the dark any thoughts and comments are appreciated.

mobeamer

www.BattleForcesOnline.com
blogspot.mobeamer.com
I am no author but I do have somethings to share.

Posted in Game Ideas, PBBG Coding, Theory | Related Content | 5 Comments »

Formatting User-Submitted Text

If you are a PHP and/or a PBBG developer, then I’m sure you know about the problems associated with user-submitted text. If not sanitized properly, your website could be the victim of XSS attacks and SQL injections. In this article I will discuss what methods I use to protect my sites.

nl2br()

PHP already has several useful functions that can be used to sanitize strings. The first function I want to talk about is nl2br(). It doesn’t really help in security, but it is great for readability when you need to display stuff. It inserts a br tag at the end of each new line.

When it should be used: This tag should only be used when data is being displayed in a non-editable form, such as in a forum or a user profile. When it is displayed in an editable form such as a textarea, or when it is being added into the database, you don’t want to use this function because you want to preserve the original text. If the text is being edited by a user, they might be wondering why there are suddenly HTML tags all over their text.

strip_tags()

If you want to get rid of HTML in text, you can use this function. strip_tags() will attempt to remove all HTML and PHP tags. You can also set which tags to allow! However, this function is not reliable, and can have unwanted side-effects. Even if you allow only ’safe’ tags, attributes of HTML tags will not be altered, and can still be dangerous by adding attributes such as ‘onmouseover’.

When it should be used: If you really are not picky about security, you could use this function as a very primitive form of removing HTML whenever the formatted text is being inserted into the database. There is no need to ‘only’ use this function when the text is being displayed to the user, since the HTML tags are not meant to be preserved, but removed permanently. However, this function still cannot protect you from SQL injections or XSS attacks.

htmlentities() and htmlspecialchars()

If you don’t want to remove the HTML tags, but instead display them, you can use either of these functions. They will convert characters into their corresponding HTML entities. The difference between the two functions is that htmlspecialchars() will only convert a limited set of characters (see PHP manual), while htmlentities() will attempt to convert everything.

When it should be used: These functions should be used when the text is being displayed, not processed, for the same reasons as for nl2br() - you’ll probably want to preserve the original text. Remember to add ENT_NOQUOTES as a parameter of the functions to convert double and single quotes.

addslashes()

This function will add backslashes to text to escape all quotes and backslashes.

When it should be used: addslashes() should be used on GET/POST/REQUEST/COOKIE data if magic_quotes_gpc is off. If it is on, backslashes will be added automatically. addslashes() should be used when you are inserting data in the database. This function is useful because it escapes quotes, which could potentially break out of any SQL queries you run with the original data.

stripslashes()

stripslashes() will remove backslashes from your message. Double backslashes will become a single backslash.

When it should be used: stripslashes() should be used on all GET/POST/REQUEST/COOKIE data if and only if magic_quotes_gpc is on and you want to display that data immediately. Otherwise, stripslashes() should be used when you are displaying data from the database which have already had their quotes escaped (with addslashes() or magic quotes).

mysql_real_escape_string()

This function is supposed to take care of SQL injections. It will escape all special characters in any values/queries that you pass a parameter.

When it should be used: This function should be used when you are inserting user-submitted text into the database. This function should not be used in conjunction with addslashes(). Any quote escaping will be done automatically by this function. I haven’t personally used this function before so I don’t know how effective it is.

HTMLPurifier

HTMLPurifier is a library for cleaning up HTML. You choose which tags to allow, or none at all, and the library will take care of the rest. I like to think of this as an advanced and more useful strip_tags() function.

When it should be used: HTMLPurifier’s functions should be used whenever data is being processed and added into the database, so that when the text is displayed, there won’t be any faulty code or hidden HTML tags. HTMLPurifier is very useful for protection against XSS attacks, and is also very flexible, allowing your users to use HTML tags safely.

Of course, these aren’t the only solutions available! There are plenty of other functions, and you could also make your own functions to sanitize strings.
If you have your own methods of sanitizing user-submitted text, please leave a comment and share your methods with us!

Posted in PBBG Coding | Related Content | 2 Comments »

2 Non-PHP PBBGs

So many browser games are written in PHP that it is easy to forget that they can be built in any language. PHP has great features for web game development and it is widely available, but it is not the only option out there.

To make this point (and as a shameless plug) I want to mention two : my game WMD Tank Battle, a multiplayer conquest game written in Perl, and RangerSheck’s Pioneers of Aethora, a tactical RPG written in Ruby on Rails.

Perl and mod_perl are old workhorses of the web, and Ruby on Rails is the latest greatest world-changing web framework, but both games make heavy use of shiny techniques like AJAX to minimize page loading and provide other features - Aethora has a built in chat, and uses the Prototype and Scriptaculous libraries for a great tactical map and drag/drop inventories. WMD Tank Battle uses CSS Sprites and javascript vector graphics for silly 2d animation and a real-time “missile command” game.

There are others around too - Urban Dead is one of the most popular web games ever and it’s sporting the “.cgi” extension. Know any other good ones ? Please comment!

Posted in PBBG Websites | Related Content | 3 Comments »

MyMiniCity

Want to create your own city? MyMiniCity allows you to do just that!

MyMiniCity is a simple ‘game’ where you can pick a country, name your city and start getting people to click on your link. Every time somebody clicks on your link, your city will increase in population, and so your city grows. As your city becomes bigger, you get more links to manage unemployment, transport, crime and pollution, so just getting citizens isn’t enough!

Your city is ranked against other cities in the same country, and the largest cities have huge skyscrapers and buildings, while you start off with a simple house in the middle of nowhere. As your city grows, so will its land, and more buildings will be added, and older buildings will become bigger.

There isn’t really any skill involved in the game, except a skill of getting people to click your links. You can check in from time to time to see how your city is doing.

To see a demo of what MyMiniCity is like, I registered a city called PBBG Blog. You can view it here: http://pbbg.myminicity.com/

Posted in PBBG General, PBBG Websites | Related Content | No Comments »