Usage notes
Use the imperative adapter when your app owns the media element lifecycle but wants Canvas Timeline to do clip-to-source time mapping. React apps normally use the optional React hooks instead so disposal follows component lifetime.
Signature
createHTMLMediaAdapter(options: CreateHTMLMediaAdapterOptions): HTMLMediaAdapterParameters
| Name | Type | Description |
|---|---|---|
| options | CreateHTMLMediaAdapterOptions | Media element and source map used for timeline synchronization. |
Returns
Adapter callbacks compatible with Canvas Timeline media synchronization.
Examples
import { createHTMLMediaAdapter } from '@techsquidtv/canvas-timeline-html-media-adapter';
const video = document.querySelector('video');
if (video) { const adapter = createHTMLMediaAdapter({ element: video, sources: [{ sourceId: 'source-1', input: '/media/interview.mp4', }], });
await adapter.seek?.(engine.getTime(), engine.media.getActiveLayers({ layers: { visuals: { trackKind: 'visual', sourceId: 'source-1' }, }, }));}