Plugin Custom Events

This plugin triggers CustomEvents for Tiny Carousel core lifecycle events. This allows for the external code to be triggered right when it is necessary. Before or after an exact action - for example after the tiny carousel got initialized.

The plugin also extends Tiny Carousel instance with additional methods. Read more about it in the instance methods section.

TIP

This plugin is often a required dependency for the other parts of Tiny Carousel ecosystem.

To learn on how to install and use plugin, please see our usage guide.

For complete list of custom events raised by this plugin, please head directly to the events section.

Instance methods

carousel.on

• Arguments:

  • {string} eventName
  • {function} listener
  • {object | boolean} options <optional>

• Returns: this - this TinyCarousel instance (for chaining purposes)

• Usage:

  Method used to set a handler triggered for an event eventName. listener and options argument types are based on and passed directly to a native addEventListener method.

carousel.off

• Arguments:

  • {string} eventName
  • {function} listener

• Returns: this - this TinyCarousel instance (for chaining purposes)

• Usage:

  Method used to remove the event eventName listener that has been added via carousel.on method.

carousel.dispatch

• Arguments:

  • {string} eventName
  • {unknown} payload <optional>
  • {object} options <optional>

• Returns: this - this TinyCarousel instance (for chaining purposes)

• Usage:

  Method used to dispatch custom event eventName on Tiny Carousel instance.

  • payload

    • If not an object - will be turned into one as follows: { data: payload }
    • Then (or firstly, if payload was an object) it will be enhanced with tinyCarousel field which would contain a reference to the TinyCarousel instance
    • Lastly, such formatted object will be passed to the native CustomEvent as event`s payload

  • options argument is passed directly to the constructor of CustomEvent and thus might contain fields of the eventInit type - so, bubbles, cancelable or composed

Events

List of events triggered by default when Plugin Custom Events is used:

Event Name	Event Payload
before:init	StandardRequiredPayload
after:init	StandardRequiredPayload
before:go-to	GoToEventPayload
after:go-to	GoToEventPayload
error:go-to	GoToErrorEventPayload
before:find-possible-items	StandardRequiredPayload
after:find-possible-items	StandardRequiredPayload

Payload Types

StandardRequiredPayload

• Properties:

  • {TinyCarousel} tinyCarousel

• Details:

  Standard payload type describing fields which are available in the every event dispatched through plugin-custom-events. tinyCarousel field holds reference to the current TinyCarousel instance.

GoToEventPayload

• Properties:

  • {TinyCarousel} tinyCarousel
  • {SlideInfo} to

• Details:

  Data type which holds information about the active slide change process. For the description of the rest of fields, please look into StandardRequiredPayload section.

GoToErrorEventPayload

• Properties:

  • {TinyCarousel} tinyCarousel
  • {SlideInfo} to
  • {'overflow'} cause

• Details:

Data type which hold information about the slide change process which have failed and a cause of its error. Current list of possible causes: `overflow`. For the description of the rest of fields, please look into [`StandardRequiredPayload`](#standardrequiredpayload) section.