proper player movement on click

front/src/Phaser/Player/Player.ts

@@ -65,7 +65,14 @@ export class Player extends Character {
     }
 
     public setPathToFollow(path: { x: number; y: number }[]): void {
-        this.pathToFollow = path;
+        // take collider offset into consideraton
+        this.pathToFollow = this.adjustPathToFollowToColliderBounds(path);
+    }
+
+    private adjustPathToFollowToColliderBounds(path: { x: number; y: number }[]): { x: number; y: number }[] {
+        return path.map((step) => {
+            return { x: step.x, y: step.y - this.getBody().offset.y };
+        });
     }
 
     private inputStep(activeEvents: ActiveEventList, x: number, y: number) {
@@ -133,9 +140,7 @@ export class Player extends Character {
         if (distance < 2000) {
             return [0, 0];
         }
-        const xMovement = xDistance / Math.sqrt(distance);
+        return this.getMovementDirection(xDistance, yDistance, distance);
-        const yMovement = yDistance / Math.sqrt(distance);
-        return [xMovement, yMovement];
     }
 
     private computeFollowPathMovement(): number[] {
@@ -148,11 +153,13 @@ export class Player extends Character {
         const xDistance = nextStep.x - this.x;
         const yDistance = nextStep.y - this.y;
         const distance = Math.pow(xDistance, 2) + Math.pow(yDistance, 2);
-        if (distance < 200) {
+        if (distance < 10) {
             this.pathToFollow.shift();
         }
-        const xMovement = xDistance / Math.sqrt(distance);
+        return this.getMovementDirection(xDistance, yDistance, distance);
-        const yMovement = yDistance / Math.sqrt(distance);
+    }
-        return [xMovement, yMovement];
+
+    private getMovementDirection(xDistance: number, yDistance: number, distance: number): [number, number] {
+        return [xDistance / Math.sqrt(distance), yDistance / Math.sqrt(distance)];
     }
 }

front/src/Phaser/UserInput/GameSceneUserInputHandler.ts

@@ -32,13 +32,19 @@ export class GameSceneUserInputHandler implements UserInputHandlerInterface {
             .then((path) => {
                 const tileDimensions = this.gameScene.getGameMap().getTileDimensions();
                 const pixelPath = path.map((step) => {
-                    return { x: step.x * tileDimensions.width, y: step.y * tileDimensions.height };
+                    return {
+                        x: step.x * tileDimensions.width + tileDimensions.width * 0.5,
+                        y: step.y * tileDimensions.height + tileDimensions.height * 0.5,
+                    };
                 });
+                // Replace last position with pointerUp result
+                // pixelPath[pixelPath.length - 1] = { x: pointer.x + camera.scrollX, y: pointer.y + camera.scrollY };
+                // Remove first step as it is for the tile we are currently standing on
+                pixelPath.shift();
                 this.gameScene.CurrentPlayer.setPathToFollow([...pixelPath]);
-                console.log(pixelPath);
             })
             .catch((reason) => {
-                console.log(reason);
+                console.warn(reason);
             });
     }
 

front/src/Utils/PathfindingManager.ts

@@ -9,7 +9,7 @@ export class PathfindingManager {
         this.scene = scene;
 
         this.easyStar = new EasyStar.js();
-        this.easyStar.disableDiagonals();
+        this.easyStar.enableDiagonals();
 
         this.setGrid(collisionsGrid);
     }