1.1.0 • Published 1 year ago

ng-ws-video-player v1.1.0

Weekly downloads
-
License
-
Repository
github
Last release
1 year ago

NgWsVideoPlayer

This Video Player is a customizable video player component for Angular 17 applications. It provides a rich set of features and controls for playback, including timeline scrubbing, volume control, playback speed adjustment, and more.

Features

  • Playback speed adjustment
  • Full-screen mode
  • Theater mode
  • Mini-player mode
  • Captions support
  • Keyboard shortcuts for various controls
  • Customization

Keyboard Shortcuts

  • Space / K - Play/Pause
  • F - Toggle full-screen mode
  • T - Toggle theater mode
  • I - Toggle mini-player mode
  • M - Toggle mute
  • Left Arrow / J - Seek backward (5 seconds)
  • Right Arrow / L - Seek forward (5 seconds)
  • C - Toggle captions

Usage

<ng-ws-video-player
    [videoSrc]="'path/to/your/video.mp4'"
    [captionSrc]="'path/to/your/captions.vtt'"
    [captionLangLabel]="'English'"
    [captionSrcLang]="'en'"
    [videoPlayerClassesToAdd]="'class1 class2 class3'"
    [videoContainerClassesToAdd]="'class1 class2 class3'"
    [videoAccentColor]="'#ff0000'"
/>

Inputs

The component accepts the following inputs:

InputTypeRequiredDefaultDescription
videoSrcstringYes''Path to the video file
captionSrcstringNo''Path to the captions file
captionLangLabelstringNo'English'Label for the caption language
captionSrcLangstringNo'en'Source language code for captions
videoPlayerClassesToAddstringNo''Additional classes to add to the video player element
videoContainerClassesToAddstringNo''Additional classes to add to the video container
videoAccentColorstringNo''Accent color for the video player controls

Customization

You can customize the appearance of the video player by modifying the provided SCSS file or overriding the CSS classes in your application. Dependencies This component is designed for Angular and uses Angular's built-in features. Make sure you have Angular installed in your project.

Installation

  1. Install the component in your Angular project:
npm i ng-ws-video-player
  1. Install the whole library, and it will come with it:
npm i ng-ws-ui
1.1.0

1 year ago

1.0.4

1 year ago

1.0.2

1 year ago

1.0.1

1 year ago

1.0.0

1 year ago

0.0.7

1 year ago

0.0.6

1 year ago

0.0.5

1 year ago

0.0.4

1 year ago

0.0.3

1 year ago

0.0.2

1 year ago

0.0.1

1 year ago