@gcorevideo/player 2.22.24 → 2.22.26
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/assets/clappr-nerd-stats/clappr-nerd-stats.scss +11 -0
- package/assets/seek-time/seek-time.html +3 -2
- package/dist/core.js +1 -1
- package/dist/index.css +1448 -1441
- package/dist/index.js +147 -139
- package/dist/plugins/index.css +724 -724
- package/lib/plugins/clappr-nerd-stats/speedtest/Speedtest.d.ts.map +1 -1
- package/lib/plugins/clappr-nerd-stats/speedtest/Speedtest.js +1 -0
- package/lib/plugins/clappr-nerd-stats/speedtest/index.d.ts.map +1 -1
- package/lib/plugins/clappr-nerd-stats/speedtest/index.js +7 -1
- package/lib/plugins/seek-time/SeekTime.d.ts +14 -10
- package/lib/plugins/seek-time/SeekTime.d.ts.map +1 -1
- package/lib/plugins/seek-time/SeekTime.js +72 -69
- package/package.json +1 -1
- package/rollup.config.js +28 -28
- package/src/plugins/bottom-gear/__tests__/BottomGear.test.ts +0 -3
- package/src/plugins/clappr-nerd-stats/speedtest/Speedtest.ts +1 -0
- package/src/plugins/clappr-nerd-stats/speedtest/index.ts +8 -1
- package/src/plugins/seek-time/SeekTime.ts +156 -113
- package/src/plugins/subtitles/__tests__/ClosedCaptions.test.ts +1 -0
- package/tsconfig.tsbuildinfo +1 -1
package/dist/index.js
CHANGED
|
@@ -12680,7 +12680,7 @@ var PlaybackEvents;
|
|
|
12680
12680
|
// https://github.com/clappr/clappr/blob/8752995ea439321ac7ca3cd35e8c64de7a3c3d17/LICENSE
|
|
12681
12681
|
const AUTO$1 = -1;
|
|
12682
12682
|
const { now: now$2 } = Utils;
|
|
12683
|
-
const T$
|
|
12683
|
+
const T$n = 'playback.dash';
|
|
12684
12684
|
class DashPlayback extends BasePlayback {
|
|
12685
12685
|
_levels = null;
|
|
12686
12686
|
_currentLevel = null;
|
|
@@ -12955,10 +12955,10 @@ class DashPlayback extends BasePlayback {
|
|
|
12955
12955
|
}
|
|
12956
12956
|
_onPlaybackError = (event) => {
|
|
12957
12957
|
// TODO
|
|
12958
|
-
trace(`${T$
|
|
12958
|
+
trace(`${T$n} _onPlaybackError`, { event });
|
|
12959
12959
|
};
|
|
12960
12960
|
_onDASHJSSError = (event) => {
|
|
12961
|
-
trace(`${T$
|
|
12961
|
+
trace(`${T$n} _onDASHJSSError`, { event });
|
|
12962
12962
|
this._stopTimeUpdateTimer();
|
|
12963
12963
|
// Note that the other error types are deprecated
|
|
12964
12964
|
const e = event.error;
|
|
@@ -12993,7 +12993,7 @@ class DashPlayback extends BasePlayback {
|
|
|
12993
12993
|
}
|
|
12994
12994
|
};
|
|
12995
12995
|
triggerError(error) {
|
|
12996
|
-
trace(`${T$
|
|
12996
|
+
trace(`${T$n} triggerError`, { error });
|
|
12997
12997
|
// this triggers Events.ERROR to be handled by the UI
|
|
12998
12998
|
this.trigger(Events$1.PLAYBACK_ERROR, this.createError(error, {
|
|
12999
12999
|
useCodePrefix: false,
|
|
@@ -13032,10 +13032,10 @@ class DashPlayback extends BasePlayback {
|
|
|
13032
13032
|
}
|
|
13033
13033
|
get dvrEnabled() {
|
|
13034
13034
|
if (!this._dash) {
|
|
13035
|
-
trace(`${T$
|
|
13035
|
+
trace(`${T$n} dvrEnable no dash player instance`);
|
|
13036
13036
|
return false;
|
|
13037
13037
|
}
|
|
13038
|
-
trace(`${T$
|
|
13038
|
+
trace(`${T$n} get.dvrEnabled`, {
|
|
13039
13039
|
dvrWindowSize: this._dash?.getDVRWindowSize(),
|
|
13040
13040
|
minDvrSize: this._minDvrSize,
|
|
13041
13041
|
playbackType: this.getPlaybackType(),
|
|
@@ -13057,7 +13057,7 @@ class DashPlayback extends BasePlayback {
|
|
|
13057
13057
|
this.trigger(Events$1.PLAYBACK_PROGRESS, progress, {});
|
|
13058
13058
|
}
|
|
13059
13059
|
play() {
|
|
13060
|
-
trace(`${T$
|
|
13060
|
+
trace(`${T$n} play`, { dash: !!this._dash });
|
|
13061
13061
|
if (!this._dash) {
|
|
13062
13062
|
this._setup();
|
|
13063
13063
|
}
|
|
@@ -13143,7 +13143,7 @@ class DashPlayback extends BasePlayback {
|
|
|
13143
13143
|
}
|
|
13144
13144
|
// @ts-expect-error
|
|
13145
13145
|
get currentAudioTrack() {
|
|
13146
|
-
trace(`${T$
|
|
13146
|
+
trace(`${T$n} get currentAudioTrack`);
|
|
13147
13147
|
assert.ok(this._dash, 'DASH.js MediaPlayer is not initialized');
|
|
13148
13148
|
const t = this._dash.getCurrentTrackFor('audio');
|
|
13149
13149
|
if (!t) {
|
|
@@ -41844,7 +41844,7 @@ const AUTO = -1;
|
|
|
41844
41844
|
const DEFAULT_RECOVER_ATTEMPTS = 16;
|
|
41845
41845
|
Events$1.register('PLAYBACK_FRAGMENT_CHANGED');
|
|
41846
41846
|
Events$1.register('PLAYBACK_FRAGMENT_PARSING_METADATA');
|
|
41847
|
-
const T$
|
|
41847
|
+
const T$m = 'playback.hls';
|
|
41848
41848
|
class HlsPlayback extends BasePlayback {
|
|
41849
41849
|
_ccIsSetup = false;
|
|
41850
41850
|
_ccTracksUpdated = false;
|
|
@@ -42073,7 +42073,7 @@ class HlsPlayback extends BasePlayback {
|
|
|
42073
42073
|
maxBufferLength: 2,
|
|
42074
42074
|
maxMaxBufferLength: 4,
|
|
42075
42075
|
}, this.options.playback.hlsjsConfig);
|
|
42076
|
-
trace(`${T$
|
|
42076
|
+
trace(`${T$m} _createHLSInstance`, { config });
|
|
42077
42077
|
this._hls = new Hls(config);
|
|
42078
42078
|
}
|
|
42079
42079
|
_attachHLSMedia() {
|
|
@@ -42164,7 +42164,7 @@ class HlsPlayback extends BasePlayback {
|
|
|
42164
42164
|
}
|
|
42165
42165
|
else {
|
|
42166
42166
|
Log.error('hlsjs: failed to recover', { evt, data });
|
|
42167
|
-
trace(`${T$
|
|
42167
|
+
trace(`${T$m} _recover failed to recover`, {
|
|
42168
42168
|
type: data.type,
|
|
42169
42169
|
details: data.details,
|
|
42170
42170
|
});
|
|
@@ -42250,7 +42250,7 @@ class HlsPlayback extends BasePlayback {
|
|
|
42250
42250
|
this.trigger(Events$1.PLAYBACK_SETTINGSUPDATE);
|
|
42251
42251
|
}
|
|
42252
42252
|
_onHLSJSError(evt, data) {
|
|
42253
|
-
trace(`${T$
|
|
42253
|
+
trace(`${T$m} _onHLSJSError`, {
|
|
42254
42254
|
fatal: data.fatal,
|
|
42255
42255
|
type: data.type,
|
|
42256
42256
|
details: data.details,
|
|
@@ -42298,7 +42298,7 @@ class HlsPlayback extends BasePlayback {
|
|
|
42298
42298
|
evt,
|
|
42299
42299
|
data,
|
|
42300
42300
|
});
|
|
42301
|
-
trace(`${T$
|
|
42301
|
+
trace(`${T$m} _onHLSJSError trying to recover from network error`, {
|
|
42302
42302
|
details: data.details,
|
|
42303
42303
|
});
|
|
42304
42304
|
error.level = PlayerError.Levels.WARN;
|
|
@@ -42311,7 +42311,7 @@ class HlsPlayback extends BasePlayback {
|
|
|
42311
42311
|
evt,
|
|
42312
42312
|
data,
|
|
42313
42313
|
});
|
|
42314
|
-
trace(`${T$
|
|
42314
|
+
trace(`${T$m} _onHLSJSError trying to recover from media error`, {
|
|
42315
42315
|
details: data.details,
|
|
42316
42316
|
});
|
|
42317
42317
|
error.level = PlayerError.Levels.WARN;
|
|
@@ -42341,7 +42341,7 @@ class HlsPlayback extends BasePlayback {
|
|
|
42341
42341
|
return;
|
|
42342
42342
|
}
|
|
42343
42343
|
Log.warn('hlsjs: non-fatal error occurred', { evt, data });
|
|
42344
|
-
trace(`${T$
|
|
42344
|
+
trace(`${T$m} _onHLSJSError non-fatal error occurred`, {
|
|
42345
42345
|
type: data.type,
|
|
42346
42346
|
details: data.details,
|
|
42347
42347
|
});
|
|
@@ -42675,11 +42675,11 @@ class HlsPlayback extends BasePlayback {
|
|
|
42675
42675
|
this._hls.audioTrack = Number(id); // TODO or find index by .id == id?
|
|
42676
42676
|
}
|
|
42677
42677
|
_onAudioTracksUpdated(_, data) {
|
|
42678
|
-
trace(`${T$
|
|
42678
|
+
trace(`${T$m} onAudioTracksUpdated`);
|
|
42679
42679
|
this.trigger(Events$1.PLAYBACK_AUDIO_AVAILABLE, data.audioTracks.map(toClapprTrack));
|
|
42680
42680
|
}
|
|
42681
42681
|
_onAudioTrackSwitched(_, data) {
|
|
42682
|
-
trace(`${T$
|
|
42682
|
+
trace(`${T$m} onAudioTrackSwitched`);
|
|
42683
42683
|
// @ts-ignore
|
|
42684
42684
|
const track = this._hls.audioTracks[data.id];
|
|
42685
42685
|
this.trigger(Events$1.PLAYBACK_AUDIO_CHANGED, toClapprTrack(track));
|
|
@@ -42700,7 +42700,7 @@ function toClapprTrack(t) {
|
|
|
42700
42700
|
};
|
|
42701
42701
|
}
|
|
42702
42702
|
|
|
42703
|
-
const T$
|
|
42703
|
+
const T$l = 'playback.html5_video';
|
|
42704
42704
|
const STALL_TIMEOUT = 15000;
|
|
42705
42705
|
class HTML5Video extends BasePlayback {
|
|
42706
42706
|
stallTimerId = null;
|
|
@@ -42708,7 +42708,7 @@ class HTML5Video extends BasePlayback {
|
|
|
42708
42708
|
* @internal
|
|
42709
42709
|
*/
|
|
42710
42710
|
createError(errorData, options) {
|
|
42711
|
-
trace(`${T$
|
|
42711
|
+
trace(`${T$l} createError`, {
|
|
42712
42712
|
errorData: { ...errorData },
|
|
42713
42713
|
});
|
|
42714
42714
|
const i18n = this.i18n ||
|
|
@@ -42724,11 +42724,11 @@ class HTML5Video extends BasePlayback {
|
|
|
42724
42724
|
return super.createError(errorData, { ...options, useCodePrefix: false });
|
|
42725
42725
|
}
|
|
42726
42726
|
_onWaiting() {
|
|
42727
|
-
trace(`${T$
|
|
42727
|
+
trace(`${T$l} _onWaiting`);
|
|
42728
42728
|
super._onWaiting();
|
|
42729
42729
|
}
|
|
42730
42730
|
_onEnded() {
|
|
42731
|
-
trace(`${T$
|
|
42731
|
+
trace(`${T$l} _onEnded`);
|
|
42732
42732
|
if (this.stallTimerId) {
|
|
42733
42733
|
clearTimeout(this.stallTimerId);
|
|
42734
42734
|
this.stallTimerId = null;
|
|
@@ -42736,12 +42736,12 @@ class HTML5Video extends BasePlayback {
|
|
|
42736
42736
|
super._onEnded();
|
|
42737
42737
|
}
|
|
42738
42738
|
_handleBufferingEvents() {
|
|
42739
|
-
trace(`${T$
|
|
42739
|
+
trace(`${T$l} _handleBufferingEvents`, {
|
|
42740
42740
|
networkState: this.el.networkState,
|
|
42741
42741
|
});
|
|
42742
42742
|
if (!this.stallTimerId) {
|
|
42743
42743
|
this.stallTimerId = setTimeout(() => {
|
|
42744
|
-
trace(`${T$
|
|
42744
|
+
trace(`${T$l} _handleBufferingEvents stall timeout`, {
|
|
42745
42745
|
buffering: this.buffering,
|
|
42746
42746
|
ended: this.ended,
|
|
42747
42747
|
});
|
|
@@ -42759,7 +42759,7 @@ class HTML5Video extends BasePlayback {
|
|
|
42759
42759
|
super._handleBufferingEvents();
|
|
42760
42760
|
}
|
|
42761
42761
|
_onPlaying() {
|
|
42762
|
-
trace(`${T$
|
|
42762
|
+
trace(`${T$l} _onPlaying`);
|
|
42763
42763
|
if (this.stallTimerId) {
|
|
42764
42764
|
clearTimeout(this.stallTimerId);
|
|
42765
42765
|
this.stallTimerId = null;
|
|
@@ -42767,7 +42767,7 @@ class HTML5Video extends BasePlayback {
|
|
|
42767
42767
|
super._onPlaying();
|
|
42768
42768
|
}
|
|
42769
42769
|
_onPause() {
|
|
42770
|
-
trace(`${T$
|
|
42770
|
+
trace(`${T$l} _onPause`);
|
|
42771
42771
|
super._onPause();
|
|
42772
42772
|
if (this.stallTimerId) {
|
|
42773
42773
|
clearTimeout(this.stallTimerId);
|
|
@@ -42777,7 +42777,7 @@ class HTML5Video extends BasePlayback {
|
|
|
42777
42777
|
get audioTracks() {
|
|
42778
42778
|
const tracks = this.el.audioTracks;
|
|
42779
42779
|
const supported = !!tracks;
|
|
42780
|
-
trace(`${T$
|
|
42780
|
+
trace(`${T$l} get audioTracks`, { supported });
|
|
42781
42781
|
const retval = [];
|
|
42782
42782
|
if (supported) {
|
|
42783
42783
|
for (let i = 0; i < tracks.length; i++) {
|
|
@@ -42796,7 +42796,7 @@ class HTML5Video extends BasePlayback {
|
|
|
42796
42796
|
get currentAudioTrack() {
|
|
42797
42797
|
const tracks = this.el.audioTracks;
|
|
42798
42798
|
const supported = !!tracks;
|
|
42799
|
-
trace(`${T$
|
|
42799
|
+
trace(`${T$l} get currentAudioTrack`, {
|
|
42800
42800
|
supported,
|
|
42801
42801
|
});
|
|
42802
42802
|
if (supported) {
|
|
@@ -42817,7 +42817,7 @@ class HTML5Video extends BasePlayback {
|
|
|
42817
42817
|
switchAudioTrack(id) {
|
|
42818
42818
|
const tracks = this.el.audioTracks;
|
|
42819
42819
|
const supported = !!tracks;
|
|
42820
|
-
trace(`${T$
|
|
42820
|
+
trace(`${T$l} switchAudioTrack`, {
|
|
42821
42821
|
supported,
|
|
42822
42822
|
});
|
|
42823
42823
|
if (supported) {
|
|
@@ -42836,7 +42836,7 @@ function registerPlaybacks() {
|
|
|
42836
42836
|
Loader.registerPlayback(DashPlayback);
|
|
42837
42837
|
}
|
|
42838
42838
|
|
|
42839
|
-
const T$
|
|
42839
|
+
const T$k = 'GPlayer';
|
|
42840
42840
|
const DEFAULT_OPTIONS = {
|
|
42841
42841
|
autoPlay: false,
|
|
42842
42842
|
debug: 'none',
|
|
@@ -42924,7 +42924,7 @@ class Player {
|
|
|
42924
42924
|
* ```
|
|
42925
42925
|
*/
|
|
42926
42926
|
attachTo(playerElement) {
|
|
42927
|
-
trace(`${T$
|
|
42927
|
+
trace(`${T$k} attachTo`, {
|
|
42928
42928
|
player: !!this.player,
|
|
42929
42929
|
});
|
|
42930
42930
|
assert.ok(!this.player, 'Player already initialized');
|
|
@@ -42934,7 +42934,7 @@ class Player {
|
|
|
42934
42934
|
}
|
|
42935
42935
|
const coreOpts = this.buildCoreOptions(playerElement);
|
|
42936
42936
|
const { core, container } = Player.getRegisteredPlugins();
|
|
42937
|
-
trace(`${T$
|
|
42937
|
+
trace(`${T$k} init`, {
|
|
42938
42938
|
registeredPlaybacks: Loader.registeredPlaybacks.map((p) => p.prototype.name),
|
|
42939
42939
|
});
|
|
42940
42940
|
coreOpts.plugins = {
|
|
@@ -42948,7 +42948,7 @@ class Player {
|
|
|
42948
42948
|
* Destroys the player, releasing all resources and unmounting its UI from the DOM.
|
|
42949
42949
|
*/
|
|
42950
42950
|
destroy() {
|
|
42951
|
-
trace(`${T$
|
|
42951
|
+
trace(`${T$k} destroy`, {
|
|
42952
42952
|
player: !!this.player,
|
|
42953
42953
|
});
|
|
42954
42954
|
if (this.player) {
|
|
@@ -43135,7 +43135,7 @@ class Player {
|
|
|
43135
43135
|
this.config = $.extend(true, this.config, config);
|
|
43136
43136
|
}
|
|
43137
43137
|
initPlayer(coreOptions) {
|
|
43138
|
-
trace(`${T$
|
|
43138
|
+
trace(`${T$k} initPlayer`, {
|
|
43139
43139
|
autoPlay: coreOptions.autoPlay,
|
|
43140
43140
|
sources: coreOptions.sources,
|
|
43141
43141
|
player: !!this.player,
|
|
@@ -43160,7 +43160,7 @@ class Player {
|
|
|
43160
43160
|
}
|
|
43161
43161
|
}
|
|
43162
43162
|
triggerAutoPlay() {
|
|
43163
|
-
trace(`${T$
|
|
43163
|
+
trace(`${T$k} triggerAutoPlay`);
|
|
43164
43164
|
setTimeout(() => {
|
|
43165
43165
|
this.player?.play({
|
|
43166
43166
|
autoPlay: true,
|
|
@@ -43178,7 +43178,7 @@ class Player {
|
|
|
43178
43178
|
// TODO test
|
|
43179
43179
|
events = {
|
|
43180
43180
|
onReady: () => {
|
|
43181
|
-
trace(`${T$
|
|
43181
|
+
trace(`${T$k} onReady`, {
|
|
43182
43182
|
ready: this.ready,
|
|
43183
43183
|
});
|
|
43184
43184
|
if (this.ready) {
|
|
@@ -43212,7 +43212,7 @@ class Player {
|
|
|
43212
43212
|
buildCoreOptions(rootNode) {
|
|
43213
43213
|
const sources = this.buildMediaSourcesList();
|
|
43214
43214
|
const source = sources[0];
|
|
43215
|
-
trace(`${T$
|
|
43215
|
+
trace(`${T$k} buildCoreOptions`, {
|
|
43216
43216
|
source,
|
|
43217
43217
|
sources,
|
|
43218
43218
|
});
|
|
@@ -43273,7 +43273,7 @@ class Player {
|
|
|
43273
43273
|
assert.ok(this.player, 'Player is not initialized');
|
|
43274
43274
|
const core = this.player.core;
|
|
43275
43275
|
core.on(Events$1.CORE_SCREEN_ORIENTATION_CHANGED, ({ orientation }) => {
|
|
43276
|
-
trace(`${T$
|
|
43276
|
+
trace(`${T$k} on CORE_SCREEN_ORIENTATION_CHANGED`, {
|
|
43277
43277
|
orientation,
|
|
43278
43278
|
rootNode: {
|
|
43279
43279
|
width: this.rootNode?.clientWidth,
|
|
@@ -43288,14 +43288,14 @@ class Player {
|
|
|
43288
43288
|
}
|
|
43289
43289
|
}, null);
|
|
43290
43290
|
core.on(Events$1.CORE_RESIZE, ({ width, height }) => {
|
|
43291
|
-
trace(`${T$
|
|
43291
|
+
trace(`${T$k} on CORE_RESIZE`, {
|
|
43292
43292
|
width,
|
|
43293
43293
|
height,
|
|
43294
43294
|
});
|
|
43295
43295
|
this.safeTriggerEvent(PlayerEvent.Resize, { width, height });
|
|
43296
43296
|
}, null);
|
|
43297
43297
|
core.on(Events$1.CORE_FULLSCREEN, (isFullscreen) => {
|
|
43298
|
-
trace(`${T$
|
|
43298
|
+
trace(`${T$k} CORE_FULLSCREEN`, {
|
|
43299
43299
|
isFullscreen,
|
|
43300
43300
|
});
|
|
43301
43301
|
this.safeTriggerEvent(PlayerEvent.Fullscreen, isFullscreen);
|
|
@@ -43303,7 +43303,7 @@ class Player {
|
|
|
43303
43303
|
}
|
|
43304
43304
|
}
|
|
43305
43305
|
|
|
43306
|
-
var version$1 = "2.22.
|
|
43306
|
+
var version$1 = "2.22.26";
|
|
43307
43307
|
|
|
43308
43308
|
var packages = {
|
|
43309
43309
|
"node_modules/@clappr/core": {
|
|
@@ -43627,7 +43627,7 @@ const INITIAL_SETTINGS = {
|
|
|
43627
43627
|
default: [],
|
|
43628
43628
|
seekEnabled: false,
|
|
43629
43629
|
};
|
|
43630
|
-
const T$
|
|
43630
|
+
const T$j = 'plugins.media_control';
|
|
43631
43631
|
const LEFT_ORDER = [
|
|
43632
43632
|
'playpause',
|
|
43633
43633
|
'playstop',
|
|
@@ -43878,7 +43878,7 @@ class MediaControl extends UICorePlugin {
|
|
|
43878
43878
|
* Hides the media control UI
|
|
43879
43879
|
*/
|
|
43880
43880
|
disable() {
|
|
43881
|
-
trace(`${T$
|
|
43881
|
+
trace(`${T$j} disable`);
|
|
43882
43882
|
this.userDisabled = true; // TODO distinguish between user and system (e.g., unplayable) disabled?
|
|
43883
43883
|
this.hide();
|
|
43884
43884
|
this.unbindKeyEvents();
|
|
@@ -43888,7 +43888,7 @@ class MediaControl extends UICorePlugin {
|
|
|
43888
43888
|
* Reenables the plugin disabled earlier with the {@link MediaControl.disable} method
|
|
43889
43889
|
*/
|
|
43890
43890
|
enable() {
|
|
43891
|
-
trace(`${T$
|
|
43891
|
+
trace(`${T$j} enable`);
|
|
43892
43892
|
if (this.options.chromeless) {
|
|
43893
43893
|
return;
|
|
43894
43894
|
}
|
|
@@ -44334,13 +44334,13 @@ class MediaControl extends UICorePlugin {
|
|
|
44334
44334
|
}
|
|
44335
44335
|
}
|
|
44336
44336
|
updateSettings() {
|
|
44337
|
-
trace(`${T$
|
|
44337
|
+
trace(`${T$j} updateSettings`, { settings: this.settings });
|
|
44338
44338
|
const newSettings = $.extend(true, {
|
|
44339
44339
|
left: [],
|
|
44340
44340
|
default: [],
|
|
44341
44341
|
right: [],
|
|
44342
44342
|
}, this.core.activeContainer.settings);
|
|
44343
|
-
trace(`${T$
|
|
44343
|
+
trace(`${T$j} updateSettings`, { newSettings });
|
|
44344
44344
|
newSettings.left.push('clips'); // TODO settings
|
|
44345
44345
|
// TODO make order controlled via CSS
|
|
44346
44346
|
newSettings.left = orderByOrderPattern([...newSettings.left, 'volume', 'clips'], LEFT_ORDER);
|
|
@@ -44352,7 +44352,7 @@ class MediaControl extends UICorePlugin {
|
|
|
44352
44352
|
newSettings.right = DEFAULT_SETTINGS.right; // TODO get from the options
|
|
44353
44353
|
if ((!this.fullScreenOnVideoTagSupported && !fullscreenEnabled()) ||
|
|
44354
44354
|
this.options.fullscreenDisable) {
|
|
44355
|
-
trace(`${T$
|
|
44355
|
+
trace(`${T$j} updateSettings removing fullscreen`, {
|
|
44356
44356
|
supported: this.fullScreenOnVideoTagSupported,
|
|
44357
44357
|
enabled: Fullscreen.fullscreenEnabled(),
|
|
44358
44358
|
optionsDisable: this.options.fullscreenDisable,
|
|
@@ -44419,7 +44419,7 @@ class MediaControl extends UICorePlugin {
|
|
|
44419
44419
|
*/
|
|
44420
44420
|
mount(name, element) {
|
|
44421
44421
|
const panel = this.getElementLocation(name);
|
|
44422
|
-
trace(`${T$
|
|
44422
|
+
trace(`${T$j} mount`, { name, panel: !!panel });
|
|
44423
44423
|
if (panel) {
|
|
44424
44424
|
const current = panel.find(`[data-${name}]`);
|
|
44425
44425
|
element.attr(`data-${name}`, '');
|
|
@@ -44615,7 +44615,7 @@ class MediaControl extends UICorePlugin {
|
|
|
44615
44615
|
* @internal
|
|
44616
44616
|
*/
|
|
44617
44617
|
render() {
|
|
44618
|
-
trace(`${T$
|
|
44618
|
+
trace(`${T$j} render`, {
|
|
44619
44619
|
needsUpdate: this.hasUpdate,
|
|
44620
44620
|
metadataLoaded: this.metadataLoaded,
|
|
44621
44621
|
});
|
|
@@ -44745,7 +44745,7 @@ class MediaControl extends UICorePlugin {
|
|
|
44745
44745
|
return isFinite(this.core.activePlayback.getDuration());
|
|
44746
44746
|
}
|
|
44747
44747
|
getElementLocation(name) {
|
|
44748
|
-
trace(`${T$
|
|
44748
|
+
trace(`${T$j} getElementLocation`, {
|
|
44749
44749
|
name,
|
|
44750
44750
|
right: this.settings.right,
|
|
44751
44751
|
left: this.settings.left,
|
|
@@ -44784,7 +44784,7 @@ function serializeSettings(s) {
|
|
|
44784
44784
|
}
|
|
44785
44785
|
|
|
44786
44786
|
const VERSION$7 = '2.22.4';
|
|
44787
|
-
const T$
|
|
44787
|
+
const T$i = 'plugins.audiotracks';
|
|
44788
44788
|
/**
|
|
44789
44789
|
* `PLUGIN` that makes possible to switch audio tracks via the media control UI.
|
|
44790
44790
|
* @beta
|
|
@@ -44906,7 +44906,7 @@ class AudioTracks extends UICorePlugin {
|
|
|
44906
44906
|
this.updateText();
|
|
44907
44907
|
}
|
|
44908
44908
|
hideMenu() {
|
|
44909
|
-
trace(`${T$
|
|
44909
|
+
trace(`${T$i} hideMenu`);
|
|
44910
44910
|
this.$el.find('#audiotracks-select').addClass('hidden');
|
|
44911
44911
|
this.$el.find('#audiotracks-button').attr('aria-expanded', 'false');
|
|
44912
44912
|
}
|
|
@@ -44959,7 +44959,7 @@ class AudioTracks extends UICorePlugin {
|
|
|
44959
44959
|
|
|
44960
44960
|
const pluginHtml$6 = "<div class=\"big-mute-icon-wrapper\" data-big-mute>\n <div class=\"big-mute-icon gcore-skin-border-color\" data-big-mute-icon></div>\n</div>\n";
|
|
44961
44961
|
|
|
44962
|
-
const T$
|
|
44962
|
+
const T$h = 'plugins.big_mute_button';
|
|
44963
44963
|
// TODO rewrite as a container plugin
|
|
44964
44964
|
/**
|
|
44965
44965
|
* `PLUGIN` that displays a big mute button over the video when it's muted.
|
|
@@ -45000,7 +45000,7 @@ class BigMuteButton extends UICorePlugin {
|
|
|
45000
45000
|
this.listenTo(this.core, Events$1.CORE_READY, this.onCoreReady);
|
|
45001
45001
|
this.listenTo(this.core, 'core:advertisement:start', this.onStartAd);
|
|
45002
45002
|
this.listenTo(this.core, 'core:advertisement:finish', this.onFinishAd);
|
|
45003
|
-
trace(`${T$
|
|
45003
|
+
trace(`${T$h} bindEvents`, {
|
|
45004
45004
|
mediacontrol: !!this.core.mediaControl,
|
|
45005
45005
|
});
|
|
45006
45006
|
this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_RENDERED, this.mediaControlRendered);
|
|
@@ -45025,12 +45025,12 @@ class BigMuteButton extends UICorePlugin {
|
|
|
45025
45025
|
}
|
|
45026
45026
|
mediaControlRendered() {
|
|
45027
45027
|
const container = this.core.activeContainer;
|
|
45028
|
-
trace(`${T$
|
|
45028
|
+
trace(`${T$h} mediaControlRendered`, {
|
|
45029
45029
|
container: !!container,
|
|
45030
45030
|
});
|
|
45031
45031
|
if (container) {
|
|
45032
45032
|
this.listenTo(container.playback, Events$1.PLAYBACK_PLAY, () => {
|
|
45033
|
-
trace(`${T$
|
|
45033
|
+
trace(`${T$h} PLAYBACK_PLAY`);
|
|
45034
45034
|
this.render();
|
|
45035
45035
|
});
|
|
45036
45036
|
}
|
|
@@ -45054,7 +45054,7 @@ class BigMuteButton extends UICorePlugin {
|
|
|
45054
45054
|
}
|
|
45055
45055
|
const { autoPlay, wasMuted } = this.options;
|
|
45056
45056
|
const volume = container.volume;
|
|
45057
|
-
trace(`${T$
|
|
45057
|
+
trace(`${T$h} shouldRender`, {
|
|
45058
45058
|
autoPlay,
|
|
45059
45059
|
wasMuted,
|
|
45060
45060
|
volume,
|
|
@@ -45066,7 +45066,7 @@ class BigMuteButton extends UICorePlugin {
|
|
|
45066
45066
|
*/
|
|
45067
45067
|
render() {
|
|
45068
45068
|
if (this.shouldRender()) {
|
|
45069
|
-
trace(`${T$
|
|
45069
|
+
trace(`${T$h} render`, {
|
|
45070
45070
|
el: !!this.$el,
|
|
45071
45071
|
});
|
|
45072
45072
|
this.$el.html(BigMuteButton.template());
|
|
@@ -45112,7 +45112,7 @@ const gearIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"n
|
|
|
45112
45112
|
const gearHdIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_28_1567)\">\n <path\n d=\"M19.14 12.94C19.18 12.64 19.2 12.33 19.2 12C19.2 11.68 19.18 11.36 19.13 11.06L21.16 9.47999C21.34 9.33999 21.39 9.06999 21.28 8.86999L19.36 5.54999C19.24 5.32999 18.99 5.25999 18.77 5.32999L16.38 6.28999C15.88 5.90999 15.35 5.58999 14.76 5.34999L14.4 2.80999C14.36 2.56999 14.16 2.39999 13.92 2.39999H10.08C9.83999 2.39999 9.64999 2.56999 9.60999 2.80999L9.24999 5.34999C8.65999 5.58999 8.11999 5.91999 7.62999 6.28999L5.23999 5.32999C5.01999 5.24999 4.76999 5.32999 4.64999 5.54999L2.73999 8.86999C2.61999 9.07999 2.65999 9.33999 2.85999 9.47999L4.88999 11.06C4.83999 11.36 4.79999 11.69 4.79999 12C4.79999 12.31 4.81999 12.64 4.86999 12.94L2.83999 14.52C2.65999 14.66 2.60999 14.93 2.71999 15.13L4.63999 18.45C4.75999 18.67 5.00999 18.74 5.22999 18.67L7.61999 17.71C8.11999 18.09 8.64999 18.41 9.23999 18.65L9.59999 21.19C9.64999 21.43 9.83999 21.6 10.08 21.6H13.92C14.16 21.6 14.36 21.43 14.39 21.19L14.75 18.65C15.34 18.41 15.88 18.09 16.37 17.71L18.76 18.67C18.98 18.75 19.23 18.67 19.35 18.45L21.27 15.13C21.39 14.91 21.34 14.66 21.15 14.52L19.14 12.94ZM12 15.6C10.02 15.6 8.39999 13.98 8.39999 12C8.39999 10.02 10.02 8.39999 12 8.39999C13.98 8.39999 15.6 10.02 15.6 12C15.6 13.98 13.98 15.6 12 15.6Z\"\n fill=\"#C9C9C9\"/>\n <rect x=\"13\" width=\"11\" height=\"7\" rx=\"1\" fill=\"#F6413B\"/>\n <path\n d=\"M14.6962 6V1.63636H15.3546V3.53267H17.53V1.63636H18.1905V6H17.53V4.0973H15.3546V6H14.6962ZM20.562 6H19.1493V1.63636H20.6067C21.0343 1.63636 21.4015 1.72372 21.7083 1.89844C22.0151 2.07173 22.2502 2.32102 22.4135 2.64631C22.5783 2.97017 22.6607 3.35866 22.6607 3.81179C22.6607 4.26634 22.5776 4.65696 22.4114 4.98366C22.2466 5.31037 22.008 5.56179 21.6955 5.73793C21.383 5.91264 21.0051 6 20.562 6ZM19.8077 5.42472H20.5257C20.8581 5.42472 21.1344 5.36222 21.3546 5.23722C21.5748 5.1108 21.7395 4.92827 21.8489 4.68963C21.9583 4.44957 22.013 4.15696 22.013 3.81179C22.013 3.46946 21.9583 3.17898 21.8489 2.94034C21.7409 2.7017 21.5797 2.5206 21.3652 2.39702C21.1507 2.27344 20.8844 2.21165 20.5662 2.21165H19.8077V5.42472Z\"\n fill=\"#C9C9C9\"/>\n </g>\n <defs>\n <clipPath id=\"clip0_28_1567\">\n <rect width=\"24\" height=\"24\" fill=\"white\"/>\n </clipPath>\n </defs>\n</svg>\n";
|
|
45113
45113
|
|
|
45114
45114
|
const VERSION$6 = '2.19.12';
|
|
45115
|
-
const T$
|
|
45115
|
+
const T$g = 'plugins.bottom_gear';
|
|
45116
45116
|
/**
|
|
45117
45117
|
* Events triggered by the plugin
|
|
45118
45118
|
* @beta
|
|
@@ -45262,20 +45262,20 @@ class BottomGear extends UICorePlugin {
|
|
|
45262
45262
|
addItem(name, $subMenu) {
|
|
45263
45263
|
const $existingItem = this.$el.find(`#gear-options li[data-${name}`);
|
|
45264
45264
|
if ($existingItem.length) {
|
|
45265
|
-
trace(`${T$
|
|
45265
|
+
trace(`${T$g} addItem already exists`, { name });
|
|
45266
45266
|
return $existingItem;
|
|
45267
45267
|
}
|
|
45268
45268
|
const $item = $('<li></li>')
|
|
45269
45269
|
.attr(`data-${name}`, '')
|
|
45270
45270
|
.appendTo(this.$el.find('#gear-options'));
|
|
45271
45271
|
if ($subMenu) {
|
|
45272
|
-
trace(`${T$
|
|
45272
|
+
trace(`${T$g} addItem adding submenu`, { name });
|
|
45273
45273
|
$subMenu
|
|
45274
45274
|
.addClass('gear-sub-menu-wrapper')
|
|
45275
45275
|
.hide()
|
|
45276
45276
|
.appendTo(this.$el.find('#gear-options-wrapper'));
|
|
45277
45277
|
$item.on('click', (e) => {
|
|
45278
|
-
trace(`${T$
|
|
45278
|
+
trace(`${T$g} addItem submenu clicked`, { name });
|
|
45279
45279
|
e.stopPropagation();
|
|
45280
45280
|
$subMenu.show();
|
|
45281
45281
|
this.$el.find('#gear-options').hide();
|
|
@@ -45284,15 +45284,15 @@ class BottomGear extends UICorePlugin {
|
|
|
45284
45284
|
return $item;
|
|
45285
45285
|
}
|
|
45286
45286
|
onActiveContainerChanged() {
|
|
45287
|
-
trace(`${T$
|
|
45287
|
+
trace(`${T$g} onActiveContainerChanged`);
|
|
45288
45288
|
this.bindContainerEvents();
|
|
45289
45289
|
}
|
|
45290
45290
|
bindContainerEvents() {
|
|
45291
|
-
trace(`${T$
|
|
45291
|
+
trace(`${T$g} bindContainerEvents`);
|
|
45292
45292
|
this.listenTo(this.core.activeContainer, Events$1.CONTAINER_HIGHDEFINITIONUPDATE, this.highDefinitionUpdate);
|
|
45293
45293
|
}
|
|
45294
45294
|
highDefinitionUpdate(isHd) {
|
|
45295
|
-
trace(`${T$
|
|
45295
|
+
trace(`${T$g} highDefinitionUpdate`, { isHd });
|
|
45296
45296
|
this.hd = isHd;
|
|
45297
45297
|
this.$el.find('.gear-icon').html(isHd ? gearHdIcon : gearIcon);
|
|
45298
45298
|
}
|
|
@@ -45300,7 +45300,7 @@ class BottomGear extends UICorePlugin {
|
|
|
45300
45300
|
* @internal
|
|
45301
45301
|
*/
|
|
45302
45302
|
render() {
|
|
45303
|
-
trace(`${T$
|
|
45303
|
+
trace(`${T$g} render`);
|
|
45304
45304
|
const mediaControl = this.core.getPlugin('media_control');
|
|
45305
45305
|
if (!mediaControl) {
|
|
45306
45306
|
return this; // TODO test
|
|
@@ -45332,11 +45332,11 @@ class BottomGear extends UICorePlugin {
|
|
|
45332
45332
|
this.$el.find('#gear-options-wrapper').toggle();
|
|
45333
45333
|
}
|
|
45334
45334
|
hide() {
|
|
45335
|
-
trace(`${T$
|
|
45335
|
+
trace(`${T$g} hide`);
|
|
45336
45336
|
this.$el.find('#gear-options-wrapper').hide();
|
|
45337
45337
|
}
|
|
45338
45338
|
onCoreReady() {
|
|
45339
|
-
trace(`${T$
|
|
45339
|
+
trace(`${T$g} onCoreReady`);
|
|
45340
45340
|
const mediaControl = this.core.getPlugin('media_control');
|
|
45341
45341
|
assert(mediaControl, 'media_control plugin is required');
|
|
45342
45342
|
this.listenTo(mediaControl, Events$1.MEDIACONTROL_RENDERED, this.onMediaControlRendered);
|
|
@@ -45348,7 +45348,7 @@ class BottomGear extends UICorePlugin {
|
|
|
45348
45348
|
});
|
|
45349
45349
|
}
|
|
45350
45350
|
onMediaControlRendered() {
|
|
45351
|
-
trace(`${T$
|
|
45351
|
+
trace(`${T$g} onMediaControlRendered`);
|
|
45352
45352
|
const mediaControl = this.core.getPlugin('media_control');
|
|
45353
45353
|
mediaControl.mount('gear', this.$el);
|
|
45354
45354
|
}
|
|
@@ -47561,6 +47561,7 @@ class Speedtest {
|
|
|
47561
47561
|
}
|
|
47562
47562
|
}
|
|
47563
47563
|
this._state = 3;
|
|
47564
|
+
// TODO don't run until properly initialized (url_ping, etc)
|
|
47564
47565
|
this.worker.postMessage('start ' + JSON.stringify(this._settings));
|
|
47565
47566
|
// ... [rest of the logic remains unchanged] ...
|
|
47566
47567
|
}
|
|
@@ -47585,7 +47586,7 @@ class Speedtest {
|
|
|
47585
47586
|
const DIGITS_THRESHOLD = 99999;
|
|
47586
47587
|
const DEFAULT_DOWNLOAD_SPEED = '0.00';
|
|
47587
47588
|
const DRAW_SIZE = 5;
|
|
47588
|
-
|
|
47589
|
+
const T$f = 'plugins.clappr_nerd_stats.speedtest';
|
|
47589
47590
|
function limitDigits(value) {
|
|
47590
47591
|
return value > DIGITS_THRESHOLD ? '> ' + DIGITS_THRESHOLD : value.toFixed(2);
|
|
47591
47592
|
}
|
|
@@ -47613,6 +47614,7 @@ const getColor = (speedValue) => {
|
|
|
47613
47614
|
}
|
|
47614
47615
|
};
|
|
47615
47616
|
function drawSpeedTestResults() {
|
|
47617
|
+
trace(`${T$f} drawSpeedTestResults`);
|
|
47616
47618
|
const canvas = document.getElementById('nerd-stats-speed-test-canvas');
|
|
47617
47619
|
if (!canvas) {
|
|
47618
47620
|
return;
|
|
@@ -47635,6 +47637,7 @@ const initSpeedTest = (customMetrics) => {
|
|
|
47635
47637
|
return inited;
|
|
47636
47638
|
}
|
|
47637
47639
|
inited = (async () => {
|
|
47640
|
+
trace(`${T$f} initSpeedTest run`);
|
|
47638
47641
|
// TODO: fix server selection
|
|
47639
47642
|
// const response = await fetch('https://iam.gcdn.co/info/json');
|
|
47640
47643
|
// const data = await response.json();
|
|
@@ -47689,6 +47692,7 @@ const initSpeedTest = (customMetrics) => {
|
|
|
47689
47692
|
await fetch('https://iam.gcdn.co/info/json')
|
|
47690
47693
|
.then(r => r.json())
|
|
47691
47694
|
.then(data => {
|
|
47695
|
+
trace(`${T$f} initSpeedTest fetched`);
|
|
47692
47696
|
const country = data['Server Country code'].toLowerCase();
|
|
47693
47697
|
const server = serversList.find(s => s.country === country) || serversList[0];
|
|
47694
47698
|
if (!server) {
|
|
@@ -47696,6 +47700,7 @@ const initSpeedTest = (customMetrics) => {
|
|
|
47696
47700
|
}
|
|
47697
47701
|
speedTest.addTestPoint(server);
|
|
47698
47702
|
speedTest.setSelectedServer(server);
|
|
47703
|
+
trace(`${T$f} initSpeedTest done`);
|
|
47699
47704
|
});
|
|
47700
47705
|
})();
|
|
47701
47706
|
return inited;
|
|
@@ -47711,6 +47716,7 @@ const startSpeedtest = () => {
|
|
|
47711
47716
|
}
|
|
47712
47717
|
};
|
|
47713
47718
|
const clearSpeedTestResults = () => {
|
|
47719
|
+
trace(`${T$f} clearSpeedTestResults`);
|
|
47714
47720
|
speedtestResults.splice(0, speedtestResults.length);
|
|
47715
47721
|
};
|
|
47716
47722
|
function configureSpeedTest(servers) {
|
|
@@ -50564,7 +50570,7 @@ function formatLevelLabel(level) {
|
|
|
50564
50570
|
return `${h}p`;
|
|
50565
50571
|
}
|
|
50566
50572
|
|
|
50567
|
-
const seekTimeHTML = "<span data-seek-time></span>\n<span data-duration></span>\n";
|
|
50573
|
+
const seekTimeHTML = "<span data-seek-time id=\"mc-seek-time\"></span>\n<span data-duration id=\"mc-duration\"></span>\n\n";
|
|
50568
50574
|
|
|
50569
50575
|
// Copyright 2014 Globo.com Player authors. All rights reserved.
|
|
50570
50576
|
// Use of this source code is governed by a BSD-style
|
|
@@ -50581,25 +50587,17 @@ class SeekTime extends UICorePlugin {
|
|
|
50581
50587
|
get supportedVersion() {
|
|
50582
50588
|
return { min: CLAPPR_VERSION$1 };
|
|
50583
50589
|
}
|
|
50584
|
-
|
|
50585
|
-
return tmpl(seekTimeHTML);
|
|
50586
|
-
}
|
|
50590
|
+
static template = tmpl(seekTimeHTML);
|
|
50587
50591
|
get attributes() {
|
|
50588
50592
|
return {
|
|
50589
|
-
|
|
50590
|
-
'data-seek-time': ''
|
|
50593
|
+
class: 'seek-time',
|
|
50594
|
+
'data-seek-time': '',
|
|
50591
50595
|
};
|
|
50592
50596
|
}
|
|
50593
|
-
get mediaControl() {
|
|
50594
|
-
return this.core.mediaControl;
|
|
50595
|
-
}
|
|
50596
|
-
get mediaControlContainer() {
|
|
50597
|
-
return this.mediaControl.container;
|
|
50598
|
-
}
|
|
50599
50597
|
get isLiveStreamWithDvr() {
|
|
50600
|
-
return this.
|
|
50601
|
-
this.
|
|
50602
|
-
this.
|
|
50598
|
+
return (this.core.activeContainer &&
|
|
50599
|
+
this.core.activeContainer.getPlaybackType() === Playback.LIVE &&
|
|
50600
|
+
this.core.activeContainer.isDvrEnabled());
|
|
50603
50601
|
}
|
|
50604
50602
|
get durationShown() {
|
|
50605
50603
|
return !this.isLiveStreamWithDvr;
|
|
@@ -50613,20 +50611,27 @@ class SeekTime extends UICorePlugin {
|
|
|
50613
50611
|
rendered = false;
|
|
50614
50612
|
$durationEl = null;
|
|
50615
50613
|
$seekTimeEl = null;
|
|
50614
|
+
/**
|
|
50615
|
+
* @internal
|
|
50616
|
+
*/
|
|
50616
50617
|
bindEvents() {
|
|
50617
|
-
this.listenTo(this.
|
|
50618
|
-
|
|
50619
|
-
|
|
50620
|
-
|
|
50621
|
-
|
|
50622
|
-
|
|
50623
|
-
|
|
50618
|
+
this.listenTo(this.core, Events$1.CORE_READY, this.onCoreReady);
|
|
50619
|
+
}
|
|
50620
|
+
onCoreReady() {
|
|
50621
|
+
const mediaControl = this.core.getPlugin('media_control');
|
|
50622
|
+
assert(mediaControl, 'MediaControl plugin is required for SeekTime plugin to work');
|
|
50623
|
+
this.listenTo(mediaControl, Events$1.MEDIACONTROL_RENDERED, this.mount);
|
|
50624
|
+
this.listenTo(mediaControl, Events$1.MEDIACONTROL_MOUSEMOVE_SEEKBAR, this.showTime);
|
|
50625
|
+
this.listenTo(mediaControl, Events$1.MEDIACONTROL_MOUSELEAVE_SEEKBAR, this.hideTime);
|
|
50626
|
+
this.listenTo(mediaControl, Events$1.MEDIACONTROL_CONTAINERCHANGED, this.onContainerChanged);
|
|
50627
|
+
if (this.core.activeContainer) {
|
|
50628
|
+
this.listenTo(this.core.activeContainer, Events$1.CONTAINER_PLAYBACKDVRSTATECHANGED, this.update);
|
|
50629
|
+
this.listenTo(this.core.activeContainer, Events$1.CONTAINER_TIMEUPDATE, this.onTimeUpdate);
|
|
50624
50630
|
}
|
|
50625
50631
|
}
|
|
50626
50632
|
onContainerChanged() {
|
|
50627
|
-
|
|
50628
|
-
this.
|
|
50629
|
-
this.bindEvents();
|
|
50633
|
+
this.listenTo(this.core.activeContainer, Events$1.CONTAINER_PLAYBACKDVRSTATECHANGED, this.update);
|
|
50634
|
+
this.listenTo(this.core.activeContainer, Events$1.CONTAINER_TIMEUPDATE, this.onTimeUpdate);
|
|
50630
50635
|
}
|
|
50631
50636
|
onTimeUpdate({ total }) {
|
|
50632
50637
|
this.duration = total;
|
|
@@ -50642,18 +50647,15 @@ class SeekTime extends UICorePlugin {
|
|
|
50642
50647
|
this.update();
|
|
50643
50648
|
}
|
|
50644
50649
|
calculateHoverPosition(event) {
|
|
50645
|
-
const
|
|
50650
|
+
const mediaControl = this.core.getPlugin('media_control');
|
|
50651
|
+
const offset = event.pageX - mediaControl.$seekBarContainer.offset().left;
|
|
50646
50652
|
// proportion into the seek bar that the mouse is hovered over 0-1
|
|
50647
|
-
this.hoverPosition = Math.min(1, Math.max(offset /
|
|
50653
|
+
this.hoverPosition = Math.min(1, Math.max(offset / mediaControl.$seekBarContainer.width(), 0));
|
|
50648
50654
|
}
|
|
50649
50655
|
getSeekTime() {
|
|
50650
|
-
|
|
50651
|
-
|
|
50652
|
-
|
|
50653
|
-
}
|
|
50654
|
-
else {
|
|
50655
|
-
seekTime = this.hoverPosition * this.duration;
|
|
50656
|
-
}
|
|
50656
|
+
const seekTime = this.isLiveStreamWithDvr
|
|
50657
|
+
? this.duration - this.hoverPosition * this.duration
|
|
50658
|
+
: this.hoverPosition * this.duration;
|
|
50657
50659
|
return { seekTime };
|
|
50658
50660
|
}
|
|
50659
50661
|
update() {
|
|
@@ -50664,59 +50666,65 @@ class SeekTime extends UICorePlugin {
|
|
|
50664
50666
|
if (!this.shouldBeVisible()) {
|
|
50665
50667
|
this.$el.hide();
|
|
50666
50668
|
this.$el.css('left', '-100%');
|
|
50669
|
+
return;
|
|
50667
50670
|
}
|
|
50668
|
-
|
|
50669
|
-
|
|
50670
|
-
|
|
50671
|
-
|
|
50672
|
-
|
|
50673
|
-
|
|
50674
|
-
|
|
50675
|
-
|
|
50676
|
-
|
|
50677
|
-
|
|
50678
|
-
|
|
50679
|
-
|
|
50680
|
-
|
|
50681
|
-
|
|
50682
|
-
|
|
50683
|
-
|
|
50684
|
-
this.displayedDuration = currentDuration;
|
|
50685
|
-
}
|
|
50686
|
-
}
|
|
50687
|
-
else {
|
|
50688
|
-
this.$durationEl.hide();
|
|
50671
|
+
const seekTime = this.getSeekTime();
|
|
50672
|
+
let currentSeekTime = formatTime(seekTime.seekTime, false);
|
|
50673
|
+
if (this.isLiveStreamWithDvr) {
|
|
50674
|
+
currentSeekTime = `-${currentSeekTime}`;
|
|
50675
|
+
}
|
|
50676
|
+
// only update dom if necessary, ie time actually changed
|
|
50677
|
+
if (currentSeekTime !== this.displayedSeekTime) {
|
|
50678
|
+
this.$seekTimeEl.text(currentSeekTime);
|
|
50679
|
+
this.displayedSeekTime = currentSeekTime;
|
|
50680
|
+
}
|
|
50681
|
+
if (this.durationShown) {
|
|
50682
|
+
this.$durationEl.show();
|
|
50683
|
+
const currentDuration = formatTime(this.duration, false);
|
|
50684
|
+
if (currentDuration !== this.displayedDuration) {
|
|
50685
|
+
this.$durationEl.text(currentDuration);
|
|
50686
|
+
this.displayedDuration = currentDuration;
|
|
50689
50687
|
}
|
|
50690
|
-
// the element must be unhidden before its width is requested, otherwise it's width will be reported as 0
|
|
50691
|
-
this.$el.show();
|
|
50692
|
-
const containerWidth = this.mediaControl.$seekBarContainer.width();
|
|
50693
|
-
const elWidth = this.$el.width();
|
|
50694
|
-
let elLeftPos = this.hoverPosition * containerWidth;
|
|
50695
|
-
elLeftPos -= elWidth / 2;
|
|
50696
|
-
elLeftPos = Math.max(0, Math.min(elLeftPos, containerWidth - elWidth));
|
|
50697
|
-
this.$el.css('left', elLeftPos);
|
|
50698
50688
|
}
|
|
50689
|
+
else {
|
|
50690
|
+
this.$durationEl.hide();
|
|
50691
|
+
}
|
|
50692
|
+
// the element must be unhidden before its width is requested, otherwise it's width will be reported as 0
|
|
50693
|
+
this.$el.show();
|
|
50694
|
+
const mediaControl = this.core.getPlugin('media_control');
|
|
50695
|
+
const containerWidth = mediaControl.$seekBarContainer.width();
|
|
50696
|
+
const elWidth = this.$el.width();
|
|
50697
|
+
let elLeftPos = this.hoverPosition * containerWidth;
|
|
50698
|
+
elLeftPos -= elWidth / 2;
|
|
50699
|
+
elLeftPos = Math.max(0, Math.min(elLeftPos, containerWidth - elWidth));
|
|
50700
|
+
this.$el.css('left', elLeftPos);
|
|
50699
50701
|
}
|
|
50700
50702
|
shouldBeVisible() {
|
|
50701
|
-
return this.
|
|
50702
|
-
this.
|
|
50703
|
+
return (this.core.activeContainer &&
|
|
50704
|
+
this.core.activeContainer.settings.seekEnabled &&
|
|
50703
50705
|
this.hoveringOverSeekBar &&
|
|
50704
50706
|
this.hoverPosition !== null &&
|
|
50705
|
-
this.duration !== null;
|
|
50707
|
+
this.duration !== null);
|
|
50706
50708
|
}
|
|
50709
|
+
/**
|
|
50710
|
+
* @internal
|
|
50711
|
+
*/
|
|
50707
50712
|
render() {
|
|
50708
50713
|
this.rendered = true;
|
|
50709
50714
|
this.displayedDuration = null;
|
|
50710
50715
|
this.displayedSeekTime = null;
|
|
50711
|
-
this.$el.html(
|
|
50716
|
+
this.$el.html(SeekTime.template());
|
|
50712
50717
|
this.$el.hide();
|
|
50713
|
-
this.mediaControl.$el.append(this.el);
|
|
50714
|
-
this.$seekTimeEl = this.$el.find('
|
|
50715
|
-
this.$durationEl = this.$el.find('
|
|
50718
|
+
// this.mediaControl.$el.append(this.el);
|
|
50719
|
+
this.$seekTimeEl = this.$el.find('#mc-seek-time');
|
|
50720
|
+
this.$durationEl = this.$el.find('#mc-duration');
|
|
50716
50721
|
this.$durationEl.hide();
|
|
50717
50722
|
this.update();
|
|
50718
50723
|
return this;
|
|
50719
50724
|
}
|
|
50725
|
+
mount() {
|
|
50726
|
+
this.core.getPlugin('media_control').$el.append(this.$el); // TODO use a method
|
|
50727
|
+
}
|
|
50720
50728
|
}
|
|
50721
50729
|
|
|
50722
50730
|
const pluginHtml$2 = "<% if (url || embed) { %>\n <div class=\"share-button-container gcore-skin-bg-color\">\n <button type=\"button\" class=\"media-control-button media-control-icon\" data-share-button\n aria-label=\"share\"></button>\n </div>\n\n <div class=\"share-container gcore-skin-bg-color\">\n <div class=\"share-container-header gcore-skin-bg-color\">\n <div class=\"share-container-header--title gcore-skin-text-color\"><%= share_title %></div>\n <div class=\"share-container-header--close gcore-skin-button-color\" data-share-close></div>\n </div>\n <div class=\"share-container-main gcore-skin-bg-color\">\n <% if (url) { %>\n <div class=\"share-container-header--linktext gcore-skin-text-color\"><%= link_title %></div>\n <input\n class=\"share-container-header--link gcore-skin-bg-color gcore-skin-text-color gcore-skin-border-textarea-color\"\n value=\"<%= url %>\" data-share-link\n >\n <% }; %>\n <% if (url) { %>\n <div class=\"share-container-header--socialtext gcore-skin-text-color\"><%= social_title %></div>\n <div class=\"share-container-header--socialicon\">\n <div class=\"share-container-header--socialicon_fb gcore-skin-button-with-bg-color\"\n data-share-fb></div>\n <div class=\"share-container-header--socialicon_tw gcore-skin-button-with-bg-color\"\n data-share-tw></div>\n </div>\n <% }; %>\n <% if (embed) { %>\n <div class=\"share-container-header--embedtext gcore-skin-text-color\"><%= embed_title %></div>\n <textarea\n class=\"share-container-header--embed gcore-skin-bg-color gcore-skin-text-color gcore-skin-border-textarea-color\"\n rows=\"4\" data-share-embed><%= embed %></textarea>\n <% }; %>\n </div>\n </div>\n<% }; %>\n";
|