@npo/player 1.14.0 → 1.15.0
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/README.md +1 -1
- package/lib/js/ads/ster.d.ts +3 -3
- package/lib/js/ads/ster.js +114 -98
- package/lib/js/ads/ster.js.map +1 -1
- package/lib/js/ads/ster.test.js +0 -27
- package/lib/js/ads/ster.test.js.map +1 -1
- package/lib/js/tracking/handlers/eventbinding.js +37 -30
- package/lib/js/tracking/handlers/eventbinding.js.map +1 -1
- package/lib/js/ui/components/audio/controlbar.d.ts +3 -0
- package/lib/js/ui/components/audio/controlbar.js +23 -0
- package/lib/js/ui/components/audio/controlbar.js.map +1 -0
- package/lib/js/ui/components/controlbar.js +3 -16
- package/lib/js/ui/components/controlbar.js.map +1 -1
- package/lib/js/ui/components/nativemobile/buttons.d.ts +2 -2
- package/lib/js/ui/components/nativemobile/buttons.js +36 -24
- package/lib/js/ui/components/nativemobile/buttons.js.map +1 -1
- package/lib/js/ui/components/nativemobile/controlbar.js +2 -2
- package/lib/js/ui/components/nativemobile/controlbar.js.map +1 -1
- package/lib/js/ui/components/nativemobile/topbar.js +2 -2
- package/lib/js/ui/components/nativemobile/topbar.js.map +1 -1
- package/lib/js/ui/components/seekbar.d.ts +6 -0
- package/lib/js/ui/components/seekbar.js +21 -0
- package/lib/js/ui/components/seekbar.js.map +1 -0
- package/lib/js/ui/components/settingspanel.js +23 -1
- package/lib/js/ui/components/settingspanel.js.map +1 -1
- package/lib/js/ui/nativemobileuicontainer.js +1 -0
- package/lib/js/ui/nativemobileuicontainer.js.map +1 -1
- package/lib/js/ui/nativemobileuifactory.js +1 -1
- package/lib/js/ui/nativemobileuifactory.js.map +1 -1
- package/lib/js/ui/uicontainer.d.ts +2 -1
- package/lib/js/ui/uicontainer.js +26 -8
- package/lib/js/ui/uicontainer.js.map +1 -1
- package/lib/js/utilities/utilities.js +10 -1
- package/lib/js/utilities/utilities.js.map +1 -1
- package/lib/npoplayer.d.ts +6 -5
- package/lib/npoplayer.js +13 -26
- package/lib/npoplayer.js.map +1 -1
- package/lib/package.json +2 -2
- package/lib/src/js/ads/ster.d.ts +3 -3
- package/lib/src/js/ui/components/audio/controlbar.d.ts +3 -0
- package/lib/src/js/ui/components/nativemobile/buttons.d.ts +2 -2
- package/lib/src/js/ui/components/seekbar.d.ts +6 -0
- package/lib/src/js/ui/uicontainer.d.ts +2 -1
- package/lib/src/npoplayer.d.ts +6 -5
- package/lib/src/types/interfaces.d.ts +6 -0
- package/lib/types/interfaces.d.ts +6 -0
- package/lib/types/interfaces.js +6 -0
- package/lib/types/interfaces.js.map +1 -1
- package/package.json +2 -2
- package/src/scss/components/_audio.scss +4 -0
- package/src/scss/components/_buffering.scss +37 -29
- package/src/scss/components/_hugeplaybacktogglebutton.scss +1 -1
- package/src/scss/components/_icons.scss +1 -1
- package/src/scss/components/_replay.scss +0 -5
- package/src/scss/components/_seekbar.scss +9 -5
- package/src/scss/components/_settingspanel.scss +6 -2
- package/src/scss/components/_subtitles.scss +45 -27
- package/src/scss/components/_volumeslider.scss +1 -0
- package/src/scss/components/audio/_bottombar.scss +43 -0
- package/src/scss/components/audio/_buffering.scss +8 -0
- package/src/scss/components/audio/_errors.scss +13 -0
- package/src/scss/components/audio/_metadata.scss +38 -0
- package/src/scss/components/audio/_playbutton.scss +66 -0
- package/src/scss/components/audio/_poster.scss +19 -0
- package/src/scss/components/audio/_replay.scss +28 -0
- package/src/scss/components/audio/_seekbar.scss +26 -0
- package/src/scss/components/audio/_topbar.scss +35 -0
- package/src/scss/components/audio/_vars.scss +5 -0
- package/src/scss/components/audio/_volumeslider.scss +35 -0
- package/src/scss/npoplayer.css +84 -28
- package/src/scss/npoplayer.scss +10 -6
- package/src/scss/variants/_player-audio.scss +55 -0
- package/src/scss/variants/_player-base.scss +4 -0
- package/src/scss/variants/_player-small.scss +4 -0
- package/src/scss/vars/_audio.scss +5 -0
- package/src/scss/vars/_colors.scss +4 -0
package/README.md
CHANGED
|
@@ -8,7 +8,7 @@ The video player library for NPO (Nederlandse Publieke Omroep) and other broadca
|
|
|
8
8
|
Extensive and up-to-date documentation is available at https://docs.npoplayer.nl
|
|
9
9
|
|
|
10
10
|
# Changelog
|
|
11
|
-
Current version: v1.
|
|
11
|
+
Current version: v1.15.0
|
|
12
12
|
The changelog is available at https://docs.npoplayer.nl/implementation/web/changelog/
|
|
13
13
|
|
|
14
14
|
## License
|
package/lib/js/ads/ster.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { PlayerAPI } from
|
|
2
|
-
import NpoPlayer from
|
|
3
|
-
import { StreamObject } from
|
|
1
|
+
import { PlayerAPI } from 'bitmovin-player';
|
|
2
|
+
import NpoPlayer from 'npoplayer';
|
|
3
|
+
import { StreamObject } from '../../types/interfaces';
|
|
4
4
|
export declare function handlePreRolls(playerapi: PlayerAPI, streamObject: StreamObject, npoplayer: NpoPlayer): Promise<void>;
|
package/lib/js/ads/ster.js
CHANGED
|
@@ -1,107 +1,123 @@
|
|
|
1
|
-
import { AdTagType, PlayerEvent } from
|
|
1
|
+
import { AdTagType, PlayerEvent } from 'bitmovin-player';
|
|
2
|
+
import { NpoPlayerUIVariants } from '../../types/interfaces';
|
|
2
3
|
export async function handlePreRolls(playerapi, streamObject, npoplayer) {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
let adIndex = 0;
|
|
7
|
-
let totalAds = 0;
|
|
8
|
-
let currentClickListener = null;
|
|
9
|
-
let adUiSet = false;
|
|
10
|
-
async function handleSourceLoaded() {
|
|
11
|
-
const advertConfig = {
|
|
12
|
-
tag: {
|
|
13
|
-
url: prerollUrl,
|
|
14
|
-
type: AdTagType.VAST
|
|
15
|
-
},
|
|
16
|
-
id: 'Ad',
|
|
17
|
-
position: 'pre',
|
|
18
|
-
};
|
|
19
|
-
await playerapi.ads.schedule(advertConfig);
|
|
20
|
-
}
|
|
21
|
-
playerapi.on(PlayerEvent.SourceLoaded, handleSourceLoaded);
|
|
22
|
-
async function handlePlay() {
|
|
23
|
-
attemptSetAdUi();
|
|
24
|
-
}
|
|
25
|
-
playerapi.on(PlayerEvent.Play, handlePlay);
|
|
26
|
-
function setAdUi() {
|
|
27
|
-
let activeAdBreak = playerapi.ads.getActiveAdBreak();
|
|
28
|
-
if (!activeAdBreak || !activeAdBreak.ads)
|
|
29
|
-
return false;
|
|
30
|
-
npoplayer.uiManager?.release();
|
|
31
|
-
npoplayer.createUIManager(playerapi, 'ad');
|
|
32
|
-
adUiSet = true;
|
|
33
|
-
let currentAd = activeAdBreak.ads[0];
|
|
34
|
-
adIndex = 1;
|
|
35
|
-
totalAds = activeAdBreak.ads.length;
|
|
36
|
-
currentClickListener = () => {
|
|
37
|
-
window.open(currentAd.clickThroughUrl, '_blank');
|
|
38
|
-
playerapi.pause();
|
|
39
|
-
};
|
|
40
|
-
npoplayer.uiComponents.adbutton?.show();
|
|
41
|
-
npoplayer.uiComponents.adbutton?.onClick.subscribe(currentClickListener);
|
|
42
|
-
npoplayer.uiComponents.adlabel?.setText(`Advertentie 1 van ${activeAdBreak.ads.length}`);
|
|
43
|
-
return true;
|
|
44
|
-
}
|
|
45
|
-
function attemptSetAdUi(attemptsLeft = 10) {
|
|
46
|
-
if (attemptsLeft <= 0)
|
|
4
|
+
return new Promise((resolve) => {
|
|
5
|
+
if (streamObject.metadata.hasPreroll == 'false' || streamObject.assets.preroll == null) {
|
|
6
|
+
resolve();
|
|
47
7
|
return;
|
|
48
|
-
const isUiSet = setAdUi();
|
|
49
|
-
if (!isUiSet) {
|
|
50
|
-
setTimeout(() => {
|
|
51
|
-
attemptSetAdUi(attemptsLeft - 1);
|
|
52
|
-
}, 200);
|
|
53
8
|
}
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
let
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
9
|
+
let prerollUrl = streamObject.assets.preroll;
|
|
10
|
+
let adIndex = 0;
|
|
11
|
+
let totalAds = 0;
|
|
12
|
+
let currentClickListener = null;
|
|
13
|
+
let adUiSet = false;
|
|
14
|
+
async function handleSourceLoaded() {
|
|
15
|
+
const advertConfig = {
|
|
16
|
+
tag: {
|
|
17
|
+
url: String(prerollUrl),
|
|
18
|
+
type: AdTagType.VAST
|
|
19
|
+
},
|
|
20
|
+
id: 'Ad',
|
|
21
|
+
position: 'pre',
|
|
22
|
+
};
|
|
23
|
+
await playerapi.ads.schedule(advertConfig);
|
|
60
24
|
}
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
}
|
|
65
|
-
playerapi.on(PlayerEvent.AdBreakStarted, handleAdBreakStarted);
|
|
66
|
-
function handleAdFinished() {
|
|
67
|
-
let activeAdBreak = playerapi.ads.getActiveAdBreak();
|
|
68
|
-
if (!activeAdBreak || !activeAdBreak.ads) {
|
|
69
|
-
console.error('No active ad break data found');
|
|
70
|
-
return;
|
|
25
|
+
playerapi.on(PlayerEvent.SourceLoaded, handleSourceLoaded);
|
|
26
|
+
async function handlePlay() {
|
|
27
|
+
attemptSetAdUi();
|
|
71
28
|
}
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
29
|
+
playerapi.on(PlayerEvent.Play, handlePlay);
|
|
30
|
+
function setAdUi() {
|
|
31
|
+
let activeAdBreak = playerapi.ads.getActiveAdBreak();
|
|
32
|
+
if (!activeAdBreak || !activeAdBreak.ads)
|
|
33
|
+
return false;
|
|
34
|
+
npoplayer.uiManager?.release();
|
|
35
|
+
npoplayer.createUIManager(playerapi, NpoPlayerUIVariants.AD);
|
|
36
|
+
adUiSet = true;
|
|
37
|
+
let adButton = npoplayer.uiComponents.adbutton;
|
|
38
|
+
let currentAd = activeAdBreak.ads[0];
|
|
39
|
+
adIndex = 1;
|
|
40
|
+
totalAds = activeAdBreak.ads.length;
|
|
41
|
+
adButton?.show();
|
|
42
|
+
adClickHandler(currentAd, adButton);
|
|
43
|
+
npoplayer.uiComponents.adlabel?.setText(`Advertentie 1 van ${activeAdBreak.ads.length}`);
|
|
44
|
+
return true;
|
|
45
|
+
}
|
|
46
|
+
function attemptSetAdUi(attemptsLeft = 10) {
|
|
47
|
+
if (attemptsLeft <= 0)
|
|
48
|
+
return;
|
|
49
|
+
const isUiSet = setAdUi();
|
|
50
|
+
if (!isUiSet) {
|
|
51
|
+
setTimeout(() => {
|
|
52
|
+
attemptSetAdUi(attemptsLeft - 1);
|
|
53
|
+
}, 200);
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
function handleAdStarted() {
|
|
57
|
+
let activeAdBreak = playerapi.ads.getActiveAdBreak();
|
|
58
|
+
if (!activeAdBreak || !activeAdBreak.ads) {
|
|
59
|
+
console.error('No active ad break data found');
|
|
60
|
+
return;
|
|
61
|
+
}
|
|
62
|
+
if (!adUiSet)
|
|
63
|
+
setAdUi();
|
|
64
|
+
npoplayer.adBreakActive = true;
|
|
65
|
+
}
|
|
66
|
+
playerapi.on(PlayerEvent.AdStarted, handleAdStarted);
|
|
67
|
+
function adClickHandler(ad, button) {
|
|
68
|
+
let clickThroughCallback;
|
|
69
|
+
if (currentClickListener)
|
|
70
|
+
button?.onClick.unsubscribe(currentClickListener);
|
|
71
|
+
clickThroughCallback = ad.clickThroughUrlOpened;
|
|
72
|
+
currentClickListener = () => {
|
|
73
|
+
try {
|
|
74
|
+
window.open(ad.clickThroughUrl, '_blank');
|
|
75
|
+
playerapi.pause();
|
|
76
|
+
if (clickThroughCallback)
|
|
77
|
+
clickThroughCallback();
|
|
78
|
+
}
|
|
79
|
+
catch (error) {
|
|
80
|
+
console.log(error);
|
|
81
|
+
}
|
|
82
|
+
};
|
|
83
|
+
button.onClick.subscribe(currentClickListener);
|
|
84
|
+
}
|
|
85
|
+
function handleAdFinished() {
|
|
86
|
+
let activeAdBreak = playerapi.ads.getActiveAdBreak();
|
|
87
|
+
if (!activeAdBreak || !activeAdBreak.ads) {
|
|
88
|
+
console.error('No active ad break data found');
|
|
89
|
+
return;
|
|
90
|
+
}
|
|
91
|
+
if (adIndex >= totalAds) {
|
|
92
|
+
handleAdBreakFinished();
|
|
93
|
+
return;
|
|
94
|
+
}
|
|
95
|
+
let adButton = npoplayer.uiComponents.adbutton;
|
|
96
|
+
let nextAd = activeAdBreak.ads[adIndex];
|
|
97
|
+
adIndex += 1;
|
|
98
|
+
adButton?.show();
|
|
99
|
+
adClickHandler(nextAd, adButton);
|
|
100
|
+
npoplayer.uiComponents.adlabel?.setText(`Advertentie ${adIndex} van ${activeAdBreak.ads.length}`);
|
|
101
|
+
}
|
|
102
|
+
playerapi.on(PlayerEvent.AdFinished, handleAdFinished);
|
|
103
|
+
function handleAdBreakFinished() {
|
|
104
|
+
npoplayer.adBreakActive = false;
|
|
105
|
+
npoplayer.uiComponents.adbutton?.hide();
|
|
106
|
+
npoplayer.uiComponents.adlabel?.hide();
|
|
107
|
+
npoplayer.uiManager?.release();
|
|
108
|
+
npoplayer.createUIManager(playerapi, NpoPlayerUIVariants.DEFAULT);
|
|
109
|
+
adUiSet = false;
|
|
110
|
+
removeListeners();
|
|
75
111
|
}
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
112
|
+
playerapi.on(PlayerEvent.AdBreakFinished, handleAdBreakFinished);
|
|
113
|
+
function removeListeners() {
|
|
114
|
+
playerapi.off(PlayerEvent.SourceLoaded, handleSourceLoaded);
|
|
115
|
+
playerapi.off(PlayerEvent.Play, handlePlay);
|
|
116
|
+
playerapi.off(PlayerEvent.AdStarted, handleAdStarted);
|
|
117
|
+
playerapi.off(PlayerEvent.AdFinished, handleAdFinished);
|
|
118
|
+
playerapi.off(PlayerEvent.AdBreakFinished, handleAdBreakFinished);
|
|
119
|
+
resolve();
|
|
80
120
|
}
|
|
81
|
-
|
|
82
|
-
window.open(nextAd.clickThroughUrl, '_blank');
|
|
83
|
-
playerapi.pause();
|
|
84
|
-
};
|
|
85
|
-
npoplayer.uiComponents.adbutton?.onClick.subscribe(currentClickListener);
|
|
86
|
-
npoplayer.uiComponents.adlabel?.setText(`Advertentie ${adIndex} van ${activeAdBreak.ads.length}`);
|
|
87
|
-
}
|
|
88
|
-
playerapi.on(PlayerEvent.AdFinished, handleAdFinished);
|
|
89
|
-
function handleAdBreakFinished() {
|
|
90
|
-
npoplayer.adBreakActive = false;
|
|
91
|
-
npoplayer.uiComponents.adbutton?.hide();
|
|
92
|
-
npoplayer.uiComponents.adlabel?.hide();
|
|
93
|
-
npoplayer.uiManager?.release();
|
|
94
|
-
npoplayer.createUIManager(playerapi, 'default');
|
|
95
|
-
adUiSet = false;
|
|
96
|
-
removeListeners();
|
|
97
|
-
}
|
|
98
|
-
playerapi.on(PlayerEvent.AdBreakFinished, handleAdBreakFinished);
|
|
99
|
-
function removeListeners() {
|
|
100
|
-
playerapi.off(PlayerEvent.SourceLoaded, handleSourceLoaded);
|
|
101
|
-
playerapi.off(PlayerEvent.Play, handlePlay);
|
|
102
|
-
playerapi.off(PlayerEvent.AdBreakStarted, handleAdBreakStarted);
|
|
103
|
-
playerapi.off(PlayerEvent.AdFinished, handleAdFinished);
|
|
104
|
-
playerapi.off(PlayerEvent.AdBreakFinished, handleAdBreakFinished);
|
|
105
|
-
}
|
|
121
|
+
});
|
|
106
122
|
}
|
|
107
123
|
//# sourceMappingURL=ster.js.map
|
package/lib/js/ads/ster.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ster.js","sourceRoot":"","sources":["../../../../src/js/ads/ster.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"ster.js","sourceRoot":"","sources":["../../../../src/js/ads/ster.ts"],"names":[],"mappings":"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"}
|
package/lib/js/ads/ster.test.js
CHANGED
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { handlePreRolls } from './ster';
|
|
2
|
-
import { PlayerEvent } from "bitmovin-player";
|
|
3
2
|
jest.mock("bitmovin-player");
|
|
4
3
|
jest.mock("../../npoplayer");
|
|
5
4
|
describe("handlePreRolls", () => {
|
|
@@ -48,32 +47,6 @@ describe("handlePreRolls", () => {
|
|
|
48
47
|
await handlePreRolls(mockPlayerAPI, streamObject, mockNpoPlayer);
|
|
49
48
|
expect(mockPlayerAPI.ads.schedule).not.toHaveBeenCalled();
|
|
50
49
|
});
|
|
51
|
-
it("should schedule ads on SourceLoaded when hasPreroll is true", async () => {
|
|
52
|
-
const streamObject = {
|
|
53
|
-
metadata: {
|
|
54
|
-
hasPreroll: "true"
|
|
55
|
-
},
|
|
56
|
-
assets: {
|
|
57
|
-
preroll: "sample_url"
|
|
58
|
-
}
|
|
59
|
-
};
|
|
60
|
-
await handlePreRolls(mockPlayerAPI, streamObject, mockNpoPlayer);
|
|
61
|
-
mockPlayerAPI.on.mock.calls.forEach(call => {
|
|
62
|
-
if (call[0] === PlayerEvent.SourceLoaded) {
|
|
63
|
-
const sourceLoadedCallback = call[1];
|
|
64
|
-
const mockEvent = {};
|
|
65
|
-
sourceLoadedCallback(mockEvent);
|
|
66
|
-
}
|
|
67
|
-
});
|
|
68
|
-
expect(mockPlayerAPI.ads.schedule).toHaveBeenCalledWith({
|
|
69
|
-
tag: {
|
|
70
|
-
url: "sample_url",
|
|
71
|
-
type: "vast"
|
|
72
|
-
},
|
|
73
|
-
id: 'Ad',
|
|
74
|
-
position: 'pre',
|
|
75
|
-
});
|
|
76
|
-
});
|
|
77
50
|
it("should not schedule ads if preroll URL is missing", async () => {
|
|
78
51
|
const streamObject = {
|
|
79
52
|
metadata: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ster.test.js","sourceRoot":"","sources":["../../../../src/js/ads/ster.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAA;
|
|
1
|
+
{"version":3,"file":"ster.test.js","sourceRoot":"","sources":["../../../../src/js/ads/ster.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAA;AAKvC,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAA;AAC5B,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAA;AAE5B,QAAQ,CAAC,gBAAgB,EAAE,GAAG,EAAE;IAC5B,IAAI,aAAqC,CAAA;IACzC,IAAI,aAAqC,CAAA;IAEzC,UAAU,CAAC,GAAG,EAAE;QACZ,aAAa,GAAG;YACZ,GAAG,EAAE;gBACD,QAAQ,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,iBAAiB,CAAC,SAAS,CAAC;gBAChD,gBAAgB,EAAE,IAAI,CAAC,EAAE,EAAE;aAC9B;YACD,EAAE,EAAE,IAAI,CAAC,EAAE,EAAE;YACb,GAAG,EAAE,IAAI,CAAC,EAAE,EAAE;SACV,CAAA;QAER,aAAa,GAAG;YACZ,SAAS,EAAE;gBACP,OAAO,EAAE,IAAI,CAAC,EAAE,EAAE;aACrB;YACD,eAAe,EAAE,IAAI,CAAC,EAAE,EAAE;YAC1B,YAAY,EAAE;gBACV,QAAQ,EAAE;oBACN,IAAI,EAAE,IAAI,CAAC,EAAE,EAAE;oBACf,IAAI,EAAE,IAAI,CAAC,EAAE,EAAE;oBACf,OAAO,EAAE;wBACL,SAAS,EAAE,IAAI,CAAC,EAAE,EAAE;wBACpB,WAAW,EAAE,IAAI,CAAC,EAAE,EAAE;qBACzB;iBACJ;gBACD,OAAO,EAAE;oBACL,OAAO,EAAE,IAAI,CAAC,EAAE,EAAE;oBAClB,IAAI,EAAE,IAAI,CAAC,EAAE,EAAE;iBAClB;aACJ;YACD,aAAa,EAAE,KAAK;SAChB,CAAA;IACZ,CAAC,CAAC,CAAA;IAOF,EAAE,CAAC,kDAAkD,EAAE,KAAK,IAAI,EAAE;QAC9D,MAAM,YAAY,GAAqB;YACnC,QAAQ,EAAE;gBACN,UAAU,EAAE,OAAO;aACtB;YACD,MAAM,EAAE;gBACJ,OAAO,EAAE,YAAY;aACxB;SACJ,CAAA;QAED,MAAM,cAAc,CAAC,aAAa,EAAE,YAAmB,EAAE,aAAa,CAAC,CAAA;QACvE,MAAM,CAAC,aAAa,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,gBAAgB,EAAE,CAAA;IAC7D,CAAC,CAAC,CAAA;IAiCF,EAAE,CAAC,mDAAmD,EAAE,KAAK,IAAI,EAAE;QAC/D,MAAM,YAAY,GAAqB;YACnC,QAAQ,EAAE;gBACN,UAAU,EAAE,MAAM;aACrB;YACD,MAAM,EAAE,EAAE;SACb,CAAA;QAED,MAAM,cAAc,CAAC,aAAa,EAAE,YAAmB,EAAE,aAAa,CAAC,CAAA;QACvE,MAAM,CAAC,aAAa,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,gBAAgB,EAAE,CAAA;IAC7D,CAAC,CAAC,CAAA;IAEF,SAAS,CAAC,GAAG,EAAE;QACX,IAAI,CAAC,aAAa,EAAE,CAAA;IACxB,CAAC,CAAC,CAAA;AACN,CAAC,CAAC,CAAA"}
|
|
@@ -1,22 +1,13 @@
|
|
|
1
1
|
import { PlayerEvent, ViewMode } from 'bitmovin-player';
|
|
2
2
|
import { logEvent } from './eventlogging';
|
|
3
|
+
const logEventHandlers = new Map();
|
|
3
4
|
export function bindPlayerEvents(npoplayer, player) {
|
|
4
5
|
if (player == null)
|
|
5
6
|
return;
|
|
6
7
|
let isNewSource = false;
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
{ event: PlayerEvent.Ready, name: 'load_complete' },
|
|
11
|
-
{ event: PlayerEvent.StallStarted, name: 'buffering' },
|
|
12
|
-
{ event: PlayerEvent.StallEnded, name: 'buffering_complete' },
|
|
13
|
-
{ event: PlayerEvent.PlaybackFinished, name: 'complete' },
|
|
14
|
-
{ event: PlayerEvent.TimeChanged, name: 'time' },
|
|
15
|
-
{ event: PlayerEvent.SourceUnloaded, name: 'stop' },
|
|
16
|
-
{ event: PlayerEvent.Destroy, name: 'stop' },
|
|
17
|
-
];
|
|
18
|
-
const logEventHandler = (npoplayer, eventName, event) => {
|
|
19
|
-
return () => {
|
|
8
|
+
let isSeeking = false;
|
|
9
|
+
const logEventHandler = (eventName) => {
|
|
10
|
+
return (event) => {
|
|
20
11
|
const timeDifference = npoplayer.streamObject.stream.isLiveStream
|
|
21
12
|
? event.position - Date.now() / 1000
|
|
22
13
|
: event.position;
|
|
@@ -24,6 +15,7 @@ export function bindPlayerEvents(npoplayer, player) {
|
|
|
24
15
|
};
|
|
25
16
|
};
|
|
26
17
|
const seekHandler = (e) => {
|
|
18
|
+
isSeeking = true;
|
|
27
19
|
let data = {};
|
|
28
20
|
if (e.type === 'timeshift') {
|
|
29
21
|
const timeDifferencePosition = -1 * (Date.now() / 1000 - e.position);
|
|
@@ -48,11 +40,14 @@ export function bindPlayerEvents(npoplayer, player) {
|
|
|
48
40
|
}
|
|
49
41
|
};
|
|
50
42
|
const handlePlay = (e) => {
|
|
51
|
-
if (!isNewSource) {
|
|
43
|
+
if (!isNewSource && !isSeeking) {
|
|
52
44
|
logEvent(npoplayer, 'resume', e.position);
|
|
53
45
|
}
|
|
54
46
|
};
|
|
55
47
|
const handlePlaying = (e) => {
|
|
48
|
+
if (isSeeking) {
|
|
49
|
+
isSeeking = false;
|
|
50
|
+
}
|
|
56
51
|
if (isNewSource) {
|
|
57
52
|
logEvent(npoplayer, 'start', e.position);
|
|
58
53
|
isNewSource = false;
|
|
@@ -67,29 +62,41 @@ export function bindPlayerEvents(npoplayer, player) {
|
|
|
67
62
|
logEvent(npoplayer, 'windowed', e.position);
|
|
68
63
|
}
|
|
69
64
|
};
|
|
70
|
-
|
|
71
|
-
logEvent(npoplayer, 'stop',
|
|
65
|
+
const stopBeforeUnload = () => {
|
|
66
|
+
logEvent(npoplayer, 'stop', {});
|
|
67
|
+
};
|
|
68
|
+
for (const [key, value] of logEventHandlers) {
|
|
69
|
+
player.off(key, value);
|
|
72
70
|
}
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
71
|
+
window.removeEventListener('beforeunload', logEventHandlers.get('stopBeforeUnload'));
|
|
72
|
+
logEventHandlers.clear();
|
|
73
|
+
const playerEvents = [
|
|
74
|
+
{ event: PlayerEvent.Paused, name: 'pause' },
|
|
75
|
+
{ event: PlayerEvent.SourceLoaded, handler: handleSourceLoaded },
|
|
76
|
+
{ event: PlayerEvent.Ready, name: 'load_complete' },
|
|
77
|
+
{ event: PlayerEvent.StallStarted, name: 'buffering' },
|
|
78
|
+
{ event: PlayerEvent.StallEnded, name: 'buffering_complete' },
|
|
79
|
+
{ event: PlayerEvent.PlaybackFinished, name: 'complete' },
|
|
80
|
+
{ event: PlayerEvent.TimeChanged, name: 'time' },
|
|
81
|
+
{ event: PlayerEvent.SourceUnloaded, name: 'stop' },
|
|
82
|
+
{ event: PlayerEvent.Destroy, name: 'stop' },
|
|
83
|
+
];
|
|
84
|
+
playerEvents.forEach(({ event, name, handler }) => {
|
|
85
|
+
handler = handler || logEventHandler(name);
|
|
86
|
+
logEventHandlers.set(event, handler);
|
|
87
|
+
player.on(event, handler);
|
|
81
88
|
});
|
|
82
|
-
|
|
83
|
-
player.on(PlayerEvent.SourceLoaded, handleSourceLoaded);
|
|
89
|
+
logEventHandlers.set(PlayerEvent.Seek, seekHandler);
|
|
84
90
|
player.on(PlayerEvent.Seek, seekHandler);
|
|
91
|
+
logEventHandlers.set(PlayerEvent.TimeShift, seekHandler);
|
|
85
92
|
player.on(PlayerEvent.TimeShift, seekHandler);
|
|
93
|
+
logEventHandlers.set(PlayerEvent.Play, handlePlay);
|
|
86
94
|
player.on(PlayerEvent.Play, handlePlay);
|
|
95
|
+
logEventHandlers.set(PlayerEvent.Playing, handlePlaying);
|
|
87
96
|
player.on(PlayerEvent.Playing, handlePlaying);
|
|
97
|
+
logEventHandlers.set(PlayerEvent.ViewModeChanged, handleViewModeChange);
|
|
88
98
|
player.on(PlayerEvent.ViewModeChanged, handleViewModeChange);
|
|
89
|
-
|
|
90
|
-
const handler = logEventHandler(npoplayer, name, event);
|
|
91
|
-
player.on(event, handler);
|
|
92
|
-
});
|
|
99
|
+
logEventHandlers.set('beforeunload', stopBeforeUnload);
|
|
93
100
|
window.addEventListener('beforeunload', stopBeforeUnload);
|
|
94
101
|
}
|
|
95
102
|
//# sourceMappingURL=eventbinding.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"eventbinding.js","sourceRoot":"","sources":["../../../../../src/js/tracking/handlers/eventbinding.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,WAAW,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAA;AACvE,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;
|
|
1
|
+
{"version":3,"file":"eventbinding.js","sourceRoot":"","sources":["../../../../../src/js/tracking/handlers/eventbinding.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { ControlBar, Container, SeekBar, SeekBarLabel, VolumeControlButton } from 'bitmovin-player-ui';
|
|
2
|
+
import { createSeekBar } from '../seekbar';
|
|
3
|
+
export function createAudioControlBar(npoplayer) {
|
|
4
|
+
const seekBar = new SeekBar({ label: new SeekBarLabel() });
|
|
5
|
+
npoplayer.uiComponents.seekBar = seekBar;
|
|
6
|
+
const controlbar = new ControlBar({
|
|
7
|
+
components: [
|
|
8
|
+
createSeekBar(npoplayer),
|
|
9
|
+
new Container({
|
|
10
|
+
components: [
|
|
11
|
+
new VolumeControlButton({
|
|
12
|
+
vertical: true,
|
|
13
|
+
}),
|
|
14
|
+
],
|
|
15
|
+
cssClasses: ['controlbar-bottom']
|
|
16
|
+
})
|
|
17
|
+
],
|
|
18
|
+
cssClasses: ['ui-controlbar-bottom']
|
|
19
|
+
});
|
|
20
|
+
npoplayer.uiComponents.controlbar = controlbar;
|
|
21
|
+
return controlbar;
|
|
22
|
+
}
|
|
23
|
+
//# sourceMappingURL=controlbar.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"controlbar.js","sourceRoot":"","sources":["../../../../../../src/js/ui/components/audio/controlbar.ts"],"names":[],"mappings":"AAAA,OAAO,EACH,UAAU,EACV,SAAS,EACT,OAAO,EACP,YAAY,EACZ,mBAAmB,EACtB,MAAM,oBAAoB,CAAA;AAE3B,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAE1C,MAAM,UAAU,qBAAqB,CACjC,SAAoB;IAEpB,MAAM,OAAO,GAAG,IAAI,OAAO,CAAC,EAAE,KAAK,EAAE,IAAI,YAAY,EAAE,EAAE,CAAC,CAAA;IAC1D,SAAS,CAAC,YAAY,CAAC,OAAO,GAAG,OAAO,CAAA;IAExC,MAAM,UAAU,GAAG,IAAI,UAAU,CAAC;QAC9B,UAAU,EAAE;YACR,aAAa,CAAC,SAAS,CAAC;YACxB,IAAI,SAAS,CAAC;gBACV,UAAU,EAAE;oBACR,IAAI,mBAAmB,CAAC;wBACpB,QAAQ,EAAE,IAAI;qBACjB,CAAC;iBACL;gBACD,UAAU,EAAE,CAAC,mBAAmB,CAAC;aACpC,CAAC;SACL;QACD,UAAU,EAAE,CAAC,sBAAsB,CAAC;KACvC,CAAC,CAAA;IAGF,SAAS,CAAC,YAAY,CAAC,UAAU,GAAG,UAAU,CAAA;IAE9C,OAAO,UAAU,CAAA;AACrB,CAAC"}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
import { ControlBar, Container,
|
|
1
|
+
import { ControlBar, Container, SeekBar, SeekBarLabel, PlaybackToggleButton, VolumeToggleButton, VolumeSlider, Spacer, PictureInPictureToggleButton, AirPlayToggleButton, CastToggleButton, SettingsToggleButton, FullscreenToggleButton } from 'bitmovin-player-ui';
|
|
2
2
|
import { airPlaySupported } from '../../../js/utilities/utilities';
|
|
3
3
|
import { PlayerEvent } from 'bitmovin-player';
|
|
4
4
|
import { createForwardButton, createRewindButton } from './buttons';
|
|
5
|
+
import { createSeekBar } from './seekbar';
|
|
5
6
|
export function createControlBar(npoplayer, settingsPanel) {
|
|
6
7
|
const player = npoplayer.player;
|
|
7
8
|
const rewindButton = createRewindButton(player);
|
|
@@ -17,21 +18,7 @@ export function createControlBar(npoplayer, settingsPanel) {
|
|
|
17
18
|
});
|
|
18
19
|
const controlbar = new ControlBar({
|
|
19
20
|
components: [
|
|
20
|
-
|
|
21
|
-
components: [
|
|
22
|
-
new PlaybackTimeLabel({
|
|
23
|
-
timeLabelMode: PlaybackTimeLabelMode.CurrentTime,
|
|
24
|
-
hideInLivePlayback: true,
|
|
25
|
-
cssClasses: ['current-time']
|
|
26
|
-
}),
|
|
27
|
-
seekBar,
|
|
28
|
-
new PlaybackTimeLabel({
|
|
29
|
-
timeLabelMode: PlaybackTimeLabelMode.TotalTime,
|
|
30
|
-
cssClasses: ['total-time']
|
|
31
|
-
})
|
|
32
|
-
],
|
|
33
|
-
cssClasses: ['controlbar-top']
|
|
34
|
-
}),
|
|
21
|
+
createSeekBar(npoplayer),
|
|
35
22
|
new Container({
|
|
36
23
|
components: [
|
|
37
24
|
new PlaybackToggleButton(),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"controlbar.js","sourceRoot":"","sources":["../../../../../src/js/ui/components/controlbar.ts"],"names":[],"mappings":"AAAA,OAAO,EACH,UAAU,EACV,SAAS,EACT,
|
|
1
|
+
{"version":3,"file":"controlbar.js","sourceRoot":"","sources":["../../../../../src/js/ui/components/controlbar.ts"],"names":[],"mappings":"AAAA,OAAO,EACH,UAAU,EACV,SAAS,EACT,OAAO,EACP,YAAY,EACZ,oBAAoB,EACpB,kBAAkB,EAClB,YAAY,EACZ,MAAM,EACN,4BAA4B,EAC5B,mBAAmB,EACnB,gBAAgB,EAChB,oBAAoB,EACpB,sBAAsB,EAEzB,MAAM,oBAAoB,CAAA;AAC3B,OAAO,EAAE,gBAAgB,EAAE,MAAM,iCAAiC,CAAA;AAElE,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAC7C,OAAO,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAA;AACnE,OAAO,EAAE,aAAa,EAAE,MAAM,WAAW,CAAA;AAEzC,MAAM,UAAU,gBAAgB,CAC5B,SAAoB,EACpB,aAA4B;IAE5B,MAAM,MAAM,GAAG,SAAS,CAAC,MAAM,CAAA;IAE/B,MAAM,YAAY,GAAG,kBAAkB,CAAC,MAAM,CAAC,CAAA;IAC/C,MAAM,aAAa,GAAG,mBAAmB,CAAC,MAAM,CAAC,CAAA;IAEjD,MAAM,OAAO,GAAG,IAAI,OAAO,CAAC,EAAE,KAAK,EAAE,IAAI,YAAY,EAAE,EAAE,CAAC,CAAA;IAC1D,SAAS,CAAC,YAAY,CAAC,OAAO,GAAG,OAAO,CAAA;IAExC,MAAM,gBAAgB,GAAG,IAAI,gBAAgB,CAAC;QAC1C,MAAM,EAAE,IAAI;KACf,CAAC,CAAA;IAEF,MAAM,EAAE,EAAE,CAAC,WAAW,CAAC,aAAa,EAAE,GAAG,EAAE;QACvC,IAAG,MAAM,CAAC,eAAe,EAAE;YAAE,gBAAgB,CAAC,IAAI,EAAE,CAAA;IACxD,CAAC,CAAC,CAAA;IAEF,MAAM,UAAU,GAAG,IAAI,UAAU,CAAC;QAC9B,UAAU,EAAE;YACR,aAAa,CAAC,SAAS,CAAC;YACxB,IAAI,SAAS,CAAC;gBACV,UAAU,EAAE;oBACR,IAAI,oBAAoB,EAAE;oBAC1B,IAAI,kBAAkB,EAAE;oBACxB,IAAI,YAAY,EAAE;oBAClB,YAAY;oBACZ,aAAa;oBACb,IAAI,MAAM,EAAE;oBACZ,GAAG,CAAC,QAAQ,CAAC,uBAAuB,IAAI,gCAAgC,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,4BAA4B,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;oBAC/I,GAAG,CAAC,gBAAgB,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,mBAAmB,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;oBAC1D,gBAAgB;oBAChB,IAAI,oBAAoB,CAAC,EAAE,aAAa,EAAE,CAAC;oBAC3C,IAAI,sBAAsB,EAAE;iBAC/B;gBACD,UAAU,EAAE,CAAC,mBAAmB,CAAC;aACpC,CAAC;SACL;QACD,UAAU,EAAE,CAAC,sBAAsB,CAAC;KACvC,CAAC,CAAA;IAGF,SAAS,CAAC,YAAY,CAAC,UAAU,GAAG,UAAU,CAAA;IAE9C,OAAO,UAAU,CAAA;AACrB,CAAC"}
|
|
@@ -20,8 +20,8 @@ export declare function createGoBackLiveButton(player: PlayerAPI): Button<{
|
|
|
20
20
|
}>;
|
|
21
21
|
export declare function createSettingsButton(settingsPanel: SettingsPanel): SettingsToggleButton;
|
|
22
22
|
export declare function createPlaybackToggleButton(): PlaybackToggleButton;
|
|
23
|
-
export declare function createVolumeToggleButton(): VolumeToggleButton;
|
|
24
|
-
export declare function createPictureInPictureToggleButton(): PictureInPictureToggleButton;
|
|
23
|
+
export declare function createVolumeToggleButton(player: PlayerAPI): VolumeToggleButton;
|
|
24
|
+
export declare function createPictureInPictureToggleButton(player: PlayerAPI): PictureInPictureToggleButton;
|
|
25
25
|
export declare function createAirPlayToggleButton(): AirPlayToggleButton;
|
|
26
26
|
export declare function createCastToggleButton(): CastToggleButton;
|
|
27
27
|
export declare function createFullscreenToggleButton(player: PlayerAPI): FullscreenToggleButton;
|