feat(#1): added grid drawing

src/index.js

@@ -1,18 +1,41 @@
 import CanvasWindow from "./canvas-windows";
 import ResourceLoader from "./resource-loader";
-(async function gameloop() {
+
-  const canvasWindow = new CanvasWindow({
+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([
+  const [overworld] = await Promise.all(
-    "assets/overworld.png",
+    ["assets/overworld.png"].map(ResourceLoader.load)
-  ].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
+      );
 
-  ctx.drawImage(overworld, 0, 0);
+      DEBUG &&
+        ctx.strokeRect(col * GAME_TILE, row * GAME_TILE, GAME_TILE, GAME_TILE);
+    }
+  }
 })();