#206 refactor movement

src/Direction/Direction.ts

@@ -12,6 +12,20 @@ export enum Direction {
   DOWN_LEFT = "down-left",
 }
 
+export function directions(): Direction[] {
+  return [
+    Direction.UP,
+    Direction.DOWN,
+    Direction.LEFT,
+    Direction.RIGHT,
+    Direction.NONE,
+    Direction.UP_LEFT,
+    Direction.UP_RIGHT,
+    Direction.DOWN_RIGHT,
+    Direction.DOWN_LEFT,
+  ];
+}
+
 export function isDiagonal(direction: Direction): boolean {
   const diagonals = [
     Direction.DOWN_LEFT,
@@ -39,15 +53,15 @@ export function turnCounterClockwise(direction: Direction): Direction {
 
 export function directionVector(direction: Direction): Vector2 {
   const directionVectors = {
-    [Direction.UP]: Vector2.UP.clone(),
-    [Direction.DOWN]: Vector2.DOWN.clone(),
-    [Direction.LEFT]: Vector2.LEFT.clone(),
-    [Direction.RIGHT]: Vector2.RIGHT.clone(),
-    [Direction.NONE]: Vector2.ZERO.clone(),
-    [Direction.UP_LEFT]: new Vector2(-1, -1),
-    [Direction.UP_RIGHT]: new Vector2(1, -1),
-    [Direction.DOWN_RIGHT]: new Vector2(1, 1),
-    [Direction.DOWN_LEFT]: new Vector2(-1, 1),
+    [Direction.UP]: Vector2.UP,
+    [Direction.DOWN]: Vector2.DOWN,
+    [Direction.LEFT]: Vector2.LEFT,
+    [Direction.RIGHT]: Vector2.RIGHT,
+    [Direction.NONE]: Vector2.ZERO,
+    [Direction.UP_LEFT]: Vector2.UP_LEFT,
+    [Direction.UP_RIGHT]: Vector2.UP_RIGHT,
+    [Direction.DOWN_RIGHT]: Vector2.DOWN_RIGHT,
+    [Direction.DOWN_LEFT]: Vector2.DOWN_LEFT,
   };
   return directionVectors[direction];
 }

src/GridCharacter/GridCharacter.ts

@@ -334,25 +334,11 @@ export class GridCharacter {
     }
   }
 
-  private createSpeedPixelsPerSecond(): { [key in Direction]: Vector2 } {
-    const speedPixelsPerSecond = {
-      [Direction.LEFT]: new Vector2(this.tilemap.getTileWidth(), 0),
-      [Direction.RIGHT]: new Vector2(this.tilemap.getTileWidth(), 0),
-      [Direction.UP]: new Vector2(0, this.tilemap.getTileHeight()),
-      [Direction.DOWN]: new Vector2(0, this.tilemap.getTileHeight()),
-      [Direction.UP_LEFT]: this.tilemap.getTileDistance(Direction.UP_LEFT),
-      [Direction.UP_RIGHT]: this.tilemap.getTileDistance(Direction.UP_RIGHT),
-      [Direction.DOWN_LEFT]: this.tilemap.getTileDistance(Direction.DOWN_LEFT),
-      [Direction.DOWN_RIGHT]: this.tilemap.getTileDistance(
-        Direction.DOWN_RIGHT
-      ),
-      [Direction.NONE]: Vector2.ZERO,
-    };
-
-    Object.entries(speedPixelsPerSecond).forEach(([key, val]) => {
-      speedPixelsPerSecond[key] = VectorUtils.scalarMult(val, this.speed);
-    });
-    return speedPixelsPerSecond;
+  private speedPixelsPerSecond(direction: Direction): Vector2 {
+    return directionVector(direction)
+      .abs()
+      .multiply(this.tilemap.getTileDistance(direction))
+      .scalarMult(this.speed);
   }
 
   private get nextTilePos(): LayerPosition {
@@ -463,12 +449,7 @@ export class GridCharacter {
 
     const newLayer = trans || this.tilePos.layer;
     this.nextTilePos = { position: newTilePos, layer: newLayer };
-    this.positionChangeStarted$.next({
-      exitTile: this.tilePos.position,
-      enterTile: newTilePos,
-      exitLayer: this.tilePos.layer,
-      enterLayer: newLayer,
-    });
+    this.fire(this.positionChangeStarted$, this.tilePos, this.nextTilePos);
   }
 
   private tilePosInDirection(direction: Direction): Vector2 {
@@ -504,10 +485,8 @@ export class GridCharacter {
 
   private getSpeedPerDelta(delta: number): Vector2 {
     const deltaInSeconds = delta / 1000;
-    return this.createSpeedPixelsPerSecond()
-      [this.movementDirection].multiply(
-        new Vector2(deltaInSeconds, deltaInSeconds)
-      )
+    return this.speedPixelsPerSecond(this.movementDirection)
+      .scalarMult(deltaInSeconds)
       .multiply(directionVector(this.movementDirection));
   }
 

src/Utils/Vector2/Vector2.test.ts

@@ -87,4 +87,9 @@ describe("Vector2", () => {
     const v = new Vector2({ x: 4, y: -3 });
     expect(v.toString()).toEqual("4#-3");
   });
+
+  it("should multiply with scalar", () => {
+    const v = new Vector2({ x: 4, y: -3 });
+    expect(v.scalarMult(3)).toEqual(new Vector2(12, -9));
+  });
 });

src/Utils/Vector2/Vector2.ts

@@ -5,6 +5,10 @@ export class Vector2 {
     return new Vector2(0, 0);
   }
 
+  static get ONE(): Vector2 {
+    return new Vector2(1, 1);
+  }
+
   static get UP(): Vector2 {
     return new Vector2(0, -1);
   }
@@ -21,6 +25,22 @@ export class Vector2 {
     return new Vector2(1, 0);
   }
 
+  static get UP_LEFT(): Vector2 {
+    return new Vector2(-1, -1);
+  }
+
+  static get UP_RIGHT(): Vector2 {
+    return new Vector2(1, -1);
+  }
+
+  static get DOWN_RIGHT(): Vector2 {
+    return new Vector2(1, 1);
+  }
+
+  static get DOWN_LEFT(): Vector2 {
+    return new Vector2(-1, 1);
+  }
+
   x: number;
   y: number;
 
@@ -68,6 +88,10 @@ export class Vector2 {
     return Math.sqrt(this.x * this.x + this.y * this.y);
   }
 
+  scalarMult(scalar: number): Vector2 {
+    return new Vector2(this.x * scalar, this.y * scalar);
+  }
+
   toString(): string {
     return `${this.x}#${this.y}`;
   }