diff --git a/src/input/TouchInput.ts b/src/input/TouchInput.ts index 1bd83c1..143ad70 100644 --- a/src/input/TouchInput.ts +++ b/src/input/TouchInput.ts @@ -4,23 +4,63 @@ export class TouchInput { dx = 0; dy = 0; - constructor(scene: Phaser.Scene) { - let start: Phaser.Math.Vector2 | null = null; + private base?: Phaser.GameObjects.Arc; + 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; - this.dx = Phaser.Math.Clamp((pointer.x - start.x) / 50, -1, 1); - this.dy = Phaser.Math.Clamp((pointer.y - start.y) / 50, -1, 1); + if (!this.start || !this.knob) return; + + 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.dx = 0; - this.dy = 0; + this.reset(); + }); + + 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; + } }