Обработчики пользовательских действий

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

Структура обработчика определяется стандартным интерфейсом:

function handler(event, state) {
    // event — объект события
    // state — текущие данные модели Mind.js
}

event содержит сведения о типе события, источнике и дополнительных параметрах, а state предоставляет доступ к внутреннему состоянию сети и хранилищу данных.

Регистрация обработчиков

Для привязки обработчика к элементу или событию используется метод addActionHandler:

mind.addActionHandler("click", "button#start", function(event, state) {
    state.network.activate([1, 0, 0]);
});

Параметры метода:

  • тип события — строка, например "click", "input", "hover".
  • селектор или идентификатор источника события — строка с CSS-селектором или ID элемента.
  • обработчик — функция, выполняемая при срабатывании события.

Можно привязывать несколько обработчиков к одному элементу и событию, что позволяет создавать сложные цепочки реакций без изменения исходного кода нейронной сети.

Контекст состояния

Обработчики получают объект состояния, который содержит следующие ключевые поля:

  • network — экземпляр нейронной сети Mind.js;
  • data — текущее состояние данных модели;
  • params — пользовательские параметры для передачи в обработчик;
  • lastEvent — информация о предыдущем событии.

Это позволяет сохранять состояние между вызовами и использовать предыдущие результаты для вычислений.

Пример использования состояния для обновления данных сети:

mind.addActionHandler("input", "input#userText", function(event, state) {
    state.data.userInput = event.target.value;
    state.network.activate([event.target.value.length / 10]);
});

Асинхронные обработчики

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

mind.addActionHandler("click", "#fetchData", async (event, state) => {
    const response = await fetch("/api/data");
    const result = await response.json();
    state.data.apiResult = result;
    state.network.activate([result.value]);
});

Асинхронные обработчики не блокируют основной поток и позволяют плавно интегрировать нейросетевую логику с внешними источниками данных.

Фильтрация и условная активация

Можно создавать обработчики, которые срабатывают только при выполнении определённого условия:

mind.addActionHandler("click", "#submitButton", function(event, state) {
    if (state.data.userInput && state.data.userInput.length > 3) {
        state.network.activate([1]);
    }
});

Это позволяет реализовывать контролируемые действия, где реакция сети зависит от состояния данных или контекста интерфейса.

Приоритет и порядок выполнения

Mind.js позволяет задавать приоритет обработчиков через опциональный параметр:

mind.addActionHandler("click", "#start", handler, { priority: 10 });
  • Приоритет выше — обработчик выполняется раньше.
  • Приоритет ниже — обработчик выполняется после.

Это важно при построении сложных взаимодействий, когда одни события зависят от результатов других.

Снятие обработчиков

Для управления жизненным циклом событий используется метод removeActionHandler:

mind.removeActionHandler("click", "#start", handler);

Можно удалять отдельные обработчики или все обработчики для конкретного события и элемента. Это предотвращает утечки памяти и дублирование срабатываний при динамическом создании элементов интерфейса.

Примеры сложных цепочек действий

Обработчики можно объединять в последовательности, чтобы создавать сценарии с несколькими этапами:

mind.addActionHandler("click", "#step1", function(event, state) {
    state.data.step1Complete = true;
});

mind.addActionHandler("click", "#step2", function(event, state) {
    if (state.data.step1Complete) {
        state.network.activate([0, 1]);
    }
});

Таким образом обеспечивается поэтапная активация сети на основе действий пользователя.

Встроенные утилиты для обработки событий

Mind.js содержит вспомогательные методы для упрощения работы с событиями:

  • getEventTarget(event) — получение DOM-элемента, вызвавшего событие;
  • preventDefault(event) — отмена стандартного поведения элемента;
  • stopPropagation(event) — остановка распространения события.

Использование этих утилит повышает читаемость и надёжность обработчиков.

Оглавление