Options
All
  • Public
  • Public/Protected
  • All
Menu

Represents an animation, defined as a simple sequence of AnimationKeyframe objects. AnimationSequence itself does no actual animation, it's simply an abstract represention of an animation for which the actual mechanism of the visual representation is decoupled. See AnimationProvider.

Hierarchy

  • AnimationSequence

Index

Constructors

constructor

  • Constructs an instance of AnimationSequence, given a frame provider, an HTML element, and some optional keyframes.

    Parameters

    • frameProvider: AnimationProvider

      The AnimationProvider responsible for interpolating between keyframes.

    • element: HTMLElement

      The HTML element that the animation is to run on.

    • Optional frames: any[]

      An initial set of 0 or more animation frames to populate the animation with.

    • Optional frameCallback: AnimationFrameCallback

      A callback to invoke after every frame has completed.

    Returns AnimationSequence

Properties

Protected _animationPromise

_animationPromise: Deferrable<AnimationEvent>

Protected _element

_element: HTMLElement

Protected _frame

_frame: number

Protected _frameCallback

_frameCallback: AnimationFrameCallback

Protected _frameClass

_frameClass: string

Protected _frameProvider

_frameProvider: AnimationProvider

Protected _frames

Protected _isDynamic

_isDynamic: boolean

Protected _resets

_resets: boolean

Protected _state

Methods

Protected _applyFrame

  • _applyFrame(): void
  • Applies the current frame in the sequence to the element being animated.

    Returns void

Protected _complete

  • Completes the animation, resolving the animation's completion promise.

    Parameters

    • Optional completed: boolean

      Whether or not to indicate that the animation was actually completed, rather than stopped.

    Returns Thenable<AnimationKeyframe>

Protected _onFrameEnd

  • _onFrameEnd(): void
  • Called after each keyframe has been fully applied.

    Returns void

Protected _startAnimation

  • Starts the animation sequences and begins progressing through the animation's states and applying keyframes.

    Returns Deferrable<AnimationEvent>

Protected _tick

  • _tick(): void
  • Moves the animation forward, either to the next keyframe or to the completed state if all keyframes are complete.

    Returns void

add

  • Adds a keyframe to the sequence. The keyframe may represent a pre-defined CSS class, or an object block containing animatable property values. Keyframes may be added to animations that are in progress. However, if the animation has completed, it must be restarted.

    Parameters

    Returns AnimationSequence

play

  • Begins playing the animation, returning a Promise-like object that will be resolved once the animation is complete.

    Parameters

    • Optional frameCallback: AnimationFrameCallback

      An optional callback to invoke after every frame has been applied and immediately before _onFrameEnd is called.

    Returns Deferrable<AnimationEvent>

resets

  • resets(): boolean
  • Returns whether or not this animation resets. An animation that resets should cause the animated element to go back to its original state when complete.

    Returns boolean

setResets

  • Sets whether or not the animation resets to its original state.

    Parameters

    • Optional value: boolean

      Whether or not the animation should reset.

    Returns AnimationSequence

stop

  • Stops playing the animation by preventing subsequent keyframes from being applied. Note that this will not prevent the visual state of the animation from progressing between keyframes. In other words, an animation stopped will continue to animate until the visual state of current keyframe has been reached.

    Returns Thenable<AnimationKeyframe>

Static getActiveAnimationForElement

  • Gets the currently activate animation for a given element, if there is one.

    Parameters

    • element: HTMLElement

      The element to return the active animation for.

    Returns AnimationSequence

Static removeAnimationForElement

  • removeAnimationForElement(element: HTMLElement): boolean
  • Removes the activate animation for a given element, if it exists.

    Parameters

    • element: HTMLElement

      The element to remove the animation for.

    Returns boolean