new CloudinaryVideoComponent()

Description

The Cloudinary video component.

Properties
Name Type Description
transformation CloudinaryVideo

Generated by @cloudinary/url-gen

transformation VideoPoster

Generated by @cloudinary/url-gen

plugins Plugins

Advanced image component plugins lazyload()

videoAttributes

Optional attributes include controls, loop, muted, poster, preload, autoplay

videoEvents

Optional video events include play, loadstart, playing, error, ended

sources VideoSources

Optional sources to generate

Examples

Using custom defined resources.

vid = new CloudinaryVideo('dog', {cloudName: 'demo'});
			  sources = [
			 {
			        type: 'mp4',
			        codecs: ['vp8', 'vorbis'],
			        transcode: videoCodec(auto())
			},
			 {
			        type: 'webm',
			        codecs: ['avc1.4D401E', 'mp4a.40.2'],
			         transcode: videoCodec(auto())
			      }];
			
			<advanced-video [cldvid]="vid" [sources]="sources" controls></advanced-video>

Methods


ngOnInit()

Description

On init creates a new HTMLVideoLayer instance and initializes with ref to video element, user generated cloudinaryVideo and the plugins to be used.


ngOnChanges()

Description

On update, we cancel running plugins and update the video instance if the src was changed.


ngOnDestroy()

Description

On destroy, we cancel the currently running plugins.


getVideoAttributes()

Description

Returns video attributes.


attachRef()

Description

Attach both this.videoRef and props.innerRef as ref to the given element.