From 687cb1b034ed919bf422d866f458fbb6f72b5823 Mon Sep 17 00:00:00 2001
From: sigmasternchen <git@sigma-star.io>
Date: Wed, 30 Oct 2024 22:53:32 +0100
Subject: [PATCH] refactor to using lambdas instead of binds

---
 src/game/Ball.ts     |  8 ++++----
 src/game/Banner.ts   |  4 ++--
 src/game/Game.ts     | 21 ++++++++++-----------
 src/game/Paddle.ts   | 12 ++++++------
 src/game/Position.ts |  5 ++---
 5 files changed, 24 insertions(+), 26 deletions(-)

diff --git a/src/game/Ball.ts b/src/game/Ball.ts
index f98d866..93e9a4e 100644
--- a/src/game/Ball.ts
+++ b/src/game/Ball.ts
@@ -24,21 +24,21 @@ export class Ball {
         this._position = position;
     }
 
-    public redraw(): void {
+    public readonly redraw = (): void => {
         this.element.style.left = this._position.x + "px";
         this.element.style.top = this._position.y + "px";
     }
 
-    public setup(gameElement: HTMLElement): void {
+    public readonly setup = (gameElement: HTMLElement): void => {
         gameElement.appendChild(this.element);
     }
 
-    public launch() {
+    public readonly launch = (): void => {
         this.phi = choice(startAngles);
         this.speed = defaultBallSpeed;
     }
 
-    public tick(delta: number) {
+    public readonly tick = (delta: number): void => {
         this._position = this._position.moveInDirection(this.phi, this.speed * delta / 1000);
         this.redraw();
     }
diff --git a/src/game/Banner.ts b/src/game/Banner.ts
index e47404a..657b4f7 100644
--- a/src/game/Banner.ts
+++ b/src/game/Banner.ts
@@ -18,7 +18,7 @@ export class Banner {
         this.element.style.left = this.position.x + "px";
     }
 
-    public load(): Promise<void> {
+    public readonly load = (): Promise<void> => {
         return new Promise<void>((resolve, reject) => {
             const image = new Image();
             image.onload = () => resolve();
@@ -28,7 +28,7 @@ export class Banner {
         })
     }
 
-    public setup(gameElement: HTMLElement): void {
+    public readonly setup = (gameElement: HTMLElement): void => {
         gameElement.appendChild(this.element);
     }
 }
diff --git a/src/game/Game.ts b/src/game/Game.ts
index fdb1686..004a031 100644
--- a/src/game/Game.ts
+++ b/src/game/Game.ts
@@ -23,33 +23,32 @@ export class Game {
         this.balls = [];
     }
 
-    public load(): Promise<void> {
-        return Promise.all(this.banners.map(banner => banner.load())).then(() => {});
-    }
+    public readonly load = (): Promise<void> =>
+        Promise.all(this.banners.map(banner => banner.load())).then(() => {});
 
-    public setup(): void {
+    public readonly setup = (): void => {
         this.banners.forEach(banner => banner.setup(this.root));
-        this.paddle.setup(this.root, this.ballLaunchHandler.bind(this));
+        this.paddle.setup(this.root, this.ballLaunchHandler);
         this.balls.forEach(ball => ball.setup(this.root));
     }
 
-    private ballLaunchHandler(ball: Ball): void {
+    private readonly ballLaunchHandler = (ball: Ball): void => {
         this.balls.push(ball);
         ball.launch();
     }
 
-    public run(): void {
+    public readonly run = (): void => {
         this.running = true;
-        requestAnimationFrame(this.tick.bind(this))
+        requestAnimationFrame(this.tick)
     }
 
-    private tick(timestamp: number): void {
+    private readonly tick = (timestamp: number): void => {
         const delta = timestamp - this.lastTickTimestamp;
         this.lastTickTimestamp = timestamp;
 
-        this.balls.forEach(ball => ball.tick.bind(ball)(delta));
+        this.balls.forEach(ball => ball.tick(delta));
         if (this.running) {
-            requestAnimationFrame(this.tick.bind(this));
+            requestAnimationFrame(this.tick);
         }
     }
 }
diff --git a/src/game/Paddle.ts b/src/game/Paddle.ts
index 83bceb4..82f8ce3 100644
--- a/src/game/Paddle.ts
+++ b/src/game/Paddle.ts
@@ -22,7 +22,7 @@ export class Paddle {
         this.redraw();
     }
 
-    private redraw() {
+    private readonly redraw = (): void => {
         this.element.style.left = this.position + "px";
         this.element.style.width = this.size + "px";
 
@@ -32,7 +32,7 @@ export class Paddle {
         }
     }
 
-    private mouseHandler(event: MouseEvent) {
+    private readonly mouseHandler = (event: MouseEvent): void => {
         this.position =
             Math.min(fieldWidth - this.size / 2,
             Math.max(this.size / 2, event.offsetX)
@@ -41,11 +41,11 @@ export class Paddle {
         this.redraw();
     }
 
-    public setup(gameElement: HTMLElement, ballLaunchHandler: (ball: Ball) => void): void {
+    public readonly setup = (gameElement: HTMLElement, ballLaunchHandler: (ball: Ball) => void): void => {
         gameElement.appendChild(this.element);
-        gameElement.addEventListener("mousemove", this.mouseHandler.bind(this));
-        gameElement.addEventListener("mouseenter", this.mouseHandler.bind(this));
-        gameElement.addEventListener("mouseleave", this.mouseHandler.bind(this));
+        gameElement.addEventListener("mousemove", this.mouseHandler);
+        gameElement.addEventListener("mouseenter", this.mouseHandler);
+        gameElement.addEventListener("mouseleave", this.mouseHandler);
 
         gameElement.addEventListener("click", () => {
             if (this.ball) {
diff --git a/src/game/Position.ts b/src/game/Position.ts
index 9dbbb04..9d47f8a 100644
--- a/src/game/Position.ts
+++ b/src/game/Position.ts
@@ -16,10 +16,9 @@ export class Position {
         return this._y;
     }
 
-    public moveInDirection(phi: number, distance: number): Position {
-        return new Position(
+    public readonly moveInDirection = (phi: number, distance: number): Position =>
+        new Position(
             this._x + Math.cos(phi) * distance,
             this._y - Math.sin(phi) * distance
         );
-    }
 }
\ No newline at end of file