NuclleaR,
ну алгоритм примерно
такой 
<!DOCTYPE HTML>
<html>
<head>
<title></title>
<style type="text/css">
td{
height: 22px; width: 22px; text-align: center;
}
</style>
</head>
<body>
<script>
for (var m = [], z = [[1, 1]], l = 7, k,v = 0,
b = ["background-color: #FFFF00;", "background-color: #FF00FF;", "background-color: #00FF00;", "background-color: #FF0000;"],
t = document.createElement("table"), c = 0; c < l; c++) {
var tr = t.insertRow(c);
m[c] = [];
for (var s = 0; s < l; s++) {
k = 1;
if (c == 0 || c == l - 1 || s == 0 || s == l - 1) k = 0;
var td = tr.insertCell(s)
td.style.cssText = b[k];
k && (td.innerHTML = ++v)
m[c][s] = k
}
}
document.body.appendChild(t);
t.rows[z[0][0]].cells[z[0][1]].style.cssText = b[3];
var p = [
[0, 1],
[-1, 0],
[0, -1],
[1, 0]
],
v = 0, end = 4;
function go() {
n = [z[0][0] + p[0][0], z[0][1] + p[0][1]];
if (m[n[0]][n[1]] == 2) {
end = 4;
m[n[0]][n[1]] = 3;
t.rows[n[0]].cells[n[1]].style.cssText = b[3];
z.unshift(n)
} else if (m[n[0]][n[1]] == 1) {
end = 4;
m[n[0]][n[1]] = 3;
t.rows[n[0]].cells[n[1]].style.cssText = b[3];
z.unshift(n);
d = z.pop();
m[d[0]][d[1]] = 3;
t.rows[d[0]].cells[d[1]].style.cssText = b[1];
t.rows[d[0]].cells[d[1]].innerHTML = ++v
} else if (m[n[0]][n[1]] == 0 || m[n[0]][n[1]] == 3) {
p.push(p.shift());
end--
}
end ? setTimeout(arguments.callee, 300) : (t.rows[z[0][0]].cells[z[0][1]].innerHTML = ++v,alert("Game over"))
};
</script>
<input type="button" name="" value="go" onclick="go()"/>
</body>
</html>