Method animate

adev/src/app/features/home/animation/animation.ts:409–439

Animate function.

(then: number, elapsed: number)

  /** Animate function. */
  private animate(then: number, elapsed: number) {
    this.animationFrameId = requestAnimationFrame(() => this.animate(then, elapsed));

    const now = Date.now();
    elapsed = now - then;

    if (elapsed >= this.config.timestep) {
      // Subtract the overflowed time from Now to maintain steady fps.
      then = now - (elapsed % this.config.timestep);

      const time = this.currentTime + elapsed;

      if (time <= this._duration) {
        this.updateFrame(time);
      } else {
        // Pause the animation and mark it as completed
        // when we go over the duration.
        this.pause();
        this.completed = true;

        // Since the last frame can be few milliseconds behind the duration
        // (e.g. duration = 5000; current time = 4998) when the animation is
        // completed, we perform one additional call to updateFrame in order
        // to visualize any remaining static rules that match exactly the end
        // of the animation.
        if (this.duration > this.currentTime) {
          requestAnimationFrame(() => this.updateFrame(this.duration));
        }
      }
    }
  }

  /** Extract the objects from the selectors and validate their rules. */
  private extractObjectsAndValidateRules(definition: AnimationDefinition) {