At some point when programming you probably realized that collision testing every object in your game is rather inefficient. A better way is to group objects based on their physical location in the game, and only collision test the bounds of the whole group. A quadtree does this, and can be used in 2D games to greatly speed up both collision detection and rendering.

Say your level is comprised of blocks:



To collision test the player against that level, you collision test each of the six blocks. As the level grows, this eats up a lot of processing power.

With a quadtree, you split the blocks up into groups of up to four per node:




Continue reading...

Here's a basic guide on setting up an Apache server with PHP and MySQL on your Windows computer to use as a developer environment. Sure, you could just download WAMP, but where's the fun in that?

If you currently have IIS setup with MySQL, you can leave MySQL installed. You will want to remove IIS prior to installing Apache though. It would require configuring beyond the scope of this guide to use both IIS & Apache concurrently. To remove IIS, you will want to choose the "Add/Remove Windows Components" or similar link on your respective version of Windows, which would be in the "Add/Remove Programs" or "Programs and Features" control panel.

If you have PHP currently with IIS, you may also be able to leave it installed (and just reconfigure it using the original installer), but it is likely that the version you originally downloaded for IIS won't be the best one to use for Apache, or you may not have the installer anymore. I suggest uninstalling PHP and starting fresh.

Now to the setup:


Continue reading...

If your site accepts any form of user input, it's a good idea to understand the differences in newline characters between platforms and how to handle them (and it's just good to know in general). Say your site is running on a Unix host and receives comments or posts from Windows clients. Any HTML textarea form input sent from the Windows clients will contain newline characters that do not match those native to the Unix host. Likewise, if your site runs on a Windows host, the occasional Linux or Mac user will be sending non-native newline characters as well.

Here are the newline characters that each major system uses:

Platform	Line Break
Windows	\r\n (Carriage Return & Line Feed)
Unix/Linux/MacOS X	\n (Line Feed)
MacOS 9 and earlier	\r (Carriage Return)

Continue reading...

I couldn't think of an easy way to explain references (or pointers), so I'm going to jump right in with examples.

Create two array variables, but only assign values to one. Then assign the second one to the first:


What you've just done is created two array variables, array1 and array2, that both reference (point to) the same array. You can use either variable to access and edit the same array. Here is a test:


array1 and array2 are references to the actual array object that exists in memory.

Let's take the example one step further. Create another array and assign array1 to it:


Continue reading...

Here's a quick description of a unit vector for those that don't know. A unit vector is a vector with a magnitude (distance) of 1. The vector can be pointing in any direction, but the magnitude will always be 1. To get a unit vector from any old vector, you "normalize" that vector, which gives you a new vector with the same direction but a magnitude of 1. Unit vector and normalized vector are often used interchangeably.

Take a look at this graph. Notice that while (1,0) is a unit vector, (1,1) is not. Think about the actual length of the line (it's magnitude) and you'll understand why (1,1) is not a unit vector.


Continue reading...

When working with BitmapData and copyPixels, you'll quickly run into the limitation of not having an alpha attribute with which to change the transparency level of objects. If you're like me, you started out using Sprite and MovieClip in your games and could easily fade-in or fade-out objects using the alpha attribute. Unfortunately, BitmapData does not have the alpha attribute, so how do you adjust transparency dynamically while using copyPixels?

You could create several versions of every image at different transparency levels. This is very tedious and will result in more file size and memory usage. Another way is to use a separate transparent BitmapData mask and apply it to any image that you want transparent.

Continue reading...

Creating semi-transparent BitmapData in ActionScript 3 is done using an ARGB hexadecimal value (32-bit). ARGB stands for Alpha-Red-Green-Blue and is just like an RGB hex value but with an alpha level at the beginning. Due to the alpha level, ARGB hex values are 8 hex digits and not 6. If you aren't familiar with hexadecimal, I suggest reading up on it before continuing.

In the alpha level, 00 represents fully transparent and FF represents fully opaque (visible). For example, to create a fully opaque black, you would use FF000000 (0xFF000000). To create a semi-transparent black, you could use AA000000 (0xAA000000).

Continue reading...

JSON stands for JavaScript Object Notation. It is a widely-used model for transferring variable data as text, and is often used in combination with AJAX to create the basis for highly-interactive, portable, and modular websites (Facebook, Twitter, etc).

If you are familiar with JavaScript objects, then you already know JSON! If you aren't, it is very easy to learn. A JavaScript object is just like an object in ActionScript 3 or an associative array in PHP, just with slightly different syntax.

Here is the basic syntax for JSON. This object contains two strings, an array, and an object:



Continue reading...

In a nutshell, AJAX allows you to update parts of a page with server-side content using JavaScript, without reloading the whole page. AJAX is not a new language, it's just a method for using JavaScript to achieve this functionality.

To use AJAX you will need to know a bit of JavaScript and (for this example) PHP, and have a server that can parse PHP. If you don't have this, you can download Apache server and PHP for free from their respective websites (follow my guide on setting up Apache, MySQL, and PHP on Windows).

Before diving into AJAX, first take a look at this example:



Continue reading...

Many websites have a print link that opens up documents in a separate window with special formatting for print. This works, but often times you can achieve the same result using CSS and the media="print" attribute. What I generally do is specify two external stylesheets, one for media="all" and one for media="print". For example:


Link tags should be between the head tags in your html.

The style_print.css document would contain tweaks that eliminate the website's layout and adjust dimensions to make the printed document look good. The end result is a cleanly printed document without requiring a separate page or forcing users to open up a new window/tab to print from.

There are other ways to implement a media declaration if you want to have inline css or all of it on a single css document. See W3Schools CSS Media Types for more information.