Skip to content

React hook that simplifies the integration and management ๐Ÿ—๏ธ of media streams with extensive control over devices, streaming status, and event handling. ๐Ÿ“น

License

Notifications You must be signed in to change notification settings

kothariji/use-media-stream

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

26 Commits
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

Use Media Stream

use-media-stream is a powerful React hook designed to streamline the integration and management of media streams within your React applications. It offers a comprehensive set of features and options for effortless control and manipulation of media streams. It provides a convenient interface for handling media devices, initiating media streams, and controlling audio and video tracks.

npm package

GitHub License

Demo - Link

Installation

Install the hook using your preferred package manager:

npm install use-media-stream
or
yarn add use-media-stream

Usage

Import the hook into your React component and leverage its capabilities to manage your media streams:

import useMediaStream from 'use-media-stream';

function MyComponent() {
  const {
    stream,
    isSupported,
    isStreaming,
    isAudioMuted,
    isVideoMuted,
    // ... other properties and handlers
  } = useMediaStream();

  // ... your component logic
}

Props Values

Prop Type Description
mediaDeviceConstraints MediaStreamConstraints | null The constraints for the media device to be used in the media stream.

Return Values

Property Type Description
stream MediaStream | null The current media stream object.
isStreaming boolean Indicates whether the media stream is currently active.
isAudioMuted boolean Indicates whether audio tracks are muted.
isVideoMuted boolean Indicates whether video tracks are muted.
devices MediaDeviceInfo[] An array of available media devices.
audioInputDevices MediaDeviceInfo[] An array of available audio input devices.
audioOutputDevices MediaDeviceInfo[] An array of available audio output devices.
videoInputDevices MediaDeviceInfo[] An array of available video input devices.
getStreamRequest REQUEST_STATES The state of the request to obtain the media stream (IDLE, PENDING, FULFILLED, or REJECTED).
getMediaDevicesRequest REQUEST_STATES The state of the request to obtain media devices (IDLE, PENDING, FULFILLED, or REJECTED).
error unknown Any error that occurred during media stream or device retrieval.
start () => Promise<MediaStream | null> Initiates the media stream if not already streaming.
stop () => void Stops the media stream if currently streaming.
getMediaDevices () => Promise<MediaDeviceInfo[]> Retrieves a list of available media devices.
updateMediaDeviceConstraints ({ constraints, resetStream }) => Promise<void> Updates media device constraints and optionally resets the media stream.
muteAudio () => void Mutes all audio tracks in the media stream.
unmuteAudio () => void Unmutes all audio tracks in the media stream.
muteVideo () => void Mutes all video tracks in the media stream.
unmuteVideo () => void Unmutes all video tracks in the media stream.
addVideoEndedEventListener (fn: EventListenerOrEventListenerObject) => void Adds an event listener for 'ended' events on video tracks.
addAudioEndedEventListener (fn: EventListenerOrEventListenerObject) => void Adds an event listener for 'ended' events on audio tracks.
addVideoMuteEventListener (fn: EventListenerOrEventListenerObject) => void Adds an event listener for 'mute' events on video tracks.
addAudioMuteEventListener (fn: EventListenerOrEventListenerObject) => void Adds an event listener for 'mute' events on audio tracks.
removeVideoEndedEventListener (fn: EventListenerOrEventListenerObject) => void Removes an event listener for 'ended' events on video tracks.
removeAudioEndedEventListener (fn: EventListenerOrEventListenerObject) => void Removes an event listener for 'ended' events on audio tracks.
removeVideoMuteEventListener (fn: EventListenerOrEventListenerObject) => void Removes an event listener for 'mute' events on video tracks.
removeAudioMuteEventListener (fn: EventListenerOrEventListenerObject) => void Removes an event listener for 'mute' events on audio tracks.

Example

Demo - Link

License

This project is licensed under the MIT License - see the LICENSE.md file for details.

Acknowledgments

Feel free to use and contribute! If you encounter any issues or have suggestions, please open an issue.

About

React hook that simplifies the integration and management ๐Ÿ—๏ธ of media streams with extensive control over devices, streaming status, and event handling. ๐Ÿ“น

Resources

License

Stars

Watchers

Forks

Packages

No packages published