Levels' background

Some grass + finer grid

script.js

@@ -73,6 +73,8 @@ const canvasTarget = byId("canvasTarget")
 const scoreTarget = byId("scoreTarget")
 
 // Get images
+const imgGrass = new Image();
+imgGrass.src = './assets/grass.png';
 const imgWall = new Image();
 imgWall.src = './assets/wall.jpg';
 const imgApple = new Image();
@@ -244,8 +246,13 @@ async function startGame(gameID) {
         
         // Redraw screen
         ctx.clearRect(0, 0, canvas.width, canvas.height)
+        let pattern = ctx.createPattern(imgGrass, 'repeat');
+        ctx.fillStyle = pattern;
+        ctx.fillRect(0, 0, canvas.width, canvas.height);
         
         // First, draw the grid
+        ctx.lineWidth = 0.3;
+        
         for(let i = 0; i <= level.dimensions[1]; i++) {
             drawLine(ctx, i*cell_width, 0, i*cell_width, canvas.height)
         }