Vanilla Disintegratev1.0.0
RU
На этой странице

Каждое встроенное имя обозначает пару: отдельную анимацию удаления и логичную анимацию восстановления. Фаза восстановления реализована самостоятельно, а не простым обратным проигрыванием готового таймлайна.

Четыре эффекта

ИмяУдалениеВосстановление
dustЭлемент рассыпается поднимающейся пылью.Пыль собирается в конечной геометрии элемента.
vaporИзображение смягчается и испаряется.Пар конденсируется в видимый элемент.
scatterЧастицы резко разлетаются наружу.Частицы сходятся снаружи.
windПоток уносит частицы в сторону.Тот же поток возвращает их со своего направления.
effects.remove(card, { effect: 'dust' });
effects.restore(card, { effect: 'dust' });

effects.remove(card, { effect: 'vapor' });
effects.restore(card, { effect: 'vapor' });

effects.remove(card, { effect: 'scatter' });
effects.restore(card, { effect: 'scatter' });

effects.remove(card, { effect: 'wind' });
effects.restore(card, { effect: 'wind' });

Эффект по умолчанию

const effects = new Disintegrator({ effect: 'vapor' });

effects.remove(firstElement); // vapor
effects.remove(secondElement, { effect: 'scatter' });
effects.restore(insertedElement, { effect: 'wind' });

Запомненная пара

const removal = effects.remove(card, {
  effect: 'wind',
  retain: true,
});

await removal.finished;
const retained = effects.take(removal.removalId!);

if (retained) {
  list.prepend(retained);
  await effects.restore(retained).finished; // восстановление wind
}

Передайте effect в restore(), только если хотите сознательно заменить запомненную пару.

Слоты звука

У каждой фазы собственный слот аудио. Сейчас звук есть у dust.remove и wind.remove; остальные шесть слотов намеренно равны null до появления подходящих файлов. Звук подключается явно: sound: true включает встроенные дорожки для экземпляра или отдельного вызова, sound: false оставляет их выключенными, не меняя анимацию.

Редактировать страницу на GitHub