Skip to content

LoadingManager

Defined in: packages/core/src/ui/loading-manager.ts:110

Manages loading states and optional UI overlays.

Provides centralized loading state management with optional visual feedback. Emits events for all loading state changes, allowing external UI integration. Can optionally show built-in loading overlays with spinners and error messages.

Features:

  • Event-driven state changes
  • Optional loading UI overlays
  • Customizable messages and spinner styles
  • Minimum display time to prevent flashing
  • Retry support with visual feedback
  • Multiple concurrent loading operations
const manager = new LoadingManager({
showUI: true,
minDisplayTime: 300
});
// Listen to loading events
manager.on('loading:start', ({ layerId }) => {
console.log(`Loading ${layerId}...`);
});
// Show loading state
const container = document.getElementById('map-container');
manager.showLoading('vehicles', container, 'Loading vehicle data...');
// Hide when complete
manager.hideLoading('vehicles', { fromCache: false });
// Show error with retry
manager.showError('vehicles', container, new Error('Failed'), () => {
// Retry logic
});

new LoadingManager(config?): LoadingManager

Defined in: packages/core/src/ui/loading-manager.ts:143

Create a new LoadingManager.

ParameterTypeDescription
config?Partial<LoadingConfig>Loading manager configuration

LoadingManager

const manager = new LoadingManager({
showUI: true,
messages: {
loading: 'Fetching data...',
error: 'Could not load data'
},
spinnerStyle: 'dots',
minDisplayTime: 500
});

EventEmitter.constructor

clearAll(): void

Defined in: packages/core/src/ui/loading-manager.ts:376

Clear all loading states and UI.

void

manager.clearAll();

destroy(): void

Defined in: packages/core/src/ui/loading-manager.ts:396

Clean up all resources.

void

manager.destroy();

eventNames(): keyof LoadingEvents[]

Defined in: packages/core/src/utils/event-emitter.ts:211

Get all event names that have registered handlers

keyof LoadingEvents[]

Array of event names

const events = emitter.eventNames();
console.log('Events with handlers:', events);

EventEmitter.eventNames


getState(layerId): LoadingState | null

Defined in: packages/core/src/ui/loading-manager.ts:346

Get loading state for a layer.

ParameterTypeDescription
layerIdstringLayer identifier

LoadingState | null

Loading state or null if not found

const state = manager.getState('earthquakes');
if (state?.isLoading) {
console.log('Still loading...');
}

hasListeners<K>(event): boolean

Defined in: packages/core/src/utils/event-emitter.ts:228

Check if an event has any registered handlers

Type Parameter
K extends keyof LoadingEvents
ParameterTypeDescription
eventKEvent name

boolean

True if the event has at least one handler

if (emitter.hasListeners('message')) {
emitter.emit('message', { text: 'Hello' });
}

EventEmitter.hasListeners


hideLoading(layerId, result?): void

Defined in: packages/core/src/ui/loading-manager.ts:211

Hide loading state for a layer.

ParameterTypeDescription
layerIdstringLayer identifier
result?{ fromCache: boolean; }Optional result information
result.fromCache?boolean-

void

manager.hideLoading('earthquakes', { fromCache: true });

isLoading(layerId): boolean

Defined in: packages/core/src/ui/loading-manager.ts:364

Check if a layer is currently loading.

ParameterTypeDescription
layerIdstringLayer identifier

boolean

True if loading, false otherwise

if (manager.isLoading('earthquakes')) {
console.log('Loading in progress');
}

listenerCount<K>(event): number

Defined in: packages/core/src/utils/event-emitter.ts:195

Get the number of handlers registered for an event

Type Parameter
K extends keyof LoadingEvents
ParameterTypeDescription
eventKEvent name

number

Number of registered handlers

const count = emitter.listenerCount('message');
console.log(`${count} handlers registered`);

EventEmitter.listenerCount


off<K>(event, handler): void

Defined in: packages/core/src/utils/event-emitter.ts:120

Remove an event handler

Type Parameter
K extends keyof LoadingEvents
ParameterTypeDescription
eventKEvent name
handlerEventHandler<LoadingEvents[K]>Handler function to remove

void

const handler = (data) => console.log(data);
emitter.on('message', handler);
emitter.off('message', handler);

EventEmitter.off


on<K>(event, handler): () => void

Defined in: packages/core/src/utils/event-emitter.ts:65

Register an event handler

Type Parameter
K extends keyof LoadingEvents
ParameterTypeDescription
eventKEvent name to listen for
handlerEventHandler<LoadingEvents[K]>Callback function to invoke when event is emitted

Unsubscribe function that removes this specific handler

() => void

const unsubscribe = emitter.on('message', (data) => {
console.log(data.text);
});
// Later, to unsubscribe:
unsubscribe();

EventEmitter.on


once<K>(event, handler): void

Defined in: packages/core/src/utils/event-emitter.ts:95

Register a one-time event handler

Type Parameter
K extends keyof LoadingEvents
ParameterTypeDescription
eventKEvent name to listen for
handlerEventHandler<LoadingEvents[K]>Callback function to invoke once

void

The handler will be automatically removed after being invoked once.

emitter.once('connect', () => {
console.log('Connected!');
});

EventEmitter.once


removeAllListeners<K>(event?): void

Defined in: packages/core/src/utils/event-emitter.ts:175

Remove all handlers for an event, or all handlers for all events

Type Parameter
K extends keyof LoadingEvents
ParameterTypeDescription
event?KOptional event name. If omitted, removes all handlers for all events.

void

// Remove all handlers for 'message' event
emitter.removeAllListeners('message');
// Remove all handlers for all events
emitter.removeAllListeners();

EventEmitter.removeAllListeners


showError(layerId, container, error, onRetry?): void

Defined in: packages/core/src/ui/loading-manager.ts:260

Show error state for a layer.

ParameterTypeDescription
layerIdstringLayer identifier
containerHTMLElementContainer element for UI overlay
errorErrorError that occurred
onRetry?() => voidOptional retry callback

void

manager.showError('earthquakes', container, error, () => {
// Retry loading
fetchData();
});

showLoading(layerId, container, message?): void

Defined in: packages/core/src/ui/loading-manager.ts:169

Show loading state for a layer.

ParameterTypeDescription
layerIdstringLayer identifier
containerHTMLElementContainer element for UI overlay
message?stringCustom loading message

void

const container = document.getElementById('map');
manager.showLoading('earthquakes', container, 'Loading earthquake data...');

showRetrying(layerId, attempt, delay): void

Defined in: packages/core/src/ui/loading-manager.ts:316

Show retrying state for a layer.

ParameterTypeDescription
layerIdstringLayer identifier
attemptnumberCurrent retry attempt number
delaynumberDelay before retry in milliseconds

void

manager.showRetrying('earthquakes', 2, 2000);