# Humanoid Motion Cycles — Three.js

A single-page, no-build Three.js scene with a procedurally rigged humanoid that plays
blended **walk**, **run** and **jump** cycles. three.js `0.169.0` is pinned and loaded
from the unpkg CDN via an import map.

## Run

Open `index.html` directly in a modern desktop or mobile browser, or serve the folder:

```
npx serve .
# or
python3 -m http.server
```

## Controls

| Input | Action |
| --- | --- |
| **Walk** button / `1` / `W` | Switch to the walk cycle (blends smoothly) |
| **Run** button / `2` / `R` | Switch to the run cycle (blends smoothly) |
| **Jump** button / `3` / `Space` | Play one jump cycle, then return to the current gait |
| **Skeleton** button / `S` | Toggle body meshes / skeleton lines and joints |
| Mouse drag or one-finger touch | Orbit the camera |
| Scroll wheel or pinch | Zoom in / out |

Buttons are touch-friendly; the orbit camera follows the character while preserving your
viewing angle.

## Notes on the motion

* Ankle targets are world-fixed during stance, so the support foot does not slide while
  in contact; a physical foot rocker (heel strike → flat → toe-off) keeps the sole on
  the ground.
* Legs use two-bone IK with a forward knee pole, so knees never hyperextend or bend
  backward; elbows only flex (never negative). Hip/ankle targets are clamped to human
  ranges.
* The pelvis bobs twice per cycle, sways toward the support leg, and counter-rotates
  against the chest and swinging shoulders; the head stays upright.
* Arms swing in opposition to the legs, with more elbow flexion in the run.
* Gait switches blend a parameter set (stride, duty, heights, lean, arm amplitudes),
  and the jump blends as a full pose over the locomotion, so transitions stay smooth.
* The world is a large unit grid; the character wraps seamlessly every 8 m, so it can
  keep walking or running indefinitely.