From f05a472585b2506da21aed71f0252b2d4c04a221 Mon Sep 17 00:00:00 2001 From: Indrajith K L Date: Mon, 5 Feb 2024 04:15:02 +0530 Subject: React Slides * Adds useState * State * useEffect * Side Effects --- src/lib/motion/signal.ts | 61 ++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 61 insertions(+) create mode 100644 src/lib/motion/signal.ts (limited to 'src/lib/motion/signal.ts') diff --git a/src/lib/motion/signal.ts b/src/lib/motion/signal.ts new file mode 100644 index 0000000..99697ce --- /dev/null +++ b/src/lib/motion/signal.ts @@ -0,0 +1,61 @@ +import { tweened, type TweenedOptions } from 'svelte/motion' +import { cubicInOut } from 'svelte/easing' +import { interpolate } from 'd3-interpolate' +import type { AnimationFn, Resolve } from './types' + +export function signal( + values: TweenValues, + options: TweenedOptions = {} +) { + const { subscribe, update, set } = tweened(values, { + duration: 1000, + easing: cubicInOut, + interpolate, + ...options, + }) + + let tasks: AnimationFn[] = [] + + function to( + this: any, + values: Partial, + toOptions: TweenedOptions = {} + ) { + if (typeof values === 'object') { + tasks.push(() => update((prev) => ({ ...prev, ...values }), toOptions)) + } else { + tasks.push(() => set(values, toOptions)) + } + return this + } + + function reset() { + set(values, { duration: 0 }) + tasks = [] + } + + function sfx(this: any, sound: string, { volume = 0.5 } = {}) { + const audio = new Audio(sound) + audio.volume = volume + + tasks.push(async () => { + audio + .play() + .catch(() => + console.error('To play sounds interact with the page first.') + ) + }) + + return this + } + + async function then(resolve: Resolve) { + for (const task of tasks) { + await task() + } + resolve() + tasks = [] + } + + return { subscribe, to, reset, sfx, then } +} -- cgit v1.2.3