videojs-max-quality-selector
A Videojs Plugin to help you list out resolutions and bit-rates from Live, Adaptive and Progressive streams.
Table of Contents
Installation
npm install --save videojs-max-quality-selector
Options
:string
autoLabel Default:
'Auto'
This option lets you rename the string value that represents the auto bitrate selection system.
var player = ;player;
:number
defaultQuality This option lets you control which level of quality is selected first.
0
= Default Behaviour (The default from playlist), 1
= Lowest (Start the video with the lowest quality stream selected), 2
= Highest (Start the video with the highest quality stream selected)
Default:
0
var player = ;player;
:boolean
disableAuto This option disables the auto bitrate selection system and focuses on a single quality level.
Default:
false
var player = ;player;
:number
displayMode This option lets you control how the default quality level is displayed to the screen.
Note
: This option is ignored if you override the quality level with a label in DefaultOptions.labels
0
= Both (Includes both the resolution, in height, and the quality marketing name), 1
= Resolution (Include just the resolution, in height), 2
= Name (Include just the quality marketing name)
Default:
0
var player = ;player;
:boolean
filterDuplicateHeights This option enabled the filtering of duplicate quality levels when their height all match.
Tip
: This is useful if you want to avoid showing different bitrates to users.
Default:
true
var player = ;player;
:boolean
filterDuplicates This option enabled the filtering of duplicate quality levels when their width, height, bitrate all match.
Tip
: This is useful if you want to avoid showing different endpoints to users.
Default:
true
var player = ;player;
:number
index This option helps you position the button in the VideoJS control bar.
Default:
-1
var player = ;player;
:Array|Object
labels This options lets you override the name of the listed quality levels.
Tip
: Use maxQualitySelector.getLevelNames();
output to find the ID to overwrite.
Default:
[]
var player = ; // Quick and useful if only a few contiguous quality levelsvar labelsArray = 'High' 'Low' ; // Useful if you need to specify labels in a sparce listvar labelsObject = 0: 'High' 8: 'Medium' 16: 'Low' 24: 'Super Low' ; player;
:number
maxHeight This options lets you specify the maximum height resolution to show in the menu.
Default:
0
var player = ;player;
:number
minHeight This options lets you specify the minimum height resolution to show in the menu.
Default:
0
var player = ;player;
:boolean
showBitrates This option enables showing the bitrate in the button and menu.
Default:
false
var player = ;player;
:boolean
showSingleItemMenu This option enabled to show the menu even if there is only one quality level.
Default:
false
var player = ;player;
:number
sort This option enables sorting direction the quality levels in the menu.
0
= Descending (Qualities are listed from highest to lowest top down by height), 1
= Ascending (Qualities are listed from lowest to highest top down by height)
Default:
0
var player = ;player;
:boolean
sortEnabled This option enables sorting the quality levels in the menu.
Default:
true
var player = ;player;
Usage
⚠ Warning: ⚠ We require the https://github.com/videojs/videojs-contrib-quality-levels plugin to be included before ours.
To include videojs-max-quality-selector on your website or web application, use any of the following methods.
<link>
& <script>
Tag
This is the simplest case. Get the script in whatever way you prefer and include the plugin after you include [video.js][videojs], so that the videojs
global is available.
Browserify/CommonJS
When using with Browserify, install videojs-max-quality-selector via npm and require
the plugin as you would any other module.
var videojs = ; // The actual plugin function is exported by this module, but it is also// attached to the `Player.prototype`; so, there is no need to assign it// to a variable.;; var player = ; player;
RequireJS/AMD
When using with RequireJS (or another AMD library), get the script in whatever way you prefer and require
the plugin as you normally would:
;
CDN
Content Delivery Network We're using unpkg to serve our files.
File Explorer: https://unpkg.com/videojs-max-quality-selector/
Latest: https://unpkg.com/videojs-max-quality-selector/dist/videojs-max-quality-selector.css https://unpkg.com/videojs-max-quality-selector/dist/videojs-max-quality-selector.min.js
Contributing
We welcome contributions from everyone! Find out how to contribute...
Code of Conduct
Contributor Covenant Code of Conduct
License
MIT. Copyright (c) Fox (onefox@gmail.com)