user-media
<user-media>
A WebComponent wrapper for the getUserMedia API.
Get webcam video and microphone audio streams with a simple html tag!
Installation
Loading from CDN
Load the component from unpkg with a script tag:
<script type="module" src="https://unpkg.com/@popul-ar/user-media@latest"></script>
Installing from NPM
Install the module: npm install --save @popul-ar/user-media
Import the module: import '@popul-ar/user-media'
Examples
Using the component without any attributes will give you a muted video element with default webcam settings.
<user-media></user-media>
You can also specify other attributes depending on your needs.
<user-media width="720" height="1280" controls></user-media>
<user-media aspect-ratio="1.333" video-facing-mode="user"></user-media>
Documentation
See the <user-media> component API documentation for more details about attributes, events, and methods.
Demos
Basic webcam example: device selector with a few controls
Simplest usage: just the tag
Audio controls: audio streams and properties. ⚠️ Headphones recommended to prevent feedback loops ⚠️.
Advanced properties: zoom, contrast, exposure mode, etc…
Development
npm install: installs dependencies
npm start: starts a dev server and runs a watcher for compiling the component
npm run build: builds the component in production mode and generates docs
npm run publish: publishes the module on NPM
