Add play area check

Author: una-ada

Diff for: js/modules/DOMRenderer.js

@@ -57,7 +57,7 @@ export default class DOMRenderer extends Renderer {
     model.healthDisplay.textContent = `${Math.max(
       0,
       model.health
-    )} lives remaining.`;
+    )} attempts remaining.`;
     model.message.innerHTML =
       model.condition === "PLAY"
         ? `Shoot the moon from the

Diff for: js/modules/Game.js

@@ -7,6 +7,7 @@
 /*----- Imports --------------------------------------------------------------*/
 import Celestial from "./Celestial.js";
 import GameData from "./GameData.js";
+import Physics from "./Physics.js";
 import Renderer from "./Renderer.js";
 
 /*----- Classes --------------------------------------------------------------*/
@@ -71,6 +72,7 @@ export default class Game {
     if (!this.running) return;
     const model = this.model,
       mouse = this.model.mouse;
+    let scaledClick;
     // Handle player input
     model.condition === "PLAY" &&
       (mouse.isDown
@@ -86,15 +88,19 @@ export default class Game {
               model.customMassAllowed && (model.newborn.mass *= Game.SCALE.mass)
           : // Create new Celestial on mouse down
             model.health > 0 &&
+            Physics.pointInRectangle(
+              (scaledClick = this.view.origin
+                .copy()
+                .subtract(mouse.position)
+                .subtract(this.view.offset)
+                .scale(0 - this.view.scale)),
+              model.playArea
+            ) &&
             (model.isCreating = true) &&
             (model.newborn = new Celestial({
               name: "played",
               mass: 1.35e23,
-              position: this.view.origin
-                .copy()
-                .subtract(mouse.position)
-                .subtract(this.view.offset)
-                .scale(0 - this.view.scale),
+              position: scaledClick,
               size: 0.54e8,
             })) &&
             model.scene.push(model.newborn)

Diff for: js/modules/GameData.js

@@ -53,13 +53,13 @@ export default class GameData {
   /** @var {Area} target The level target area. */
   get target() {
     return this.scene.find(
-      (obj) => obj instanceof Area && obj.name.toLowercase() === "target"
+      (obj) => obj instanceof Area && obj.name.toLowerCase() === "target"
     );
   }
   /** @var {Area} playArea The level play area. */
   get playArea() {
     return this.scene.find(
-      (obj) => obj instanceof Area && obj.name.toLowerCase() === "play area"
+      (obj) => obj instanceof Area && obj.name.toLowerCase() === "play"
     );
   }
 }

Diff for: js/modules/Physics.js

@@ -8,7 +8,7 @@
 import GameData from "./GameData.js";
 import Celestial from "./Celestial.js";
 import Area from "./Area.js";
-import { Vector } from "./Utils.js";
+import { Point, Vector } from "./Utils.js";
 
 /*----- Classes --------------------------------------------------------------*/
 /** @module Physics Manages the physics simulation. */
@@ -40,6 +40,7 @@ export default class Physics {
    * @returns {boolean}
    */
   static pointInRectangle(point, rect) {
+    if(!(point instanceof Point && rect instanceof Area)) return;
     let p1 = rect.position.copy(),
       p2 = p1.copy().add(rect.size);
     return point.x > p1.x && point.x < p2.x && point.y > p1.y && point.y < p2.y;
@@ -71,7 +72,9 @@ export default class Physics {
          * @returns {boolean}
          */
         (a, b) => Physics.pointInRectangle(b.position, a),
-      RECTANGLE: () => false,
+      RECTANGLE:
+        // This will always be false because only Areas are rectangles for now!
+        () => false,
     },
   };
   /**