feat: reduce mobile control sensitivity for better touch experience

app/components/GameCanvas.tsx

@@ -87,7 +87,7 @@ export default function GameCanvas({ onGameOver, startLevel = 0 }: GameCanvasPro
     useEffect(() => {
         if (!canvasRef.current) return;
 
-        const game = new Game(canvasRef.current, startLevel);
+        const game = new Game(canvasRef.current, startLevel, isMobile);
         gameRef.current = game;
 
         game.setOnGameOver(handleGameOver);
@@ -96,7 +96,7 @@ export default function GameCanvas({ onGameOver, startLevel = 0 }: GameCanvasPro
         return () => {
             game.stop();
         };
-    }, [handleGameOver, startLevel]);
+    }, [handleGameOver, startLevel, isMobile]);
 
     // Calculate scale for CSS transform
     const scale = dimensions.width / GAME_CONFIG.CANVAS_WIDTH;

lib/constants.ts

@@ -14,7 +14,9 @@ export const GAME_CONFIG = {
     PLAYER_WIDTH: 32,
     PLAYER_HEIGHT: 48,
     PLAYER_SPEED: 5,
+    MOBILE_PLAYER_SPEED: 3.5, // Reduced speed for mobile touch controls
     PLAYER_JUMP_FORCE: -14,
+    MOBILE_JUMP_FORCE: -12, // Slightly lower jump for mobile
 
     // Tile size
     TILE_SIZE: 32,

lib/engine/Game.ts

@@ -29,8 +29,9 @@ export class Game {
     private callbacks: GameCallbacks = {};
     private totalScore: number = 0;
     private currentTheme: LevelTheme = 'overworld';
+    private isMobile: boolean = false;
 
-    constructor(canvas: HTMLCanvasElement, startLevel: number = 0) {
+    constructor(canvas: HTMLCanvasElement, startLevel: number = 0, isMobile: boolean = false) {
         this.canvas = canvas;
         this.ctx = canvas.getContext('2d')!;
         this.renderer = new Renderer(this.ctx);
@@ -38,6 +39,10 @@ export class Game {
         this.collision = new Collision();
         this.levelManager = new LevelManager();
         this.keys = { left: false, right: false, jump: false };
+        this.isMobile = isMobile;
+
+        // Set mobile mode for physics
+        this.physics.setMobileMode(isMobile);
 
         // Set starting level
         if (startLevel > 0) {

lib/engine/Physics.ts

@@ -3,9 +3,23 @@
 import { PlayerState, Enemy, KeyState } from './types';
 import { GAME_CONFIG } from '../constants';
 
-const { GRAVITY, FRICTION, MAX_FALL_SPEED, PLAYER_SPEED, PLAYER_JUMP_FORCE } = GAME_CONFIG;
+const { GRAVITY, FRICTION, MAX_FALL_SPEED, PLAYER_SPEED, PLAYER_JUMP_FORCE, MOBILE_PLAYER_SPEED, MOBILE_JUMP_FORCE } = GAME_CONFIG;
 
 export class Physics {
+    private isMobile: boolean = false;
+
+    setMobileMode(isMobile: boolean): void {
+        this.isMobile = isMobile;
+    }
+
+    private getPlayerSpeed(): number {
+        return this.isMobile ? MOBILE_PLAYER_SPEED : PLAYER_SPEED;
+    }
+
+    private getJumpForce(): number {
+        return this.isMobile ? MOBILE_JUMP_FORCE : PLAYER_JUMP_FORCE;
+    }
+
     applyGravity(entity: { vy: number; isFalling?: boolean }): void {
         entity.vy += GRAVITY;
         if (entity.vy > MAX_FALL_SPEED) {
@@ -21,12 +35,15 @@ export class Physics {
     }
 
     updatePlayerMovement(player: PlayerState, keys: KeyState): void {
+        const speed = this.getPlayerSpeed();
+        const jumpForce = this.getJumpForce();
+
         // Horizontal movement
         if (keys.left) {
-            player.vx = -PLAYER_SPEED;
+            player.vx = -speed;
             player.facingRight = false;
         } else if (keys.right) {
-            player.vx = PLAYER_SPEED;
+            player.vx = speed;
             player.facingRight = true;
         } else {
             this.applyFriction(player);
@@ -34,7 +51,7 @@ export class Physics {
 
         // Jump
         if (keys.jump && !player.isJumping && !player.isFalling) {
-            player.vy = PLAYER_JUMP_FORCE;
+            player.vy = jumpForce;
             player.isJumping = true;
         }