Attempt to show auto video quality
This commit is contained in:
parent
73f27cc67e
commit
b5f8a849a1
2 changed files with 30 additions and 6 deletions
|
@ -4,6 +4,7 @@ import { version as VERSION } from './package.json';
|
|||
import ConcreteButton from './ConcreteButton';
|
||||
import ConcreteMenuItem from './ConcreteMenuItem';
|
||||
import * as QUALITY_OPTIONS from 'constants/video';
|
||||
import { safeGetComputedStyle, simpleSelector } from '../videojs-http-streaming--override/playlist-selectors';
|
||||
|
||||
// Default options for the plugin.
|
||||
const defaults = {};
|
||||
|
@ -110,6 +111,29 @@ class HlsQualitySelectorPlugin {
|
|||
concreteButtonInstance.removeClass('vjs-hidden');
|
||||
}
|
||||
|
||||
resolveAutoQualityLabel(includeResolution) {
|
||||
const player = this.player;
|
||||
const vhs = player.tech(true).vhs;
|
||||
|
||||
if (includeResolution && vhs) {
|
||||
const pixelRatio = this.useDevicePixelRatio ? window.devicePixelRatio || 1 : 1;
|
||||
|
||||
const selectedBandwidth = simpleSelector(
|
||||
vhs.playlists.master,
|
||||
vhs.systemBandwidth,
|
||||
parseInt(safeGetComputedStyle(vhs.tech_.el_, 'width'), 10) * pixelRatio,
|
||||
parseInt(safeGetComputedStyle(vhs.tech_.el_, 'height'), 10) * pixelRatio,
|
||||
vhs.limitRenditionByPlayerDimensions
|
||||
);
|
||||
|
||||
const quality = selectedBandwidth.attributes.RESOLUTION.height;
|
||||
|
||||
return __('Auto (%quality%) --[Video quality popup. Long form.]--', { quality: quality + 'p' });
|
||||
} else {
|
||||
return __('Auto --[Video quality. Short form]--');
|
||||
}
|
||||
}
|
||||
|
||||
resolveOriginalQualityLabel(abbreviatedForm, includeResolution) {
|
||||
if (includeResolution && this.config.originalHeight) {
|
||||
return abbreviatedForm
|
||||
|
@ -136,7 +160,7 @@ class HlsQualitySelectorPlugin {
|
|||
let str;
|
||||
switch (text) {
|
||||
case QUALITY_OPTIONS.AUTO:
|
||||
str = __('Auto --[Video quality. Short form]--');
|
||||
str = this.resolveAutoQualityLabel(true);
|
||||
break;
|
||||
case QUALITY_OPTIONS.ORIGINAL:
|
||||
str = this.resolveOriginalQualityLabel(true, false);
|
||||
|
@ -230,15 +254,15 @@ class HlsQualitySelectorPlugin {
|
|||
|
||||
levelItems.push(
|
||||
this.getQualityMenuItem.call(this, {
|
||||
label: __('Auto --[Video quality. Short form]--'),
|
||||
label: this.resolveAutoQualityLabel(true),
|
||||
value: QUALITY_OPTIONS.AUTO,
|
||||
selected: !defaultQuality ? true : defaultQuality === QUALITY_OPTIONS.AUTO,
|
||||
})
|
||||
);
|
||||
|
||||
if (nextLowestQualityItemObj || defaultQuality) {
|
||||
this.setButtonInnerText(nextLowestQualityItemObj ? nextLowestQualityItemObj.label : defaultQuality);
|
||||
}
|
||||
this.setButtonInnerText(
|
||||
nextLowestQualityItemObj ? nextLowestQualityItemObj.label : defaultQuality || QUALITY_OPTIONS.AUTO
|
||||
);
|
||||
|
||||
if (this._qualityButton) {
|
||||
this._qualityButton.createItems = function () {
|
||||
|
|
|
@ -15,7 +15,7 @@ import Playlist from './playlist';
|
|||
* @param {HTMLElement} el the htmlelement to work on
|
||||
* @param {string} the proprety to get the style for
|
||||
*/
|
||||
const safeGetComputedStyle = function(el, property) {
|
||||
export const safeGetComputedStyle = function(el, property) {
|
||||
if (!el) {
|
||||
return '';
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue