PathFinder
HTML
Tempo de execução: <span id="time"></span> <br />
<canvas id="map">
</canvas>
CSS
#time {
font-weight: bold;
}
JavaScript
var mapObj = [];
var mapX = 10;
var mapY = 10;
var tileSize = 20;
var prob = 0.2;
var player = {
x: 0,
y: 0
};
var path = [];
var canvas = document.getElementById("map");
var ctx = canvas.getContext("2d");
var initMapObj = function() {
$("#map").attr("height", mapY * tileSize);
$("#map").attr("width", mapX * tileSize);
for (var y = 0; y < mapY; y++) {
mapObj[y] = [];
for (var x = 0; x < mapX; x++) {
var b = '';9
if ((x % 2) != 1) {
if(y==0 || y==9){
b=false
}else{
b=true
}
}
else {
b=false
}
if( x % 2 == 0 ) {
if(y==0 || y==9){
b=false
}else{
b=true
}
}
mapObj[y][x] = {
block: b
};
}
}
mapObj[0][0].block = false;
};
var draw = function() {
ctx.fillStyle = "#FFFFFF";
ctx.fillRect(0, 0, mapX * tileSize, mapY * tileSize);
for (var y = 0; y < mapY; y++) {
for (var x = 0; x < mapX; x++) {
if (mapObj[y][x].block) {
ctx.fillStyle = "#000000";
ctx.fillRect(x * tileSize, y * tileSize, tileSize, tileSize);
} else {
ctx.strokeStyle = "#000000";
ctx.lineWidth = 2;
ctx.strokeRect(x * tileSize, y * tileSize, tileSize, tileSize);
}
}
}
// Player
ctx.fillStyle = "#0000FF";
ctx.fillRect(player.x * tileSize, player.y * tileSize, tileSize, tileSize);
// Path
for (var i in path) {
ctx.fillStyle = "#FF0000";
ctx.fillRect(path[i].x * tileSize, path[i].y * tileSize, tileSize, tileSize);
}
};
$("#map").click(function(e) {
var offset = $(this).offset();
x = e.pageX - offset.left;
y = e.pageY - offset.top;
x = (x - (x % tileSize)) / tileSize;
y = (y - (y %...