Pathfinding and walking the path
This commit is contained in:
Ian Gulliver
59
js/grid.js
59
js/grid.js
@@ -5,16 +5,18 @@ export class Grid {
|
||||
this.layers = new Map();
|
||||
this.masks = new Map();
|
||||
this.prnt = prnt;
|
||||
this.width = width;
|
||||
this.height = height;
|
||||
this.prnt.style.display = 'grid';
|
||||
this.prnt.style.gridTemplateColumns = `repeat(${width}, 1fr)`;
|
||||
this.prnt.style.gridTemplateRows = `repeat(${height}, 1fr)`;
|
||||
this.prnt.style.gridTemplateColumns = `repeat(${this.width}, 1fr)`;
|
||||
this.prnt.style.gridTemplateRows = `repeat(${this.height}, 1fr)`;
|
||||
this.prnt.style.backgroundImage = `url("images/${tileset}/land.svg")`;
|
||||
for (let i = 0; i <= layers.length; i++) {
|
||||
const name = layers[i];
|
||||
this.layers.set(name, new Layer(i * height, tileset));
|
||||
this.layers.set(name, new Layer(i * this.height, tileset));
|
||||
}
|
||||
for (const name of masks) {
|
||||
this.masks.set(name, new Mask(width, height));
|
||||
this.masks.set(name, new Mask(this.width, this.height));
|
||||
}
|
||||
}
|
||||
add_tile(tile_factory, x, y) {
|
||||
@@ -28,5 +30,54 @@ export class Grid {
|
||||
}
|
||||
return tile;
|
||||
}
|
||||
add_debug_tile(x, y, color) {
|
||||
const div = document.createElement('div');
|
||||
this.prnt.appendChild(div);
|
||||
div.style.gridColumnStart = `${x + 1}`;
|
||||
div.style.gridRowStart = `${y + 1}`;
|
||||
div.style.gridColumnEnd = 'span 1';
|
||||
div.style.gridRowEnd = 'span 1';
|
||||
div.style.backgroundColor = color;
|
||||
div.style.opacity = '0.3';
|
||||
div.style.zIndex = '1000000';
|
||||
}
|
||||
get_path(mask_name, src, dst) {
|
||||
const mask = this.masks.get(mask_name);
|
||||
const next = [];
|
||||
for (let x = 0; x < this.width; x++) {
|
||||
next.push(Array(this.height).fill(undefined));
|
||||
}
|
||||
// BFS
|
||||
const queue = [dst];
|
||||
while (queue.length) {
|
||||
const point = queue.shift();
|
||||
// Horizontal / vertical has to come before diagonal
|
||||
for (const [dx, dy] of [[-1, 0], [1, 0], [0, -1], [0, 1], [-1, -1], [-1, 1], [1, -1], [1, 1]]) {
|
||||
const check = [point[0] + dx, point[1] + dy];
|
||||
if (next[check[0]][check[1]]) {
|
||||
// Already visited
|
||||
continue;
|
||||
}
|
||||
if (!mask.mask[check[0]][check[1]]) {
|
||||
// Not allowed
|
||||
continue;
|
||||
}
|
||||
next[check[0]][check[1]] = point;
|
||||
if (check[0] == src[0] && check[1] == src[1]) {
|
||||
const path = [];
|
||||
let cur = src;
|
||||
while (cur[0] != dst[0] || cur[1] != dst[1]) {
|
||||
path.push(cur);
|
||||
cur = next[cur[0]][cur[1]];
|
||||
}
|
||||
path.push(dst);
|
||||
return path;
|
||||
}
|
||||
queue.push(check);
|
||||
}
|
||||
}
|
||||
// No valid path
|
||||
return [];
|
||||
}
|
||||
}
|
||||
//# sourceMappingURL=grid.js.map
|
||||
@@ -1 +1 @@
|
||||
{"version":3,"file":"grid.js","sourceRoot":"","sources":["../ts/grid.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAIjC,MAAM,OAAO,IAAI;IAKf,YAAY,IAAiB,EAAE,KAAa,EAAE,MAAc,EAAE,OAAe,EAAE,MAAgB,EAAE,KAAe;QAHhH,WAAM,GAAuB,IAAI,GAAG,EAAiB,CAAC;QACtD,UAAK,GAAsB,IAAI,GAAG,EAAgB,CAAC;QAGjD,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QAEjB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAC;QACjC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,mBAAmB,GAAG,UAAU,KAAK,QAAQ,CAAC;QAC9D,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,gBAAgB,GAAG,UAAU,MAAM,QAAQ,CAAC;QAC5D,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,eAAe,GAAG,eAAe,OAAO,aAAa,CAAC;QAEtE,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,MAAM,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YACvC,MAAM,IAAI,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;YACvB,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,EAAE,IAAI,KAAK,CAAC,CAAC,GAAG,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;SACvD;QAED,KAAK,MAAM,IAAI,IAAI,KAAK,EAAE;YACxB,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,EAAE,IAAI,IAAI,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC;SAC/C;IACH,CAAC;IAED,QAAQ,CAAC,YAAyB,EAAE,CAAS,EAAE,CAAS;QACtD,MAAM,IAAI,GAAG,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,YAAY,CAAC,UAAU,CAAE,CAAC,QAAQ,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC;QAEjF,sBAAsB;QACtB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,eAAe,GAAG,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC;QAC7C,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,GAAG,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC;QAC1C,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAEjC,KAAK,MAAM,CAAC,IAAI,EAAE,IAAI,CAAC,IAAI,IAAI,CAAC,KAAK,EAAE;YACrC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAE,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,CAAC;SAC1C;QAED,OAAO,IAAI,CAAC;IACd,CAAC;CACF"}
|
||||
{"version":3,"file":"grid.js","sourceRoot":"","sources":["../ts/grid.ts"],"names":[],"mappings":"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"}
|
||||
47
js/tower.js
47
js/tower.js
@@ -71,30 +71,6 @@ export function main() {
|
||||
grid.add_tile(tiles.BRIDGE_LR, 92, 52);
|
||||
grid.add_tile(tiles.BRIDGE_LR, 92, 36);
|
||||
grid.add_tile(tiles.BRIDGE_LR, 92, 20);
|
||||
function add_debug_tile(x, y, color) {
|
||||
const div = document.createElement('div');
|
||||
real.appendChild(div);
|
||||
div.style.gridColumnStart = `${x + 1}`;
|
||||
div.style.gridRowStart = `${y + 1}`;
|
||||
div.style.gridColumnEnd = 'span 1';
|
||||
div.style.gridRowEnd = 'span 1';
|
||||
div.style.backgroundColor = color;
|
||||
div.style.opacity = '0.3';
|
||||
div.style.zIndex = '1000000';
|
||||
}
|
||||
{
|
||||
const m = grid.masks.get('walkable').mask;
|
||||
for (let x = 0; x < m.length; x++) {
|
||||
for (let y = 0; y < m[x].length; y++) {
|
||||
if (m[x][y]) {
|
||||
add_debug_tile(x, y, 'orange');
|
||||
continue;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
add_debug_tile(118, 23, 'blue');
|
||||
add_debug_tile(44, 94, 'red');
|
||||
function rand(min, max) {
|
||||
return Math.round(Math.random() * (max - min) + min);
|
||||
}
|
||||
@@ -109,15 +85,30 @@ export function main() {
|
||||
grid.add_tile(tiles.FIREBALL_IMPACT, 62 + target_relative_x, 54 + target_relative_y);
|
||||
}, factory.duration);
|
||||
}, 3250);
|
||||
const greenaxe = grid.add_tile(tiles.GREENAXE, 60, 32);
|
||||
const path = grid.get_path('walkable', [118, 23], [44, 94]);
|
||||
const greenaxe = grid.add_tile(tiles.GREENAXE, 115, 18);
|
||||
greenaxe.play('walk');
|
||||
greenaxe.elem.style.transitionProperty = 'top,left';
|
||||
greenaxe.elem.style.transitionDuration = '25s';
|
||||
greenaxe.elem.style.transitionDuration = '0.5s';
|
||||
greenaxe.elem.style.transitionTimingFunction = 'linear';
|
||||
greenaxe.elem.style.top = '0';
|
||||
greenaxe.elem.style.left = '0';
|
||||
greenaxe.elem.style.transform = 'scaleX(-1)';
|
||||
setTimeout(() => greenaxe.elem.style.left = '-500%', 100);
|
||||
let prev = [118, 23];
|
||||
setInterval(() => {
|
||||
const next = path.shift();
|
||||
if (!next) {
|
||||
return;
|
||||
}
|
||||
if (next[0] - prev[0] < 0) {
|
||||
greenaxe.elem.style.transform = 'scaleX(-1)';
|
||||
}
|
||||
else if (next[0] - prev[0] > 0) {
|
||||
greenaxe.elem.style.transform = 'scaleX(1)';
|
||||
}
|
||||
prev = next;
|
||||
greenaxe.elem.style.left = `${(next[0] - 118) / 6 * 100}%`;
|
||||
greenaxe.elem.style.top = `${(next[1] - 23) / 6 * 100}%`;
|
||||
}, 500);
|
||||
}
|
||||
;
|
||||
main();
|
||||
|
||||
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user