@24i/bigscreen-sdk 1.0.4 → 1.0.5-4.alpha-2832

package/packages/driver-smartcast/src/DeviceSmartCast.ts

@@ -0,0 +1,380 @@
+import {
+    DeviceBase, ConnectionType, ScreenSaverStatus, VolumeRange,
+    IAPSuccessPayload,
+    IAPPurchaseProductData,
+} from '@24i/bigscreen-sdk/driver-base';
+import { runAsync } from '@24i/bigscreen-sdk/utils/timers';
+import { ipify } from '@24i/bigscreen-sdk/ipify';
+import { VendorType } from '@24i/smartapps-datalayer/api';
+import { getKeyMap } from './keymap';
+import {
+    ISmartCastApi,
+    IFA,
+    DEFAULT_TTS_TIMEOUT,
+    DevicePlaybackQuality,
+    DeviceLanguage,
+    PurchaseData,
+} from './types';
+
+declare const window: Window & { VIZIO: ISmartCastApi };
+
+export class DeviceSmartCast extends DeviceBase {
+    keyMap = getKeyMap();
+
+    deviceId = '';
+
+    deviceModel = '';
+
+    deviceFirmware = '';
+
+    readonly backAsBackspaceInSearch = true;
+
+    devicePlaybackQualities: DevicePlaybackQuality[] = [];
+
+    closedCaptionsStatus = false;
+
+    textToSpeechStatus = false;
+
+    textToSpeechTimeout?: null | number;
+
+    lastTextToSpeechItem?: { delay: number, text: string } | null;
+
+    deviceLanguage?: DeviceLanguage;
+
+    API?: ISmartCastApi;
+
+    IFA?: IFA;
+
+    publicIpAddress?: string;
+
+    async initDevice() {
+        this.initNetworkChangeListener();
+        this.initVisibilityChangeListener();
+        this.initMouseActiveListener();
+        await this.initPlatformApiListeners();
+    }
+
+    async initPlatformApiListeners(): Promise<void> {
+        return new Promise((resolve) => {
+            document.addEventListener('VIZIO_LIBRARY_DID_LOAD', async () => {
+                const API = window.VIZIO;
+                this.API = window.VIZIO;
+                const promises = [];
+
+                API.setClosedCaptionHandler((isEnabled: boolean) => {
+                    this.closedCaptionsStatus = isEnabled;
+                    this.triggerEvent('cctoggle', { isEnabled });
+                });
+
+                promises.push(new Promise<void>((r) => {
+                    API.setAdvertiserIDListener((advertiserID: IFA) => {
+                        this.IFA = advertiserID;
+                        r();
+                    });
+                }));
+
+                promises.push(new Promise<void>((r) => {
+                    API.getDeviceId((id: string) => {
+                        this.deviceId = id;
+                        r();
+                    });
+                }));
+
+                this.deviceModel = API.deviceModel;
+
+                promises.push(new Promise<void>((r) => {
+                    API.getFirmwareVersion((version: string) => {
+                        this.deviceFirmware = version;
+                        r();
+                    });
+                }));
+
+                promises.push(new Promise<void>((r) => {
+                    API.getDevicePlaybackQualities((qualities: DevicePlaybackQuality[]) => {
+                        this.devicePlaybackQualities = qualities;
+                        r();
+                    });
+                }));
+
+                promises.push(new Promise<void>((r) => {
+                    API.setDeviceLanguageHandler((deviceLanguage: DeviceLanguage) => {
+                        this.deviceLanguage = deviceLanguage;
+                        r();
+                    });
+                }));
+
+                // eslint-disable-next-line @typescript-eslint/no-unused-vars
+                API.setContentChangeHandler(this.handleDeeplink);
+
+                await Promise.all(promises);
+
+                resolve();
+            });
+
+            document.addEventListener('VIZIO_TTS_ENABLED', () => {
+                this.textToSpeechStatus = true;
+            }, false);
+
+            document.addEventListener('VIZIO_TTS_DISABLED', () => {
+                this.lastTextToSpeechItem = null;
+                this.textToSpeechStatus = false;
+                window.clearTimeout(this.textToSpeechTimeout as any);
+                this.API?.Chromevox.cancel();
+            }, false);
+
+            const object = document.createElement('script');
+            object.src = 'http://127.0.0.1:12345/scfs/cl/js/vizio-companion-lib.js';
+            document.body.appendChild(object);
+        });
+    }
+
+    initNetworkChangeListener() {
+        window.addEventListener('online', () => {
+            this.triggerEvent('networkchange', { isConnected: true });
+        });
+        window.addEventListener('offline', () => {
+            this.triggerEvent('networkchange', { isConnected: false });
+        });
+    }
+
+    initVisibilityChangeListener() {
+        document.addEventListener('visibilitychange', () => {
+            this.triggerEvent('visibilitychange', {
+                isVisible: document.visibilityState === 'visible',
+            });
+        });
+    }
+
+    initMouseActiveListener() {
+        document.addEventListener('mousemove', this.onMouseActive);
+    }
+
+    onMouseActive = () => {
+        document.removeEventListener('mousemove', this.onMouseActive);
+        document.addEventListener('keydown', this.onMouseInactive, true);
+        this.isMouseActive = true;
+        this.triggerEvent('mouseactive', { isMouseActive: true });
+    };
+
+    onMouseInactive = (event: KeyboardEvent) => {
+        if (!this.isDirectionalArrow(event)) return;
+        document.removeEventListener('keydown', this.onMouseInactive);
+        this.initMouseActiveListener();
+
+        // to let other handlers to use this property before change
+        runAsync(() => {
+            this.isMouseActive = false;
+        });
+        this.triggerEvent('mouseactive', { isMouseActive: false });
+    };
+
+    handleDeeplink = (deeplinkUrl: string) => {
+        if (typeof deeplinkUrl !== 'string') return;
+        const newRoute = deeplinkUrl.split('#')[1];
+        if (newRoute) {
+            const currentUrl = window.location.href.split('#')[0];
+            window.location.href = `${currentUrl}#${newRoute}`;
+        }
+    };
+
+    /**
+     * Reads provided text by the device internal reader.
+     */
+    readText({ text, delay = DEFAULT_TTS_TIMEOUT }: {
+        text: string, delay?: number
+    }) {
+        if (this.textToSpeechStatus && text) {
+            if (this.textToSpeechTimeout) {
+                this.lastTextToSpeechItem = { text, delay };
+            } else {
+                this.API?.Chromevox.play(text);
+
+                this.textToSpeechTimeout = window.setTimeout(() => {
+                    this.textToSpeechTimeout = null;
+
+                    if (this.lastTextToSpeechItem) {
+                        const last = this.lastTextToSpeechItem;
+
+                        this.API?.Chromevox.play(last.text);
+                        this.lastTextToSpeechItem = null;
+                    }
+                }, delay);
+            }
+        }
+    }
+
+    exit() {
+        this.API?.exitApplication();
+    }
+
+    reboot() {
+        window.location.reload();
+    }
+
+    /**
+     * Returns the status of Closed Captions feature.
+     */
+    async getClosedCaptionsStatus() {
+        return this.closedCaptionsStatus;
+    }
+
+    /**
+     * Returns the status of Text to Speech Engine if it is available by the device.
+     */
+    async getTextToSpeechStatus() {
+        return this.textToSpeechStatus;
+    }
+
+    /**
+     * Returns filled in Vast Tag URL.
+     */
+    async getVastTagUrl(template: string): Promise<null | string> {
+        const IFAObject = this.IFA;
+        const resolution = this.getResolution();
+
+        if (!IFAObject) return null;
+
+        this.publicIpAddress = this.publicIpAddress ?? await ipify();
+
+        return template
+            .replace('{{width}}', String(resolution.width))
+            .replace('{{height}}', String(resolution.height))
+            .replace('{{cb}}', String(Date.now()))
+            .replace('{{user_agent}}', encodeURIComponent(window.navigator.userAgent))
+            .replace('{{ifa}}', IFAObject.IFA)
+            .replace('{{ifa_type}}', IFAObject.IFA_TYPE)
+            .replace('{{ip_address}}', this.publicIpAddress!)
+            .replace('{{lmt}}', IFAObject.LMT ? '1' : '0')
+            .replace('{{us_privacy}}', IFAObject.LMT ? '1YYN' : '1YNN');
+    }
+
+    async getManufacturerName() {
+        return 'VIZIO';
+    }
+
+    async getPlatformName() {
+        return 'SmartCast';
+    }
+
+    async getPlatformVersion() {
+        return '';
+    }
+
+    async getDeviceName() {
+        return 'VIZIO SmartCast';
+    }
+
+    async getModelName() {
+        return this.deviceModel;
+    }
+
+    async getFirmware() {
+        return this.deviceFirmware;
+    }
+
+    async is4KSupported() {
+        return this.devicePlaybackQualities.includes('UHD');
+    }
+
+    async is8KSupported() {
+        return false;
+    }
+
+    async getUuid() {
+        return this.deviceId;
+    }
+
+    async getAdInfo() {
+        const adId = this.IFA?.IFA ?? null;
+        const type = this.IFA?.IFA_TYPE ?? 'vida';
+        const latEnabled = (this.IFA?.LMT !== null || this.IFA?.LMT !== undefined)
+            ? Boolean(this.IFA?.LMT)
+            : true;
+        return { adId, type, latEnabled };
+    }
+
+    async getOsLanguage() {
+        return this.deviceLanguage?.code || '';
+    }
+
+    async getVolume() {
+        return VolumeRange.UNSUPPORTED;
+    }
+
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    async setVolume(volumePercentage: number) {
+        // not supported on SmartCast platform
+    }
+
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    async mute(mute: boolean) {
+        // not supported on SmartCast platform
+    }
+
+    async isMute() {
+        return false;
+    }
+
+    async getScreenSaver() {
+        return { enabled: false };
+    }
+
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    async setScreenSaver(status: ScreenSaverStatus) {
+        // not supported on SmartCast platform
+    }
+
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    async setUserAgent(userAgent: string) {
+        return false;
+    }
+
+    async getConnectionType() {
+        return 'unknown' as ConnectionType;
+    }
+
+    async isNetworkConnected() {
+        return window.navigator.onLine;
+    }
+
+    async getLocalIP() {
+        // not supported on SmartCast platform
+        return '';
+    }
+
+    async getMacAddress() {
+        // not supported on SmartCast platform
+        return '';
+    }
+
+    registerPartner(callback: (challenge: string) => Promise<string>, appKeyId: string) {
+        this.API!.Account.registerPartner(callback, appKeyId);
+    }
+
+    async checkAndLinkTv() {
+        const isLinked = await this.API!.Account.getLinkStatus();
+        if (!isLinked) await this.API!.Account.startTVLink();
+    }
+
+    async purchaseProduct({ sku, serviceId }: IAPPurchaseProductData): Promise<IAPSuccessPayload> {
+        await this.checkAndLinkTv();
+        await this.API!.Account.getPlans({ includeBundlePlans: true });
+        const purchaseResult = await this.API!.Account.startSVODPurchase(
+            sku, serviceId ?? '',
+        );
+        const receiptPayload: PurchaseData = {
+            customerId: purchaseResult.data.customerId,
+            partnerAccountId: purchaseResult.data.partnerAccountId,
+            planCode: purchaseResult.data.planCode,
+            addOnCodes: purchaseResult.data.addOnCodes,
+            subscriptionId: purchaseResult.data.subscriptionId,
+        };
+        return { platform: VendorType.VIZIO, receiptPayload };
+    }
+
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    async cancelSubscription(data: IAPPurchaseProductData): Promise<void> {
+        // not supported
+        throw new Error('Not supported');
+    }
+}

package/packages/driver-smartcast/src/__mocks__/api.ts

@@ -0,0 +1,69 @@
+import { IFA, ISmartCastApi, DevicePlaybackQuality, DeviceLanguage } from '../types';
+
+export const deviceId = '2bd671ef-02cd-445f-9295-b3565dbaf1e8';
+export const deviceModel = 'D24f4-J01';
+export const firmware = '3.520.28.1-2';
+export const playbackQualities = ['UHD', 'HD'] as DevicePlaybackQuality[];
+// eslint-disable-next-line max-len
+export const deeplinkUrl = 'https://smartapps-bigscreen.24i.com/#/detail/SERIES/FO03OogBXRsigNB1VRz_/undefined/undefined/';
+// eslint-disable-next-line max-len
+export const deeplinkUrl2 = 'https://smartapps-bigscreen.24i.com/#/detail/SERIES/Ge1sO4gBXRsigNB1TBwy/undefined/undefined/';
+// eslint-disable-next-line max-len
+export const vastTagTemplate = 'w={{width}}&h={{height}}&did={{ifa}}&ifa_type={{ifa_type}}&lmt={{lmt}}&ip={{ip_address}}&us_privacy={{us_privacy}}';
+
+export const SmartCastMockApi: ISmartCastApi = {
+    deviceModel,
+
+    getDeviceId: (callback: (id: string) => void): void => callback(deviceId),
+
+    getFirmwareVersion: (callback: (id: string) => void): void => callback(firmware),
+
+    getDevicePlaybackQualities: (
+        callback: (
+            qualities: DevicePlaybackQuality[]
+        ) => void,
+    ): void => callback(playbackQualities),
+
+    exitApplication: (): void => {},
+
+    setClosedCaptionHandler: (callback: (isEnabled: boolean) => void): void => callback(false),
+
+    setAdvertiserIDListener: (callback: (advertiserID: IFA) => void): void => callback({
+        IFA: deviceId,
+        IFA_TYPE: 'vida',
+        LMT: 0,
+    }),
+
+    setContentChangeHandler:
+        (callback: (contentUrl: string) => void): void => callback(deeplinkUrl),
+
+    setDeviceLanguageHandler: (
+        callback: (deviceLanguage: DeviceLanguage) => void,
+    ): void => callback({ code: 'en', name: 'English' }),
+
+    Chromevox: {
+        cancel: (): void => {
+            throw new Error('Function not implemented.');
+        },
+        play: (text: string): void => {
+            // eslint-disable-next-line no-console
+            console.log(text);
+        },
+    },
+
+    Account: {
+        startSVODPurchase: async () => ({
+            id: 'id',
+            data: {
+                customerId: 'customerId',
+                partnerAccountId: 'partnerAccountId',
+                planCode: 'planCode',
+                subscriptionId: 'subscriptionId',
+            },
+        }),
+        registerPartner: jest.fn(),
+        getLinkStatus: async () => true,
+        startTVLink: async () => ({}),
+        getPlans: async () => ({ id: 'id', data: [] }),
+    },
+};

package/packages/driver-smartcast/src/index.ts

@@ -0,0 +1 @@
+export { DeviceSmartCast } from './DeviceSmartCast';

package/packages/driver-smartcast/src/keymap.ts

@@ -0,0 +1,9 @@
+import { generateKeyCodeKeyMap, overrideValues } from '@24i/bigscreen-sdk/driver-base/keymap';
+
+export const getKeyMap = () => {
+    overrideValues({
+        CHANNEL_PREVIOUS: { code: 'PrevCh', keyCode: 500 },
+        SUBTITLES: { keyCode: 204 },
+    });
+    return generateKeyCodeKeyMap();
+};

package/packages/driver-smartcast/src/types.ts

@@ -0,0 +1,102 @@
+export type ISmartCastApi = {
+    /**
+     * Sets the callback to receive the device UID in standard 32 digits.
+     */
+    getDeviceId: (callback: (id: string) => void) => void;
+
+    /**
+     * Sets the callback to receive the device firmware version.
+     */
+    getFirmwareVersion: (callback: (firmwareVersion: string) => void) => void;
+
+    /**
+     * Sets the callback to receive the device playback qualities.
+     */
+    getDevicePlaybackQualities: (callback: (qualities: DevicePlaybackQuality[]) => void) => void;
+
+    /**
+     * Exits the application.
+     */
+    exitApplication: () => void;
+
+    /**
+     * Sets the callback to receive the device CC toggle event.
+     */
+    setClosedCaptionHandler: (callback: (isEnabled: boolean) => void) => void;
+
+    /**
+     * Sets the callback to receive IFA object with the device ads related parameters.
+     */
+    setAdvertiserIDListener: (callback: (advertiserID: IFA) => void) => void;
+
+    /**
+     * Sets the callback to receive the device content change event.
+     */
+    setContentChangeHandler: (callback: (contentUrl: string) => void) => void;
+
+    /**
+     * Sets the callback to receive device language object.
+     */
+    setDeviceLanguageHandler: (callback: (deviceLanguage: DeviceLanguage) => void) => void;
+
+    Account: {
+        startSVODPurchase: (
+            planCode: string,
+            partnerAccountId: string,
+            couponCode?: string,
+            addOnCodes?: string[],
+            noFreeTrial?: boolean,
+        ) => Promise<{ id: string, data: PurchaseData }>
+        registerPartner: (callback:(challenge: string) => Promise<string>, keyId: string) => void
+        getLinkStatus: () => Promise<boolean>
+        startTVLink: () => Promise<object>
+        getPlans: (options: { includeBundlePlans?: boolean }) => Promise<{
+            id: string, data: object[]
+        }>
+    }
+
+    /**
+     * Device model.
+     */
+    deviceModel: string;
+
+    /**
+     * Chromevox Text-to-Speech accessibility playback engine.
+     */
+    Chromevox: {
+        cancel: () => void,
+        play: (text: string) => void,
+    };
+};
+/**
+ *  Data type when purchase successfull.
+ */
+
+export type PurchaseData = {
+    customerId: string,
+    partnerAccountId: string,
+    planCode: string,
+    addOnCodes?: string[],
+    subscriptionId: string
+};
+
+/**
+ * Identifier For Advertising (IFA) and Limited Tracking parameter object
+ */
+export type IFA = {
+    /** Unique identifier string for advertising */
+    IFA: string,
+    /** String value for IFA type ("vida") */
+    IFA_TYPE: string,
+    /** 0=Limited tracking not enabled, 1=Limited tracking enabled */
+    LMT: 0 | 1,
+};
+
+export type DevicePlaybackQuality = 'UHD' | 'HD' | 'SD';
+
+export const DEFAULT_TTS_TIMEOUT = 3000;
+
+export type DeviceLanguage = {
+    code: string,
+    name: string,
+};