Skip to content

A plugin for the Clappr HTML5 video player that enables variable speed playback (0.5x, 1x, 2x, ...)

License

Notifications You must be signed in to change notification settings

Viewly/clappr-playback-rate-plugin

 
 

Repository files navigation

Clappr Playback Rate Plugin

Usage

npm install --save clappr-playback-rate-plugin

Add both Clappr and Playback Rate plugin scripts:

<head>
  <script type="text/javascript" src="http://cdn.clappr.io/latest/clappr.min.js"></script>
  <script type="text/javascript" src="dist/clappr-playback-rate-plugin.js"></script>
</head>

or

import Clappr from 'clappr';
import PlaybackRatePlugin from 'clappr-playback-rate-plugin';

Then just add PlaybackRatePlugin into the list of plugins of your player instance:

var player = new Clappr.Player({
  source: "http://your.video/here.m3u8",
  plugins: {
    'core': [PlaybackRatePlugin]
  }
});

You can also customize the labels and title:

var player = new Clappr.Player({
  source: "http://your.video/here.m3u8",
  plugins: {
    'core': [PlaybackRatePlugin]
  },
  playbackRateConfig: {
    defaultValue: '1.0',
    options: [
        {value: '0.5', label: '0.5x'},
        {value: '1.0', label: '1x'},
        {value: '2.0', label: '2x'},
    ]
  },
});

Compatibility

This works by settings the playbackRate property of the <video> element; accordingly, it does not work for the Flash playback.

Changelog

See Releases

About

A plugin for the Clappr HTML5 video player that enables variable speed playback (0.5x, 1x, 2x, ...)

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 78.5%
  • CSS 17.9%
  • HTML 3.6%