Hooks API
These functions provide Hooks for accessing the ambient Player and subscribing to certain events. They are exported from the root of the library.
import {usePlayer, useTime} from "liqvid";
useKeymap()
Access the ambient Keymap
.
useKeymap(): Keymap;
useMarkerUpdate()
Subscribe to the markerupdate
event of Script. Callback receives the index of the previous marker (the current index can be accessed via Script.markerIndex
). The second argument is an array of dependencies used to avoid resubscriptions; you will usually want to pass []
.
useMarkerUpdate(callback: (prevIndex: number) => void, deps?: React.DependencyList): void;
usePlayback()
Access the ambient Playback
.
usePlayback(): Playback;
usePlayer()
Access the ambient Player
.
usePlayer(): Player;
useScript()
Access the ambient Script
.
useScript(): Script;
useTime()
Subscribe to the seek
and timeupdate
event of Playback. Accepts the following arguments:
callback: (value: T) => void
Callback receiving the current time (iftransform
is not specified) or a value computed from it (iftransform
is specified). This gets called once initially, and will only be called thereafter whenvalue
changes.transform?: (t: number) => T
A function which receives the current time (in milliseconds) and returns a value, which then gets passed tocallback
. If this argument is not specified, it defaults tot => t
, so thatcallback
will receive the current time.deps?: React.DependencyList
An array of dependencies used to avoid resubscriptions; you will usually want to pass[]
.
useTime(callback: (value: number) => void, deps?: React.DependencyList): void;
useTime<T = number>(callback: (value: T) => void, transform?: (t: number) => T, deps?: React.DependencyList): void;
useTimeUpdate()
Legacy version of useTime()
. Compared to useTime()
, this does not accept a transform
parameter, and also does not call callback
initially (so callback
gets called only when the time updates).
useTimeUpdate(callback: (t: number) => void, deps?: React.DependencyList): void;