❤
npm
Sign UpSign In

react-html5-video-editor

1.2.0 • Public • Published

react-html5-video-editor

React / redux video element with a crop marker. Crop markers emit Redux actions when dragged.

npm version Build Status Dependancies

preview

Features:

  • simple & clean
  • video crop
  • effect composer
  • numerous formats support
  • customizable

Do not hesitate to post an issue to request a feature (seriously).

Roadmap

  • enhanced video previews
  • effect composer
  • multiple tracks

Quickstart

Install

npm init
npm install react-html5-video-editor --save
ls node_modules/react-html5-video-editor/dist/bundle.js

Basic usage

<body>
    <div id="root"></div>
    <script type="text/javascript" src="js/bundle.js"></script> 
 </body>
import {RdxVideo, Overlay, Controls} from 'react-html5-video-editor'
ReactDOM.render(
  <RdxVideo autoPlay loop muted poster="src/img/poster.png" store={store}>
    <Overlay />
    <Controls />
    <source src="src/video/small.mp4" type="video/mp4" />
  </RdxVideo>
  ,
  document.getElementById('root')
);

Configuration

RdxVideo.Props = {
    autoPlay: false,
    loop: false,
    controls: true,
    volume:	1.0,
    preload: "auto",
    cropEnabled: true;
}

License

Code released under GNU GPLv3

Readme

Keywords

Package Sidebar

Install

npm i react-html5-video-editor

Repository

github.com/evgenity/react-html5-video-editor

Homepage

crop-video-online.com

Weekly Downloads

25

Version

1.2.0

License

GNU GPLv3

Last publish

Collaborators

  • evgenity
Try on RunKit
Report malware