ebay-video

EbayVideo

Video player. Supports either MPD or M3U8 playlist formats. Natively uses shaka player under the hood. For resizing, ebay-video supports fixed width or variable width. If no width is provided the video tag will resize based on the container size.

Demo

Storybook

Usage

yarn add @ebay/ui-core-react shaka-player

import { EbayVideo } from '@ebay/ui-core-react/ebay-video'
import '@ebay/skin/video'
import 'shaka-player/dist/controls.css'

<EbayVideo
    width="600"
    height="400"
    onLoadError(err => {
        console.log("handle error", err);
    })>
        <EbayVideoSource src="https://ir.ebaystatic.com/cr/v/c1/ebayui/video/v1/playlist.mpd" />
</EbayVideo>

EbayVideo Props

Name	Type	Required	Description
width	Number	No
height	Number	No
thumbnail	String	No	URL path for the video thumbnail
action	String	No	play or pause: will programatically perform the given action
volume	Number	No	sets sound volume
volumeSlider	Boolean	No	keep or remove volume slider, default is false
muted	Boolean	No	mute or unmute video, default is false
playView	String	No	inline or fullscreen. When player starts to play, will either play inline (default) or switch to fullscreen
a11yLoadText	String	Yes	a11y text for the loading spinner
a11yPlayText	String	Yes	a11y text for the play button
errorText	String	Yes	content for error when an either the library or video cannot load
reportText	String	Yes	text for report button

Callbacks

Name	Required	Description	Arguments
onLoadError	No	triggered when there is a load error with video player or source	(Event)
onPlay	No	triggered when playback starts	(Event, { player })
onVolumeChange	No	triggered when volume is changed	(Event, { volume: number, muted: boolean })
onReport	No	triggered when report button is clicked

EbayVideoSource Props

Name	Type	Required	Description
src	String	Yes	video/playlist URL
type	String	No	playlist type, hls or dash