Source: tiles-1.js

/**
 * @fileoverview Dictionary of tiles
 * @author Robert Laing
 * @module tiles
 */

import * as squares from "/js/modules/squares-1.js";

const tiles = {
  "weeds": {
    "width": 480,
    "height": 480,
    "image": new Image(),
    "src": "/tiles/grass1.png",
    "frame": [0,0],
    "loaded": false
  }
};

let terrainArray = [];
let game;
let rows;
let columns;
let cellLength;
let terrain;

function load(tile) {
  tiles[tile].image.src = tiles[tile].src;
  tiles[tile].image.addEventListener("load", () => {tiles[tile].loaded = true});
}

export function init(board) {
  let tile, centerX, centerY;
  game = board.game;
  rows = structuredClone(board.rows);
  columns = structuredClone(board.columns);
  cellLength = board.squareSideLength;
  terrain = structuredClone(board.terrain);
  terrainArray = [];
  for (const [key, value] of Object.entries(terrain)) {
    load(key);
    [centerX, centerY] = squares.colrow2xy(columns.indexOf(value.col), rows.indexOf(value.row), cellLength);
    centerX = (centerX - (cellLength/2) + (value.colspan * cellLength))/2;
    centerY = (centerY - (cellLength/2) + (value.rowspan * cellLength))/2;
    tile = {
      "type": key,
      "centerX": centerX,
      "centerY": centerY,
      "angle": value.angle,
      "width": value.colspan * cellLength,
      "height": value.rowspan * cellLength
    };
    terrainArray.push(tile);
  }
}

export function resize(scale) {
  terrainArray.forEach(function(tile) {
    tile.centerX *= scale;
    tile.centerY *= scale;
    tile.width *= scale;
    tile.height *= scale;
  });
}

/** most tiles are at 90%, so leaving out Math.PI/2 + used in sprites to get north facing sprites to 0 is heading east
 */
function drawTile(tile) {
  if (tiles[tile.type].loaded) {
    window.ctx.save();
    window.ctx.translate(tile.centerX, tile.centerY);
    window.ctx.rotate(tile.angle * Math.PI/180);
    window.ctx.drawImage(
      tiles[tile.type].image,
      tiles[tile.type].frame[0],
      tiles[tile.type].frame[1],
      tiles[tile.type].width,
      tiles[tile.type].height,
      -tile.width/2,
      -tile.height/2,
      tile.width,
      tile.height
    );
    window.ctx.restore();
  }
}

export function drawTerrain() {
  terrainArray.forEach((tile) => drawTile(tile));
}