Shaku Miscs Demo: Path Finding

This demo show how to use the built-in PathFinder utility.
Click on tiles to change their type and a new path will be calculated few moments after (path displayed as red dots).
Hold Right Mouse Button to paint blocking tiles.

Tile colors:

Black tiles are blocking.
Green tiles are cheapest to walk on.
Purple tiles slightly more expensive.
Orange tiles are expensive to walk on.

Allow Diagonal

The following shows a basic path finding example code.

// a grid provider that simple use a 2d array of numbers to represent tile types.
// tile type 0 = blocking / out of bounds.
// other types = walkable, price = type index.
class GridProvider extends Shaku.utils.PathFinder.IGrid
{
  constructor(grid)
  {
    super();
    this.grid = grid;
  }
  
  // blocking tiles = type 0, or out of bounds.
  isBlocked(_from, _to)
  {
    return !Boolean(this.getType(_to));
  }

  // get price: price = tile type
  getPrice(_index)
  {
    return this.getType(_index);
  }
  
  // get type from index.
  // return 0 (block) for out of bounds.
  getType(index)
  {
    if (!this.grid[index.x]) {
        return 0;
    }
    return this.grid[index.x][index.y] || 0;
  }
}

// create grid
let grid = [[1,2,1,1,1,1,1,1,1,1,1,1],
            [1,2,1,1,1,1,1,1,1,1,1,1],
            [1,1,1,0,1,1,1,1,1,1,1,1],
            [1,1,1,0,0,0,1,1,1,1,1,1],
            [1,1,1,1,1,0,1,1,1,1,1,1],
            [1,1,1,2,2,0,1,0,0,0,1,1],
            [1,1,1,2,1,0,1,0,1,1,1,1],
            [1,1,1,1,1,1,1,0,1,1,1,1],
            [1,1,0,1,1,1,1,0,1,2,1,1],
            [1,1,0,1,1,0,0,0,1,2,2,1],
            [1,1,0,1,1,1,1,1,1,2,2,1],
            [1,1,0,1,1,1,1,1,1,1,2,1]];
let gridProvider = new GridProvider(grid);

// find path from top-left to bottom-right
let path = Shaku.utils.PathFinder.findPath(gridProvider, {x:0, y:0}, {x:11, y:11}, {allowDiagonal: true});