Two-way favorites synchronization

To activate two-way favorites synchronization you need to set the parameter enable_two_way_favorites=1 in integration.

При двусторонней синхронизации избранных артикулов управление избранным полностью передается на вашу сторону. Так как интеграция ВЕБ-визуализатора в сайт происходит с помощью тега iframe, то общение между ВЕБ-визуализатором и сайтом происходит с помощью метода window.postMessage .  При каком либо действии с избранными артикулами ВЕБ-визуализатор вызывает метод window.postMessage с определенными параметрами которое необходимо обработать и после этого сообщить ВЕБ-визуализатору текущее состояние списка избранных артикулов.

При открытии визуализатора необходимо сообщить текущее состояние избранного ВЕБ-визуализатору для синхронизации избранных артикулов. Для это необходимо вызвать событие window.postMessage описанное ниже

window.frames.wizartFittingRoom.onload = (() => {
  window.frames.wizartFittingRoom.postMessage({
    eventName: 'setFavoritesStore',
    payload: ['vendor_code_1', 'vendor_code_2'],
  }, '*');
});

где в payload необходимо передать массив vendor кодов, а wizartFittingRoom это iframe’s name.

При добавлении артикула в избранное ВЕБ-визуализатор вызывает событие window.postMessage с name: addFavorite.

// Subscription to the event of adding product to the fovarites
window.addEventListener('message', (event) => {
  if (event.data && event.data.eventName === 'addFavorite') {
    // Event handling
  }
}, false);

Data format:
event.data = {
  eventName: 'addFavorite',
  payload: { 
    item: {
      vendor_code: 'vendor_code', // type string
    },
  },
}

После того как выполните на своей стороне действия по обработке события addFavorite необходимо сообщить ВЕБ-визуализатору текущее состояние избранного вызвав событие setFavoritesStore описанное выше.

При удалении артикула из избранного ВЕБ-визуализатор вызывает событие window.postMessage с name: removeFavorite.

// Subscription to the event of delete product
window.addEventListener('message', (event) => {
  if (event.data && event.data.eventName === 'removeFavorite') {
    // Event handling
  }
}, false);

Data format:
event.data = {
  eventName: 'removeFavorite',
  payload: { 
    item: {
      vendor_code: 'vendor_code', // type string
    },
  },
}

После того как выполните на своей стороне действия по обработке события removeFavorite необходимо сообщить ВЕБ-визуализатору текущее состояние избранного вызвав событие setFavoritesStore описанное выше.

Если необходимо получить все артикулы находящиеся в избранном на текущий момент необходимо вызывать событие window.postMessage с name: getFavoritesStore.

window.frames.wizartFittingRoom.onload = (() => {
    // Calling the event of getting the list of products from the shopping cart.
    window.frames.wizartFittingRoom.postMessage({
      eventName: 'getFavoritesStore'
    }, '*');
});

В ответ на запрос getFavoritesStore ВЕБ-визуализатор вызывает событие window.postMessage с name: getFavorites.

// Subscription to the event to get favorites
window.addEventListener('message', (event) => {
  if (event.data && event.data.eventName === 'getFavorites') {
    // Event handling
  }
}, false);

Data format:
event.data = {
  eventName: 'getFavorites',
  payload: { 
    list: ['vendor_code_1', 'vendor_code_2'],
    },
  },
}