Fix hero spinning while walking/attacking: face only when moving, keep attack facing, stop walking into target

index.html

@@ -851,7 +851,10 @@ button.big.ghost { background:rgba(20,16,10,.8); color:var(--gold); }
 
     // movement: joystick / keyboard overrides path
     const sp = HERO_SPEED * (t < H.slowUntil ? 0.6 : 1) * (t < H.stunUntil ? 0 : 1);
-    let manual = false;
+    let manual = false, walking = false;
+    // while an attack animation is playing, keep the attack facing and do not replace the swing with run/stance
+    const attacking = t < H.lockUntil;
+    const inReach = H.target && !H.target.dead && dist(H.x, H.y, H.target.x, H.target.y) <= S.world.classes[H.cls].range + 0.25;
     if (S.joy.on || S.keyDir) {
       const [vx, vy] = S.joy.on ? [S.joy.vx, S.joy.vy] : S.keyDir;
       const len = Math.hypot(vx, vy);
@@ -860,9 +863,16 @@ button.big.ghost { background:rgba(20,16,10,.8); color:var(--gold); }
         const wx = (vx / HW + vy / HH) / 2, wy = (vy / HH - vx / HW) / 2;
         const wl = Math.hypot(wx, wy) || 1;
         const k = sp * dt * Math.min(1, len);
-        moveEnt(M, H, wx / wl * k, wy / wl * k, H.r);
-        H.dir = dirOf(wx, wy);
-        setAnim(H, 'run');
+        let mx = wx / wl * k, my = wy / wl * k;
+        // already in reach of the locked target: do not walk into it (that made the hero overshoot back and forth)
+        if (inReach && mx * (H.target.x - H.x) + my * (H.target.y - H.y) > 0) { mx = 0; my = 0; }
+        const x0 = H.x, y0 = H.y;
+        moveEnt(M, H, mx, my, H.r);
+        // face the walking direction only when we actually moved (pushing against a blocker must not spin the sprite)
+        const moved = Math.hypot(H.x - x0, H.y - y0);
+        walking = moved > k * 0.3;
+        if (!attacking && walking) H.dir = dirOf(wx, wy);
+        if (!attacking) setAnim(H, walking ? 'run' : 'stance');
         manual = true;
         H.path = []; H.chase = false; H.pending = null;
       }
@@ -880,9 +890,10 @@ button.big.ghost { background:rgba(20,16,10,.8); color:var(--gold); }
       }
       if (H.path.length) {
         if (followPath(M, H, H.path, sp, dt)) {
+          walking = true;
           const nx = H.path.length ? H.path[0] : null;
-          if (nx) H.dir = dirOf(nx[0] - H.x, nx[1] - H.y);
-          setAnim(H, 'run');
+          if (nx && !attacking) H.dir = dirOf(nx[0] - H.x, nx[1] - H.y);
+          if (!attacking) setAnim(H, 'run');
         }
       } else if (t >= H.lockUntil) setAnim(H, 'stance');
     }
@@ -898,6 +909,8 @@ button.big.ghost { background:rgba(20,16,10,.8); color:var(--gold); }
     if (H.target && !H.target.dead) {
       const inRange = dist(H.x, H.y, H.target.x, H.target.y) <= S.world.classes[H.cls].range + 0.25;
       if (inRange) {
+        // standing and fighting: keep facing the target (no turning back and forth while attacking)
+        if (!walking && !attacking) faceHero(H.target.x - H.x, H.target.y - H.y);
         if (S.auto) autoFight();
         else if (S.atkOn && H.atkCd <= 0) doBasic();
       }
@@ -1467,7 +1480,7 @@ button.big.ghost { background:rgba(20,16,10,.8); color:var(--gold); }
     get state() {
       const H = S.H;
       return H && S.M ? {
-        map: S.M.id, hero: { x: H.x, y: H.y, hp: H.hp, mp: H.mp, lvl: H.lvl, xp: H.xp, dead: H.dead, potions: H.potions, target: H.target ? H.target.def.name : null, tx: H.target ? H.target.x : null, ty: H.target ? H.target.y : null, path: H.path.length, chase: H.chase, atkCd: H.atkCd },
+        map: S.M.id, hero: { x: H.x, y: H.y, hp: H.hp, mp: H.mp, lvl: H.lvl, xp: H.xp, dead: H.dead, potions: H.potions, target: H.target ? H.target.def.name : null, tx: H.target ? H.target.x : null, ty: H.target ? H.target.y : null, chase: H.chase, atkCd: H.atkCd, dir: H.dir, anim: H.anim.n, path: H.path.length },
         enemies: S.enemies.filter((e) => !e.dead).length, kills: S.kills, auto: S.auto, lock: S.lock,
       } : null;
     },