$(document).ready(function()
		{
			var hexSideLength = 30;

			var r = Raphael("map", 1024, 768), i, j, map = [], current = {};

			var centerPixel;

			var Position = function(x, y)
			{
				this.x = x;
				this.y = y;
			};

			var Pixel = function(x, y)
			{
				this.x = x;
				this.y = y;
			};

			var Hexagon = function(x, y, sideLength)
			{
				this.position = new Position(x, y);
				this.sideLength = sideLength;

				var hexA, hexB, hexC;
			};

			Hexagon.prototype.draw = function()
			{
				var hexA, hexB, hexC;

				this.hexC = this.sideLength;
				this.hexB = (Math.sqrt(3) / 2) * this.hexC;
				this.hexA = 0.5 * this.hexC;

				hexA = this.hexA, hexB = this.hexB, hexC = this.hexC;

				this.getCenterPixel();

				return r.path(
					"M" + (this.position.x * (hexA+hexC)) + " " + (768-((this.position.y * 2+2-this.position.x) * hexB)) +
					"l" + hexA + " " + (-hexB) +
					"l" + hexC + " 0" +
					"l" + (hexC - hexA) + " " + hexB +
					"l" + (hexA - hexC) + " " + hexB +
					"l" + (-hexC) + " 0" +
					"Z");
			};

			Hexagon.prototype.getCenterPixel = function()
			{
				this.centerPixel = new Pixel(
					(this.hexC+this.position.x * (this.hexA+this.hexC)),
					(768-((this.position.y * 2+2-this.position.x) * this.hexB))
				);
			};

			var randomInt = function(min, max)
			{
				return Math.floor(Math.random() * (max - min + 1)) + min;
			};

			var colours = [
				"rgb(255, 000, 000)",	// red
				"rgb(000, 127, 000)",	// green
				"rgb(000, 000, 255)",	// blue
				"rgb(255, 255, 000)",	// yellow
				"rgb(255, 127, 000)",	// orange
				"rgb(127, 000, 255)"	// purple
			];

			for (i = 0; i < 8; i++)
			{
				map[i] = [];

				for (j = 0; j < 16; j++)
				{

					hex = new Hexagon(i, j, hexSideLength);

					current.shape = map[i][j] = hex.draw().attr({
						fill: colours[randomInt(0, 5)],
						"stroke-width": 1,
						"fill-opacity": 0.3
					}).hover(function()
					{
						this.attr({"fill-opacity": 1});
					}, function()
					{
						this.attr({"fill-opacity": 0.3});
					});

					r.text(hex.centerPixel.x, hex.centerPixel.y, hex.position.x + ", " + hex.position.y);
				}
			}
		});