Time
Playback position and duration state for the player store
Tracks playback position and duration.
API Reference
State
| Property | Type | Details |
|---|---|---|
currentTime | number | |
| ||
duration | number | |
| ||
seeking | boolean | |
| ||
Actions
| Action | Type | Details |
|---|---|---|
seek | (time: number) => Promise<number> | |
| ||
Selector
Pass selectTime to usePlayer to subscribe to time state. Returns undefined if the time feature is not configured.
Pass selectTime to PlayerController to subscribe to time state. Returns undefined if the time feature is not configured.
import { selectTime, usePlayer } from '@videojs/react';
function TimeDisplay() {
const time = usePlayer(selectTime);
if (!time) return null;
return (
<span>
{Math.floor(time.currentTime)} / {Math.floor(time.duration)}
</span>
);
}import { createPlayer, MediaElement, selectTime } from '@videojs/html';
import { videoFeatures } from '@videojs/html/video';
const { PlayerController, context } = createPlayer({ features: videoFeatures });
class TimeDisplay extends MediaElement {
readonly #time = new PlayerController(this, context, selectTime);
}