Archive

Posts Tagged ‘Actionscript’

Tic Tac Whatsit

December 8th, 2009

Long days ago I spoke with a dentist of game demos, and of a festival dedicated to those. We talked of Ticktacktoe, a classic game of boxes and shapes – a boring, beatable game, but an easy one to program.
It’d be easy to program, right? We could probably make one with flash in less than thirty minutes, couldn’t we? At least one way to find out!

Yup. Sure could!

Ticktacwhatsit is made up of nine (9) blocks, and each can be either blank, an X, or an O. That’s so easy to represent in flash!

I started by making a symbol called called block which had two layers and three keyframes on one layer: blank, X, and O. On the other layer, i added the action stop(); to prevent it from flipping through the frames.

I dragged 9 instances of block onto the stage, and arranged them into a game board (named them in sequence) – and drew some lines between them.

And then I wrote the game code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
var boxes:Array = [ b0, b1, b2, b3, b4, b5, b6, b7, b8 ];
var nextSymbol:int = 0;
 
removeChild( done );
done.addEventListener( 'go_again', restart );
 
function restart( e:Event ) : void {
	nextSymbol = 0;
	for( var i:int=0; i < boxes.length; i++ ) 
		boxes[i].gotoAndStop( 1 );
	removeChild( done );
}
 
for( var i:int=0; i < boxes.length; i++ ) {
	boxes[i].addEventListener( MouseEvent.CLICK, onClick );
	boxes[i].buttonMode = true;
}
 
 
function onClick( e:MouseEvent ) : void {
	if ( e.currentTarget.currentFrame == 1 ) {
		e.currentTarget.gotoAndStop( nextSymbol+2 );
		if ( checkGame() ) {
			trace( 'won!' );
			done.gotoAndStop( nextSymbol + 1 );
			addChild( done );
		}
		nextSymbol = (nextSymbol+1)%2;
	}
}
 
function checkGame() {
	for( var t:int=0; t < possible.length; t++ ) {
		var val:int = boxes[possible[t][0]].currentFrame;
		for( var i:int=0; i < possible[t].length; i++ ) {
			if ( boxes[possible[t][i]].currentFrame != val || val == 1 )
				break;
			else if ( i == 2 )
				return true;
		}
	}
	return false;
}
 
 
var possible:Array = [
		[ 0, 1, 2 ],
		[ 3, 4, 5 ],
		[ 6, 7, 8 ],
 
		[ 0, 3, 6 ],
		[ 1, 4, 7 ],
		[ 2, 5, 8 ],
 
		[ 0, 4, 8 ],
		[ 2, 4, 6 ]
	];

So the main idea is that we have a bunch of boxes and whenever one of them gets clicked, we may have to do something. I added each of the boxes to an array (line 1), so I could easily loop through them all (line 14), and set the buttonMode and add an onClick event handler to each. A true buttonMode tells flash to display the little hand when you mouseover the object.

The main processing is done whenever you click a block, and the onClick event handler starts on line 20. That’s really all there is to the game, the rest of the stuff are just extras.

The mouse event is passed as a param to the event handler. Its currentTarget property represents the object clicked, which in this case is one of the blocks.
The first test to do on that block is see if it’s empty. If it’s not empty, there’s nothing for us to do.
A block is empty if it is still on its first frame, which is where currentFrame comes in. If it’s not on its first frame it’s either an X (frame 2) or an O (frame 3).

If it is empty, I need to either fill it with an X or an O, whichever wasn’t used last. For this, I have the nextSymbol variable, which is only ever either a 0(X) or a 1(O). I set the block using its gotoAndStop function, passing it the frame we wish it to change to.

After that, I just check if a player has won!
I was pretty lazy about checking; I made a list of every possible victory combination (line 46), and check each of those (line 32) to ensure all the squares in each aren’t on the same frame, or on frame 1 (line 36).

Done!

Line 28: I wonder why I did nextSymbol = ( nextSymbol + 1 ) % 2; instead of nextSymbol ^= 1; Laziness?

Dev, Uncategorized, being helpful to people less experienced than myself in the ways of the world; mostly in the ways of the web actually , , ,

Poseidon Plumbing

October 13th, 2009

Poseidon Plumbing (I didn’t make the website) is a local plumbing company that ordered some business cards and was not altogether pleased with what they received. They asked that I design them some new cards using their existing logo, and sent a copy of their current card design for reference:

 

 

 

The first thing I wanted to do was clean up the logo. I manually redrew the Ps, adjusted their spacing and colour, and left off the stroke. Which I think lends it a simpler, cleaner look.

I added the company name, and defined a faint gradient for it and the P in the foreground.

 

I made versions for both light, and dark backgrounds.

 

 

 

Scott liked the back of my card and wanted something like it for his own, but which conveyed the idea of water. I guess plumbers deal a lot with water, I don’t know.

I rewrote my business card viewer, using the Altered Effect Actionscript 3 library I’ve been developing, to make presenting the card easier and more effective:


( click to flip )


Cards may appear blurry in the viewer, but such behaviour is expected. Flash rasterizes as soon as you rotate about the Y axis.
The bubbles on back of the card are a spot gloss; the background is the same colour, but shiny in those spots.

 


I’ve included some JPGs, which will be slightly clearer, though they are similarly small. To be perfectly honest, they are the source images used by the flash viewer.

Tomorrow I’ll get them printed.

 

 

Business ,

function race 001!

September 28th, 2009

One day for fun, Karl and I thought up few different ways to accomplish the same thing. That sort of thing is fun. No, it’s fun.

I decided to compare two of them for speed. The range and domain of both functions are {1,2,3}.

Method A
Based on a table.
function( a:int, b:int ) : int {
   var c:int = a^b;
   return c ? c : a;
};

Mathod B
Based on the same table, but karnaugh-mapped, circuit-design style.
function( a:int, b:int ) : int {
   var a0:int = a&1;
   var a1:int = (a&2)>>1;
   var b0:int = b&1;
   var b1:int = (b&2)>>1;
   return ((( a0&~b0 | (~a0)&b0 | a1&b1&b0 )<<1 ) | ( b1&~a1 | a1&~b1 | a1&a0&b0 | (~b0)&~a0 ))&3;
};

Method A is always faster than Method B (except sometimes in firefox for some reason) on my computer, but the difference is minimal (like .5%). There are obviously little ways in which we can tweak the algorithms. For example: we could not declare a0, a1, b0, and b1 every single time.

Function Racer
Click on it to start the race. Click off of it to stop the race.
The number below each method is the number of milliseconds consumed for the total operations performed (above the methods).
The operation size (at the top) is scaled to keep the framerate between 29 and 32.

Uncategorized , ,

Set 1: There may be bugs

September 21st, 2009

A game called Set, to which I was recently introduced, got me thinking about algorithms. A lot.
In particular, set finding algorithms.

I found in myself the desire to program a set player, but what use is a set player without a game to set? It is of little use, my friend.

Here’s an example with a single human player. Mouse over it to enlarge.

Next step? Write a player and get shaun to write one – AND MAKE THEM COMPETE.

Dev , , , ,