destroy

Метод destroy является важным инструментом управления жизненным циклом экземпляра Driver в библиотеке Driver.js. Он предназначен для полного завершения работы интерактивного руководства по пользовательскому интерфейсу и освобождения ресурсов, связанных с текущей сессией.

Основное назначение

destroy полностью удаляет все DOM-элементы, которые были созданы Driver.js для подсветки и подсказок, включая:

  • Оверлеи (overlays) — затемнённые области вокруг элементов интерфейса.
  • Подсказки (tooltips) — информационные всплывающие окна с инструкциями.
  • Навигационные элементы — стрелки, кнопки “Next”, “Previous”, индикаторы шага.

После вызова метода объект Driver становится неактивным, и дальнейшее использование старого экземпляра без повторной инициализации приведёт к ошибкам.

Синтаксис

driver.destroy();

Где driver — это экземпляр Driver, созданный через конструктор:

const driver = new Driver(options);

Поведение метода

  • Удаление всех подсветок: все элементы, подсвеченные во время работы Driver, теряют свои стили.
  • Очистка событий: все события кликов и навигации внутри Driver снимаются.
  • Возврат DOM в исходное состояние: элементы страницы возвращаются к состоянию, в котором находились до запуска руководства.
  • Остановка анимаций: любые активные анимации или переходы, запущенные Driver, прекращаются.

Применение в сценариях

Метод destroy особенно полезен в следующих случаях:

  1. Преждевременное завершение руководства Если пользователь закрывает руководство до конца, вызов destroy гарантирует корректное удаление всех элементов интерфейса и предотвращение утечек памяти.

    document.querySelector("#close-tour").addEventListener("click", () => {
    driver.destroy();
});

  2. Повторное использование Driver Когда требуется полностью пересоздать шаги руководства, старый экземпляр необходимо уничтожить:

    driver.destroy();
const newDriver = new Driver(newOptions);
newDriver.start();

  3. Динамические изменения страницы Если структура DOM изменяется после запуска руководства, старый Driver может стать некорректным. Вызов destroy перед созданием нового экземпляра предотвращает конфликты.

Важные нюансы

  • После вызова destroy невозможно возобновить старую сессию. Не следует использовать этот метод, если планируется пауза или временное скрытие подсказок.
  • В отличие от методов reset или stop, destroy полностью очищает все внутренние данные, включая настройки и шаги.
  • Метод безопасен для многократного вызова — повторное использование на уже уничтоженном экземпляре не вызывает ошибок, однако возвращает Driver в неактивное состояние.

Пример комплексного использования

const driver = new Driver({
    animate: true,
    opacity: 0.75,
    padding: 10,
    stageBackground: "#ffffff"
});

// Определение шагов
driver.defineSteps([
    { element: "#step1", popover: { title: "Шаг 1", description: "Описание первого шага" } },
    { element: "#step2", popover: { title: "Шаг 2", description: "Описание второго шага" } }
]);

// Запуск
driver.start();

// Завершение при условии определённого события
document.querySelector("#end-tour").addEventListener("click", () => {
    driver.destroy(); // полностью очищает интерфейс
});

Метод destroy обеспечивает безопасное и полное завершение всех визуальных и функциональных компонентов Driver.js, предотвращая накопление неиспользуемых элементов и потенциальные конфликты с остальными скриптами на странице.

Оглавление