Movement bug with two+ pushable entities

src/bootstrap.js

@@ -1,6 +1,6 @@
 game.bootstrap = (() => {
   const scripts = [
-    { src: ['src/utils/objectEquivalence.js', 'src/utils/unitizeVector.js'], id: 'utils'},
+    { src: ['src/utils/objectEquivalence.js', 'src/utils/unitizeVector.js', 'src/utils/clamp.js'], id: 'utils'},
     { src: ['src/render/graphics.js'], id: 'graphics' },
     { src: ['src/components/component.js'], id: 'component' },
     { 

src/game.js

@@ -26,7 +26,7 @@ game.initialize = () => {
 
   game.entities = {};
 
-  Array(400).fill(null).forEach((_, i) => {
+  Array(10).fill(null).forEach((_, i) => {
     const bigBlue = game.createBigBlue();
     bigBlue.addComponent(game.components.GridPosition({x: Math.floor(Math.random() * 15), y: Math.floor(Math.random() * 13)}));
 		bigBlue.addComponent(game.components.Pushable());

src/systems/gridSystem.js

@@ -52,18 +52,31 @@ game.system.GridSystem = ({ xDim, yDim, canvasWidth, canvasHeight }) => {
           });
 
           // TODO: Loop in momentum direction until we find an entity that does not have "push" component
-          const proposed = {x: entity.components.gridPosition.x + momentumVector.dx, y: entity.components.gridPosition.y + momentumVector.dy}
+          const proposed = {
+            x: entity.components.gridPosition.x + momentumVector.dx,
+            y: entity.components.gridPosition.y + momentumVector.dy
+          };
 					
-					const entitiesInCell = entitiesGrid[proposed.x][proposed.y];
+          const proposedCopy = {...proposed};
+          let found = false;
+          do {
+            found = false;
+            const entitiesInCell = entitiesGrid[proposedCopy.y][proposedCopy.x];
+            entitiesInCell.forEach((entity) => {
+              if (entity.hasComponent("pushable")) {
+                entity.addComponent(game.components.Momentum({...momentumVector}));
+                found = true;
+              }
+            });
+            proposedCopy.x += momentumVector.dx;
+            proposedCopy.y += momentumVector.dy;
+            const proposedCopyInBounds = clamp(proposedCopy, xDim, yDim);
+            if (!equivalence(proposedCopyInBounds, proposedCopy)) {
+              found = false;
+            }
+          } while (found);
 
-					for (let id in entitiesInCell) {
-						if (entitiesInCell[id].hasComponent("pushable")) {
-							entitiesInCell[id].addComponent(game.components.Momentum({...momentumVector}));
-						}
-					} 
-
-          entity.components.gridPosition.x = entity.components.gridPosition.x + momentumVector.dx;
-          entity.components.gridPosition.y = entity.components.gridPosition.y + momentumVector.dy;
+          entity.components.gridPosition = {...entity.components.gridPosition, ...proposed};
 
           entity.components.position = {
             ...entity.components.position,

src/systems/physics.js

@@ -6,8 +6,7 @@ game.system.Physics = () => {
         const {dx, dy} = entity.components.momentum;
         entity.components.position.x += dx * elapsedTime;
         entity.components.position.y += dy * elapsedTime;
-        entity.components.position.x = Math.max(0, Math.min(game.canvas.width - entity.components.appearance.width, entity.components.position.x));
-        entity.components.position.y = Math.max(0, Math.min(game.canvas.height - entity.components.appearance.height, entity.components.position.y));
+        entity.components.position = clamp(entity.components.position, game.canvas.width - entity.components.appearance.width, game.canvas.height - entity.components.appearance.height);
       }
     }
   }

src/utils/clamp.js

@@ -0,0 +1,6 @@
+const clamp = (vector, maxX, maxY) => {
+  const newVector = {...vector};
+  newVector.x = Math.max(0, Math.min(maxX, vector.x));
+  newVector.y = Math.max(0, Math.min(maxY, vector.y));
+  return newVector;
+}