Update camera.js

js/camera.js

@@ -10,20 +10,24 @@ function renderCamera() {
 
   const camera = {
     get x() {
-      if (player.x < scaledCanvas.width) return 0
+      if (player.x < scaledCanvas.width) return 0 // This is when the camera hits the left map boundary
       if (player.x > cameraWidth - scaledCanvas.width)
-        return -(cameraWidth - scaledCanvas.width * 2)
-      else return -(player.x - scaledCanvas.width)
+        return (
+          cameraWidth - scaledCanvas.width * 2
+        ) // This centers the player horizontally
+      else return player.x - scaledCanvas.width // This is when the camera hits the right map boundary
     },
     get y() {
-      if (player.y < scaledCanvas.height) return 0
+      if (player.y < scaledCanvas.height) return 0 // This is when the camera hits top map boundary
       if (player.y > cameraHeight - scaledCanvas.height)
-        return -(cameraHeight - scaledCanvas.height * 2)
-      else return -(player.y - scaledCanvas.height)
+        return (
+          cameraHeight - scaledCanvas.height * 2
+        ) // This centers the player vertically
+      else return player.y - scaledCanvas.height // This is when the camera hits the bottom map boundary
     },
   }
 
-  ctx.translate(camera.x, camera.y)
+  ctx.translate(-camera.x, -camera.y)
 }
 
 //-------------------------------------------------------------------------