@epicgames-ps/lib-pixelstreamingfrontend-ue5.5 0.0.5

package/src/AFK/AFKController.ts

@@ -0,0 +1,158 @@
+// Copyright Epic Games, Inc. All Rights Reserved.
+
+import { Config, Flags, NumericParameters } from '../Config/Config';
+import { Logger } from '@epicgames-ps/lib-pixelstreamingcommon-ue5.5';
+import { PixelStreaming } from '../PixelStreaming/PixelStreaming';
+import {
+    AfkTimedOutEvent,
+    AfkWarningActivateEvent,
+    AfkWarningDeactivateEvent,
+    AfkWarningUpdateEvent
+} from '../Util/EventEmitter';
+
+export class AFKController {
+    // time out logic details
+    closeTimeout = 10;
+    active = false;
+    countdownActive = false;
+    warnTimer: ReturnType<typeof setTimeout> = undefined;
+    countDown = 0;
+    countDownTimer: ReturnType<typeof setInterval> = undefined;
+    config: Config;
+    pixelStreaming: PixelStreaming;
+    onDismissAfk: () => void;
+
+    onAFKTimedOutCallback: () => void;
+
+    constructor(
+        config: Config,
+        pixelStreaming: PixelStreaming,
+        onDismissAfk: () => void
+    ) {
+        this.config = config;
+        this.pixelStreaming = pixelStreaming;
+        this.onDismissAfk = onDismissAfk;
+        this.onAFKTimedOutCallback = () => {
+            console.log(
+                'AFK timed out, did you want to override this callback?'
+            );
+        };
+    }
+
+    /**
+     * The methods that occur when an afk event listener is clicked
+     */
+    onAfkClick() {
+        clearInterval(this.countDownTimer);
+
+        if (this.active || this.countdownActive) {
+            this.startAfkWarningTimer();
+            this.pixelStreaming.dispatchEvent(
+                new AfkWarningDeactivateEvent()
+            );
+        }
+    }
+
+    /**
+     * Start the warning timer if a timeout is set greater that 0 seconds
+     */
+    startAfkWarningTimer() {
+        if (
+            this.config.getNumericSettingValue(
+                NumericParameters.AFKTimeoutSecs
+            ) > 0 &&
+            this.config.isFlagEnabled(Flags.AFKDetection)
+        ) {
+            this.active = true;
+        } else {
+            this.active = false;
+        }
+        this.resetAfkWarningTimer();
+    }
+
+    /**
+     * Stop the afk warning timer
+     */
+    stopAfkWarningTimer() {
+        this.active = false;
+        this.countdownActive = false;
+        clearTimeout(this.warnTimer);
+        clearInterval(this.countDownTimer);
+    }
+
+    /**
+     * Pause the timer which when elapsed will warn the user they are inactive.
+     */
+    pauseAfkWarningTimer() {
+        this.active = false;
+    }
+
+    /**
+     * If the user interacts then reset the warning timer.
+     */
+    resetAfkWarningTimer() {
+        if (this.active && this.config.isFlagEnabled(Flags.AFKDetection)) {
+            clearTimeout(this.warnTimer);
+            this.warnTimer = setTimeout(
+                () => this.activateAfkEvent(),
+                this.config.getNumericSettingValue(
+                    NumericParameters.AFKTimeoutSecs
+                ) * 1000
+            );
+        }
+    }
+
+    /**
+     * Show the AFK overlay and begin the countDown
+     */
+    activateAfkEvent() {
+        // Pause the timer while the user is looking at the inactivity warning overlay
+        this.pauseAfkWarningTimer();
+
+        // instantiate a new overlay
+        this.pixelStreaming.dispatchEvent(
+            new AfkWarningActivateEvent({
+                countDown: this.countDown,
+                dismissAfk: this.onDismissAfk
+            })
+        );
+
+        // update our countDown timer and overlay contents
+        this.countDown = this.closeTimeout;
+        this.countdownActive = true;
+        this.pixelStreaming.dispatchEvent(
+            new AfkWarningUpdateEvent({ countDown: this.countDown })
+        );
+
+        // if we are in locked mouse exit pointerlock
+        if (!this.config.isFlagEnabled(Flags.HoveringMouseMode)) {
+            // minor hack to alleviate ios not supporting pointerlock
+            if (document.exitPointerLock) {
+                document.exitPointerLock();
+            }
+        }
+
+        // reset our countDown interval accordingly
+        this.countDownTimer = setInterval(() => {
+            this.countDown--;
+            if (this.countDown == 0) {
+                // The user failed to click so hide the overlay and disconnect them.
+                this.pixelStreaming.dispatchEvent(
+                    new AfkTimedOutEvent()
+                );
+                this.onAFKTimedOutCallback();
+                Logger.Log(
+                    Logger.GetStackTrace(),
+                    'You have been disconnected due to inactivity'
+                );
+
+                // switch off the afk feature as stream has closed
+                this.stopAfkWarningTimer();
+            } else {
+                this.pixelStreaming.dispatchEvent(
+                    new AfkWarningUpdateEvent({ countDown: this.countDown })
+                );
+            }
+        }, 1000);
+    }
+}

package/src/Config/Config.test.ts

@@ -0,0 +1,222 @@
+import { mockRTCRtpReceiver, unmockRTCRtpReceiver } from '../__test__/mockRTCRtpReceiver';
+import {
+    Config,
+    Flags,
+    FlagsKeys,
+    NumericParameters,
+    NumericParametersKeys,
+    OptionParameters,
+    OptionParametersKeys,
+    TextParameters,
+    TextParametersKeys
+} from './Config';
+
+const allFlags = Object.keys(Flags).map((key) => Flags[key as FlagsKeys]);
+const allNumericParameters = Object.keys(NumericParameters).map(
+    (key) => NumericParameters[key as NumericParametersKeys]
+);
+const allTextParameters = Object.keys(TextParameters).map(
+    (key) => TextParameters[key as TextParametersKeys]
+);
+const allOptionParameters = Object.keys(OptionParameters).map(
+    (key) => OptionParameters[key as OptionParametersKeys]
+);
+
+const allParameters = [
+    ...allFlags,
+    ...allNumericParameters,
+    ...allTextParameters,
+    ...allOptionParameters
+];
+
+describe('Config', () => {
+    beforeEach(() => {
+        mockRTCRtpReceiver();
+    });
+
+    afterEach(() => {
+        unmockRTCRtpReceiver();
+        jest.resetAllMocks();
+    });
+
+    it('should populate initial values for all settings when initialized without parameters', () => {
+        const config = new Config();
+
+        const settings = config.getSettings();
+        expect(Object.keys(settings)).toEqual(
+            expect.arrayContaining(allParameters)
+        );
+    });
+
+    it('should populate given initial setting values', () => {
+        const initialSettings = {
+            [Flags.AutoPlayVideo]: false,
+            [NumericParameters.WebRTCMaxBitrate]: 12345,
+            [TextParameters.SignallingServerUrl]: 'url'
+        };
+
+        const config = new Config({ initialSettings });
+
+        expect(config.isFlagEnabled(Flags.AutoPlayVideo)).toEqual(
+            initialSettings[Flags.AutoPlayVideo]
+        );
+        expect(
+            config.getNumericSettingValue(NumericParameters.WebRTCMaxBitrate)
+        ).toEqual(initialSettings[NumericParameters.WebRTCMaxBitrate]);
+        expect(
+            config.getTextSettingValue(TextParameters.SignallingServerUrl)
+        ).toEqual(initialSettings[TextParameters.SignallingServerUrl]);
+    });
+
+    it('should replace setting values when new settings are set with setSettings', () => {
+        const config = new Config();
+
+        const preferredCodecs = ['c1', 'c2', 'c3'];
+        config.setOptionSettingOptions(
+            OptionParameters.PreferredCodec,
+            preferredCodecs
+        );
+
+        const changedSettings = {
+            [Flags.AutoPlayVideo]: false,
+            [NumericParameters.WebRTCMaxBitrate]: 54321,
+            [TextParameters.SignallingServerUrl]: 'signalling-url',
+            [OptionParameters.PreferredCodec]: 'c2'
+        };
+
+        config.setSettings(changedSettings);
+
+        expect(config.isFlagEnabled(Flags.AutoPlayVideo)).toEqual(
+            changedSettings[Flags.AutoPlayVideo]
+        );
+        expect(
+            config.getNumericSettingValue(NumericParameters.WebRTCMaxBitrate)
+        ).toEqual(changedSettings[NumericParameters.WebRTCMaxBitrate]);
+        expect(
+            config.getTextSettingValue(TextParameters.SignallingServerUrl)
+        ).toEqual(changedSettings[TextParameters.SignallingServerUrl]);
+        expect(
+            config.getSettingOption(OptionParameters.PreferredCodec).selected
+        ).toEqual(changedSettings[OptionParameters.PreferredCodec]);
+    });
+
+    it('should replace setting values when new settings are set with set* setters', () => {
+        const config = new Config();
+
+        const preferredCodecs = ['c1', 'c2', 'c3'];
+        config.setOptionSettingOptions(
+            OptionParameters.PreferredCodec,
+            preferredCodecs
+        );
+
+        const changedSettings = {
+            [Flags.AutoPlayVideo]: false,
+            [NumericParameters.WebRTCMaxBitrate]: 54321,
+            [TextParameters.SignallingServerUrl]: 'signalling-url',
+            [OptionParameters.PreferredCodec]: 'c2'
+        };
+
+        config.setFlagEnabled(
+            Flags.AutoPlayVideo,
+            changedSettings[Flags.AutoPlayVideo]
+        );
+        config.setNumericSetting(
+            NumericParameters.WebRTCMaxBitrate,
+            changedSettings[NumericParameters.WebRTCMaxBitrate]
+        );
+        config.setTextSetting(
+            TextParameters.SignallingServerUrl,
+            changedSettings[TextParameters.SignallingServerUrl]
+        );
+        config.setOptionSettingValue(
+            OptionParameters.PreferredCodec,
+            changedSettings[OptionParameters.PreferredCodec]
+        );
+
+        expect(config.isFlagEnabled(Flags.AutoPlayVideo)).toEqual(
+            changedSettings[Flags.AutoPlayVideo]
+        );
+        expect(
+            config.getNumericSettingValue(NumericParameters.WebRTCMaxBitrate)
+        ).toEqual(changedSettings[NumericParameters.WebRTCMaxBitrate]);
+        expect(
+            config.getTextSettingValue(TextParameters.SignallingServerUrl)
+        ).toEqual(changedSettings[TextParameters.SignallingServerUrl]);
+        expect(
+            config.getSettingOption(OptionParameters.PreferredCodec).selected
+        ).toEqual(changedSettings[OptionParameters.PreferredCodec]);
+    });
+
+    it('should persist config changes to window.location URL when updateURLParams() is called', () => {
+        const config = new Config({ useUrlParams: true });
+
+        const preferredCodecs = ['c1', 'c2', 'c3'];
+        config.setOptionSettingOptions(
+            OptionParameters.PreferredCodec,
+            preferredCodecs
+        );
+
+        const changedSettings = {
+            [Flags.AutoPlayVideo]: false,
+            [NumericParameters.WebRTCMaxBitrate]: 54321,
+            [TextParameters.SignallingServerUrl]: 'signalling-url',
+            [OptionParameters.PreferredCodec]: 'c2'
+        };
+
+        config.setSettings(changedSettings);
+
+        config
+            .getFlags()
+            .find((setting) => setting.id === Flags.AutoPlayVideo)
+            ?.updateURLParams();
+        config
+            .getNumericSettings()
+            .find(
+                (setting) => setting.id === NumericParameters.WebRTCMaxBitrate
+            )
+            ?.updateURLParams();
+        config
+            .getTextSettings()
+            .find(
+                (setting) => setting.id === TextParameters.SignallingServerUrl
+            )
+            ?.updateURLParams();
+        config
+            .getOptionSettings()
+            .find((setting) => setting.id === OptionParameters.PreferredCodec)
+            ?.updateURLParams();
+
+        const urlParams = new URLSearchParams(window.location.search);
+
+        expect(urlParams.get(Flags.AutoPlayVideo)).toEqual(
+            changedSettings[Flags.AutoPlayVideo].toString()
+        );
+        expect(urlParams.get(NumericParameters.WebRTCMaxBitrate)).toEqual(
+            changedSettings[NumericParameters.WebRTCMaxBitrate].toString()
+        );
+        expect(urlParams.get(TextParameters.SignallingServerUrl)).toEqual(
+            changedSettings[TextParameters.SignallingServerUrl].toString()
+        );
+        expect(urlParams.get(OptionParameters.PreferredCodec)).toEqual(
+            changedSettings[OptionParameters.PreferredCodec].toString()
+        );
+    });
+
+    it('should read initial config from window.location URL if initialized with useUrlParams: true', () => {
+        window.history.replaceState(
+            {},
+            '',
+            'http://localhost/?AutoPlayVideo=false&WebRTCMaxBitrate=43210&ss=signalling-url-from-url-param'
+        );
+
+        const config = new Config({ useUrlParams: true });
+
+        expect(config.isFlagEnabled(Flags.AutoPlayVideo)).toEqual(false);
+        expect(
+            config.getNumericSettingValue(NumericParameters.WebRTCMaxBitrate)
+        ).toEqual(43210);
+        expect(
+            config.getTextSettingValue(TextParameters.SignallingServerUrl)
+        ).toEqual('signalling-url-from-url-param');
+    });
+});