Skip to content

ReferenceText tracks

getActiveTextCues

The cues active now on the text tracks a filter or track definition matches

Import

import { getActiveTextCues } from '@videojs/html';

getActiveTextCues returns the cues active at the current time on the tracks a filter or track definition matches, from the media and the app alike. Cues from several tracks are merged in time order.

It reads textCues from the text cues feature, which describes when a cue is active, so it only finds cues on the tracks that feature reads.

Read through a definition, cues are typed by it. With a schema, cues whose value fails it are skipped.

Usage

Read the active cues in a player.store.subscribe() callback to follow playback:

const player = document.querySelector('video-player')!;
const quiz = document.querySelector<HTMLElement>('.quiz')!;

player.store.subscribe(() => {
  const [cue] = getActiveTextCues(player.store, quizTrack);

  quiz.hidden = !cue;
  quiz.textContent = cue?.value?.question ?? '';
});

API Reference

With Definition

getActiveTextCues<Cue extends MediaTextCue>(source, track): readonly Cue[]

The cues active now on the tracks a track definition matches, typed by the definition. With a schema, cues whose value fails it are skipped.

player.store.subscribe(() => { const [question] = getActiveTextCues(player.store, quizTrack); });

Parameters

ParameterTypeDefaultDetails
source*{ textCues: readonly MediaTrackCues[] }—
track*object—

Return Value

readonly Cue[]

With Filter

getActiveTextCues(source, filter?): readonly MediaTextCue[]

The cues active now on the tracks a filter matches, from the media or the app.

Parameters

ParameterTypeDefaultDetails
source*{ textCues: readonly MediaTrackCues[] }—
filterobject—

Return Value

readonly MediaTextCue[]