import CanvasWindow from "./canvas-windows";
import ResourceLoader from "./resource-loader";

const canvasWindow = new CanvasWindow({
  canvas: document.querySelector("canvas"),
  maxMultiplier: 5,
  windowPercentage: 0.9,
});

const DEBUG = true;
const GAME_TILE = 16;
const ROWS = canvasWindow.nativeHeight / GAME_TILE;
const COLUMNS = canvasWindow.nativeWidth / GAME_TILE;

(async () => {
  await canvasWindow.load();
  const { canvas } = canvasWindow;
  const ctx = canvas.getContext("2d");

  const [overworld] = await Promise.all(
    ["assets/overworld.png"].map(ResourceLoader.load)
  );
  for (let row = 0; row < ROWS; row++) {
    for (let col = 0; col < COLUMNS; col++) {
      ctx.drawImage(
        overworld,
        0,
        0,
        GAME_TILE,
        GAME_TILE,
        col * GAME_TILE,
        row * GAME_TILE,
        GAME_TILE,
        GAME_TILE
      );

      DEBUG &&
        ctx.strokeRect(col * GAME_TILE, row * GAME_TILE, GAME_TILE, GAME_TILE);
    }
  }
})();