Class Tweenable

Hierarchy

Tweenable

Index

Constructors

constructor

new Tweenable(initialState?: TweenState, config?: TweenableConfig): Tweenable
Parameters
- initialState: TweenState = {}
  
  The values that the initial tween should start at if a from value is not provided to tween or setConfig.
- Optional config: TweenableConfig
  
  Configuration object to be passed to setConfig.
Returns Tweenable
- Defined in src/tweenable.ts:498

Properties

`Static` easing

easing: Record<string, EasingFunction> = ...

You can define custom easing curves by attaching EasingFunctions to this static object.

Tweenable.easing['customEasing'] = (pos: number) => Math.pow(pos, 2)

`Static` filters

filters: Record<string, Filter> = ...

The Filters available for use. These filters are automatically applied. You can define your own Filters and attach them to this object.

Tweenable.filters['customFilter'] = {
  doesApply: () => true
  tweenCreated: () => console.log('tween created!')
}

Accessors

hasEnded

get hasEnded(): boolean
Whether or not a tween has completed.

Returns boolean
- Defined in src/tweenable.ts:872

isPlaying

get isPlaying(): boolean
Whether or not a tween is running (not paused or completed).

Returns boolean
- Defined in src/tweenable.ts:865

state

get state(): TweenState
Returns the current state of the tween.

Returns TweenState
- Defined in src/tweenable.ts:677

Methods

cancel

cancel(gotoEnd?: boolean): Tweenable
stops a tween and also rejects its Promise. If a tween is not running, this is a no-op. Prevents calling any provided finish function.

See
https://github.com/jeremyckahn/shifty/issues/122
Parameters
- gotoEnd: boolean = false
  
  This gets propagated to stop.
Returns Tweenable
- Defined in src/tweenable.ts:838

catch

catch(onRejected: RejectionHandler): Promise<PromisedData>
See
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/catch
Parameters
- onRejected: RejectionHandler
Returns Promise<PromisedData>
- Defined in src/tweenable.ts:664

data

data(data?: Data): Data
Get and optionally set the data that gets passed as data to StartFunction, FinishFunction and RenderFunction.
Parameters
- data: Data = null
Returns Data
- Defined in src/tweenable.ts:880

dispose

dispose(): void
delete all own properties. Call this when the Tweenable instance is no longer needed to free memory.

Returns void
- Defined in src/tweenable.ts:894

finally

finally(onFinally?: ((onfinally?: null | (() => void)) => Promise<any>)): Promise<PromisedData>
See
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/finally
Parameters
- Optional onFinally: ((onfinally?: null | (() => void)) => Promise<any>)
  - - (onfinally?: null | (() => void)): Promise<any>
    - Attaches a callback that is invoked when the Promise is settled (fulfilled or rejected). The resolved value cannot be modified from the callback.
      
      Returns
      A Promise for the completion of the callback.
      
      Parameters
      
      Optional onfinally: null | (() => void)
      
      The callback to execute when the Promise is settled (fulfilled or rejected).
      
      Returns Promise<any>
Returns Promise<PromisedData>
- Defined in src/tweenable.ts:670

pause

pause(): Tweenable
Pauses a tween. Paused tweens can be resumed from the point at which they were paused. If a tween is not running, this is a no-op.

Returns Tweenable
- Defined in src/tweenable.ts:697

resume

resume(): Tweenable
Resumes a paused tween.

Returns Tweenable
- Defined in src/tweenable.ts:712

seek

seek(millisecond: number): Tweenable
Move the state of the animation to a specific point in the tween's timeline. If the animation is not running, this will cause the tween's render handler to be called.
Parameters
- millisecond: number
  
  The millisecond of the animation to seek to. This must not be less than 0.
Returns Tweenable
- Defined in src/tweenable.ts:759

setConfig

setConfig(config?: TweenableConfig): Tweenable
Configures a tween without starting it. Aside from delay, from, and to, each configuration option will automatically default to the same option used in the preceding tween of the Tweenable instance.
Parameters
- config: TweenableConfig = {}
Returns Tweenable
- Defined in src/tweenable.ts:564

setState

setState(state: TweenState): void
Set the current tween state.
Parameters
- state: TweenState
  
  The state to set.
Returns void
- Defined in src/tweenable.ts:684

stop

stop(gotoEnd?: boolean): Tweenable
Stops a tween. If a tween is not running, this is a no-op. This method does not reject the tween Promise. For that, use cancel.
Parameters
- gotoEnd: boolean = false
  
  If false or not provided, the tween just stops at its current state. If true, the tweened object's values are instantly set to the target values.
Returns Tweenable
- Defined in src/tweenable.ts:786

then

then(onFulfilled?: FulfillmentHandler, onRejected?: RejectionHandler): Promise<PromisedData>
Overrides any finish function passed via a TweenableConfig.

See
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/then
Parameters
- Optional onFulfilled: FulfillmentHandler
- Optional onRejected: RejectionHandler
Returns Promise<PromisedData>
- Defined in src/tweenable.ts:645

tween

tween(config?: TweenableConfig): Tweenable
Configure and start a tween. If this Tweenable's instance is already running, then it will stop playing the old tween and immediately play the new one.
Parameters
- Optional config: TweenableConfig
Returns Tweenable
- Defined in src/tweenable.ts:537

`Static` now

now(): number
Returns the current timestamp.

Returns number
- Defined in src/tweenable.ts:351

`Static` setScheduleFunction

setScheduleFunction(fn: ScheduleFunction): ScheduleFunction
Sets a custom schedule function.

By default, Shifty uses requestAnimationFrame is used if available, otherwise setTimeout is used.
Parameters
- fn: ScheduleFunction
  
  The function to be used to schedule the next frame to be rendered.
Returns ScheduleFunction
- Defined in src/tweenable.ts:360

Class Tweenable

Hierarchy

Index

Constructors

Properties

Accessors

Methods

Constructors

constructor

Parameters

initialState: TweenState = {}

Optional config: TweenableConfig

Returns Tweenable

Properties

Static easing

Static filters

Accessors

hasEnded

Returns boolean

isPlaying

Returns boolean

state

Returns TweenState

Methods

cancel

See

Parameters

gotoEnd: boolean = false

Returns Tweenable

catch

See

Parameters

onRejected: RejectionHandler

Returns Promise<PromisedData>

data

Parameters

data: Data = null

Returns Data

dispose

Returns void

finally

See

Parameters

Optional onFinally: ((onfinally?: null | (() => void)) => Promise<any>)

Returns

Parameters

Optional onfinally: null | (() => void)

Returns Promise<any>

Returns Promise<PromisedData>

pause

Returns Tweenable

resume

Returns Tweenable

seek

Parameters

millisecond: number

Returns Tweenable

setConfig

Parameters

config: TweenableConfig = {}

Returns Tweenable

setState

Parameters

state: TweenState

Returns void

stop

Parameters

gotoEnd: boolean = false

Returns Tweenable

then

See

Parameters

Optional onFulfilled: FulfillmentHandler

Optional onRejected: RejectionHandler

Returns Promise<PromisedData>

tween

Parameters

Optional config: TweenableConfig

Returns Tweenable

Static now

`Optional` config: TweenableConfig

`Static` easing

`Static` filters

`Optional` onFinally: ((onfinally?: null | (() => void)) => Promise<any>)

`Optional` onfinally: null | (() => void)

`Optional` onFulfilled: FulfillmentHandler

`Optional` onRejected: RejectionHandler

`Optional` config: TweenableConfig

`Static` now

`Static` setScheduleFunction