Quick View API reference

Events

Listed below are all the events emitted by the quick view component. Use .on() to register event listeners to each of these events.

library.quickView.Event.CLOSE

The quick view component is about to close.

library.quickView.Event.CLOSED

The quick view component has closed. All transitions and closing animations are completed.

library.quickView.Event.OPEN

The quick view component is about to open.

library.quickView.Event.OPENED

The quick view component has opened. All transitions and opening animations are completed.

Methods

This section lists the public methods the quick view component exposes.

hide()

Hide the quick view currently visible.

Usage example:

library.quickView.hide();

off(event: string, handler: () => void)

Removes a previously registered event listener from receiving any more events.

Parameters

event — A string which specifies the type of event for which to remove an event listener.

handler — The event listener function of the event handler to remove from the LiSA player.

Usage example:

const handler = (err) => {
  console.error('Quick view opens', err);
};

// Register the event handler
library.quickView.on(library.quickView.Event.OPEN, handler);

// Remove the event handler again
library.quickView.off(library.quickView.Event.OPEN, handler);

on(event: string, handler)

Registeres an event handler for any of the events listed above.

Usage example:

library.quickView.on(library.quickView.Event.CLOSED, () => {
  consoel.log('Quick view closed');
});

removeAllListeners(event: string)

Remove all event listeners previously registered to the LiSA player.

Usage example:

library.quickView.on(library.quickView.Event.OPEN, () => console.log('Quick view opens'));

library.quickView.on(library.quickView.Event.CLOSE, () => console.log('Quick view closes'));

// Prevent all listeners from being invoked
library.quickView.removeAllListeners();

show(url: string)

Open the given url in the quick view component.

Usage example:

library.player.on(library.player.Event.PRODUCT_VIEW, (payload, first, product) => {
  // payload action contains the product URL in this example
  library.quickView.show(payload.action);
});

Last updated