add joystick

src/input/TouchInput.ts

@@ -4,23 +4,63 @@ export class TouchInput {
   dx = 0;
   dy = 0;
 
-  constructor(scene: Phaser.Scene) {
+  private base?: Phaser.GameObjects.Arc;
-    let start: Phaser.Math.Vector2 | null = null;
+  private knob?: Phaser.GameObjects.Arc;
 
+  private start?: Phaser.Math.Vector2;
+  private readonly radius = 50;
+
+  constructor(scene: Phaser.Scene) {
     scene.input.on("pointerdown", (pointer: Phaser.Input.Pointer) => {
-      start = new Phaser.Math.Vector2(pointer.x, pointer.y);
+      this.start = new Phaser.Math.Vector2(pointer.x, pointer.y);
+
+      // основание
+      this.base = scene.add
+        .circle(pointer.x, pointer.y, this.radius, 0x000000, 0.35)
+        .setDepth(1000);
+
+      // ручка
+      this.knob = scene.add
+        .circle(pointer.x, pointer.y, this.radius / 2, 0xffffff, 0.8)
+        .setDepth(1001);
     });
 
     scene.input.on("pointermove", (pointer: Phaser.Input.Pointer) => {
-      if (!start) return;
+      if (!this.start || !this.knob) return;
-      this.dx = Phaser.Math.Clamp((pointer.x - start.x) / 50, -1, 1);
+
-      this.dy = Phaser.Math.Clamp((pointer.y - start.y) / 50, -1, 1);
+      const dx = pointer.x - this.start.x;
+      const dy = pointer.y - this.start.y;
+
+      const distance = Math.min(this.radius, Math.hypot(dx, dy));
+      const angle = Math.atan2(dy, dx);
+
+      const knobX = this.start.x + Math.cos(angle) * distance;
+      const knobY = this.start.y + Math.sin(angle) * distance;
+
+      this.knob.setPosition(knobX, knobY);
+
+      this.dx = Phaser.Math.Clamp(dx / this.radius, -1, 1);
+      this.dy = Phaser.Math.Clamp(dy / this.radius, -1, 1);
     });
 
     scene.input.on("pointerup", () => {
-      start = null;
+      this.reset();
-      this.dx = 0;
+    });
-      this.dy = 0;
+
+    scene.input.on("pointerout", () => {
+      this.reset();
     });
   }
+
+  private reset() {
+    this.dx = 0;
+    this.dy = 0;
+    this.start = undefined;
+
+    this.base?.destroy();
+    this.knob?.destroy();
+
+    this.base = undefined;
+    this.knob = undefined;
+  }
 }