@npo/player 1.24.7 → 1.26.0

package/README.md

@@ -11,7 +11,7 @@ Extensive and up-to-date documentation is available at https://docs.npoplayer.nl
 Code quality is analysed by SonarCloud. The project can be found at https://sonarcloud.io/project/overview?id=NPOstart_npo-player
 
 # Changelog
-Current version: v1.24.0
+Current version: v1.26.0
 
 The changelog is available at https://docs.npoplayer.nl/implementation/web/changelog/
 

package/lib/js/api/getstreamobject.d.ts

@@ -1,3 +1,3 @@
 import { type ApiPayload } from '../../types/interfaces';
 import type NpoPlayer from '../../npoplayer';
-export declare function getStreamObject(npoplayer: NpoPlayer, payload: ApiPayload): Promise<any>;
+export declare function getStreamObject(npoPlayer: NpoPlayer, payload: ApiPayload): Promise<any>;

package/lib/js/api/getstreamobject.js

@@ -1,5 +1,5 @@
 import { removeTrailingSlash } from '../utilities/utilities.url';
-export async function getStreamObject(npoplayer, payload) {
+export async function getStreamObject(npoPlayer, payload) {
     try {
         const controller = new AbortController();
         const { signal } = controller;
@@ -22,16 +22,16 @@ export async function getStreamObject(npoplayer, payload) {
             return streamApiResponse;
         }
         else {
-            npoplayer.doError(`Het is niet gelukt de stream op te halen: \n ${streamApiResponse.body}`, response.status);
+            npoPlayer.doError('Het is niet gelukt de stream op te halen.', response.status);
         }
     }
     catch (error) {
         if (error instanceof Error) {
             if (error.message === 'AbortError') {
-                npoplayer.doError('Het is niet gelukt de stream op te halen: \n Request timed out', 408);
+                npoPlayer.doError('Het ophalen van de stream duurde te lang.', 408);
             }
             else {
-                npoplayer.doError(`Het is niet gelukt de stream op te halen: \n ${error.message}`, 500);
+                npoPlayer.doError(`Het is niet gelukt de stream op te halen: \n ${error.message}`, 500);
             }
         }
     }

package/lib/js/api/getstreamobject.test.js

@@ -2,18 +2,18 @@ import { getStreamObject } from './getstreamobject';
 import NpoPlayer from '../../npoplayer';
 import fetchMock from 'jest-fetch-mock';
 fetchMock.enableMocks();
-jest.mock('../../ui/handlers/streamhandler', () => ({
-    processStream: jest.fn()
+jest.mock('../../services/streamoptionsHandlers/streamOptionsHandler', () => ({
+    handleStreamOptions: jest.fn()
 }));
 describe('getStreamObject', () => {
-    let npoplayer;
+    let npoPlayer;
     let apiPayload;
     const testPlayerConfig = {
         key: 'dummy key'
     };
     const div = document.createElement('div');
     beforeEach(() => {
-        npoplayer = new NpoPlayer(div, testPlayerConfig);
+        npoPlayer = new NpoPlayer(div, testPlayerConfig);
         apiPayload = {
             baseURL: 'http://example.com',
             jwt: 'someToken',
@@ -24,25 +24,25 @@ describe('getStreamObject', () => {
     });
     it('should handle successful fetch', async () => {
         fetchMock.mockResponseOnce(JSON.stringify({ foo: 'bar' }));
-        const result = await getStreamObject(npoplayer, apiPayload);
+        const result = await getStreamObject(npoPlayer, apiPayload);
         expect(result).toEqual({ foo: 'bar' });
     });
     it('should handle fetch with bad response', async () => {
         fetchMock.mockResponseOnce(JSON.stringify({ body: 'Bad Request' }), { status: 400 });
-        const doErrorSpy = jest.spyOn(npoplayer, 'doError');
-        await getStreamObject(npoplayer, apiPayload);
-        expect(doErrorSpy).toHaveBeenCalledWith(expect.stringContaining('Het is niet gelukt de stream op te halen'), 400);
+        const doErrorSpy = jest.spyOn(npoPlayer, 'doError');
+        await getStreamObject(npoPlayer, apiPayload);
+        expect(doErrorSpy).toHaveBeenCalledWith(expect.stringMatching('Het is niet gelukt de stream op te halen.'), 400);
     });
     it('should handle fetch timeout', async () => {
         fetchMock.mockRejectOnce(new Error('AbortError'));
-        const doErrorSpy = jest.spyOn(npoplayer, 'doError');
-        await getStreamObject(npoplayer, apiPayload);
-        expect(doErrorSpy).toHaveBeenCalledWith(expect.stringContaining('Request timed out'), 408);
+        const doErrorSpy = jest.spyOn(npoPlayer, 'doError');
+        await getStreamObject(npoPlayer, apiPayload);
+        expect(doErrorSpy).toHaveBeenCalledWith(expect.stringMatching('Het ophalen van de stream duurde te lang.'), 408);
     });
     it('should handle fetch with other errors', async () => {
         fetchMock.mockRejectOnce(new Error('SomeError'));
-        const doErrorSpy = jest.spyOn(npoplayer, 'doError');
-        await getStreamObject(npoplayer, apiPayload);
+        const doErrorSpy = jest.spyOn(npoPlayer, 'doError');
+        await getStreamObject(npoPlayer, apiPayload);
         expect(doErrorSpy).toHaveBeenCalledWith(expect.stringContaining('SomeError'), 500);
     });
 });

package/lib/js/playeractions/handlers/handleoffsets.js

@@ -8,11 +8,13 @@ export function handleStartOffset(playerContext, offset) {
         return;
     }
     const seek = () => {
+        player.off(NpoPlayerEvent.Ready, seek);
         player.off(NpoPlayerEvent.SourceLoaded, seek);
         player.off(NpoPlayerEvent.AdBreakFinished, seek);
         player.off(NpoPlayerEvent.AdError, seek);
         player.seek(offset);
     };
+    player.on(NpoPlayerEvent.Ready, seek);
     player.on(NpoPlayerEvent.SourceLoaded, seek);
     player.on(NpoPlayerEvent.AdBreakFinished, seek);
     player.on(NpoPlayerEvent.AdError, seek);
@@ -28,22 +30,22 @@ export function shiftToProgramStart(playerContext, timestamp) {
     player.timeShift(timestamp);
 }
 export function handleLiveOffsetLogic(playerContext, options) {
-    const { player, npoplayer } = playerContext;
-    if (npoplayer.uiComponents.watchFromStartButton == undefined)
+    const { player, npoPlayer } = playerContext;
+    if (npoPlayer.uiComponents.watchFromStartButton == undefined)
         return;
     if (options?.liveProgramTime == undefined) {
-        npoplayer.uiComponents.watchFromStartButton.hide();
+        npoPlayer.uiComponents.watchFromStartButton.hide();
         return;
     }
-    npoplayer.streamOptions.liveProgramTime = options.liveProgramTime;
+    npoPlayer.streamOptions.liveProgramTime = options.liveProgramTime;
     if (player.isLive() && options.liveProgramTime > 0) {
-        npoplayer.uiComponents.watchFromStartButton.show();
+        npoPlayer.uiComponents.watchFromStartButton.show();
     }
     else {
-        npoplayer.uiComponents.watchFromStartButton.hide();
+        npoPlayer.uiComponents.watchFromStartButton.hide();
     }
     if (options.liveOffset !== null && options.liveOffset !== false && options.liveProgramTime > 0) {
-        npoplayer.uiComponents.watchFromStartButton.hide();
+        npoPlayer.uiComponents.watchFromStartButton.hide();
         shiftToProgramStart(playerContext, options.liveProgramTime);
     }
 }

package/lib/js/playeractions/handlers/handleoffsets.test.js

@@ -39,7 +39,7 @@ describe('Test offset handling', () => {
             seek: seekMock,
             off: jest.fn(),
             on: jest.fn((event, callback) => {
-                if (event === PlayerEvent.SourceLoaded) {
+                if (event === PlayerEvent.Ready) {
                     callback();
                 }
             })

package/lib/js/playeractions/handlers/processplayerconfig.d.ts

@@ -1,3 +1,3 @@
 import { type PlayerConfig } from 'bitmovin-player';
 import NpoPlayer from 'npoplayer';
-export declare function processPlayerConfig(npoplayer: NpoPlayer, playerConfig: PlayerConfig): PlayerConfig;
+export declare function processPlayerConfig(npoPlayer: NpoPlayer, playerConfig: PlayerConfig): PlayerConfig;

package/lib/js/playeractions/handlers/processplayerconfig.js

@@ -1,6 +1,6 @@
 import { LogLevel } from 'bitmovin-player';
 import { isSafari } from '../../utilities/utilities.user-agent';
-export function processPlayerConfig(npoplayer, playerConfig) {
+export function processPlayerConfig(npoPlayer, playerConfig) {
     const processedConfig = playerConfig;
     if (isSafari()) {
         processedConfig.playback = {
@@ -17,9 +17,9 @@ export function processPlayerConfig(npoplayer, playerConfig) {
         receiverVersion: 'v3',
         messageNamespace: 'urn:x-cast:com.bitmovin.player.caf',
         customReceiverConfig: {
-            drm: npoplayer.drmProfile.drm,
-            profileName: npoplayer.drmProfile.profileName,
-            jwt: npoplayer.jwt
+            drm: npoPlayer.drmProfile.drm,
+            profileName: npoPlayer.drmProfile.profileName,
+            jwt: npoPlayer.jwt
         }
     };
     const userRemoteControlConfig = processedConfig.remotecontrol || defaultRemoteControlConfig;
@@ -32,6 +32,20 @@ export function processPlayerConfig(npoplayer, playerConfig) {
         }
     };
     processedConfig.remotecontrol = mergedRemoteControlConfig;
+    if (processedConfig.cast) {
+        console.warn("'cast' is deprecated in playerConfig. Please use 'remotecontrol' with 'GoogleCastRemoteControlConfig' instead.");
+        processedConfig.remotecontrol = {
+            ...processedConfig.remotecontrol,
+            customReceiverConfig: {
+                ...processedConfig.remotecontrol.customReceiverConfig,
+                ...processedConfig.cast,
+                enable: processedConfig.remotecontrol.customReceiverConfig?.enable ??
+                    (typeof processedConfig.cast?.enable === 'boolean'
+                        ? processedConfig.cast.enable.toString()
+                        : processedConfig.cast?.enable)
+            }
+        };
+    }
     if (!processedConfig.logs)
         processedConfig.logs = {
             level: LogLevel.ERROR

package/lib/js/playeractions/handlers/processplayerconfig.test.js

@@ -0,0 +1,116 @@
+import { LogLevel } from 'bitmovin-player';
+import { isSafari } from '../../utilities/utilities.user-agent';
+import { processPlayerConfig } from './processplayerconfig';
+jest.mock('../../utilities/utilities.user-agent', () => ({
+    isSafari: jest.fn()
+}));
+const mockNpoPlayer = {
+    drmProfile: {
+        drm: 'mockDrm',
+        profileName: 'mockProfileName'
+    },
+    jwt: 'mockJwt'
+};
+describe('processPlayerConfig', () => {
+    let playerConfig;
+    beforeEach(() => {
+        playerConfig = {
+            key: 'dummy-key'
+        };
+    });
+    test('should disable autoplay and fix DRM issues on Safari', () => {
+        ;
+        isSafari.mockReturnValue(true);
+        const processedConfig = processPlayerConfig(mockNpoPlayer, playerConfig);
+        expect(processedConfig.playback?.autoplay).toBe(false);
+        expect(processedConfig.tweaks?.fairplay_ignore_duplicate_init_data_key_errors).toBe(true);
+    });
+    test('should always set bitmovin logging to false', () => {
+        playerConfig.logs = { bitmovin: true };
+        const processedConfig = processPlayerConfig(mockNpoPlayer, playerConfig);
+        expect(processedConfig.logs?.bitmovin).toEqual(false);
+    });
+    test('make sure there is an (empty) advertising object', () => {
+        const processedConfig = processPlayerConfig(mockNpoPlayer, playerConfig);
+        expect(processedConfig.advertising).toEqual({});
+    });
+    test('should set default remoteControlConfig if none is provided', () => {
+        const processedConfig = processPlayerConfig(mockNpoPlayer, playerConfig);
+        expect(processedConfig.remotecontrol).toEqual({
+            type: 'googlecast',
+            receiverApplicationId: 'CC38EB17',
+            receiverVersion: 'v3',
+            messageNamespace: 'urn:x-cast:com.bitmovin.player.caf',
+            customReceiverConfig: {
+                drm: 'mockDrm',
+                profileName: 'mockProfileName',
+                jwt: 'mockJwt'
+            }
+        });
+    });
+    test('should merge default remoteControlConfig with user-defined remoteControlConfig', () => {
+        playerConfig.remotecontrol = {
+            type: 'googlecast',
+            receiverApplicationId: 'user-receiver-application-id',
+            customReceiverConfig: {
+                primaryColor: 'rgb(255, 0, 0)',
+                enable: 'false'
+            }
+        };
+        const processedConfig = processPlayerConfig(mockNpoPlayer, playerConfig);
+        expect(processedConfig.remotecontrol).toEqual({
+            type: 'googlecast',
+            receiverApplicationId: 'user-receiver-application-id',
+            receiverVersion: 'v3',
+            messageNamespace: 'urn:x-cast:com.bitmovin.player.caf',
+            customReceiverConfig: {
+                drm: 'mockDrm',
+                profileName: 'mockProfileName',
+                jwt: 'mockJwt',
+                primaryColor: 'rgb(255, 0, 0)',
+                enable: 'false'
+            }
+        });
+    });
+    test('should convert deprecated cast configuration', () => {
+        playerConfig.cast = {
+            enable: false
+        };
+        const processedConfig = processPlayerConfig(mockNpoPlayer, playerConfig);
+        expect(processedConfig.remotecontrol?.customReceiverConfig?.enable).toBe('false');
+    });
+    test('should prefer customReceiverConfig over cast property', () => {
+        playerConfig = {
+            ...playerConfig,
+            cast: {
+                enable: false
+            }
+        };
+        playerConfig.remotecontrol = {
+            type: 'googlecast',
+            customReceiverConfig: {
+                enable: 'true'
+            }
+        };
+        const processedConfig = processPlayerConfig(mockNpoPlayer, playerConfig);
+        expect(processedConfig.remotecontrol?.customReceiverConfig?.enable).toBe('true');
+    });
+    test('should set default log level if logs are undefined', () => {
+        delete playerConfig.logs;
+        const processedConfig = processPlayerConfig(mockNpoPlayer, playerConfig);
+        expect(processedConfig.logs).toEqual({
+            bitmovin: false,
+            level: LogLevel.ERROR
+        });
+    });
+    test('should not set default log level if logs are defined', () => {
+        playerConfig.logs = {
+            level: LogLevel.WARN
+        };
+        const processedConfig = processPlayerConfig(mockNpoPlayer, playerConfig);
+        expect(processedConfig.logs).toEqual({
+            bitmovin: false,
+            level: LogLevel.WARN
+        });
+    });
+});

package/lib/js/playeractions/handlers/processsourceconfig.d.ts

@@ -1,4 +1,6 @@
 import { StreamObject, StreamOptions } from 'types/interfaces';
 import { SourceConfig } from 'bitmovin-player';
 import { NpoPlayerServices } from '../../../services/services';
-export declare function processSourceConfig(NpoPlayerServices: NpoPlayerServices, _sourceConfig: SourceConfig | undefined, _streamObject: StreamObject, drm: string | undefined, streamOptions: StreamOptions, version: string, npoTagPartyId: string | undefined, npoPlayerServices: NpoPlayerServices): Promise<SourceConfig>;
+import { NPOTag } from '@npotag/tag';
+export declare const getSubtitleLabels: (data: any) => string;
+export declare function processSourceConfig(npoPlayerServices: NpoPlayerServices, source: string, _sourceConfig: SourceConfig | undefined, _streamObject: StreamObject, drm: string | undefined, streamOptions: StreamOptions, version: string, npoTagInstance: NPOTag | undefined): Promise<SourceConfig>;

package/lib/js/playeractions/handlers/processsourceconfig.js

@@ -1,6 +1,7 @@
 import { HttpResponseType } from 'bitmovin-player';
 import { npoCdnProviders } from '../../../services/cdnProviders/cdnProviders';
 import { replaceSpecialCharacters } from '../../utilities/utilities.text';
+import subtitleLabelMap from '../../../lang/subtitleLabels/nl.json';
 async function setDrm(sourceConfig, drm, _streamObject, useWidevineServerCertificate) {
     const npoDrmGateway = 'https://npo-drm-gateway.samgcloud.nepworldwide.nl/authentication?custom_data=';
     switch (drm) {
@@ -66,11 +67,9 @@ async function getServerCertificate(url) {
     const response = await fetch(url);
     return response.arrayBuffer();
 }
-const getSubtitleLabels = function (data) {
-    if (data.label === 'nl') {
-        return 'Nederlands';
-    }
-    return data.label;
+export const getSubtitleLabels = function (data) {
+    const langKey = data.lang.toLowerCase();
+    return subtitleLabelMap[langKey] || data.label || langKey;
 };
 const getQualityLabels = function (data) {
     return data.height + 'p';
@@ -102,7 +101,7 @@ function setStreamProfile(sourceConfig, _sourceConfig, _streamObject) {
     }
     return sourceConfig;
 }
-export async function processSourceConfig(NpoPlayerServices, _sourceConfig = {}, _streamObject, drm = undefined, streamOptions, version, npoTagPartyId, npoPlayerServices) {
+export async function processSourceConfig(npoPlayerServices, source, _sourceConfig = {}, _streamObject, drm = undefined, streamOptions, version, npoTagInstance) {
     let sourceConfig = {};
     sourceConfig.title = _sourceConfig.title
         ? replacePlaceholders(_sourceConfig.title, _streamObject.metadata)
@@ -118,11 +117,11 @@ export async function processSourceConfig(NpoPlayerServices, _sourceConfig = {},
     };
     if (streamOptions.fragments || _streamObject.segment) {
         const segment = streamOptions.fragments
-            ? NpoPlayerServices.convertFragmentToSegment(streamOptions.fragments)
+            ? npoPlayerServices.convertFragmentToSegment(streamOptions.fragments)
             : _streamObject.segment;
         if (segment) {
             ;
-            sourceConfig.markers = NpoPlayerServices.segmentMarkersHandler(segment, sourceConfig.metadata.title);
+            sourceConfig.markers = npoPlayerServices.segmentMarkersHandler(segment, sourceConfig.metadata.title);
         }
     }
     sourceConfig.subtitleTracks =
@@ -140,7 +139,6 @@ export async function processSourceConfig(NpoPlayerServices, _sourceConfig = {},
         _sourceConfig.thumbnailTrack ?? _streamObject.assets.scrubbingThumbnail
             ? { url: _streamObject.assets.scrubbingThumbnail }
             : undefined;
-    sourceConfig.options = _sourceConfig.options;
     sourceConfig = setStreamProfile(sourceConfig, _sourceConfig, _streamObject);
     sourceConfig = await setDrm(sourceConfig, drm, _streamObject, streamOptions.useWidevineServerCertificate ?? true);
     const streamSource = _streamObject.stream.streamURL;
@@ -162,7 +160,7 @@ export async function processSourceConfig(NpoPlayerServices, _sourceConfig = {},
     sourceConfig.analytics.title = _streamObject.metadata.title;
     sourceConfig.analytics.customData2 = _streamObject.user.type;
     sourceConfig.analytics.customData3 = npoPlayerServices.getAVType(_streamObject.stream.avType);
-    sourceConfig.analytics.customData4 = npoTagPartyId;
+    sourceConfig.analytics.customData4 = npoTagInstance?.getParty();
     sourceConfig.analytics.customData5 = version;
     sourceConfig.analytics = {
         ...sourceConfig.analytics,
@@ -180,6 +178,18 @@ export async function processSourceConfig(NpoPlayerServices, _sourceConfig = {},
             }
         };
     }
+    sourceConfig.metadata = {
+        ...sourceConfig.metadata
+    };
+    sourceConfig.metadata.jwt = source;
+    sourceConfig.metadata.streamLinkAsJsonString = JSON.stringify(_streamObject);
+    sourceConfig.metadata.npoTagSession = String(npoTagInstance?.getSerializedSessionInfo());
+    sourceConfig.metadata.hasPreroll = _streamObject.metadata.hasPreroll || 'false';
+    sourceConfig.metadata.prerollUrl = _streamObject.assets.preroll || '';
+    sourceConfig.metadata.onScreenDebug = 'false';
+    sourceConfig.metadata.frameworkLevelDebug = 'false';
+    sourceConfig.metadata.description = sourceConfig.description || '';
+    sourceConfig.metadata.avType = npoPlayerServices.getAVType(_streamObject.stream.avType);
     return sourceConfig;
 }
 function decidePoster(streamObject, sourceConfig, streamOptions) {

package/lib/js/playeractions/handlers/processsourceconfig.test.js

@@ -0,0 +1,25 @@
+import { getSubtitleLabels } from './processsourceconfig';
+describe('getSubtitleLabels', () => {
+    it('should return the correct language label for known lang codes', () => {
+        expect(getSubtitleLabels({ lang: 'ar' })).toBe('Arabisch');
+        expect(getSubtitleLabels({ lang: 'bg' })).toBe('Bulgaars');
+        expect(getSubtitleLabels({ lang: 'de' })).toBe('Duits');
+        expect(getSubtitleLabels({ lang: 'en' })).toBe('Engels');
+        expect(getSubtitleLabels({ lang: 'es' })).toBe('Spaans');
+        expect(getSubtitleLabels({ lang: 'fr' })).toBe('Frans');
+        expect(getSubtitleLabels({ lang: 'it' })).toBe('Italiaans');
+        expect(getSubtitleLabels({ lang: 'nl' })).toBe('Nederlands');
+        expect(getSubtitleLabels({ lang: 'ma' })).toBe('Marokkaans');
+        expect(getSubtitleLabels({ lang: 'pl' })).toBe('Pools');
+        expect(getSubtitleLabels({ lang: 'ua' })).toBe('Oekraïens');
+        expect(getSubtitleLabels({ lang: 'tr' })).toBe('Turks');
+    });
+    it('should return the original label if the lang code is unknown', () => {
+        expect(getSubtitleLabels({ lang: 'jp', label: 'Japanese' })).toBe('Japanese');
+        expect(getSubtitleLabels({ lang: 'jp' })).toBe('jp');
+    });
+    it('should handle mixed case lang codes', () => {
+        expect(getSubtitleLabels({ lang: 'EN' })).toBe('Engels');
+        expect(getSubtitleLabels({ lang: 'Fr' })).toBe('Frans');
+    });
+});

package/lib/js/settings/localization.d.ts

@@ -1,6 +1,81 @@
 export declare const localizationConfig: {
     language: string;
     vocabularies: {
-        nl: Record<string, string>;
+        nl: {
+            "settings.video.quality": string;
+            "settings.audio.quality": string;
+            "settings.audio.track": string;
+            "settings.audio.mute": string;
+            "settings.audio.unmute": string;
+            "settings.audio.volume": string;
+            "settings.subtitles.window.color": string;
+            "settings.subtitles.window.opacity": string;
+            "settings.subtitles": string;
+            "settings.subtitles.font.color": string;
+            "settings.subtitles.font.opacity": string;
+            "settings.subtitles.background.color": string;
+            "settings.subtitles.background.opacity": string;
+            "colors.white": string;
+            "colors.black": string;
+            "colors.red": string;
+            "colors.green": string;
+            "colors.blue": string;
+            "colors.cyan": string;
+            "colors.yellow": string;
+            "colors.magenta": string;
+            percent: string;
+            "settings.subtitles.font.size": string;
+            "settings.subtitles.characterEdge": string;
+            "settings.subtitles.characterEdge.raised": string;
+            "settings.subtitles.characterEdge.depressed": string;
+            "settings.subtitles.characterEdge.uniform": string;
+            "settings.subtitles.characterEdge.dropshadowed": string;
+            "settings.subtitles.font.family": string;
+            "settings.subtitles.font.family.monospacedserif": string;
+            "settings.subtitles.font.family.proportionalserif": string;
+            "settings.subtitles.font.family.monospacedsansserif": string;
+            "settings.subtitles.font.family.proportionalsansserif": string;
+            "settings.subtitles.font.family.casual": string;
+            "settings.subtitles.font.family.cursive": string;
+            "settings.subtitles.font.family.smallcapital": string;
+            "settings.time.hours": string;
+            "settings.time.minutes": string;
+            "settings.time.seconds": string;
+            "ads.remainingTime": string;
+            settings: string;
+            fullscreen: string;
+            speed: string;
+            playPause: string;
+            play: string;
+            pause: string;
+            open: string;
+            close: string;
+            pictureInPicture: string;
+            appleAirplay: string;
+            googleCast: string;
+            vr: string;
+            off: string;
+            auto: string;
+            back: string;
+            reset: string;
+            replay: string;
+            normal: string;
+            default: string;
+            live: string;
+            "subtitle.example": string;
+            "subtitle.select": string;
+            playingOn: string;
+            connectingTo: string;
+            watermarkLink: string;
+            controlBar: string;
+            player: string;
+            videoPlayer: string;
+            audioPlayer: string;
+            seekBar: string;
+            "seekBar.value": string;
+            "seekBar.timeshift": string;
+            "seekBar.durationText": string;
+            "segment.unplayableTitle": string;
+        };
     };
 };

package/lib/js/settings/localization.js

@@ -1,7 +1,7 @@
-import * as nlJson from '../../lang/nl.json';
+import nlJson from '../../lang/nl.json';
 export const localizationConfig = {
     language: 'nl',
     vocabularies: {
-        nl: nlJson.default
+        nl: { ...nlJson }
     }
 };

package/lib/js/tracking/handlers/eventbinding.js

@@ -5,22 +5,24 @@ export function bindPlayerEvents(npoPlayer, player) {
     if (player == undefined)
         return;
     const isLiveStream = npoPlayer.streamObject.stream.isLiveStream;
-    let currentTime = 0;
     let isNewSource = true;
+    let data = {};
     const timeDifference = (time) => {
         if (time === undefined || time === null)
             return;
-        currentTime = isLiveStream ? +(time - Date.now() / 1000).toFixed(3) : +time.toFixed(3);
-        return currentTime;
+        const currentUnixTime = Date.now() / 1000;
+        const timeOffset = (time - currentUnixTime).toFixed(3);
+        const threeDecimalTime = time.toFixed(3);
+        const currentTime = isLiveStream ? +timeOffset : +threeDecimalTime;
+        data = { stream_position: currentTime };
     };
     const logEventHandler = (eventName) => {
         return (e) => {
-            const eventTime = e.time === undefined ? undefined : timeDifference(e.time);
-            logEvent(npoPlayer, eventName, eventTime);
+            timeDifference(e.time);
+            logEvent(npoPlayer, eventName, data);
         };
     };
     const seekHandler = (e) => {
-        let data = {};
         if (e.type === 'timeshift') {
             const timeDifferencePosition = -1 * (Date.now() / 1000 - e.position);
             const timeDifferenceTarget = -1 * (Date.now() / 1000 - e.target);
@@ -37,42 +39,48 @@ export function bindPlayerEvents(npoPlayer, player) {
         }
         logEvent(npoPlayer, 'seek', data);
     };
-    const handleSourceLoaded = () => {
+    const handleSourceLoaded = (e) => {
+        timeDifference(e.time);
         isNewSource = true;
         if (isLiveStream) {
-            logEvent(npoPlayer, 'stop');
+            logEvent(npoPlayer, 'stop', data);
         }
     };
     const handlePlay = (e) => {
+        timeDifference(e.time);
         if (!isNewSource && e.issuer !== 'ui-seek') {
-            logEvent(npoPlayer, 'resume', timeDifference(e.time));
+            logEvent(npoPlayer, 'resume', data);
         }
     };
     const pausedHandler = (e) => {
+        timeDifference(e.time);
         if (e.issuer !== 'ui-seek') {
-            logEvent(npoPlayer, 'pause', timeDifference(e.time));
+            logEvent(npoPlayer, 'pause', data);
         }
     };
     const handleTime = (e) => {
+        timeDifference(e.time);
         if (isNewSource && !npoPlayer.adBreakActive) {
-            logEvent(npoPlayer, 'start', timeDifference(e.time));
+            logEvent(npoPlayer, 'start', data);
             isNewSource = false;
         }
         else {
-            logEvent(npoPlayer, 'time', timeDifference(e.time));
+            logEvent(npoPlayer, 'time', data);
         }
     };
-    const handleViewModeChange = () => {
+    const handleViewModeChange = (e) => {
         const newViewMode = player.getViewMode();
+        timeDifference(e.time);
         if (newViewMode === ViewMode.Fullscreen) {
-            logEvent(npoPlayer, 'fullscreen', currentTime);
+            logEvent(npoPlayer, 'fullscreen', data);
         }
         else {
-            logEvent(npoPlayer, 'windowed', currentTime);
+            logEvent(npoPlayer, 'windowed', data);
         }
     };
-    const stopBeforeUnload = () => {
-        logEvent(npoPlayer, 'stop');
+    const stopBeforeUnload = (e) => {
+        timeDifference(e.time);
+        logEvent(npoPlayer, 'stop', data);
     };
     for (const [key, value] of logEventHandlers) {
         player.off(key, value);

package/lib/js/tracking/handlers/eventlogging.js

@@ -1,13 +1,8 @@
 export function logEvent(npoPlayer, event, data) {
     if (!npoPlayer.player || !npoPlayer.streamTracker || npoPlayer.adBreakActive || npoPlayer.player.isCasting())
         return;
-    try {
-        npoPlayer.player.getCurrentTime();
-    }
-    catch (error) {
-        console.warn('Er gaat iets mis met de player API', error);
-    }
-    const streamOptions = { stream_position: npoPlayer.player.getCurrentTime() };
+    if (data === undefined || Object.keys(data).length === 0)
+        data = { stream_position: 0 };
     const eventHandlers = {
         start: npoPlayer.streamTracker.start,
         buffering: npoPlayer.streamTracker.buffering,
@@ -27,5 +22,5 @@ export function logEvent(npoPlayer, event, data) {
     };
     const streamTrackerHandler = eventHandlers[event];
     npoPlayer.logEmitter.emit('logEvent', event, data);
-    streamTrackerHandler(streamOptions);
+    streamTrackerHandler(data);
 }

package/lib/js/tracking/handlers/playertrackerinit.d.ts

@@ -1,4 +1,4 @@
-import { type NPOTag } from '@npotag/tag';
+import { type NPOTag, type PageTracker } from '@npotag/tag';
 import { type InitialisationProps } from '@npotag/tag/dist/types/src/npoTag';
 import type NpoPlayer from '../../../npoplayer';
-export declare function initPlayerTracker(npoplayer: NpoPlayer, _npotag?: InitialisationProps | undefined, _npotaginstance?: NPOTag): void;
+export declare function initPlayerTracker(npoPlayer: NpoPlayer, _npoTag?: InitialisationProps, _npoTagInstance?: NPOTag, _npoTagPageTracker?: PageTracker): void;