var i = 0,
		sideLength = 25,
		tileSize = 7, 
		borderTiles = 10,
		backColor = 'rgb(0,200,200)', // background color
		dataStr = [];  // frame data

/* add frames as needed */
dataStr[0] = '0000000000000000000000000000000000000000000000000000000000000000111000000000000000000001113310000000000000000001222133100000000000000001222221111000000000000000122222133210000000000000132222221121000000000000013225444224100000000000111325441151410000000001133312544115141000000001222333155444545100000001222233133511115100000000122211133332555111000000012221213333311122210000000111212312332222221000000122111223123222222100000122221322221111111100000122222333222233310000000012212233311133322100000000111122310001222210000000000001110000122211100000000000000000122222221000000000000000011111111100000000000000000000000000000';

dataStr[1] = 
'0000000000000011100000000000000000000111331000000000000000000122213310000000000000000122222111100000000000000012222213321000000000000013222222112100000000000001322544422410000000000001132544115141000000000001331254411514100000000001333125544454510000000001333331251111510000000000133313315555510000000000001222133111111000000000000122221133331210000000000001221221331221000000000000012222121111000000000000000122121310000000000000000001133131000000000000000001133311000000000000000001222221000000000000000001222221000000000000000000122211100000000000000000001222221000000000000000000011111100000000000000000000000000000000000';

dataStr[2] = 
'0000000000000000000000000000000000000000000000000000000000000001110000000000000000000011133100000000000000000012221331000000000000000012222211110000000000000001222221332100000000000111322222211210000000001133132254442241000000001213313254411514100000001222133125441151410111001222213312554445451122210122213133125111151012221012221313331555551311222100111331233311111333222100000113122233333133222100000122112222223101322100000122221122333100011100000122222311233331000000000012212233311333210000000000111123310133321000000000000001110012222100000000000000000001222111000000000000000001222222210000000000000000111111111000000';

/* convert frame data*/
for (var j = 0; j < dataStr.length; j++) {
 dataStr[j] = dataStr[j].split("");
}

/* Animation colors; Be sure to provide as many values as indicated in frames; 
Index 0 is always the background color. */ 
var mapColor = function (pixel) {
  var theColors =[backColor,'rgb(0,0,0)','rgb(235,2,10)',
	'rgb(240,80,80)','rgb(255,239,213)','rgb(255,218,185)'];
	return theColors[pixel];
}

function setup() {
	var s = (sideLength + borderTiles * 2) * tileSize;
	createCanvas(s, s);
	noStroke();
	background(backColor);
}

function draw() {
	var pixel;
	// Retrieve next frame
	var mapArray = dataStr[i%2];
	
  	var offset = borderTiles * tileSize;
  	translate(offset, offset);

	for (var y = 0; y < sideLength; y++) { 
		for (var x = 0; x < sideLength; x++) {
			pixel = parseInt(mapArray[x + y * sideLength]);  
			fill(mapColor(pixel));
			rect(x * tileSize, y * tileSize, tileSize, tileSize);
  		}
	}
	
	i++;
 	frameRate(5);
}

var i = 0,
	sideLength = 25,
	tileSize = 7, 
	borderTiles = 10,
	backColor = 'rgb(0,200,200)', // background color
	dataStr = [];  // frame data

/* add frames as needed */
dataStr[0] = '0000000000000000000000000000000000000000000000000000000000000000111000000000000000000001113310000000000000000001222133100000000000000001222221111000000000000000122222133210000000000000132222221121000000000000013225444224100000000000111325441151410000000001133312544115141000000001222333155444545100000001222233133511115100000000122211133332555111000000012221213333311122210000000111212312332222221000000122111223123222222100000122221322221111111100000122222333222233310000000012212233311133322100000000111122310001222210000000000001110000122211100000000000000000122222221000000000000000011111111100000000000000000000000000000';

dataStr[1] = 
'0000000000000011100000000000000000000111331000000000000000000122213310000000000000000122222111100000000000000012222213321000000000000013222222112100000000000001322544422410000000000001132544115141000000000001331254411514100000000001333125544454510000000001333331251111510000000000133313315555510000000000001222133111111000000000000122221133331210000000000001221221331221000000000000012222121111000000000000000122121310000000000000000001133131000000000000000001133311000000000000000001222221000000000000000001222221000000000000000000122211100000000000000000001222221000000000000000000011111100000000000000000000000000000000000';

dataStr[2] = 
'0000000000000000000000000000000000000000000000000000000000000001110000000000000000000011133100000000000000000012221331000000000000000012222211110000000000000001222221332100000000000111322222211210000000001133132254442241000000001213313254411514100000001222133125441151410111001222213312554445451122210122213133125111151012221012221313331555551311222100111331233311111333222100000113122233333133222100000122112222223101322100000122221122333100011100000122222311233331000000000012212233311333210000000000111123310133321000000000000001110012222100000000000000000001222111000000000000000001222222210000000000000000111111111000000';

/* convert frame data*/
for (var j = 0; j < dataStr.length; j++) {
 dataStr[j] = dataStr[j].split("");
}

/* Animation colors; Be sure to provide as many values as indicated in frames; 
Index 0 is always the background color. */ 
var mapColor = function (pixel) {
  var theColors =[backColor,'rgb(0,0,0)','rgb(235,2,10)',
	'rgb(240,80,80)','rgb(255,239,213)','rgb(255,218,185)'];
	return theColors[pixel];
}

function setup() {
	var s = (sideLength + borderTiles * 2) * tileSize;
	createCanvas(s, s);
	noStroke();
	background(backColor);
}

function draw() {
	var pixel;
	// Retrieve next frame
	var mapArray = dataStr[i%2];
	
  	var offset = borderTiles * tileSize;
  	translate(offset, offset);

	for (var y = 0; y < sideLength; y++) { 
		for (var x = 0; x < sideLength; x++) {
			pixel = parseInt(mapArray[x + y * sideLength]);  
			fill(mapColor(pixel));
			rect(x * tileSize, y * tileSize, tileSize, tileSize);
  		}
	}
	
	i++;
 	frameRate(5);
}

Update main.js