1.0.20 • Published 5 years ago

eng-bsd-video-player v1.0.20

Weekly downloads
1
License
MIT
Repository
-
Last release
5 years ago

BSD Video Player

This library allows you to include a 'Timeline Caption Supported' video player within your project. Simply import the BSDVideoPlayer component into your existing React app and pass through a video url, set of captions and control the Player using your own set of controls via the Player component's props.

Usage:

import React from "react";
import BSDVideoPlayer from "eng-bsd-video-player"

const MyComponent = ({name}) => (
 <BSDVideoPlayer
     videoSource="https://d2sgdtt0dqypl6.cloudfront.net/test-videos/brexit_baker_no_plotting_1127_12_9_105_10039491.mp4"
        dimensions={{
          height: 252,
          width: 448
        }}
        playing={false}
        seekTo={0}
        captionsTimeline={[]}
        controls={true}
        onPlaying={(time) => console.log(time)}
 />
);

export default MyComponent;

Props

Prop nameDescriptionRequired?Example values
videoSourceURL to the MP4 video file (currently restricted to MP4)YesString: "https://localhost/video.mp4"
dimensionsObject defining the width and height of the video playerYesObject: { width: 100, height: 100}
playingManage the playback state of the player. Toggle to play/pauseYesBoolean: true
seekToTrigger player to seek to this value (in seconds)YesNumber: 40
captionsTimelineTimeline of captions to be played over the video (webcap format)NoArray: [{"captionURL":"../../webcap/index.html","startTime":2,"duration":5,"captionData":{"line1":"les États-Unis L'opposant a indiqué ","caption":"title2Line","scriptType":"reith","legibilityBackground":"none","animateIn":true,"animateOut":true,"verticalPosition":"middle","displayFormat":"horizontal"}}]
controlsHide/show the default HTML5 Video controlsYesBoolean: true
onPlayingHandler for playing eventNoFunction: (event) => console.log(event)
onSeekedHandler for seeked eventNoFunction: (event) => console.log(event)
onCaptionPlayerLoadHandler for when caption player is loaded with captionsNoFunction: (event) => console.log(event)