Product media placeholder
Replace this area with a screenshot or short walkthrough video during the media sweep.
Gestural N-stage routing with eased transitions. Owns its own discrete-index state and runs an internal eased clock between consecutive indices. 3 input triggers (`advance`, `retreat`, `seekTo`) replace the upstream `pulseCounter` chain — wire wheel / click / key gestures directly. Slide count auto-derives from `slidesSelector` (preferred) or is configured manually via `slideCount`. Emits a continuous `currentIndex` (lerped during transition), the latched `discreteIndex`, eased `transitionProgress`, and a `slideActivations` Float[N] channel.
Type slideRouterCategory inputsContext sharedDynamic ports noCompound no
Inputs
| Port | Type | Description |
|---|---|---|
advance | float | Trigger. Each rising edge bumps the slide index by +1. Wraps to 0 if `wrap` is on; clamps to last otherwise. |
retreat | float | Trigger. Each rising edge bumps the slide index by -1. Wraps to last if `wrap` is on; clamps to 0 otherwise. |
seekTo | float | Wireable absolute index. When finite and changed, snaps to that integer index (clamped to [0, slideCount-1]). Use NaN (the default) to mean "no seek" and let advance / retreat drive instead. |
Outputs
| Port | Type | Description |
|---|---|---|
currentIndex | float | Continuous interpolated index. Lerps from prev to next via the eased clock during a transition; equals `discreteIndex` at rest. Wire to e.g. a `paletteLut` for a continuous colour sweep. |
discreteIndex | float | Most-recent latched integer target. Use for "active slide" identity. |
transitionProgress | float | Eased 0..1 during a transition; 0 at rest. `isTransitioning` is just `progress > 0` — no separate boolean. |
slideActivations | floatArray | Float[N] channel — entry i is slide i's activation 0..1. Use `floatArrayPick(index: i)` to fan out per-slide. |
Parameters
| Parameter | Type | Default | Description |
|---|---|---|---|
slidesSelector | elementSelector | "" | CSS selector for the slide elements. `slideCount` auto-derives from `querySelectorAll(...).length` at bind. Preferred over manual `slideCount` for DOM-driven decks. Leave empty to use `slideCount` instead. |
slideCount | int | - | Manual slide count. Use only when `slidesSelector` is empty — e.g. for non-DOM decks driven by a state machine. min 1; max 256 |
transitionDurationMs | float | 800 | Total transition time. Default 800. min 1 |
transitionEase | easingCurve | "easeInOutCubic" | Easing curve for the transition ramp. Default `easeInOutCubic`. |
wrap | bool | false | When true, advance past the last slide loops to 0; retreat before 0 loops to last. Default false (clamp at endpoints). |
Use cases
- Full-screen wheel deck — `wheelGesture.pulse → slideRouter.advance`. No pulseCounter.
- Nav-link deck — N `clickPulse` nodes per link with `value: <index>`, summed into `slideRouter.seekTo`.
- Keyboard nav — `clickPulse(eventType: keydown)` filtering ArrowDown / ArrowUp into advance / retreat.
- Per-slide colour drift — wire `slideRouter.slideActivations` through `floatArrayPick` then `paletteLut.color`.
- Continuous parallax — wire `slideRouter.currentIndex` (the float lerp) into a `paletteLut.t = currentIndex / (slideCount-1)` for a continuous colour sweep instead of step-changes.
Related nodes
Envelope
Use slideRouter as the node type inside a graph node envelope. Add id, optional params, optional connections, and optional activeWhen based on the guide context.
Generated source
Registry faster-motion-docs/node-registry.jsonCategory page /help/faster-motion/faster-motion-node-category-inputs/