1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
|
import type {
ElementAnimations,
EffectParamPath,
} from "@/animation/types";
import type { ParamValues } from "@/params";
import { removeElementKeyframe } from "./keyframes";
import { resolveAnimationPathValueAtTime } from "./resolve";
export const EFFECT_PARAM_PATH_PREFIX = "effects.";
export const EFFECT_PARAM_PATH_SUFFIX = ".params.";
export function buildEffectParamPath({
effectId,
paramKey,
}: {
effectId: string;
paramKey: string;
}): EffectParamPath {
return `${EFFECT_PARAM_PATH_PREFIX}${effectId}${EFFECT_PARAM_PATH_SUFFIX}${paramKey}`;
}
export function isEffectParamPath(
propertyPath: string,
): propertyPath is EffectParamPath {
return (
propertyPath.startsWith(EFFECT_PARAM_PATH_PREFIX) &&
propertyPath.includes(EFFECT_PARAM_PATH_SUFFIX)
);
}
export function parseEffectParamPath({
propertyPath,
}: {
propertyPath: string;
}): { effectId: string; paramKey: string } | null {
if (!isEffectParamPath(propertyPath)) {
return null;
}
const withoutPrefix = propertyPath.slice(EFFECT_PARAM_PATH_PREFIX.length);
const separatorIndex = withoutPrefix.indexOf(EFFECT_PARAM_PATH_SUFFIX);
if (separatorIndex <= 0) {
return null;
}
const effectId = withoutPrefix.slice(0, separatorIndex);
const paramKey = withoutPrefix.slice(
separatorIndex + EFFECT_PARAM_PATH_SUFFIX.length,
);
if (!effectId || !paramKey) {
return null;
}
return { effectId, paramKey };
}
export function resolveEffectParamsAtTime({
effectId,
params,
animations,
localTime,
}: {
effectId: string;
params: ParamValues;
animations: ElementAnimations | undefined;
localTime: number;
}): ParamValues {
const safeLocalTime = Math.max(0, localTime);
const resolved: ParamValues = {};
for (const [paramKey, staticValue] of Object.entries(params)) {
const path = buildEffectParamPath({ effectId, paramKey });
resolved[paramKey] = animations?.bindings[path]
? resolveAnimationPathValueAtTime({
animations,
propertyPath: path,
localTime: safeLocalTime,
fallbackValue: staticValue,
})
: staticValue;
}
return resolved;
}
export function removeEffectParamKeyframe({
animations,
effectId,
paramKey,
keyframeId,
}: {
animations: ElementAnimations | undefined;
effectId: string;
paramKey: string;
keyframeId: string;
}): ElementAnimations | undefined {
return removeElementKeyframe({
animations,
propertyPath: buildEffectParamPath({ effectId, paramKey }),
keyframeId,
});
}
|
