@power-elements/shaka-player NPM

shaka-player

Custom element wrapper for google's Shaka Player

Usage

<shaka-player
   autoplay
   controls
   dash-manifest="http://rdmedia.bbc.co.uk/dash/ondemand/bbb/2/client_manifest-common_init.mpd"
></shaka-player>

Properties

Property	Attribute	Modifiers	Type	Default	Description
`allowCrossSiteCredentials`	`allow-cross-site-credentials`		`boolean`		Whether shaka player should use cookies for CORS requests.
`autoplay`	`autoplay`		`boolean`	false	Whether the video should auto-play.
`canPlay`		readonly	`boolean`		Whether the video can play.
`controls`	`controls`		`boolean`		Whether to display controls over the video.
`currentTime`	`currentTime`		`number`		Video's current time
`dashManifest`	`dash-manifest`		`string`		URL to the MPEG-DASH manifest
`duration`		readonly	`number`		The duration of the video in seconds.
`ended`		readonly	`boolean`		Whether or not the video playback has ended.
`hlsManifest`	`hls-manifest`		`string`		URL to the HLS manifest
`loading`	`loading`		`boolean`	false	Whether the video is loading
`muted`	`muted`		`boolean`	false	Whether the video is muted.
`paused`		readonly	`boolean`		Whether the video is paused.
`playing`	`playing`		`boolean`		Whether the video is playing.
`poster`	`poster`		`string`		The src URL for the poster frame.
`preload`	`preload`		`'none'\\|'metadata'\\|'auto'\\|''`	"metadata"	Video element preload value.
`readyState`		readonly	`number`		Ready state of the video element.
`src`	`src`		`string`		URL to a video file
`volume`			`number`	1	The volume level of the video.

Methods

Method	Type	Description
`load`	`(manifestUri: string, startTime?: number \\| undefined, manifestMimeType?: string \\| undefined): Promise`	Load a Manifest.startTime: Optional start time, in seconds, to begin playback. Defaults to 0 for VOD and to the live edge for live. Set a positive number to start with a certain offset the beginning. Set a negative number to start with a certain offset from the end. This is intended for use with live streams, to start at a fixed offset from the live edge.manifestMimeType: Optional mimetype registered using `shaka.media.ManifestParser.register(mimeType, ParserClass)`
`loadManifest`	`(manifestUri: string): Promise`	Load a manifest URL into shaka player.
`loadVideo`	`(url: string): string`	Load a regular video URL.
`notify`	`(property: any): void`
`pause`	`(): any`	Pauses the player.
`play`	`(): Promise`	Plays the player.
`unload`	`(reinitializeMediaSource?: boolean \\| undefined): Promise<void>`	Unload the current manifest and make the Player available for re-use.reinitializeMediaSource: If true, start reinitializing MediaSource right away. This can improve load() latency for MediaSource-based playbacks. Defaults to true.

Events

Event	Description
`error`	fired when shaka player errors
`init-shaka-player`	fired when shaka player is initialized
`manifest-loaded`	fired when shaka player loads the manifest file

CSS Custom Properties

Property	Description
`--shaka-player-background-color`	The background color of the video element. Default: `black`
`--shaka-player-object-fit`	object-fit property of the video element. Default: `initial`
`--shaka-player-video-height`	height property of the video element. Default: `auto`
`--shaka-player-video-width`	width property of the video element. Default: `100%`