|
|
@ -439,19 +439,21 @@ function create_transition(dom, init, direction, effect) {
|
|
|
|
// If we are working with CSS animations, then before we call reverse, we also need to ensure
|
|
|
|
// If we are working with CSS animations, then before we call reverse, we also need to ensure
|
|
|
|
// that we reverse the easing logic. To do this we need to re-create the keyframes so they're
|
|
|
|
// that we reverse the easing logic. To do this we need to re-create the keyframes so they're
|
|
|
|
// in reverse with easing properly reversed too.
|
|
|
|
// in reverse with easing properly reversed too.
|
|
|
|
if (payload !== null && payload.css !== undefined) {
|
|
|
|
if (
|
|
|
|
|
|
|
|
payload !== null &&
|
|
|
|
|
|
|
|
payload.css !== undefined &&
|
|
|
|
|
|
|
|
/** @type {Animation} */ (animation).effect != null
|
|
|
|
|
|
|
|
) {
|
|
|
|
const duration = payload.duration ?? 300;
|
|
|
|
const duration = payload.duration ?? 300;
|
|
|
|
const css_fn = payload.css;
|
|
|
|
const css_fn = payload.css;
|
|
|
|
const easing_fn = payload.easing || linear;
|
|
|
|
const easing_fn = payload.easing || linear;
|
|
|
|
const keyframes = create_keyframes(easing_fn, css_fn, duration, direction, true);
|
|
|
|
const keyframes = create_keyframes(easing_fn, css_fn, duration, direction, true);
|
|
|
|
if (/** @type {Animation} */ (animation).effect != null) {
|
|
|
|
// If we have an existing animation, we need to pause it and create a new animation
|
|
|
|
// If we have an existing animation, we need to pause it and create a new animation
|
|
|
|
// with the new frames.
|
|
|
|
// with the new frames.
|
|
|
|
animation.pause();
|
|
|
|
animation.pause();
|
|
|
|
create_animation();
|
|
|
|
create_animation();
|
|
|
|
// @ts-ignore
|
|
|
|
// @ts-ignore
|
|
|
|
animation.effect.setKeyframes(keyframes);
|
|
|
|
animation.effect.setKeyframes(keyframes);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
/** @type {Animation | TickAnimation} */ (animation).reverse();
|
|
|
|
/** @type {Animation | TickAnimation} */ (animation).reverse();
|
|
|
|
} else {
|
|
|
|
} else {
|
|
|
|