1 line
12 KiB
Plaintext
1 line
12 KiB
Plaintext
{"version":3,"file":"AsyncMotionValueAnimation.mjs","sources":["../../../src/animation/AsyncMotionValueAnimation.ts"],"sourcesContent":["import { MotionGlobalConfig, noop } from \"motion-utils\"\nimport { time } from \"../frameloop/sync-time\"\nimport { JSAnimation } from \"./JSAnimation\"\nimport { getFinalKeyframe } from \"./keyframes/get-final\"\nimport {\n KeyframeResolver as DefaultKeyframeResolver,\n flushKeyframeResolvers,\n ResolvedKeyframes,\n} from \"./keyframes/KeyframesResolver\"\nimport { NativeAnimationExtended } from \"./NativeAnimationExtended\"\nimport {\n AnimationPlaybackControls,\n AnyResolvedKeyframe,\n TimelineWithFallback,\n ValueAnimationOptions,\n} from \"./types\"\nimport { canAnimate } from \"./utils/can-animate\"\nimport { makeAnimationInstant } from \"./utils/make-animation-instant\"\nimport { WithPromise } from \"./utils/WithPromise\"\nimport { supportsBrowserAnimation } from \"./waapi/supports/waapi\"\n\n/**\n * Maximum time allowed between an animation being created and it being\n * resolved for us to use the latter as the start time.\n *\n * This is to ensure that while we prefer to \"start\" an animation as soon\n * as it's triggered, we also want to avoid a visual jump if there's a big delay\n * between these two moments.\n */\nconst MAX_RESOLVE_DELAY = 40\n\ntype OptionsWithoutKeyframes<T extends AnyResolvedKeyframe> = Omit<\n ValueAnimationOptions<T>,\n \"keyframes\"\n>\n\nexport class AsyncMotionValueAnimation<T extends AnyResolvedKeyframe>\n extends WithPromise\n implements AnimationPlaybackControls\n{\n private createdAt: number\n\n private resolvedAt: number | undefined\n\n private _animation: AnimationPlaybackControls | undefined\n\n private pendingTimeline: TimelineWithFallback | undefined\n\n private keyframeResolver: DefaultKeyframeResolver | undefined\n\n private stopTimeline: VoidFunction | undefined\n\n constructor({\n autoplay = true,\n delay = 0,\n type = \"keyframes\",\n repeat = 0,\n repeatDelay = 0,\n repeatType = \"loop\",\n keyframes,\n name,\n motionValue,\n element,\n ...options\n }: ValueAnimationOptions<T>) {\n super()\n\n this.createdAt = time.now()\n\n const optionsWithDefaults: OptionsWithoutKeyframes<T> = {\n autoplay,\n delay,\n type,\n repeat,\n repeatDelay,\n repeatType,\n name,\n motionValue,\n element,\n ...options,\n }\n\n const KeyframeResolver =\n element?.KeyframeResolver || DefaultKeyframeResolver\n\n this.keyframeResolver = new KeyframeResolver(\n keyframes,\n (\n resolvedKeyframes: ResolvedKeyframes<T>,\n finalKeyframe: T,\n forced: boolean\n ) =>\n this.onKeyframesResolved(\n resolvedKeyframes,\n finalKeyframe,\n optionsWithDefaults,\n !forced\n ),\n name,\n motionValue,\n element\n )\n this.keyframeResolver?.scheduleResolve()\n }\n\n onKeyframesResolved(\n keyframes: ResolvedKeyframes<T>,\n finalKeyframe: T,\n options: OptionsWithoutKeyframes<T>,\n sync: boolean\n ) {\n this.keyframeResolver = undefined\n\n const { name, type, velocity, delay, isHandoff, onUpdate } = options\n this.resolvedAt = time.now()\n\n /**\n * If we can't animate this value with the resolved keyframes\n * then we should complete it immediately.\n */\n if (!canAnimate(keyframes, name, type, velocity)) {\n if (MotionGlobalConfig.instantAnimations || !delay) {\n onUpdate?.(getFinalKeyframe(keyframes, options, finalKeyframe))\n }\n\n keyframes[0] = keyframes[keyframes.length - 1]\n\n makeAnimationInstant(options)\n options.repeat = 0\n }\n\n /**\n * Resolve startTime for the animation.\n *\n * This method uses the createdAt and resolvedAt to calculate the\n * animation startTime. *Ideally*, we would use the createdAt time as t=0\n * as the following frame would then be the first frame of the animation in\n * progress, which would feel snappier.\n *\n * However, if there's a delay (main thread work) between the creation of\n * the animation and the first committed frame, we prefer to use resolvedAt\n * to avoid a sudden jump into the animation.\n */\n const startTime = sync\n ? !this.resolvedAt\n ? this.createdAt\n : this.resolvedAt - this.createdAt > MAX_RESOLVE_DELAY\n ? this.resolvedAt\n : this.createdAt\n : undefined\n\n const resolvedOptions = {\n startTime,\n finalKeyframe,\n ...options,\n keyframes,\n }\n\n /**\n * Animate via WAAPI if possible. If this is a handoff animation, the optimised animation will be running via\n * WAAPI. Therefore, this animation must be JS to ensure it runs \"under\" the\n * optimised animation.\n */\n const useWaapi = !isHandoff && supportsBrowserAnimation(resolvedOptions)\n const element = resolvedOptions.motionValue?.owner?.current\n\n const animation = useWaapi\n ? new NativeAnimationExtended({\n ...resolvedOptions,\n element,\n } as any)\n : new JSAnimation(resolvedOptions)\n\n animation.finished.then(() => {\n this.notifyFinished()\n }).catch(noop)\n\n if (this.pendingTimeline) {\n this.stopTimeline = animation.attachTimeline(this.pendingTimeline)\n this.pendingTimeline = undefined\n }\n\n this._animation = animation\n }\n\n get finished() {\n if (!this._animation) {\n return this._finished\n } else {\n return this.animation.finished\n }\n }\n\n then(onResolve: VoidFunction, _onReject?: VoidFunction) {\n return this.finished.finally(onResolve).then(() => {})\n }\n\n get animation(): AnimationPlaybackControls {\n if (!this._animation) {\n this.keyframeResolver?.resume()\n flushKeyframeResolvers()\n }\n\n return this._animation!\n }\n\n get duration() {\n return this.animation.duration\n }\n\n get iterationDuration() {\n return this.animation.iterationDuration\n }\n\n get time() {\n return this.animation.time\n }\n\n set time(newTime: number) {\n this.animation.time = newTime\n }\n\n get speed() {\n return this.animation.speed\n }\n\n get state() {\n return this.animation.state\n }\n\n set speed(newSpeed: number) {\n this.animation.speed = newSpeed\n }\n\n get startTime() {\n return this.animation.startTime\n }\n\n attachTimeline(timeline: TimelineWithFallback) {\n if (this._animation) {\n this.stopTimeline = this.animation.attachTimeline(timeline)\n } else {\n this.pendingTimeline = timeline\n }\n\n return () => this.stop()\n }\n\n play() {\n this.animation.play()\n }\n\n pause() {\n this.animation.pause()\n }\n\n complete() {\n this.animation.complete()\n }\n\n cancel() {\n if (this._animation) {\n this.animation.cancel()\n }\n\n this.keyframeResolver?.cancel()\n }\n\n /**\n * Bound to support return animation.stop pattern\n */\n stop = () => {\n if (this._animation) {\n this._animation.stop()\n this.stopTimeline?.()\n }\n\n this.keyframeResolver?.cancel()\n }\n}\n"],"names":["KeyframeResolver","DefaultKeyframeResolver"],"mappings":"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"} |