Get the full commented source code of

HTML5 Suika Watermelon Game

Talking about Poux game, Flash and Game development.

November 22nd update: part 3 released
November 28th update: Finished project released

Ok… this is the quickest prototype update ever. Yesterday I came with the Prototype of a Flash game like Poux, a bit incomplete because you could merely watch tiles grow.

It was a 50 lines prototype, and today I am publishing the second part, with another 50 lines (now we have 100 lines and an almost complete game!).

Now you can use your mouse to click on contiguous same colored tiles to remove them.

Light, camera, actionscript:

// declaration of the array that will contain the game
field = Array();
// number of frames to pass before inserting a new row
interval = 50;
// tiles placed so far
tiles_placed = 0;
// loop that initializes the field
for (x=0; x<10; x++) {
	field[x] = Array();
	for (y=0; y<10; y++) {
		field[x][y] = 0;
	}
}
// function that places a line of tiles in the bottom of the field
function place_line() {
	for (x=0; x<10; x++) {
		tiles_placed++;
		// if the spot is not empty, must shift the colum
		if (field[x][0] != 0) {
			push_blocks(x);
		}
		tile = attachMovie("tile", "tile_"+tiles_placed, tiles_placed, {_x:10+32*x, _y:300});
		num = Math.floor(Math.random()*8)+1;
		tile.gotoAndStop(num);
		field[x][0] = tiles_placed;
	}
}
// function to be executed at every frame
_root.onEnterFrame = function() {
	interval--;
	if (interval == 0) {
		interval = 50;
		place_line();
	}
};
// function that shifts the column of blocks
function push_blocks(col_number) {
	for (i=9; i>=0; i--) {
		if (field[col_number][i] != 0) {
			if (i != 9) {
				field[col_number][i+1] = field[col_number][i];
				_root["tile_"+field[col_number][i]]._y -= 32;
			} else {
				// if I have more than 10 blocks in a column, remove the 10th block
				// In a normal game, it would be "game over"
				_root["tile_"+field[col_number][i]].removeMovieClip();
			}
		}
	}
}
// when the player clicks...
onMouseDown = function () {
	// obtain tile clicked according to mouse position
	x_tile_clicked = Math.floor((_root._xmouse-10)/32);
	y_tile_clicked = -Math.floor((_root._ymouse-300)/32);
	if ((x_tile_clicked>=0) and (x_tile_clicked<=9) and (y_tile_clicked>=0) and (y_tile_clicked<=9)) {
		if (field[x_tile_clicked][y_tile_clicked] != 0) {
			remove_tiles(x_tile_clicked, y_tile_clicked, 1);
			update_field();
		}
	}
};
// removing tiles of the same color of the one clicked
function remove_tiles(tx, ty, clicked) {
	// checking tile color according to its current frame
	tile_type = _root["tile_"+field[tx][ty]]._currentframe;
	// check if the tile to remove is the one you clicked. In this case, wait to have at least two tiles to remove
	if (!clicked) {
		_root["tile_"+field[tx][ty]].removeMovieClip();
		field[tx][ty] = 0;
	}
	if ((field[tx+1][ty] != 0) and (_root["tile_"+field[tx+1][ty]]._currentframe == tile_type)) {
		remove_tiles(tx+1, ty);
	}
	if ((field[tx-1][ty] != 0) and (_root["tile_"+field[tx-1][ty]]._currentframe == tile_type)) {
		remove_tiles(tx-1, ty);
	}
	if ((field[tx][ty+1] != 0) and (_root["tile_"+field[tx][ty+1]]._currentframe == tile_type)) {
		remove_tiles(tx, ty+1);
	}
	if ((field[tx][ty-1] != 0) and (_root["tile_"+field[tx][ty-1]]._currentframe == tile_type)) {
		remove_tiles(tx, ty-1);
	}
}
// update the field, making tiles fall if bottom tiles disappear
function update_field() {
	for (i=0; i<10; i++) {
		for (j=1; j<10; j++) {
			if ((field[i][j] != 0) and (field[i][j-1] == 0)) {
				falling = j-1;
				while ((field[i][falling] == 0) and (falling>=0)) {
					field[i][falling] = field[i][falling+1];
					_root["tile_"+field[i][falling+1]]._y += 32;
					field[i][falling+1] = 0;
					falling--;
				}
			}
		}
	}
}

The scripts has some comments so it shouldn’t be too hard for you to understand how things work.

Now try to click on contiguous tiles…

A game in only 100 lines (comments included). Tomorrow I’ll add 100 more lines coding some powerups and other weird things and I’ll have my second one-day game to continue my experiment.

Take the source code… see you… and read part 3

Never miss an update! Subscribe, and I will bother you by email only when a new game or full source code comes out.