Add event listeners for prefetch events in the 2D player.
Description
This module provides functionality to listen to a set of events for the prefetching process in the 2D player. It is primarily meant to be used in conjunction with the Prefetch Attributes option, which allows the user to prefetch renders on a configuration change.
TIP:
You will want to register a callback function for these events prior to triggering the
configurator.prefetchAttributes
method or performing configuration changes.
TypeDefinitions
The following types are used by the supported methods.
PrefetchEventType
type PrefetchEventType = 'start' | 'progress' | 'end';
Name | Description |
---|---|
start | This event is triggered when the prefetching process begins during a configuration change, or when the configurator.prefetchAttributes method is called. |
progress | During the prefetch process on a configuration change there may be a stack of different images that will be requested, and a progress event will trigger when each image from this stack has finished loading. |
end | This event is triggered when the prefetching process ends after a configuration change, or when the configurator.prefetchAttributes method has completed its process. |
PrefetchEvent
interface PrefetchEvent {
total: number;
loaded: number;
}
Methods
on (eventType, listener, ctx)
Parameter | Type | Status |
---|---|---|
eventType | PrefetchEventType | Required |
listener | (event: PrefetchEvent) => void | Required |
ctx | any | Optional |
This method allows us to add an event listener for whenever a start
, progress
, or end
event is triggered by the prefetch functionality.
Example:
//Asusme we have a progress bar with a function setProgress()
showLoadingBar();
player.prefetcher.on('progress', e => setProgress(e.loaded / e.total));
configurator.prefetchAttributes(['Rotation'])
once (eventType, listener, ctx)
Parameter | Type | Status |
---|---|---|
eventType | PrefetchEventType | Required |
listener | (event: PrefetchEvent) => void | Required |
ctx | any | Optional |
This method allows us to add an event listener that will only trigger once the first time a start
, progress
, or end
event is fired.
Example:
showLoadingBar();
player.prefetcher.once('end', () => hideLoadingBar());
configurator.prefetchAttributes(['Rotation'])
when (eventType): Promise
Parameter | Type | Status |
---|---|---|
eventType | PrefetchEventType | Required |
This method awaits for a start
, progress
, or end
event, and returns a promise that resolves when the event is emitted.
Example:
showLoadingBar();
player.prefetcher.when('end').then(() => hideLoadingBar());
configurator.prefetchAttributes(['Rotation'])
off (eventType, listener)
Parameter | Type | Status |
---|---|---|
eventType | PrefetchEventType | Required |
listener | (event: PrefetchEvent) => void | Required |
This method allows us to remove an event listener that we registered for using the on
or when
methods for a start
, progress
, or end
event.
Example:
showLoadingBar();
player.prefetcher.on('progress', e => setProgress(e.loaded / e.total));
player.prefetcher.once('end', () => {
player.prefetcher.off('progress')
hideLoadingBar();
});
configurator.prefetchAttributes(['Rotation'])