useRemoteMedia
The useRemoteMedia hook is used to fetch media from a remote peers. It gives an ability to stop and start consuming.
| Name | Description | Return Type |
|---|---|---|
| state | The current state of the media from remote peer | 'playable' | 'unavailable' | 'stopped' | 'paused' | 'available' |
| track | MediaStreamTrack of the remote peer | MediaStreamTrack | null |
| stream | MediaStream of the remote peer | MediaStream | null |
| stopConsuming | Method to stop consuming media from remote peer | void |
| startConsuming | Method to start consuming media from remote peer | Promise<void> |
Example usage
import { useRemoteMedia } from '@huddle01/react/hooks';
const {
state,
track,
stream,
stopConsuming,
startConsuming
} = useRemoteMedia({
peerId: 'YOUR_PEER_ID',
label: 'YOUR_MEDIA_LABEL',
onClose() (),
onPlayable(data: {
track: MediaStreamTrack;
stream: MediaStream;
label: string;
}) (),
onStopped(reason: {
code: number;
tag: string;
message: string;
}) ()
})
// Stop consuming media from remote peer
const stop = (peerId: string) => {
stopConsuming(peerId);
}
// Start consuming media from remote peer
const start = async (peerId: string) => {
await startConsuming();
}Props
The useRemoteMedia hook accepts the following props:
peerId
Required
| Description | Type |
|---|---|
| PeerId of the remote peer | string |
Example usage
// Get state of media from remote peer
const { state } = useRemoteMedia({
peerId,
label: 'YOUR_MEDIA_LABEL',
})label
Required
| Description | Type |
|---|---|
| Label of the media to consume from remote peer | string |
Example usage
// Get state of media from remote peer
const { state } = useRemoteMedia({
peerId: 'YOUR_PEER_ID',
label,
})onClose
Optional
| Description | Type |
|---|---|
| Callback function to be called when the media is closed | void |
Example usage
useRemoteMedia({
peerId: 'YOUR_PEER_ID',
label: 'YOUR_MEDIA_LABEL',
onClose() {
console.log('Media closed')
// Your code here
}
})onPlayable
Optional
| Description | Type |
|---|---|
| Callback function to be called when the media is playable, i.e. start consuming | void |
Example usage
useRemoteMedia({
peerId: 'YOUR_PEER_ID',
label: 'YOUR_MEDIA_LABEL',
onPlayable(data: {
track: MediaStreamTrack;
stream: MediaStream;
label: string;
}) {
console.log('Media is playable')
// Your code here
}
})onStopped
Optional
| Description | Type |
|---|---|
| Callback function to be called when we stop consuming media | void |
Example usage
useRemoteMedia({
peerId: 'YOUR_PEER_ID',
label: 'YOUR_MEDIA_LABEL',
onStopped(reason: {
code: number;
tag: string;
message: string;
}) {
console.log('Media is stopped')
// Your code here
}
})