angular-video-js-player

Angular Video-js Player

A video player called Angular Video-js Player is utilized by Angular standalone projects. Video playback on PCs and mobile devices is supported, along with Media Source Extensions and HTML5 video. With the help of Angular CLI version 15.0.0, this library was created.

This package has basic video js many features with boolean values that may be customized.

Getting Started

Installation

  npm i angular-video-js-player

Usage

Import component in any standalone component

Import in your ts file

import { VideoJsComponent } from 'angular-video-js-player';

@Component({
    standalone: true,
    imports: [VideoJsComponent]
})

Use in html file

<lib-video-js
        [videoUrl] = "videoUrl"
        [captionList] = "captionList"
        [volumeEnableByKey] = false
        [playPauseByKey] = false
        [fullScreenModeEnable]=false
        [qualitySelector]=false>
  </lib-video-js>

Description

Add this key in your ts file and assign value.

videoUrl : It is an array with option [{url:string,label:string}]

for example:

videoUrl= [{url:'your-video-url',label:'300P'}]

captionList: It is an array if you need to provide caption with option [{url: string,lang: string,label: string}] where lang and label are optional key.

for example:

captionList= [{url:'your-caption-url',lang:'en',label:'English'}]

Options

Feature	Description	Key Used	Default
Volume enable by Key	It handle volume by arrow up and arrow down.It is an optional key and has boolean value.	volumeEnableByKey	false
Play Pause by key	It handle play pause by space key.It is an optional key and has boolean value.	playPauseByKey	false
Full Screen Mode	It handle fullScreen by double click.It is an optional key and has boolean value.	fullScreenModeEnable	false
Quality Selector	It provide feature for quality option with multiple video.It is an optional key and has boolean value.	qualitySelector	false

Changelog

Please see CHANGELOG for more information what has changed recently.

Credits

• All Contributors

Further help

To get more help on the Angular CLI use ng help or go check out the Angular CLI Overview and Command Reference page.

LICENSE

The MIT License (MIT). Please see License File for more information.