Transitionable

A state maintainer for a smooth transition between numerically-specified states. Example numeric states include floats or Transform objects. An initial state is set with the constructor or set(startState). A corresponding end state and transition are set with set(endState, transition). Subsequent calls to set(endState, transition) begin at the last state. Calls to get(timestamp) provide the interpolated state along the way. Note that there is no event loop here - calls to get() are the only way to find state projected to the current (or provided) time and are the only way to trigger callbacks. Usually this kind of object would be part of the render() path of a visible component.

Overview

Options
Methods
set
reset
delay
get
isActive
halt

Transitionable(start)

Constructor Parameters

start

number|Array.Number|Object.<number|string, number>

beginning state

Methods

set(endState, transition, callback)

Add transition to end state to the queue of pending transitions. Special Use: calling without a transition resets the object to that state with no pending actions

Parameters
endState
number|FamousMatrix|Array.Number|Object.<number, number>
end state to which we interpolate
transition
Transition=
object of type {duration: number, curve: f[0,1] -> [0,1] or name}. If transition is omitted, change will be instantaneous.
callback
Function()=
Zero-argument function to call on observed completion (t=1)

reset(startState)

Cancel all transitions and reset to a stable state

Parameters
startState
number|Array.Number|Object.<number, number>
stable state to set to

delay(duration, callback)

Add delay action to the pending action queue queue.

Parameters
duration
Number
delay time (ms)
callback
Function
Zero-argument function to call on observed completion (t=1)

get(timestamp)

Get interpolated state of current action at provided time. If the last action has completed, invoke its callback.

Parameters
timestamp
Number=
Evaluate the curve at a normalized version of this time. If omitted, use current time. (Unix epoch time)
Returns
number|Object.<number|string, number>
beginning state interpolated to this point in time.

isActive()

Is there at least one action pending completion?

Returns
Boolean

halt()

Halt transition at current state and erase all pending actions.