react-video-component

React video component

Development

npm install
npm run dev

Utilization

import ReactVideoComponent from 'react-video-component';

Warning

This repo should not be used in production.

How to

The component can have every listener the origin video tag has.
For example <video sources={[url..]} metadataloaded={this._onLoaded.bind(this)}/> calls the function _onLoaded, with the event as argument. The video is so accessible through event.target.

A list of events can be found here.

Props:

Property	Type	Default	Description
sources	Array	[]	Defines sources for the video. Must be an array of objects or strings, representing the url of the video. If object is given, it must have `src` key representing the url.
style	Object	{}	Style object that will apply to video tag element.
className	String	""	Name of the class that will apply to video tag element.
attributes	Object	{}	Standard props of the video element ( e.g. "loop", "controls" ).
controls	Bool	true	Show or hide controls.
autohide	Bool	true	Automatically hide controls and overlay ( if "fixedoverlay" set to false ) when playing.
autohidecursor	Bool	true	Automatically hide cursor when playing.
overlay	Bool	true	Show or hide overlay.
fixedoverlay	Bool	false	Disable autohide for overlay.
shortcuts	Bool	true	Enable or disable keyboard shortcuts.
tabIndex	String	"1"	Tab index of the wrapper element.
width	String	"auto"	Width of the video element.
height	String	"100%"	Height of the video element.

Known issues

• Weird IE render issues. Custom controls will be disabled.