Event Bus

Описание

Event Bus — шина событий

Она предназначена для простого взаимодействия базового функционала с остальными скриптами, не привязываясь при этом к верстке и вспомогательным объектам.

Работает по принципу Pub/Sub (Издатель/Подписчик) и построена на Deferred, что позволяет:

  • привязать к одному событию (Издателю) несколько обработчиков (Подписчиков)
  • обработчики событий сработают, даже если событие произошло раньше того, как мы к нему привязали обработчик.
  • не важен порядок объявления Издателя и Подпсичиков

Работа с шиной производится через объект EventBus.

 

js
        
          

/*Подключаем Подписчика №1*/
EventBus.subscribe('event1', function (data) {
  console.log('event1:', data);
});

 

/*Запускаем Издателя*/
EventBus.publish('event1', 'hello World!');
// -> event1:hello World!

 

/*Подключаем Подписчика №2*/
EventBus.subscribe('event1', function (data) {
  console.log(data, 'Let\'s rock');
})
// -> hello World!Let's rock

 

/*Запускаем Издателя*/
EventBus.publish('event1', 'hello Mars!');
// -> event1:hello Mars!
// -> hello Mars!Let's rock

Подписчик

В работе с API необходимо привязываться подписчикам, так как издатели объявлены внутри API.
Например при добавлении товара в корзину внутри API публикуется событие add_items:insales:cart:

EventBus.publish('add_items:insales:cart', data);

Данные которые переданы через EventBus.publish, доступны в подписчике.

EventBus.subscribe('add_items:insales:cart', function (data) {
  console.log('add_items:insales:cart:', data);
});

В данных подписчика всегда доступен объект action, он содержит свойство method, а также дополнительные сведения, взависимости от события. 
В дополнительных свойствах объекта action могут быть:

  • Ссылка на jQuery объект DOM узла с которым произошло взаимодействие
  • Обновленные данные компонента (Cart, Products и т.д.)
  • Остальное смотреть через console.log или EventBus.logger
js
        
          

EventBus.subscribe('add_items:insales:cart', function (data) {
  console.log('add_items:insales:cart:', data);
});

EventBus.logger

Logger необходим для просмотра срабатываемых событий и данных которые приходят в callback функции подписчиков.

Чтобы воспользоваться логгером, в консоль браузера нужно прописать — EventBus.logger.add('Имя компонента в нижнем регистре'), например:

  • EventBus.logger.add('cart')

Список компонентов:

  • cart
  • product
  • search
  • compares
js
        
          

EventBus.logger.add('cart')

EventBus.logger.add('product')

Methods

add(component)

Добавление логера для компонента

 

publish(eventId, data)

Публикация события с данными

 

subscribe(eventId, callback)

Подписаться на событие

js
        
          

EventBus.logger.add('cart')

EventBus.publish('test_event', {isTest: true, title: 'Test', status: 'ok'});

EventBus.subscribe('test_event', function (data) {
  console.log(data)
});