@applicaster/zapp-react-dom-app 12.0.0-alpha.4201443043 → 12.0.0-alpha.4220424021

package/App/Loader/utils/const.js

@@ -62,6 +62,9 @@ export const PLATFORMS = {
   iphone: "iPhone",
   android: "Android",
   mobile: "Mobile",
+  vizio: "VIZIO",
+  smartcast: "SmartCast",
+  conjure: "Conjure",
 };
 
 /**

package/App/Loader/utils/platform.js

@@ -42,6 +42,36 @@ export const isSamsungPlatform = () => {
   );
 };
 
+/**
+ * Checks if we are on the Vizio platform by using the userAgent string
+ *
+ * Use this method when you need to identify the platform on runtime
+ * before the VIZIO Companion Library has loaded
+ */
+export const isVizioPlatform = () => {
+  const userAgent = getUserAgent();
+
+  const isVizioAgent =
+    userAgent.includes(PLATFORMS.vizio) ||
+    userAgent.includes(PLATFORMS.smartcast) ||
+    userAgent.includes(PLATFORMS.conjure);
+
+  return isVizioAgent;
+};
+
+/**
+ * Checks if we are on the Vizio platform by checking for the global VIZIO object
+ * and the VIZIO Companion Library. This method does not use the userAgent string,
+ * because it mainly checks whether we have access to apis, which may not be available yet
+ */
+export const hasVizioAPIs = () => {
+  const hasAPIs =
+    typeof window.VIZIO !== "undefined" &&
+    window?.applicaster?.vizioLibraryDidLoad;
+
+  return hasAPIs;
+};
+
 /**
  * platformSelect can't be used, because Platform.OS is overriden
  * by overloadReactNativePlatform and don't support 'web' value
@@ -253,6 +283,24 @@ export const getDeviceData = async () => {
         ...tizenConnectionInfo,
         device_type: getDeviceType(),
       };
+    } else if (isVizioPlatform()) {
+      deviceData = {
+        ...deviceData,
+        platform: "vizio",
+        deviceMake: "Vizio",
+        deviceType: "tv",
+        userAgent: getUserAgent(),
+        deviceWidth: window.innerWidth,
+        deviceHeight: window.innerHeight,
+      };
+
+      if (hasVizioAPIs()) {
+        window.VIZIO.getFirmwareVersion(function (firmwareVersion) {
+          deviceData.osVersion = firmwareVersion;
+        });
+
+        deviceData.deviceModel = window.VIZIO.deviceModel;
+      }
     }
 
     return deviceData;

package/index.js

@@ -1,23 +1,22 @@
 /// <reference types="@applicaster/applicaster-types" />
 import * as R from "ramda";
-import { useLocation, useHistory } from "react-router-dom";
+import { useHistory, useLocation } from "react-router-dom";
 
 import { createQuickBrickApp } from "@applicaster/quick-brick-core";
 import * as QuickBrickManager from "@applicaster/zapp-react-native-bridge/QuickBrick";
 import * as Contexts from "@applicaster/zapp-react-native-ui-components/Contexts";
 import { OfflineHandler } from "@applicaster/zapp-react-native-ui-components/Components/OfflineHandler";
 import { getXray } from "@applicaster/zapp-react-native-utils/logger";
-
-const { withXray } = getXray();
-
 import { ZappDomRouter } from "./App/Router";
 import { Layout } from "./App/Layout";
 import { SplashLoader } from "./App/Loader/SplashLoader";
 import { appLoader } from "./App/Loader";
 
-import { withInteractionManager } from "./App/InteractionManager";
+import { InteractionManager } from "./App/InteractionManager";
 import "./main.css";
 
+const { withXray } = getXray();
+
 const contextProviders = R.map(R.prop("withProvider"), R.values(Contexts));
 
 // Add DOM specific providers
@@ -33,7 +32,7 @@ export const ZappApp = createQuickBrickApp({
   QuickBrickManager,
   Layout,
   OfflineHandler,
-  InteractionManager: withInteractionManager,
+  InteractionManager,
   appLoader,
   SplashLoader,
   ContextProviders: contextProviders,

package/main.css

@@ -10,8 +10,8 @@ body {
 }
 
 div#zapp_app_container {
-  height: 100%;
-  width: 100%;
+  height: 1080px;
+  width: 1920px;
   display: flex;
   flex: 1;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/zapp-react-dom-app",
-  "version": "12.0.0-alpha.4201443043",
+  "version": "12.0.0-alpha.4220424021",
   "description": "Zapp App Component for Applicaster's Quick Brick React Native App",
   "main": "index.js",
   "scripts": {
@@ -22,18 +22,18 @@
   },
   "homepage": "https://github.com/applicaster/zapp-react-dom-app#readme",
   "dependencies": {
-    "@applicaster/zapp-react-dom-ui-components": "12.0.0-alpha.4201443043",
-    "@applicaster/zapp-react-native-bridge": "12.0.0-alpha.4201443043",
-    "@applicaster/zapp-react-native-redux": "12.0.0-alpha.4201443043",
-    "@applicaster/zapp-react-native-ui-components": "12.0.0-alpha.4201443043",
-    "@applicaster/zapp-react-native-utils": "12.0.0-alpha.4201443043",
+    "@applicaster/zapp-react-dom-ui-components": "12.0.0-alpha.4220424021",
+    "@applicaster/zapp-react-native-bridge": "12.0.0-alpha.4220424021",
+    "@applicaster/zapp-react-native-redux": "12.0.0-alpha.4220424021",
+    "@applicaster/zapp-react-native-ui-components": "12.0.0-alpha.4220424021",
+    "@applicaster/zapp-react-native-utils": "12.0.0-alpha.4220424021",
     "abortcontroller-polyfill": "^1.7.5",
     "history": "^4.7.2",
     "react-router-dom": "^5.1.2",
     "typeface-montserrat": "^0.0.54",
-    "video.js": "7.14.3",
-    "videojs-contrib-eme": "^3.8.1",
-    "videojs-contrib-quality-levels": "3.0.0"
+    "video.js": "8.21.0",
+    "videojs-contrib-eme": "^5.5.1",
+    "videojs-contrib-quality-levels": "^4.1.0"
   },
   "peerDependencies": {
     "core-js": "3.29.1",