From a0c4292dc2ea9ee11ab3aceda4aa5ced31ba8dcf Mon Sep 17 00:00:00 2001
From: elioat <elioat@tilde.institute>
Date: Mon, 30 Oct 2023 15:58:24 -0400
Subject: *

---
 js/canvas/game.js | 18 ++++++------------
 1 file changed, 6 insertions(+), 12 deletions(-)

diff --git a/js/canvas/game.js b/js/canvas/game.js
index e8ef51f..24f0296 100644
--- a/js/canvas/game.js
+++ b/js/canvas/game.js
@@ -1,18 +1,12 @@
-// get the canvas element
+// configure the canvas -- our playspace...magic circle and what not
 const canvas = document.getElementById("gameCanvas");
-
-// set the canvas dimensions
 canvas.width = 512;
 canvas.height = 512;
-
-// get the canvas context
 const ctx = canvas.getContext("2d");
-
-// set the background color
 ctx.fillStyle = "#e0f8cf";
 ctx.fillRect(0, 0, canvas.width, canvas.height);
 
-// create a rectangle
+// our noble avatar into playspace
 const player = {
   x: 50,
   y: 50,
@@ -63,10 +57,10 @@ document.addEventListener("keydown", (event) => {
 
 // game loop
 function gameLoop() {
-  // clear the canvas
+  // clear the canvas every tick
   ctx.clearRect(0, 0, canvas.width, canvas.height);
 
-  // looping canvas space
+  // looping canvas space so you can't wander out of view
   // this feels like a hack...
   if (player.x < 0) {
     player.x = canvas.width - 1
@@ -81,11 +75,11 @@ function gameLoop() {
     player.y = 1
   }
 
-  // draw the rectangle
+  // draw
   ctx.fillStyle = player.color;
   ctx.fillRect(player.x, player.y, player.width, player.height);
 
-  // request the next frame
+  // next frame
   requestAnimationFrame(gameLoop);
 }
 
-- 
cgit 1.4.1-2-gfad0