fix: Fix climb rope

src/Level.js

@@ -123,13 +123,13 @@ export class Level {
             { x: rope[i + 1].x, y: rope[i + 1].y }
           )
         ) {
-          this.player.cutRope(i);
+          this.player.rope.cutRope(i);
         }
       });
       this.bricks.forEach((brick) => {
         if (rope[i].isAnchor()) return;
         if (isBoxCollision(brick.getSmallCollisionBox(), rope[i])) {
-          this.player.cutRope(i);
+          this.player.rope.cutRope(i);
         }
       });
     }

src/Player.js

@@ -3,7 +3,7 @@ import skull from 'data-url:./assets/img/skull.png';
 import { getPointer, Sprite, on } from 'kontra';
 import { PlayerControls } from './PlayerControls';
 import { fgc2 } from './constants';
-import { ARCADIAN_ADDED, GOAL_COLLISION } from './gameEvents';
+import { ARCADIAN_ADDED, CUT_ROPE, GOAL_COLLISION } from './gameEvents';
 import { Rope } from './Rope';
 
 export class Player {
@@ -153,13 +153,7 @@ export class Player {
   }
 
   climbRope() {
-    if (!this.rope || this.rope.length < 2) return;
-
-    const lastPointMassWithLink = this.rope.nodes[this.rope.length - 2];
-    lastPointMassWithLink.reduceRestingDistance(0.1);
-    if (lastPointMassWithLink.restingDistance <= 0) {
-      this.reArrangeRope();
-    }
+    this.rope.climbRope();
   }
   reArrangeRope() {
     this.rope.splice(this.rope.length - 2, 1);
@@ -170,14 +164,11 @@ export class Player {
       newLastPointWithLink.attachTo(this.pointMass);
     }
   }
-  cutRope = (index) => {
-    this.isRopeCut = true;
-    this.rope.cutRope(index);
-  };
 
   listenForGameEvents() {
     on(GOAL_COLLISION, this.onGoalCollision);
     on(ARCADIAN_ADDED, this.onArcadianAdded);
+    on(CUT_ROPE, this.onCutRope);
   }
   onGoalCollision = () => {
     this.hasWon = true;
@@ -186,4 +177,7 @@ export class Player {
     this.headImg = img;
     this.createHeadSprite(img);
   };
+  onCutRope = ({ rope }) => {
+    this.isRopeCut = true;
+  };
 }

src/PlayerControls.js

@@ -8,7 +8,7 @@ export class PlayerControls {
   }
 
   updateControls() {
-    if (this.player.isRopeCut) return;
+    if (this.player.isRopeCut || this.player.rope.length <= 0) return;
     // TODO (johnedvard) add support for touch gesture and gamepad (if enough space)
     if (keyPressed('arrowleft')) {
       this.player.applyForce(-1.5, -1);
@@ -27,6 +27,6 @@ export class PlayerControls {
   }
 
   initControls() {
-    onInput(['c'], () => this.player.cutRope(0));
+    onInput(['c'], () => this.player.rope.cutRope(0));
   }
 }

src/Rope.js

@@ -1,5 +1,6 @@
-import { Vector } from 'kontra';
+import { emit, Vector } from 'kontra';
 import { fgc2, gravity, RESTING_DISTANCE } from './constants';
+import { CUT_ROPE } from './gameEvents';
 import { gameHeight, gameWidth } from './store';
 import { isBoxCollision } from './utils';
 import { VerletLink } from './VerletLink';
@@ -63,7 +64,7 @@ export class Rope {
       const dxy = l.n2.pos.subtract(l.n1.pos);
       // console.log(l.n1.pos);
       const distance = dxy.length();
-      const diff = RESTING_DISTANCE - distance;
+      const diff = l.restingDistance - distance;
       // console.log(distance);
       const percent = diff / distance / 2;
       const offset = Vector(dxy.x * percent, dxy.y * percent);
@@ -125,9 +126,24 @@ export class Rope {
       }
     });
   }
+  climbRope() {
+    if (!this.nodes || this.nodes.length <= 2) {
+      this.cutRope(0);
+      return;
+    }
+
+    const factor = 0.1;
+    const lastLink = this.links[this.links.length - 1];
+    lastLink.restingDistance -= RESTING_DISTANCE * factor;
+    if (lastLink.restingDistance <= 0) {
+      this.links.pop();
+      this.nodes.pop();
+    }
+  }
   cutRope(index) {
     if (index >= this.nodes.length - 1) index = this.nodes.length - 2; // Make sure we can cut the rope if we pass the wrong index
     this.links.splice(index, 1);
+    emit(CUT_ROPE, { rope: this });
   }
 
   get length() {

src/VerletLink.js

@@ -1,6 +1,9 @@
+import { RESTING_DISTANCE } from './constants';
+
 export class VerletLink {
   n1;
   n2;
+  restingDistance = RESTING_DISTANCE;
   constructor(n1, n2) {
     this.n1 = n1;
     this.n2 = n2;

src/gameEvents.js

@@ -2,3 +2,4 @@ export const GOAL_COLLISION = 'gc';
 export const ARCADIAN_ADDED = 'aa';
 export const LEVEL_COMPLETE = 'lc';
 export const HEART_PICKUP = 'hp';
+export const CUT_ROPE = 'cr';

src/level/level1.json

@@ -1,5 +1,5 @@
 {
-  "p": { "x": 400, "y": 240 },
+  "p": { "x": 400, "y": 255 },
   "r": 30,
   "s": [],
   "b": [

src/level/level2.json

@@ -1,5 +1,5 @@
 {
-  "p": { "x": 400, "y": 240 },
+  "p": { "x": 400, "y": 255 },
   "r": 30,
   "s": [],
   "b": [