@gcorevideo/player 2.28.3 → 2.28.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/core.js +1 -1
- package/dist/index.css +459 -459
- package/dist/index.js +1 -1
- package/package.json +2 -2
- package/tsconfig.tsbuildinfo +1 -1
- package/coverage/clover.xml +0 -6
- package/coverage/coverage-final.json +0 -1
- package/coverage/lcov-report/base.css +0 -224
- package/coverage/lcov-report/block-navigation.js +0 -87
- package/coverage/lcov-report/favicon.png +0 -0
- package/coverage/lcov-report/index.html +0 -101
- package/coverage/lcov-report/prettify.css +0 -1
- package/coverage/lcov-report/prettify.js +0 -2
- package/coverage/lcov-report/sort-arrow-sprite.png +0 -0
- package/coverage/lcov-report/sorter.js +0 -196
- package/coverage/lcov.info +0 -0
- package/dist/player.d.ts +0 -3369
- package/lib/playback/utils.d.ts +0 -2
- package/lib/playback/utils.d.ts.map +0 -1
- package/lib/playback/utils.js +0 -1
- package/lib/plugins/audio-selector/AudioSelector.d.ts +0 -67
- package/lib/plugins/audio-selector/AudioSelector.d.ts.map +0 -1
- package/lib/plugins/audio-selector/AudioSelector.js +0 -172
- package/lib/plugins/build.d.ts +0 -2
- package/lib/plugins/build.d.ts.map +0 -1
- package/lib/plugins/build.js +0 -1
- package/lib/plugins/clappr-nerd-stats/ClapprNerdStats.d.ts +0 -83
- package/lib/plugins/clappr-nerd-stats/ClapprNerdStats.d.ts.map +0 -1
- package/lib/plugins/clappr-nerd-stats/ClapprNerdStats.js +0 -339
- package/lib/plugins/disable-controls/DisableControls.d.ts +0 -15
- package/lib/plugins/disable-controls/DisableControls.d.ts.map +0 -1
- package/lib/plugins/disable-controls/DisableControls.js +0 -67
- package/lib/plugins/index.d.ts +0 -35
- package/lib/plugins/index.d.ts.map +0 -1
- package/lib/plugins/index.js +0 -37
- package/lib/plugins/level-selector/LevelSelector.d.ts +0 -112
- package/lib/plugins/level-selector/LevelSelector.d.ts.map +0 -1
- package/lib/plugins/level-selector/LevelSelector.js +0 -280
- package/lib/plugins/statistics/Statistics.d.ts +0 -87
- package/lib/plugins/statistics/Statistics.d.ts.map +0 -1
- package/lib/plugins/statistics/Statistics.js +0 -172
- package/lib/plugins/subtitles/Subtitles.d.ts +0 -115
- package/lib/plugins/subtitles/Subtitles.d.ts.map +0 -1
- package/lib/plugins/subtitles/Subtitles.js +0 -345
- package/lib/tsdoc-metadata.json +0 -11
- package/lib/utils/fullscreen.d.ts +0 -3
- package/lib/utils/fullscreen.d.ts.map +0 -1
- package/lib/utils/fullscreen.js +0 -2
- package/release.txt +0 -395
- package/release_notes +0 -297
- package/src/plugins/telemetry/Statistics copy.js +0 -296
- package/temp/player.api.json +0 -10275
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import { UICorePlugin } from '@clappr/core';
|
|
2
|
-
export declare class DisableControls extends UICorePlugin {
|
|
3
|
-
get name(): string;
|
|
4
|
-
get container(): any;
|
|
5
|
-
get supportedVersion(): {
|
|
6
|
-
min: string;
|
|
7
|
-
};
|
|
8
|
-
bindEvents(): void;
|
|
9
|
-
unbindEvents(): void;
|
|
10
|
-
private setDisableStyles;
|
|
11
|
-
private onCoreReady;
|
|
12
|
-
private enableControls;
|
|
13
|
-
private disableAllControls;
|
|
14
|
-
}
|
|
15
|
-
//# sourceMappingURL=DisableControls.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"DisableControls.d.ts","sourceRoot":"","sources":["../../../src/plugins/disable-controls/DisableControls.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAU,MAAM,cAAc,CAAC;AAIpD,qBAAa,eAAgB,SAAQ,YAAY;IAC/C,IAAI,IAAI,WAEP;IAED,IAAI,SAAS,QAEZ;IAED,IAAI,gBAAgB;;MAEnB;IAEQ,UAAU;IAcnB,YAAY;IAqBZ,OAAO,CAAC,gBAAgB;IAUxB,OAAO,CAAC,WAAW;IAMnB,OAAO,CAAC,cAAc;IAItB,OAAO,CAAC,kBAAkB;CAQ3B"}
|
|
@@ -1,67 +0,0 @@
|
|
|
1
|
-
import { UICorePlugin, Events } from '@clappr/core';
|
|
2
|
-
import { CLAPPR_VERSION } from '../../build.js';
|
|
3
|
-
export class DisableControls extends UICorePlugin {
|
|
4
|
-
get name() {
|
|
5
|
-
return 'disable_controls';
|
|
6
|
-
}
|
|
7
|
-
get container() {
|
|
8
|
-
return this.core && this.core.activeContainer;
|
|
9
|
-
}
|
|
10
|
-
get supportedVersion() {
|
|
11
|
-
return { min: CLAPPR_VERSION };
|
|
12
|
-
}
|
|
13
|
-
bindEvents() {
|
|
14
|
-
if (this.container) {
|
|
15
|
-
this.listenTo(this.container, Events.CONTAINER_MEDIACONTROL_ENABLE, this.enableControls);
|
|
16
|
-
this.listenTo(this.container, Events.CONTAINER_PLAY, this.enableControls);
|
|
17
|
-
this.listenTo(this.container, Events.CONTAINER_PAUSE, this.enableControls);
|
|
18
|
-
this.listenTo(this.container, Events.CONTAINER_STOP, this.enableControls);
|
|
19
|
-
this.listenTo(this.container, Events.CONTAINER_ENDED, this.enableControls);
|
|
20
|
-
this.listenTo(this.container, 'container:advertisement:start', this.enableControls);
|
|
21
|
-
}
|
|
22
|
-
this.listenTo(this.core, Events.CORE_READY, this.onCoreReady);
|
|
23
|
-
this.listenTo(this.core.mediaControl, Events.MEDIACONTROL_SHOW, this.enableControls);
|
|
24
|
-
this.listenTo(this.core.mediaControl, Events.MEDIACONTROL_CONTAINERCHANGED, this.enableControls);
|
|
25
|
-
}
|
|
26
|
-
unbindEvents() {
|
|
27
|
-
// @ts-ignore
|
|
28
|
-
this.stopListening(this.core, Events.CORE_READY);
|
|
29
|
-
// @ts-ignore
|
|
30
|
-
this.stopListening(this.core.mediaControl, Events.MEDIACONTROL_SHOW);
|
|
31
|
-
// @ts-ignore
|
|
32
|
-
this.stopListening(this.core.mediaControl, Events.MEDIACONTROL_CONTAINERCHANGED);
|
|
33
|
-
// @ts-ignore
|
|
34
|
-
this.stopListening(this.container, Events.CONTAINER_MEDIACONTROL_ENABLE);
|
|
35
|
-
// @ts-ignore
|
|
36
|
-
this.stopListening(this.container, Events.CONTAINER_PLAY);
|
|
37
|
-
// @ts-ignore
|
|
38
|
-
this.stopListening(this.container, Events.CONTAINER_PAUSE);
|
|
39
|
-
// @ts-ignore
|
|
40
|
-
this.stopListening(this.container, Events.CONTAINER_STOP);
|
|
41
|
-
// @ts-ignore
|
|
42
|
-
this.stopListening(this.container, Events.CONTAINER_ENDED);
|
|
43
|
-
// @ts-ignore
|
|
44
|
-
this.stopListening(this.container, 'container:advertisement:start');
|
|
45
|
-
}
|
|
46
|
-
setDisableStyles() {
|
|
47
|
-
const css = document.createElement('style');
|
|
48
|
-
const styles = '.control-need-disable { display: none!important; }';
|
|
49
|
-
css.appendChild(document.createTextNode(styles));
|
|
50
|
-
this.core.$el.get(0).appendChild(css);
|
|
51
|
-
}
|
|
52
|
-
onCoreReady() {
|
|
53
|
-
this.setDisableStyles();
|
|
54
|
-
this.bindEvents();
|
|
55
|
-
this.enableControls();
|
|
56
|
-
}
|
|
57
|
-
enableControls() {
|
|
58
|
-
this.disableAllControls();
|
|
59
|
-
}
|
|
60
|
-
disableAllControls() {
|
|
61
|
-
setTimeout(() => {
|
|
62
|
-
const spinnerPlugin = this.container.getPlugin('spinner');
|
|
63
|
-
spinnerPlugin?.destroy();
|
|
64
|
-
this.container.disableMediaControl();
|
|
65
|
-
}, 0);
|
|
66
|
-
}
|
|
67
|
-
}
|
package/lib/plugins/index.d.ts
DELETED
|
@@ -1,35 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @packageDocumentation
|
|
3
|
-
* @beta
|
|
4
|
-
* A collection of plugins for the Gcore video player
|
|
5
|
-
*/
|
|
6
|
-
import '../assets/style/main.scss';
|
|
7
|
-
export * from "./audio-selector/AudioSelector.js";
|
|
8
|
-
export * from "./big-mute-button/BigMuteButton.js";
|
|
9
|
-
export * from "./bottom-gear/BottomGear.js";
|
|
10
|
-
export * from "./clappr-nerd-stats/ClapprNerdStats.js";
|
|
11
|
-
export * from "./clappr-stats/ClapprStats.js";
|
|
12
|
-
export * from "./click-to-pause/ClickToPause.js";
|
|
13
|
-
export * from "./clips/Clips.js";
|
|
14
|
-
export * from "./context-menu/ContextMenu.js";
|
|
15
|
-
export * from "./dvr-controls/DvrControls.js";
|
|
16
|
-
export * from "./error-screen/ErrorScreen.js";
|
|
17
|
-
export * from "./favicon/Favicon.js";
|
|
18
|
-
export * from "./google-analytics/GoogleAnalytics.js";
|
|
19
|
-
export * from "./level-selector/LevelSelector.js";
|
|
20
|
-
export * from "./logo/Logo.js";
|
|
21
|
-
export * from "./media-control/MediaControl.js";
|
|
22
|
-
export * from "./multi-camera/MultiCamera.js";
|
|
23
|
-
export * from "./picture-in-picture/PictureInPicture.js";
|
|
24
|
-
export * from "./playback-rate/PlaybackRate.js";
|
|
25
|
-
export * from "./poster/Poster.js";
|
|
26
|
-
export * from "./seek-time/SeekTime.js";
|
|
27
|
-
export * from "./share/Share.js";
|
|
28
|
-
export * from "./skip-time/SkipTime.js";
|
|
29
|
-
export * from "./source-controller/SourceController.js";
|
|
30
|
-
export * from "./spinner-three-bounce/SpinnerThreeBounce.js";
|
|
31
|
-
export * from "./subtitles/Subtitles.js";
|
|
32
|
-
export * from "./telemetry/Telemetry.js";
|
|
33
|
-
export * from "./thumbnails/Thumbnails.js";
|
|
34
|
-
export * from "./volume-fade/VolumeFade.js";
|
|
35
|
-
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/plugins/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,2BAA2B,CAAC;AAEnC,cAAc,mCAAmC,CAAC;AAClD,cAAc,oCAAoC,CAAC;AACnD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,wCAAwC,CAAC;AACvD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,kCAAkC,CAAC;AACjD,cAAc,kBAAkB,CAAC;AACjC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,sBAAsB,CAAC;AAErC,cAAc,uCAAuC,CAAC;AACtD,cAAc,mCAAmC,CAAC;AAClD,cAAc,gBAAgB,CAAC;AAC/B,cAAc,iCAAiC,CAAC;AAChD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,0CAA0C,CAAC;AACzD,cAAc,iCAAiC,CAAC;AAChD,cAAc,oBAAoB,CAAC;AACnC,cAAc,yBAAyB,CAAC;AACxC,cAAc,kBAAkB,CAAC;AACjC,cAAc,yBAAyB,CAAC;AACxC,cAAc,yCAAyC,CAAC;AACxD,cAAc,8CAA8C,CAAC;AAC7D,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,4BAA4B,CAAC;AAG3C,cAAc,6BAA6B,CAAC"}
|
package/lib/plugins/index.js
DELETED
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @packageDocumentation
|
|
3
|
-
* @beta
|
|
4
|
-
* A collection of plugins for the Gcore video player
|
|
5
|
-
*/
|
|
6
|
-
import '../assets/style/main.scss';
|
|
7
|
-
export * from "./audio-selector/AudioSelector.js";
|
|
8
|
-
export * from "./big-mute-button/BigMuteButton.js";
|
|
9
|
-
export * from "./bottom-gear/BottomGear.js";
|
|
10
|
-
export * from "./clappr-nerd-stats/ClapprNerdStats.js";
|
|
11
|
-
export * from "./clappr-stats/ClapprStats.js";
|
|
12
|
-
export * from "./click-to-pause/ClickToPause.js";
|
|
13
|
-
export * from "./clips/Clips.js";
|
|
14
|
-
export * from "./context-menu/ContextMenu.js";
|
|
15
|
-
export * from "./dvr-controls/DvrControls.js";
|
|
16
|
-
export * from "./error-screen/ErrorScreen.js";
|
|
17
|
-
export * from "./favicon/Favicon.js";
|
|
18
|
-
// _ ga-events
|
|
19
|
-
export * from "./google-analytics/GoogleAnalytics.js";
|
|
20
|
-
export * from "./level-selector/LevelSelector.js";
|
|
21
|
-
export * from "./logo/Logo.js";
|
|
22
|
-
export * from "./media-control/MediaControl.js";
|
|
23
|
-
export * from "./multi-camera/MultiCamera.js";
|
|
24
|
-
export * from "./picture-in-picture/PictureInPicture.js";
|
|
25
|
-
export * from "./playback-rate/PlaybackRate.js";
|
|
26
|
-
export * from "./poster/Poster.js";
|
|
27
|
-
export * from "./seek-time/SeekTime.js";
|
|
28
|
-
export * from "./share/Share.js";
|
|
29
|
-
export * from "./skip-time/SkipTime.js";
|
|
30
|
-
export * from "./source-controller/SourceController.js";
|
|
31
|
-
export * from "./spinner-three-bounce/SpinnerThreeBounce.js";
|
|
32
|
-
export * from "./subtitles/Subtitles.js";
|
|
33
|
-
export * from "./telemetry/Telemetry.js";
|
|
34
|
-
export * from "./thumbnails/Thumbnails.js";
|
|
35
|
-
// _ vast-ads
|
|
36
|
-
// _ video360
|
|
37
|
-
export * from "./volume-fade/VolumeFade.js";
|
|
@@ -1,112 +0,0 @@
|
|
|
1
|
-
import { UICorePlugin } from '@clappr/core';
|
|
2
|
-
import '../../../assets/level-selector/style.scss';
|
|
3
|
-
/**
|
|
4
|
-
* Configuration options for the {@link QualityLevels} plugin.
|
|
5
|
-
* @beta
|
|
6
|
-
*/
|
|
7
|
-
export interface QualityLevelsPluginSettings {
|
|
8
|
-
/**
|
|
9
|
-
* The maximum resolution to allow in the level selector.
|
|
10
|
-
*/
|
|
11
|
-
restrictResolution?: number;
|
|
12
|
-
/**
|
|
13
|
-
* The labels to show in the level selector.
|
|
14
|
-
* @example
|
|
15
|
-
* ```ts
|
|
16
|
-
* { 360: 'SD', 720: 'HD' }
|
|
17
|
-
* ```
|
|
18
|
-
*/
|
|
19
|
-
labels?: Record<number, string>;
|
|
20
|
-
}
|
|
21
|
-
/**
|
|
22
|
-
* `PLUGIN` that provides a UI to select the desired quality level of the playback.
|
|
23
|
-
* @beta
|
|
24
|
-
*
|
|
25
|
-
* @remarks
|
|
26
|
-
* Depends on:
|
|
27
|
-
*
|
|
28
|
-
* - {@link MediaControl}
|
|
29
|
-
*
|
|
30
|
-
* - {@link BottomGear}
|
|
31
|
-
*
|
|
32
|
-
* The plugin is rendered as an item in the gear menu, which, when clicked, shows a list of quality levels to choose from.
|
|
33
|
-
*
|
|
34
|
-
* Configuration options - {@link QualityLevelsPluginSettings}
|
|
35
|
-
*
|
|
36
|
-
* @example
|
|
37
|
-
* ```ts
|
|
38
|
-
* new Player({
|
|
39
|
-
* qualityLevels: {
|
|
40
|
-
* restrictResolution: 360,
|
|
41
|
-
* labels: { 360: 'SD', 720: 'HD' },
|
|
42
|
-
* },
|
|
43
|
-
* })
|
|
44
|
-
* ```
|
|
45
|
-
*/
|
|
46
|
-
export declare class QualityLevels extends UICorePlugin {
|
|
47
|
-
private levels;
|
|
48
|
-
private levelLabels;
|
|
49
|
-
private removeAuto;
|
|
50
|
-
private isHd;
|
|
51
|
-
private currentText;
|
|
52
|
-
private selectedLevelId;
|
|
53
|
-
private static readonly buttonTemplate;
|
|
54
|
-
private static readonly listTemplate;
|
|
55
|
-
/**
|
|
56
|
-
* @internal
|
|
57
|
-
*/
|
|
58
|
-
get name(): string;
|
|
59
|
-
/**
|
|
60
|
-
* @internal
|
|
61
|
-
*/
|
|
62
|
-
get supportedVersion(): {
|
|
63
|
-
min: string;
|
|
64
|
-
};
|
|
65
|
-
/**
|
|
66
|
-
* @internal
|
|
67
|
-
*/
|
|
68
|
-
static get version(): string;
|
|
69
|
-
/**
|
|
70
|
-
* @internal
|
|
71
|
-
*/
|
|
72
|
-
get attributes(): {
|
|
73
|
-
class: string;
|
|
74
|
-
'data-level-selector': string;
|
|
75
|
-
};
|
|
76
|
-
get events(): {
|
|
77
|
-
'click .gear-sub-menu_btn': string;
|
|
78
|
-
'click .go-back': string;
|
|
79
|
-
};
|
|
80
|
-
/**
|
|
81
|
-
* @internal
|
|
82
|
-
*/
|
|
83
|
-
bindEvents(): void;
|
|
84
|
-
private onCoreReady;
|
|
85
|
-
private onGearRendered;
|
|
86
|
-
private onActiveContainerChange;
|
|
87
|
-
private updateHd;
|
|
88
|
-
private onStop;
|
|
89
|
-
private shouldRender;
|
|
90
|
-
/**
|
|
91
|
-
* @internal
|
|
92
|
-
*/
|
|
93
|
-
render(): this;
|
|
94
|
-
private renderDropdown;
|
|
95
|
-
private updateButton;
|
|
96
|
-
private get pluginOptions();
|
|
97
|
-
private get maxLevel();
|
|
98
|
-
private onLevelsAvailable;
|
|
99
|
-
private makeLevelsLabels;
|
|
100
|
-
private onSelect;
|
|
101
|
-
private goBack;
|
|
102
|
-
private setLevel;
|
|
103
|
-
private allLevelElements;
|
|
104
|
-
private levelElement;
|
|
105
|
-
private onLevelSwitchStart;
|
|
106
|
-
private onLevelSwitchEnd;
|
|
107
|
-
private updateText;
|
|
108
|
-
private getLevelLabel;
|
|
109
|
-
private onBitrate;
|
|
110
|
-
private highlightCurrentLevel;
|
|
111
|
-
}
|
|
112
|
-
//# sourceMappingURL=LevelSelector.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"LevelSelector.d.ts","sourceRoot":"","sources":["../../../src/plugins/level-selector/LevelSelector.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,YAAY,EAAE,MAAM,cAAc,CAAA;AAgB7D,OAAO,2CAA2C,CAAA;AAMlD;;;GAGG;AACH,MAAM,WAAW,2BAA2B;IAC1C;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B;;;;;;OAMG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;CAChC;AAED;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,qBAAa,aAAc,SAAQ,YAAY;IAC7C,OAAO,CAAC,MAAM,CAAqB;IAEnC,OAAO,CAAC,WAAW,CAAe;IAElC,OAAO,CAAC,UAAU,CAAQ;IAE1B,OAAO,CAAC,IAAI,CAAQ;IAEpB,OAAO,CAAC,WAAW,CAAK;IAExB,OAAO,CAAC,eAAe,CAAK;IAE5B,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAChB;IAEtB,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,YAAY,CAAuC;IAE3E;;OAEG;IACH,IAAI,IAAI,WAEP;IAED;;OAEG;IACH,IAAI,gBAAgB;;MAEnB;IAED;;OAEG;IACH,MAAM,KAAK,OAAO,WAEjB;IAED;;OAEG;IACH,IAAa,UAAU;;;MAKtB;IAED,IAAa,MAAM;;;MAKlB;IAED;;OAEG;IACM,UAAU;IASnB,OAAO,CAAC,WAAW;IASnB,OAAO,CAAC,cAAc;IAKtB,OAAO,CAAC,uBAAuB;IAoC/B,OAAO,CAAC,QAAQ;IAQhB,OAAO,CAAC,MAAM;IAWd,OAAO,CAAC,YAAY;IAcpB;;OAEG;IACM,MAAM;IAUf,OAAO,CAAC,cAAc;IAetB,OAAO,CAAC,YAAY;IAcpB,OAAO,KAAK,aAAa,GAExB;IAED,OAAO,KAAK,QAAQ,GASnB;IAED,OAAO,CAAC,iBAAiB;IAkBzB,OAAO,CAAC,gBAAgB;IAWxB,OAAO,CAAC,QAAQ;IAYhB,OAAO,CAAC,MAAM;IAKd,OAAO,CAAC,QAAQ;IAMhB,OAAO,CAAC,gBAAgB;IAIxB,OAAO,CAAC,YAAY;IAMpB,OAAO,CAAC,kBAAkB;IAI1B,OAAO,CAAC,gBAAgB;IAIxB,OAAO,CAAC,UAAU;IAKlB,OAAO,CAAC,aAAa;IAWrB,OAAO,CAAC,SAAS;IAKjB,OAAO,CAAC,qBAAqB;CAkB9B"}
|
|
@@ -1,280 +0,0 @@
|
|
|
1
|
-
import { Events, template, UICorePlugin } from '@clappr/core';
|
|
2
|
-
import { trace } from '@gcorevideo/utils';
|
|
3
|
-
import assert from 'assert';
|
|
4
|
-
import { CLAPPR_VERSION } from '../../build.js';
|
|
5
|
-
import { GearEvents } from '../bottom-gear/BottomGear.js';
|
|
6
|
-
import buttonHtml from '../../../assets/level-selector/button.ejs';
|
|
7
|
-
import listHtml from '../../../assets/level-selector/list.ejs';
|
|
8
|
-
import hdIcon from '../../../assets/icons/new/hd.svg';
|
|
9
|
-
import arrowRightIcon from '../../../assets/icons/new/arrow-right.svg';
|
|
10
|
-
import arrowLeftIcon from '../../../assets/icons/new/arrow-left.svg';
|
|
11
|
-
import checkIcon from '../../../assets/icons/new/check.svg';
|
|
12
|
-
import '../../../assets/level-selector/style.scss';
|
|
13
|
-
const T = 'plugins.level_selector';
|
|
14
|
-
const VERSION = '2.19.4';
|
|
15
|
-
/**
|
|
16
|
-
* `PLUGIN` that provides a UI to select the desired quality level of the playback.
|
|
17
|
-
* @beta
|
|
18
|
-
*
|
|
19
|
-
* @remarks
|
|
20
|
-
* Depends on:
|
|
21
|
-
*
|
|
22
|
-
* - {@link MediaControl}
|
|
23
|
-
*
|
|
24
|
-
* - {@link BottomGear}
|
|
25
|
-
*
|
|
26
|
-
* The plugin is rendered as an item in the gear menu, which, when clicked, shows a list of quality levels to choose from.
|
|
27
|
-
*
|
|
28
|
-
* Configuration options - {@link QualityLevelsPluginSettings}
|
|
29
|
-
*
|
|
30
|
-
* @example
|
|
31
|
-
* ```ts
|
|
32
|
-
* new Player({
|
|
33
|
-
* qualityLevels: {
|
|
34
|
-
* restrictResolution: 360,
|
|
35
|
-
* labels: { 360: 'SD', 720: 'HD' },
|
|
36
|
-
* },
|
|
37
|
-
* })
|
|
38
|
-
* ```
|
|
39
|
-
*/
|
|
40
|
-
export class QualityLevels extends UICorePlugin {
|
|
41
|
-
levels = [];
|
|
42
|
-
levelLabels = [];
|
|
43
|
-
removeAuto = false;
|
|
44
|
-
isHd = false;
|
|
45
|
-
currentText = '';
|
|
46
|
-
selectedLevelId = -1;
|
|
47
|
-
static buttonTemplate = template(buttonHtml);
|
|
48
|
-
static listTemplate = template(listHtml);
|
|
49
|
-
/**
|
|
50
|
-
* @internal
|
|
51
|
-
*/
|
|
52
|
-
get name() {
|
|
53
|
-
return 'level_selector';
|
|
54
|
-
}
|
|
55
|
-
/**
|
|
56
|
-
* @internal
|
|
57
|
-
*/
|
|
58
|
-
get supportedVersion() {
|
|
59
|
-
return { min: CLAPPR_VERSION };
|
|
60
|
-
}
|
|
61
|
-
/**
|
|
62
|
-
* @internal
|
|
63
|
-
*/
|
|
64
|
-
static get version() {
|
|
65
|
-
return VERSION;
|
|
66
|
-
}
|
|
67
|
-
/**
|
|
68
|
-
* @internal
|
|
69
|
-
*/
|
|
70
|
-
get attributes() {
|
|
71
|
-
return {
|
|
72
|
-
class: 'level-selector',
|
|
73
|
-
'data-level-selector': '',
|
|
74
|
-
};
|
|
75
|
-
}
|
|
76
|
-
get events() {
|
|
77
|
-
return {
|
|
78
|
-
'click .gear-sub-menu_btn': 'onSelect',
|
|
79
|
-
'click .go-back': 'goBack',
|
|
80
|
-
};
|
|
81
|
-
}
|
|
82
|
-
/**
|
|
83
|
-
* @internal
|
|
84
|
-
*/
|
|
85
|
-
bindEvents() {
|
|
86
|
-
this.listenToOnce(this.core, Events.CORE_READY, this.onCoreReady);
|
|
87
|
-
this.listenTo(this.core, Events.CORE_ACTIVE_CONTAINER_CHANGED, this.onActiveContainerChange);
|
|
88
|
-
}
|
|
89
|
-
onCoreReady() {
|
|
90
|
-
trace(`${T} onCoreReady`);
|
|
91
|
-
const gear = this.core.getPlugin('bottom_gear');
|
|
92
|
-
assert(gear, 'bottom_gear plugin is required');
|
|
93
|
-
this.currentText = this.core.i18n.t('auto');
|
|
94
|
-
this.listenTo(gear, GearEvents.RENDERED, this.onGearRendered);
|
|
95
|
-
}
|
|
96
|
-
onGearRendered() {
|
|
97
|
-
trace(`${T} onGearRendered`);
|
|
98
|
-
this.render();
|
|
99
|
-
}
|
|
100
|
-
onActiveContainerChange() {
|
|
101
|
-
this.removeAuto = false;
|
|
102
|
-
this.isHd = false;
|
|
103
|
-
const activePlayback = this.core.activePlayback;
|
|
104
|
-
this.listenTo(activePlayback, Events.PLAYBACK_LEVELS_AVAILABLE, this.onLevelsAvailable);
|
|
105
|
-
this.listenTo(activePlayback, Events.PLAYBACK_LEVEL_SWITCH_START, this.onLevelSwitchStart);
|
|
106
|
-
this.listenTo(activePlayback, Events.PLAYBACK_LEVEL_SWITCH_END, this.onLevelSwitchEnd);
|
|
107
|
-
this.listenTo(activePlayback, Events.PLAYBACK_BITRATE, this.onBitrate);
|
|
108
|
-
this.listenTo(activePlayback, Events.PLAYBACK_STOP, this.onStop);
|
|
109
|
-
this.listenTo(activePlayback, Events.PLAYBACK_HIGHDEFINITIONUPDATE, (isHd) => {
|
|
110
|
-
this.isHd = isHd;
|
|
111
|
-
this.updateHd();
|
|
112
|
-
});
|
|
113
|
-
if (activePlayback.levels?.length > 0) {
|
|
114
|
-
this.onLevelsAvailable(activePlayback.levels);
|
|
115
|
-
}
|
|
116
|
-
}
|
|
117
|
-
updateHd() {
|
|
118
|
-
if (this.isHd) {
|
|
119
|
-
this.$el.find('.gear-option_hd-icon').removeClass('hidden');
|
|
120
|
-
}
|
|
121
|
-
else {
|
|
122
|
-
this.$el.find('.gear-option_hd-icon').addClass('hidden');
|
|
123
|
-
}
|
|
124
|
-
}
|
|
125
|
-
onStop() {
|
|
126
|
-
trace(`${T} onStop`);
|
|
127
|
-
this.listenToOnce(this.core.activePlayback, Events.PLAYBACK_PLAY, () => {
|
|
128
|
-
if (this.core.activePlayback.getPlaybackType() === 'live') {
|
|
129
|
-
if (this.selectedLevelId !== -1) {
|
|
130
|
-
this.core.activePlayback.currentLevel = this.selectedLevelId;
|
|
131
|
-
}
|
|
132
|
-
}
|
|
133
|
-
});
|
|
134
|
-
}
|
|
135
|
-
shouldRender() {
|
|
136
|
-
const activePlayback = this.core.activePlayback;
|
|
137
|
-
if (!activePlayback) {
|
|
138
|
-
return false;
|
|
139
|
-
}
|
|
140
|
-
const supportsCurrentLevel = 'currentLevel' in activePlayback;
|
|
141
|
-
if (!supportsCurrentLevel) {
|
|
142
|
-
return false;
|
|
143
|
-
}
|
|
144
|
-
// Only care if we have at least 2 to choose from
|
|
145
|
-
return !!(this.levels && this.levels.length > 1);
|
|
146
|
-
}
|
|
147
|
-
/**
|
|
148
|
-
* @internal
|
|
149
|
-
*/
|
|
150
|
-
render() {
|
|
151
|
-
if (!this.shouldRender()) {
|
|
152
|
-
return this;
|
|
153
|
-
}
|
|
154
|
-
this.renderDropdown();
|
|
155
|
-
this.updateButton();
|
|
156
|
-
return this;
|
|
157
|
-
}
|
|
158
|
-
renderDropdown() {
|
|
159
|
-
this.$el.html(QualityLevels.listTemplate({
|
|
160
|
-
arrowLeftIcon,
|
|
161
|
-
checkIcon,
|
|
162
|
-
current: this.selectedLevelId,
|
|
163
|
-
labels: this.levelLabels,
|
|
164
|
-
levels: this.levels,
|
|
165
|
-
maxLevel: this.maxLevel,
|
|
166
|
-
removeAuto: this.removeAuto,
|
|
167
|
-
i18n: this.core.i18n,
|
|
168
|
-
}));
|
|
169
|
-
}
|
|
170
|
-
updateButton() {
|
|
171
|
-
;
|
|
172
|
-
this.core.getPlugin('bottom_gear')
|
|
173
|
-
?.addItem('quality', this.$el)
|
|
174
|
-
.html(QualityLevels.buttonTemplate({
|
|
175
|
-
arrowRightIcon,
|
|
176
|
-
currentText: this.currentText,
|
|
177
|
-
isHd: this.isHd,
|
|
178
|
-
hdIcon,
|
|
179
|
-
i18n: this.core.i18n,
|
|
180
|
-
}));
|
|
181
|
-
}
|
|
182
|
-
get pluginOptions() {
|
|
183
|
-
return this.core.options.qualityLevels || this.core.options.levelSelector;
|
|
184
|
-
}
|
|
185
|
-
get maxLevel() {
|
|
186
|
-
const maxRes = this.pluginOptions.restrictResolution;
|
|
187
|
-
return maxRes
|
|
188
|
-
? this.levels.find((level) => (level.height > level.width ? level.width : level.height) ===
|
|
189
|
-
maxRes)?.level ?? -1
|
|
190
|
-
: -1;
|
|
191
|
-
}
|
|
192
|
-
onLevelsAvailable(levels) {
|
|
193
|
-
const maxResolution = this.pluginOptions.restrictResolution;
|
|
194
|
-
this.levels = levels;
|
|
195
|
-
this.makeLevelsLabels();
|
|
196
|
-
if (maxResolution) {
|
|
197
|
-
this.removeAuto = true;
|
|
198
|
-
const initialLevel = levels
|
|
199
|
-
.filter((level) => (level.width > level.height ? level.height : level.width) <=
|
|
200
|
-
maxResolution)
|
|
201
|
-
.pop();
|
|
202
|
-
this.setLevel(initialLevel?.level ?? 0);
|
|
203
|
-
}
|
|
204
|
-
this.render();
|
|
205
|
-
}
|
|
206
|
-
makeLevelsLabels() {
|
|
207
|
-
const labels = this.pluginOptions.labels ?? {};
|
|
208
|
-
this.levelLabels = [];
|
|
209
|
-
for (const level of this.levels) {
|
|
210
|
-
const ll = level.width > level.height ? level.height : level.width;
|
|
211
|
-
const label = labels[ll] || `${ll}p`;
|
|
212
|
-
this.levelLabels.push(label);
|
|
213
|
-
}
|
|
214
|
-
}
|
|
215
|
-
onSelect(event) {
|
|
216
|
-
const selectedLevel = parseInt(event.currentTarget?.dataset?.id ?? '-1', 10);
|
|
217
|
-
this.setLevel(selectedLevel);
|
|
218
|
-
event.stopPropagation();
|
|
219
|
-
event.preventDefault();
|
|
220
|
-
return false;
|
|
221
|
-
}
|
|
222
|
-
goBack() {
|
|
223
|
-
trace(`${T} goBack`);
|
|
224
|
-
this.core.getPlugin('bottom_gear').refresh();
|
|
225
|
-
}
|
|
226
|
-
setLevel(index) {
|
|
227
|
-
this.selectedLevelId = index;
|
|
228
|
-
this.core.activePlayback.currentLevel = this.selectedLevelId;
|
|
229
|
-
this.highlightCurrentLevel();
|
|
230
|
-
}
|
|
231
|
-
allLevelElements() {
|
|
232
|
-
return this.$('#level-selector-menu li');
|
|
233
|
-
}
|
|
234
|
-
levelElement(id = -1) {
|
|
235
|
-
return this.$(`#level-selector-menu a[data-id="${id}"]`).parent();
|
|
236
|
-
}
|
|
237
|
-
onLevelSwitchStart() {
|
|
238
|
-
this.levelElement(this.selectedLevelId).addClass('changing');
|
|
239
|
-
}
|
|
240
|
-
onLevelSwitchEnd() {
|
|
241
|
-
this.levelElement(this.selectedLevelId).removeClass('changing');
|
|
242
|
-
}
|
|
243
|
-
updateText(level) {
|
|
244
|
-
this.currentText = this.getLevelLabel(level);
|
|
245
|
-
this.updateButton();
|
|
246
|
-
}
|
|
247
|
-
getLevelLabel(id) {
|
|
248
|
-
if (id < 0) {
|
|
249
|
-
return this.core.i18n.t('auto');
|
|
250
|
-
}
|
|
251
|
-
const index = this.levels.findIndex((l) => l.level === id);
|
|
252
|
-
if (index < 0) {
|
|
253
|
-
return this.core.i18n.t('auto');
|
|
254
|
-
}
|
|
255
|
-
return this.levelLabels[index] ?? formatLevelLabel(this.levels[index]);
|
|
256
|
-
}
|
|
257
|
-
onBitrate(info) {
|
|
258
|
-
trace(`${T} updateCurrentLevel`, { info });
|
|
259
|
-
this.highlightCurrentLevel();
|
|
260
|
-
}
|
|
261
|
-
highlightCurrentLevel() {
|
|
262
|
-
trace(`${T} highlightCurrentLevel`, {
|
|
263
|
-
selectedLevelId: this.selectedLevelId,
|
|
264
|
-
});
|
|
265
|
-
this.allLevelElements()
|
|
266
|
-
.removeClass('current')
|
|
267
|
-
.find('a')
|
|
268
|
-
.removeClass('gcore-skin-active');
|
|
269
|
-
const currentLevelElement = this.levelElement(this.selectedLevelId);
|
|
270
|
-
currentLevelElement
|
|
271
|
-
.addClass('current')
|
|
272
|
-
.find('a')
|
|
273
|
-
.addClass('gcore-skin-active');
|
|
274
|
-
this.updateText(this.selectedLevelId);
|
|
275
|
-
}
|
|
276
|
-
}
|
|
277
|
-
function formatLevelLabel(level) {
|
|
278
|
-
const h = level.width > level.height ? level.height : level.width;
|
|
279
|
-
return `${h}p`;
|
|
280
|
-
}
|
|
@@ -1,87 +0,0 @@
|
|
|
1
|
-
import { Container, ContainerPlugin } from '@clappr/core';
|
|
2
|
-
import type { PlaybackType } from '../../types';
|
|
3
|
-
type StatisticsEventData = Record<string, string | number | boolean>;
|
|
4
|
-
type StatisticsRecord = {
|
|
5
|
-
event: StatisticsEvent;
|
|
6
|
-
type: PlaybackType;
|
|
7
|
-
} & StatisticsEventData;
|
|
8
|
-
/**
|
|
9
|
-
* Plugin settings
|
|
10
|
-
*/
|
|
11
|
-
export type PluginSettings = {
|
|
12
|
-
/**
|
|
13
|
-
* Sends the statistics record to the storage.
|
|
14
|
-
* The actual delivery is presumably async and batched.
|
|
15
|
-
* @param data - The statistics record to send.
|
|
16
|
-
*/
|
|
17
|
-
send: (data: StatisticsRecord) => void;
|
|
18
|
-
};
|
|
19
|
-
type StatisticsEvent = 'init' | 'start' | 'watch' | 'heatmap';
|
|
20
|
-
/**
|
|
21
|
-
* Collects and reports the performance statistics.
|
|
22
|
-
* @beta
|
|
23
|
-
* @example
|
|
24
|
-
* ```ts
|
|
25
|
-
* import { Statistics } from '@gcorevideo/player'
|
|
26
|
-
*
|
|
27
|
-
* Player.registerPlugin(Statistics)
|
|
28
|
-
*
|
|
29
|
-
* const player = new Player({
|
|
30
|
-
* statistics: {
|
|
31
|
-
* send: (data) => {
|
|
32
|
-
* fetch('/stats', {
|
|
33
|
-
* method: 'POST',
|
|
34
|
-
* body: JSON.stringify(data),
|
|
35
|
-
* headers: { 'content-type': 'application/json' },
|
|
36
|
-
* })
|
|
37
|
-
* }
|
|
38
|
-
* },
|
|
39
|
-
* ...
|
|
40
|
-
* })
|
|
41
|
-
* ```
|
|
42
|
-
*/
|
|
43
|
-
export declare class Statistics extends ContainerPlugin {
|
|
44
|
-
/**
|
|
45
|
-
* The name of the plugin.
|
|
46
|
-
*/
|
|
47
|
-
get name(): string;
|
|
48
|
-
/**
|
|
49
|
-
* The supported version of the plugin.
|
|
50
|
-
*/
|
|
51
|
-
get supportedVersion(): {
|
|
52
|
-
min: string;
|
|
53
|
-
};
|
|
54
|
-
private started;
|
|
55
|
-
private timeStart;
|
|
56
|
-
private heatmapSent;
|
|
57
|
-
private heatmapLastTime;
|
|
58
|
-
private watchSent;
|
|
59
|
-
private bufTracking;
|
|
60
|
-
private lags;
|
|
61
|
-
/**
|
|
62
|
-
* The time when buffering last started.
|
|
63
|
-
*/
|
|
64
|
-
private bufLastStarted;
|
|
65
|
-
/**
|
|
66
|
-
* The accumulated buffering duration.
|
|
67
|
-
*/
|
|
68
|
-
private bufAccDuration;
|
|
69
|
-
constructor(container: Container);
|
|
70
|
-
/**
|
|
71
|
-
* @internal
|
|
72
|
-
*/
|
|
73
|
-
bindEvents(): void;
|
|
74
|
-
private startLevelSwitch;
|
|
75
|
-
private endLevelSwitch;
|
|
76
|
-
private onBuffering;
|
|
77
|
-
private onBufferFull;
|
|
78
|
-
private onReady;
|
|
79
|
-
private sendInit;
|
|
80
|
-
private sendMessage;
|
|
81
|
-
private send;
|
|
82
|
-
private sendHeatmap;
|
|
83
|
-
private onTimeUpdateLive;
|
|
84
|
-
private onStart;
|
|
85
|
-
}
|
|
86
|
-
export {};
|
|
87
|
-
//# sourceMappingURL=Statistics.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Statistics.d.ts","sourceRoot":"","sources":["../../../src/plugins/statistics/Statistics.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,eAAe,EAAoB,MAAM,cAAc,CAAA;AAK3E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAA;AAY/C,KAAK,mBAAmB,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC,CAAA;AAEpE,KAAK,gBAAgB,GAAG;IACtB,KAAK,EAAE,eAAe,CAAA;IACtB,IAAI,EAAE,YAAY,CAAA;CACnB,GAAG,mBAAmB,CAAA;AAEvB;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG;IAC3B;;;;OAIG;IACH,IAAI,EAAE,CAAC,IAAI,EAAE,gBAAgB,KAAK,IAAI,CAAA;CACvC,CAAA;AAED,KAAK,eAAe,GAAG,MAAM,GAAG,OAAO,GAAG,OAAO,GAAG,SAAS,CAAA;AAE7D;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,qBAAa,UAAW,SAAQ,eAAe;IAC7C;;OAEG;IACH,IAAI,IAAI,WAEP;IAED;;OAEG;IACH,IAAI,gBAAgB;;MAEnB;IAED,OAAO,CAAC,OAAO,CAAQ;IAEvB,OAAO,CAAC,SAAS,CAAI;IAErB,OAAO,CAAC,WAAW,CAAQ;IAE3B,OAAO,CAAC,eAAe,CAAI;IAE3B,OAAO,CAAC,SAAS,CAAQ;IAEzB,OAAO,CAAC,WAAW,CAAQ;IAE3B,OAAO,CAAC,IAAI,CAAI;IAEhB;;OAEG;IACH,OAAO,CAAC,cAAc,CAAI;IAE1B;;OAEG;IACH,OAAO,CAAC,cAAc,CAAI;gBAEd,SAAS,EAAE,SAAS;IAShC;;OAEG;IACM,UAAU;IAoCnB,OAAO,CAAC,gBAAgB;IAIxB,OAAO,CAAC,cAAc;IAItB,OAAO,CAAC,WAAW;IAMnB,OAAO,CAAC,YAAY;IAQpB,OAAO,CAAC,OAAO;IAgBf,OAAO,CAAC,QAAQ;IAIhB,OAAO,CAAC,WAAW;IAOnB,OAAO,CAAC,IAAI;IAQZ,OAAO,CAAC,WAAW;IAgBnB,OAAO,CAAC,gBAAgB;IAuBxB,OAAO,CAAC,OAAO;CAOhB"}
|