@npo/player 1.25.0 → 1.26.0

package/lib/services/npoPlayerAPI/npoPlayerAPI.js

@@ -1,6 +1,5 @@
 import { UIManager } from 'bitmovin-player-ui';
 import { customSpecificErrorMessageOverlayConfig } from '../../js/playeractions/handlers/customerrors';
-import { handleStreamOptions } from '../streamoptionsHandlers/steamOptionsHandler';
 import { createUIContainer } from '../../ui/uicontainer';
 import { playerEventMap } from '../../types/events';
 import { VOLUME_MAX, VOLUME_MIN, VOLUME_STEP } from './contants';
@@ -46,23 +45,17 @@ export class NpoPlayerAPI {
         return this.playerAPI.getViewMode();
     }
     areSubtitlesEnabled() {
-        let subsEnabled = false;
-        const currentSubtitleTrack = this.playerAPI.subtitles.list();
-        for (const subtitle of currentSubtitleTrack) {
-            if (subtitle.enabled) {
-                subsEnabled = true;
-                break;
-            }
-        }
-        return subsEnabled;
+        return this.playerAPI.subtitles.list().some((subtitle) => subtitle.enabled);
+    }
+    getCurrentSubtitle() {
+        const currentSubtitle = this.playerAPI.subtitles.list().find((subtitle) => subtitle.enabled);
+        return currentSubtitle ? currentSubtitle.lang : undefined;
     }
-    enableSubtitles() {
+    enableSubtitles(selectedLang = 'nl') {
         const subtitleTracks = this.playerAPI.subtitles.list();
-        for (const subtitle of subtitleTracks) {
-            if (!subtitle.enabled) {
-                this.playerAPI.subtitles.enable(subtitle.id);
-                break;
-            }
+        const subtitleToEnable = subtitleTracks.find((subtitle) => subtitle.lang === selectedLang);
+        if (subtitleToEnable && !subtitleToEnable.enabled) {
+            this.playerAPI.subtitles.enable(subtitleToEnable.id);
         }
     }
     isPaused() {
@@ -138,22 +131,22 @@ export class NpoPlayerAPI {
     getActiveAdBreak() {
         return this.playerAPI.ads.getActiveAdBreak();
     }
-    discardAdBreak(adBreakId) {
-        return this.playerAPI.ads.discardAdBreak(adBreakId);
-    }
     getConfig(mergedConfig) {
         return this.playerAPI.getConfig(mergedConfig);
     }
     async createUIManager(playerContext, variant) {
-        if (playerContext.npoplayer.uiManager === undefined || variant !== playerContext.npoplayer.variant) {
+        const { npoPlayerServices } = playerContext.npoPlayer;
+        npoPlayerServices.removeUivisiblityHandlers(playerContext);
+        if (playerContext.npoPlayer.uiManager === undefined || variant !== playerContext.npoPlayer.variant) {
             const uiConfig = {
                 errorMessages: customSpecificErrorMessageOverlayConfig,
                 disableAutoHideWhenHovered: true,
                 seekbarSnappingEnabled: false
             };
-            playerContext.npoplayer.uiManager = new UIManager(this.playerAPI, createUIContainer(playerContext, this.playerAPI, variant), uiConfig);
-            playerContext.npoplayer.variant = variant;
+            playerContext.npoPlayer.variant = variant;
+            const uiManager = new UIManager(this.playerAPI, createUIContainer(playerContext, this.playerAPI, variant), uiConfig);
+            playerContext.npoPlayer.uiManager = uiManager;
+            npoPlayerServices.addUivisiblityHandlers(playerContext);
         }
-        handleStreamOptions(playerContext);
     }
 }

package/lib/services/preferences/handlePreferences.d.ts

@@ -0,0 +1,2 @@
+import { PlayerContext } from '../../types/interfaces';
+export declare function handlePreferences(playerContext: PlayerContext): void;

package/lib/services/preferences/handlePreferences.js

@@ -0,0 +1,42 @@
+import { NpoPlayerEvent } from '../../types/events';
+import { LocalStorageValues } from '../../types/interfaces';
+export function handlePreferences(playerContext) {
+    const { player, npoPlayer } = playerContext;
+    const { npoPlayerServices } = npoPlayer;
+    const handleSourceLoaded = () => {
+        const storedUserPrefs = npoPlayerServices.getStoredUserPrefs();
+        const subtitlesEnabledInPrefs = storedUserPrefs?.subtitles_enabled === 'true';
+        const preferredSubtitleLang = storedUserPrefs?.subtitles_language?.toString();
+        const shouldEnableSubtitles = npoPlayer.streamOptions.enableSubtitles || subtitlesEnabledInPrefs;
+        if (shouldEnableSubtitles) {
+            player.enableSubtitles(preferredSubtitleLang);
+        }
+    };
+    const handleSubtitleEnabled = () => {
+        const currentSubtitleTrack = player.playerAPI.subtitles.list();
+        const enabledSubtitle = currentSubtitleTrack.find((subtitle) => subtitle.enabled);
+        if (enabledSubtitle) {
+            npoPlayerServices.setStoredUserPrefs(LocalStorageValues.SUBTITLES_LANGUAGE, enabledSubtitle.lang);
+            npoPlayerServices.setStoredUserPrefs(LocalStorageValues.SUBTITLES_ENABLED, 'true');
+        }
+    };
+    const handleSubtitleDisabled = () => {
+        npoPlayerServices.setStoredUserPrefs(LocalStorageValues.SUBTITLES_ENABLED, 'false');
+    };
+    const handleVolumeChanged = () => {
+        const volume = player.getVolume();
+        npoPlayerServices.setStoredUserPrefs(LocalStorageValues.VOLUME, volume);
+    };
+    const handleMuted = () => {
+        npoPlayerServices.setStoredUserPrefs(LocalStorageValues.IS_MUTED, 'true');
+    };
+    const handleUnmuted = () => {
+        npoPlayerServices.setStoredUserPrefs(LocalStorageValues.IS_MUTED, 'false');
+    };
+    player.on(NpoPlayerEvent.SourceLoaded, handleSourceLoaded);
+    player.on(NpoPlayerEvent.SubtitleEnabled, handleSubtitleEnabled);
+    player.on(NpoPlayerEvent.SubtitleDisabled, handleSubtitleDisabled);
+    player.on(NpoPlayerEvent.VolumeChanged, handleVolumeChanged);
+    player.on(NpoPlayerEvent.Muted, handleMuted);
+    player.on(NpoPlayerEvent.Unmuted, handleUnmuted);
+}

package/lib/services/preferences/handlePreferences.test.js

@@ -0,0 +1,102 @@
+import createPlayerContextMock, { createMockNpoPlayer, createMockNpoPlayerAPI } from '../../../tests/mocks/playerContextMock';
+import { handlePreferences } from './handlePreferences';
+import { NpoPlayerEvent } from '../../types/events';
+import { LocalStorageValues } from '../../types/interfaces';
+describe('handlePreferences', () => {
+    let mockPlayerAPI;
+    let mockNpoPlayer;
+    beforeEach(() => {
+        mockPlayerAPI = createMockNpoPlayerAPI({
+            getVolume: jest.fn().mockReturnValue(50),
+            on: jest.fn(),
+            enableSubtitles: jest.fn(),
+            playerAPI: {
+                subtitles: {
+                    list: jest.fn()
+                }
+            }
+        });
+        mockNpoPlayer = createMockNpoPlayer({
+            streamOptions: {
+                enableSubtitles: false
+            },
+            npoPlayerServices: {
+                getStoredUserPrefs: jest.fn().mockReturnValue({
+                    subtitles_enabled: 'false',
+                    subtitles_language: 'nl'
+                }),
+                setStoredUserPrefs: jest.fn()
+            }
+        });
+        const playerContextMock = createPlayerContextMock({
+            player: mockPlayerAPI,
+            npoPlayer: mockNpoPlayer
+        });
+        handlePreferences(playerContextMock);
+    });
+    test('should enable subtitles if streamOptions.enableSubtitles is true', () => {
+        mockNpoPlayer.streamOptions.enableSubtitles = true;
+        for (const [event, callback] of mockPlayerAPI.on.mock.calls) {
+            if (event === NpoPlayerEvent.SourceLoaded) {
+                callback(NpoPlayerEvent.SourceLoaded);
+            }
+        }
+        expect(mockPlayerAPI.enableSubtitles).toHaveBeenCalledWith('nl');
+    });
+    test('should enable subtitles if subtitles_enabled in preferences is true', () => {
+        mockNpoPlayer.streamOptions.enableSubtitles = false;
+        mockNpoPlayer.npoPlayerServices.getStoredUserPrefs.mockReturnValueOnce({
+            subtitles_enabled: 'true',
+            subtitles_language: 'nl'
+        });
+        for (const [event, callback] of mockPlayerAPI.on.mock.calls) {
+            if (event === NpoPlayerEvent.SourceLoaded) {
+                callback(NpoPlayerEvent.SourceLoaded);
+            }
+        }
+        expect(mockPlayerAPI.enableSubtitles).toHaveBeenCalledWith('nl');
+    });
+    test('should disable subtitles and set the preferences', () => {
+        ;
+        mockPlayerAPI.playerAPI.subtitles.list.mockReturnValueOnce([{ lang: 'nl', enabled: true }]);
+        for (const [event, callback] of mockPlayerAPI.on.mock.calls) {
+            if (event === NpoPlayerEvent.SubtitleEnabled) {
+                callback(NpoPlayerEvent.SubtitleEnable);
+            }
+        }
+        expect(mockNpoPlayer.npoPlayerServices.setStoredUserPrefs).toHaveBeenCalledWith(LocalStorageValues.SUBTITLES_LANGUAGE, 'nl');
+        expect(mockNpoPlayer.npoPlayerServices.setStoredUserPrefs).toHaveBeenCalledWith(LocalStorageValues.SUBTITLES_ENABLED, 'true');
+    });
+    test('should disable subtitles and set preferences to false', () => {
+        for (const [event, callback] of mockPlayerAPI.on.mock.calls) {
+            if (event === NpoPlayerEvent.SubtitleDisabled) {
+                callback(NpoPlayerEvent.SubtitleDisabled);
+            }
+        }
+        expect(mockNpoPlayer.npoPlayerServices.setStoredUserPrefs).toHaveBeenCalledWith(LocalStorageValues.SUBTITLES_ENABLED, 'false');
+    });
+    test('should set volume preferences', () => {
+        for (const [event, callback] of mockPlayerAPI.on.mock.calls) {
+            if (event === NpoPlayerEvent.VolumeChanged) {
+                callback(NpoPlayerEvent.VolumeChanged);
+            }
+        }
+        expect(mockNpoPlayer.npoPlayerServices.setStoredUserPrefs).toHaveBeenCalledWith(LocalStorageValues.VOLUME, 50);
+    });
+    test('should set muted preferences', () => {
+        for (const [event, callback] of mockPlayerAPI.on.mock.calls) {
+            if (event === NpoPlayerEvent.Muted) {
+                callback(NpoPlayerEvent.Muted);
+            }
+        }
+        expect(mockNpoPlayer.npoPlayerServices.setStoredUserPrefs).toHaveBeenCalledWith(LocalStorageValues.IS_MUTED, 'true');
+    });
+    test('should set unmuted preferences', () => {
+        for (const [event, callback] of mockPlayerAPI.on.mock.calls) {
+            if (event === NpoPlayerEvent.Unmuted) {
+                callback(NpoPlayerEvent.Unmuted);
+            }
+        }
+        expect(mockNpoPlayer.npoPlayerServices.setStoredUserPrefs).toHaveBeenCalledWith(LocalStorageValues.IS_MUTED, 'false');
+    });
+});

package/lib/services/segmentHandlers/addSegmentEventListeners.js

@@ -4,10 +4,10 @@ import { handleSegmentSeek } from './handleSegmentSeek';
 export const addSegmentEventListeners = (playerContext, segment) => {
     const segmentHandleTimeChangedCallback = handleSegmentTimeChanged(playerContext, segment);
     const segmentSeekFunctionCallback = handleSegmentSeek(playerContext, segment);
-    const { player, npoplayer } = playerContext;
+    const { player, npoPlayer } = playerContext;
     player.on(NpoPlayerEvent.TimeChanged, segmentHandleTimeChangedCallback);
     player.on(NpoPlayerEvent.Seek, segmentSeekFunctionCallback);
-    npoplayer.eventListeners = {
+    npoPlayer.eventListeners = {
         segmentHandleTimeChangedCallback,
         segmentSeekFunctionCallback
     };

package/lib/services/segmentHandlers/addSegmentEventListeners.test.js

@@ -36,7 +36,7 @@ describe('addSegmentEventListeners', () => {
         handleSegmentTimeChanged.mockReturnValue(segmentHandleTimeChangedCallback);
         handleSegmentSeek.mockReturnValue(segmentSeekFunctionCallback);
         addSegmentEventListeners(mockPlayerContext, segment);
-        expect(mockPlayerContext.npoplayer.eventListeners).toEqual({
+        expect(mockPlayerContext.npoPlayer.eventListeners).toEqual({
             segmentHandleTimeChangedCallback,
             segmentSeekFunctionCallback
         });

package/lib/services/services.d.ts

@@ -1,6 +1,5 @@
 import { ApiPayload, Fragment, PlayerContext, Profile, Segment, TimeLineMarker, LocalStorageData, LocalStorageValues, NpoPlayerUIVariants } from '../types/interfaces';
 import { AVType } from '@npotag/tag/dist/types/src/streamTracker';
-import { UIManager } from 'bitmovin-player-ui';
 export declare class NpoPlayerServices {
     getAVType(avType: string): AVType;
     keyboardHandler(playerContext: PlayerContext, e: KeyboardEvent): void;
@@ -13,7 +12,12 @@ export declare class NpoPlayerServices {
     handleUserPrefs(playerContext: PlayerContext): void;
     setAccessibilityAttributes(playerContext: PlayerContext): void;
     schedulePreRolls(playerContext: PlayerContext): Promise<void>;
+    discardAdBreak(playerContext: PlayerContext): void;
     handleVerticalVideoControls(playerContext: PlayerContext, variant: NpoPlayerUIVariants): void;
-    showNicamAfterUiDelay(playerContext: PlayerContext | undefined, uiManager: UIManager | undefined): void;
+    showNicamAfterUiDelay(playerContext: PlayerContext | undefined): void;
     setupNicamKijkwijzerIcons(playerContext: PlayerContext): void;
+    handlePreferences(playerContext: PlayerContext): void;
+    addUivisiblityHandlers(playerContext: PlayerContext): void;
+    removeUivisiblityHandlers(playerContext: PlayerContext): void;
+    handleStreamOptions(playerContext: PlayerContext): void;
 }

package/lib/services/services.js

@@ -8,6 +8,10 @@ import { getAVType } from './avTypeHandlers/getAVType';
 import { handlePreRolls } from './advertHandlers/handlePreRolls';
 import { handleVerticalVideoControls } from './verticalVideoHandlers/handleVerticalVideoControls';
 import { setupNicamKijkwijzerIcons, showNicamAfterUiDelay } from './nicamHandlers/nicamhandler';
+import { handlePreferences } from './preferences/handlePreferences';
+import { addUivisiblityHandlers, removeUivisiblityHandlers } from './uiHandlers/uiVisiblityHandler';
+import { discardAdBreak } from './advertHandlers/discardAdBreak';
+import { handleStreamOptions } from './streamoptionsHandlers/streamOptionsHandler';
 export class NpoPlayerServices {
     getAVType(avType) {
         return getAVType(avType);
@@ -50,13 +54,28 @@ export class NpoPlayerServices {
     async schedulePreRolls(playerContext) {
         await handlePreRolls(playerContext);
     }
+    discardAdBreak(playerContext) {
+        discardAdBreak(playerContext);
+    }
     handleVerticalVideoControls(playerContext, variant) {
         return handleVerticalVideoControls(playerContext, variant);
     }
-    showNicamAfterUiDelay(playerContext, uiManager) {
-        return showNicamAfterUiDelay(playerContext, uiManager);
+    showNicamAfterUiDelay(playerContext) {
+        return showNicamAfterUiDelay(playerContext);
     }
     setupNicamKijkwijzerIcons(playerContext) {
         return setupNicamKijkwijzerIcons(playerContext);
     }
+    handlePreferences(playerContext) {
+        handlePreferences(playerContext);
+    }
+    addUivisiblityHandlers(playerContext) {
+        addUivisiblityHandlers(playerContext);
+    }
+    removeUivisiblityHandlers(playerContext) {
+        removeUivisiblityHandlers(playerContext);
+    }
+    handleStreamOptions(playerContext) {
+        handleStreamOptions(playerContext);
+    }
 }

package/lib/services/streamoptionsHandlers/{steamOptionsHandler.js → streamOptionsHandler.js}

@@ -1,11 +1,11 @@
 import * as playerAction from '../../js/playeractions/playeractions';
-import { initSegment } from '../../services/segmentHandlers/initSegment';
-import { handleLiveStreamControls } from '../../services/liveStreamHandlers/handleLiveStreamControls';
-import { removeEventListeners } from '../../services/eventListenerHandlers/removeEventListeners';
+import { initSegment } from '../segmentHandlers/initSegment';
+import { handleLiveStreamControls } from '../liveStreamHandlers/handleLiveStreamControls';
+import { removeEventListeners } from '../eventListenerHandlers/removeEventListeners';
 import { NpoPlayerEvent } from '../../types/events';
 import { updateClassFromElementByQuery } from '../../js/utilities/utilities.element';
 export function handleStreamOptions(playerContext) {
-    const { streamObject, uiManager } = playerContext.npoplayer;
+    const { streamObject, uiManager } = playerContext.npoPlayer;
     if (!streamObject || !uiManager)
         return;
     removeEventListeners(playerContext);
@@ -18,20 +18,20 @@ export function handleStreamOptions(playerContext) {
     }
 }
 export function initializeFragment(playerContext) {
-    const { streamObject, streamOptions } = playerContext.npoplayer;
+    const { streamObject, streamOptions } = playerContext.npoPlayer;
     initSegment(playerContext, {
         segment: streamObject.segment,
         fragment: streamOptions?.fragments
     });
 }
 export function handleStartOffset(playerContext) {
-    const streamOptions = playerContext.npoplayer.streamOptions;
+    const streamOptions = playerContext.npoPlayer.streamOptions;
     if (streamOptions?.startOffset) {
         playerAction.handleStartOffset(playerContext, streamOptions.startOffset);
     }
 }
 export function updateStreamClasses(playerContext) {
-    const { streamObject, container } = playerContext.npoplayer;
+    const { streamObject, container } = playerContext.npoPlayer;
     const containerClassString = '.bmpui-ui-uicontainer';
     const playerContainer = container;
     const queries = [
@@ -61,18 +61,18 @@ export function updateStreamClasses(playerContext) {
     }
 }
 function getAutoplayStatus(playerContext) {
-    return (playerContext.npoplayer.streamOptions?.autoplay ?? playerContext.player.getConfig()?.playback?.autoplay ?? false);
+    return (playerContext.npoPlayer.streamOptions?.autoplay ?? playerContext.player.getConfig()?.playback?.autoplay ?? false);
 }
 export function setupAutoplay(playerContext) {
-    const player = playerContext.player;
+    const { player } = playerContext;
     const handleAutoPlay = () => {
         doAutoPlay().catch((error) => {
             console.error('Error attempting to autoplay:', error);
         });
     };
     const doAutoPlay = async () => {
-        player.off(NpoPlayerEvent.SourceLoaded, handleAutoPlay);
+        player.off(NpoPlayerEvent.Ready, handleAutoPlay);
         await player.play();
     };
-    player.on(NpoPlayerEvent.SourceLoaded, handleAutoPlay);
+    player.on(NpoPlayerEvent.Ready, handleAutoPlay);
 }

package/lib/services/streamoptionsHandlers/streamOptionsHandler.test.js

@@ -1,4 +1,4 @@
-import { handleStreamOptions, initializeFragment, handleStartOffset, updateStreamClasses, setupAutoplay } from './steamOptionsHandler';
+import { handleStreamOptions, initializeFragment, handleStartOffset, updateStreamClasses, setupAutoplay } from './streamOptionsHandler';
 import '@testing-library/jest-dom';
 import { createMockNpoPlayer, createPlayerContextMock, createMockNpoPlayerAPI } from '../../../tests/mocks/playerContextMock';
 import * as playerAction from '../../js/playeractions/playeractions';
@@ -25,7 +25,7 @@ describe('handleStreamOptions', () => {
             on: jest.fn(),
             off: jest.fn()
         });
-        const npoplayerMock = createMockNpoPlayer({
+        const npoPlayerMock = createMockNpoPlayer({
             playerconfig: {
                 playback: {
                     muted: false,
@@ -40,7 +40,7 @@ describe('handleStreamOptions', () => {
         });
         const playerContextMock = createPlayerContextMock({
             player: mockNpoPlayerAPI,
-            npoplayer: npoplayerMock
+            npoPlayer: npoPlayerMock
         });
         handleStreamOptions(playerContextMock);
         expect(initializeFragment(playerContextMock)).toHaveBeenCalled;
@@ -49,27 +49,27 @@ describe('handleStreamOptions', () => {
         expect(setupAutoplay(playerContextMock)).toHaveBeenCalled;
     });
     it('should return early if uiManager is missing', () => {
-        const npoplayerMock = createMockNpoPlayer({
+        const npoPlayerMock = createMockNpoPlayer({
             UIManager: null
         });
         const playerContextMock = createPlayerContextMock({
-            npoplayer: npoplayerMock
+            npoPlayer: npoPlayerMock
         });
         handleStreamOptions(playerContextMock);
         expect(removeEventListeners).not.toHaveBeenCalled();
     });
     it('should return early if streamObject is missing', () => {
-        const npoplayerMock = createMockNpoPlayer({
+        const npoPlayerMock = createMockNpoPlayer({
             streamObject: null
         });
         const playerContextMock = createPlayerContextMock({
-            npoplayer: npoplayerMock
+            npoPlayer: npoPlayerMock
         });
         handleStreamOptions(playerContextMock);
         expect(removeEventListeners).not.toHaveBeenCalled();
     });
     it('should return early if autoplay is false', () => {
-        const npoplayerMock = createMockNpoPlayer({
+        const npoPlayerMock = createMockNpoPlayer({
             playerconfig: {
                 playback: {
                     muted: false,
@@ -81,7 +81,7 @@ describe('handleStreamOptions', () => {
             }
         });
         const playerContextMock = createPlayerContextMock({
-            npoplayer: npoplayerMock
+            npoPlayer: npoPlayerMock
         });
         const setupAutoplayMock = jest.fn();
         handleStreamOptions(playerContextMock);
@@ -89,7 +89,7 @@ describe('handleStreamOptions', () => {
     });
     describe('updateStreamClasses', () => {
         it('should add "livestream-no-dvr" class when isLiveStream is true and hasDvrWindow is false', () => {
-            const npoplayerMock = createMockNpoPlayer({
+            const npoPlayerMock = createMockNpoPlayer({
                 streamObject: {
                     stream: {
                         isLiveStream: true,
@@ -98,7 +98,7 @@ describe('handleStreamOptions', () => {
                 }
             });
             const playerContextMock = createPlayerContextMock({
-                npoplayer: npoplayerMock
+                npoPlayer: npoPlayerMock
             });
             updateStreamClasses(playerContextMock);
             expect(updateClassFromElementByQuery).toHaveBeenCalledWith(expect.objectContaining({
@@ -107,7 +107,7 @@ describe('handleStreamOptions', () => {
             }));
         });
         it('should add "audio-only" class when avType is "aod" or "audio"', () => {
-            const npoplayerMock = createMockNpoPlayer({
+            const npoPlayerMock = createMockNpoPlayer({
                 streamObject: {
                     stream: {
                         avType: 'aod'
@@ -115,7 +115,7 @@ describe('handleStreamOptions', () => {
                 }
             });
             const playerContextMock = createPlayerContextMock({
-                npoplayer: npoplayerMock
+                npoPlayer: npoPlayerMock
             });
             updateStreamClasses(playerContextMock);
             expect(updateClassFromElementByQuery).toHaveBeenCalledWith(expect.objectContaining({
@@ -124,7 +124,7 @@ describe('handleStreamOptions', () => {
             }));
         });
         it('should call handleLiveStreamControls when isLiveStream is true and hasDvrWindow is true', () => {
-            const npoplayerMock = createMockNpoPlayer({
+            const npoPlayerMock = createMockNpoPlayer({
                 streamObject: {
                     stream: {
                         isLiveStream: true,
@@ -133,7 +133,7 @@ describe('handleStreamOptions', () => {
                 }
             });
             const playerContextMock = createPlayerContextMock({
-                npoplayer: npoplayerMock
+                npoPlayer: npoPlayerMock
             });
             updateStreamClasses(playerContextMock);
             expect(handleLiveStreamControls).toHaveBeenCalledWith(playerContextMock);
@@ -141,12 +141,12 @@ describe('handleStreamOptions', () => {
     });
     describe('initializeFragment', () => {
         it('should call initSegment with correct parameters', () => {
-            const npoplayerMock = createMockNpoPlayer({
+            const npoPlayerMock = createMockNpoPlayer({
                 streamObject: { segment: 'segment' },
                 streamOptions: { fragments: { sections: [{ duration: 10, time: 0 }] } }
             });
             const playerContextMock = createPlayerContextMock({
-                npoplayer: npoplayerMock
+                npoPlayer: npoPlayerMock
             });
             initializeFragment(playerContextMock);
             expect(initSegment).toHaveBeenCalledWith(playerContextMock, {
@@ -157,11 +157,11 @@ describe('handleStreamOptions', () => {
     });
     describe('handleStartOffset', () => {
         it('should call handleStartOffset with correct parameters', () => {
-            const npoplayerMock = createMockNpoPlayer({
+            const npoPlayerMock = createMockNpoPlayer({
                 streamOptions: { startOffset: 10 }
             });
             const playerContextMock = createPlayerContextMock({
-                npoplayer: npoplayerMock
+                npoPlayer: npoPlayerMock
             });
             handleStartOffset(playerContextMock);
             expect(playerAction.handleStartOffset).toHaveBeenCalledWith(playerContextMock, 10);
@@ -178,7 +178,7 @@ describe('handleStreamOptions', () => {
                 player: mockNpoPlayerAPI
             });
             setupAutoplay(playerContextMock);
-            expect(playerContextMock.player.on).toHaveBeenCalledWith(NpoPlayerEvent.SourceLoaded, expect.any(Function));
+            expect(playerContextMock.player.on).toHaveBeenCalledWith(NpoPlayerEvent.Ready, expect.any(Function));
             const handleAutoPlay = playerContextMock.player.on.mock.calls[0][1];
             await handleAutoPlay();
             expect(playerContextMock.player.play).toHaveBeenCalled();

package/lib/services/uiHandlers/uiVisiblityHandler.d.ts

@@ -0,0 +1,3 @@
+import { PlayerContext } from '../../types/interfaces';
+export declare function addUivisiblityHandlers(playerContext: PlayerContext): void;
+export declare function removeUivisiblityHandlers(playerContext: PlayerContext): void;

package/lib/services/uiHandlers/uiVisiblityHandler.js

@@ -0,0 +1,26 @@
+import { NpoPlayerUIVariants } from '../../types/interfaces';
+export function addUivisiblityHandlers(playerContext) {
+    const { uiManager, variant } = playerContext.npoPlayer;
+    if (!uiManager)
+        return;
+    if (variant === NpoPlayerUIVariants.DEFAULT) {
+        uiManager.activeUi.onControlsHide.subscribe(() => {
+            playerContext.npoPlayer.logEmitter.emit('logControlsVisibilityChange', false);
+        });
+        uiManager.activeUi.onControlsShow.subscribe(() => {
+            playerContext.npoPlayer.logEmitter.emit('logControlsVisibilityChange', true);
+        });
+        uiManager.activeUi.getUI().showUi();
+    }
+}
+export function removeUivisiblityHandlers(playerContext) {
+    const { uiManager } = playerContext.npoPlayer;
+    if (!uiManager)
+        return;
+    uiManager.activeUi.onControlsHide.unsubscribe(() => {
+        playerContext.npoPlayer.logEmitter.emit('logControlsVisibilityChange', false);
+    });
+    uiManager.activeUi.onControlsShow.unsubscribe(() => {
+        playerContext.npoPlayer.logEmitter.emit('logControlsVisibilityChange', true);
+    });
+}

package/lib/services/uiHandlers/uiVisiblityHandler.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/services/uiHandlers/uiVisiblityHandler.test.js

@@ -0,0 +1,62 @@
+import createPlayerContextMock from '../../../tests/mocks/playerContextMock';
+import { addUivisiblityHandlers, removeUivisiblityHandlers } from './uiVisiblityHandler';
+import { NpoPlayerUIVariants } from '../../types/interfaces';
+import { createLogEmitterMock } from '../../../tests/mocks/mockLogEmitter';
+describe('UI Visibility Handlers', () => {
+    let mockPlayerContext;
+    let mockLogEmitter;
+    let mockUIManager;
+    beforeEach(() => {
+        mockLogEmitter = createLogEmitterMock();
+        mockUIManager = {
+            activeUi: {
+                onControlsHide: { subscribe: jest.fn(), unsubscribe: jest.fn() },
+                onControlsShow: { subscribe: jest.fn(), unsubscribe: jest.fn() },
+                getUI: jest.fn().mockReturnValue({ showUi: jest.fn() })
+            }
+        };
+        mockPlayerContext = createPlayerContextMock();
+        mockPlayerContext.npoPlayer.logEmitter = mockLogEmitter;
+        mockPlayerContext.npoPlayer.uiManager = mockUIManager;
+        mockPlayerContext.npoPlayer.variant = NpoPlayerUIVariants.DEFAULT;
+    });
+    describe('addUivisiblityHandlers', () => {
+        it('should subscribe to visibility handlers and call showUi', () => {
+            addUivisiblityHandlers(mockPlayerContext);
+            expect(mockUIManager.activeUi.onControlsHide.subscribe).toHaveBeenCalled();
+            expect(mockUIManager.activeUi.onControlsShow.subscribe).toHaveBeenCalled();
+            expect(mockUIManager.activeUi.getUI().showUi).toHaveBeenCalled();
+        });
+        it('should emit logControlsVisibilityChange when controls are shown', () => {
+            addUivisiblityHandlers(mockPlayerContext);
+            const onControlsShowCallback = mockUIManager.activeUi.onControlsShow.subscribe.mock.calls[0][0];
+            onControlsShowCallback();
+            expect(mockLogEmitter.emit).toHaveBeenCalledWith('logControlsVisibilityChange', true);
+        });
+        it('should emit logControlsVisibilityChange when controls are hidden', () => {
+            addUivisiblityHandlers(mockPlayerContext);
+            const onControlsHideCallback = mockUIManager.activeUi.onControlsHide.subscribe.mock.calls[0][0];
+            onControlsHideCallback();
+            expect(mockLogEmitter.emit).toHaveBeenCalledWith('logControlsVisibilityChange', false);
+        });
+        it('should not do anything if uiManager is not defined', () => {
+            mockPlayerContext.npoPlayer.uiManager = undefined;
+            addUivisiblityHandlers(mockPlayerContext);
+            expect(mockLogEmitter.emit).not.toHaveBeenCalled();
+        });
+    });
+    describe('removeUivisiblityHandlers', () => {
+        it('should unsubscribe from visibility handlers', () => {
+            addUivisiblityHandlers(mockPlayerContext);
+            removeUivisiblityHandlers(mockPlayerContext);
+            expect(mockUIManager.activeUi.onControlsHide.unsubscribe).toHaveBeenCalled();
+            expect(mockUIManager.activeUi.onControlsShow.unsubscribe).toHaveBeenCalled();
+        });
+        it('should not do anything if uiManager is not defined', () => {
+            mockPlayerContext.npoPlayer.uiManager = undefined;
+            removeUivisiblityHandlers(mockPlayerContext);
+            expect(mockUIManager.activeUi.onControlsHide.unsubscribe).not.toHaveBeenCalled();
+            expect(mockUIManager.activeUi.onControlsShow.unsubscribe).not.toHaveBeenCalled();
+        });
+    });
+});

package/lib/src/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/src/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/src/js/playeractions/handlers/processsourceconfig.d.ts

@@ -2,4 +2,5 @@ import { StreamObject, StreamOptions } from 'types/interfaces';
 import { SourceConfig } from 'bitmovin-player';
 import { NpoPlayerServices } from '../../../services/services';
 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/src/js/playeractions/handlers/processsourceconfig.test.d.ts

@@ -0,0 +1 @@
+export {};