feat(FEC-10835): expose share to plugin (#447)

Issue: share configured ui from kaltura player.
Solution: handle this config as a plugin config.

flow-typed/types/ui-component-options.js

@@ -0,0 +1,8 @@
+declare type KPUIComponentOptions = {
+  label: string,
+  presets: Array<string>,
+  area: string,
+  beforeComponent?: string,
+  afterComponent?: string,
+  replaceComponent?: string
+};

flow-typed/types/ui-component.js

@@ -1,11 +1,5 @@
 // @flow
-declare type KPUIComponent = {
-  label: string,
-  presets: Array<string>,
-  area: string,
+declare type KPUIComponent = KPUIComponentOptions & {
   get: Function,
-  props?: {},
-  beforeComponent?: string,
-  afterComponent?: string,
-  replaceComponent?: string
+  props?: {}
 };

src/common/plugins/plugins-config-store.js

@@ -48,6 +48,12 @@ const defaultConfig: dataStoreType = {
   },
   vr: {
     rootElement: '{{domRootElementId}}'
+  },
+  share: {
+    partnerId: '{{partnerId}}',
+    uiConfId: '{{uiConfId}}',
+    entryId: '{{entryId}}',
+    embedBaseUrl: '{{embedBaseUrl}}'
   }
 };
 

src/common/plugins/plugins-config.js

@@ -175,28 +175,6 @@ class ConfigEvaluator {
       _mergeConfig(options, evaluatedConfig);
     }
   }
-
-  /**
-   * @param {KPUIOptionsObject} options - UI options
-   * @param {KPOptionsObject} config - player config
-   * @return {void}
-   */
-  evaluateUIConfig(options: KPUIOptionsObject, config: KPOptionsObject): void {
-    if (options) {
-      const defaultUiConfig = {
-        components: {
-          share: {
-            shareUrl: `{{embedBaseUrl}}/index.php/extwidget/preview/partner_id/{{partnerId}}/uiconf_id/{{uiConfId}}/entry_id/{{entryId}}/embed/dynamic`,
-            embedUrl: `{{embedBaseUrl}}/p/{{partnerId}}/embedPlaykitJs/uiconf_id/{{uiConfId}}?iframeembed=true&entry_id={{entryId}}`
-          }
-        }
-      };
-      const dataModel = getModel(config);
-      const mergedConfig = Utils.Object.mergeDeep({}, defaultUiConfig, options);
-      const evaluatedConfig = _formatConfigString(evaluate(JSON.stringify(mergedConfig), dataModel));
-      _mergeConfig(options, evaluatedConfig);
-    }
-  }
 }
 
 export {ConfigEvaluator, getEncodedReferrer};

src/common/utils/setup-helpers.js

@@ -24,6 +24,7 @@ import {DEFAULT_OBSERVED_THRESHOLDS, DEFAULT_PLAYER_THRESHOLD} from './viewabili
 const setupMessages: Array<Object> = [];
 const CONTAINER_CLASS_NAME: string = 'kaltura-player-container';
 const KALTURA_PLAYER_DEBUG_QS: string = 'debugKalturaPlayer';
+const KALTURA_PLAYER_START_TIME_QS: string = 'kalturaStartTime';
 const KAVA_DEFAULT_PARTNER = 2504201;
 const KAVA_DEFAULT_IMPRESSION = `https://analytics.kaltura.com/api_v3/index.php?service=analytics&action=trackEvent&apiVersion=3.3.0&format=1&eventType=1&partnerId=${KAVA_DEFAULT_PARTNER}&entryId=1_3bwzbc9o&&eventIndex=1&position=0`;
 
@@ -181,15 +182,25 @@ function isDebugMode(): boolean {
   let isDebugMode = false;
   if (window.DEBUG_KALTURA_PLAYER === true) {
     isDebugMode = true;
-  } else if (window.URLSearchParams) {
-    const urlParams = new URLSearchParams(window.location.search);
-    isDebugMode = urlParams.has(KALTURA_PLAYER_DEBUG_QS);
   } else {
-    isDebugMode = !!getUrlParameter(KALTURA_PLAYER_DEBUG_QS);
+    isDebugMode = getUrlParameter(KALTURA_PLAYER_DEBUG_QS) === '';
   }
   return isDebugMode;
 }
 
+/**
+ * get the parameter for start time
+ * @private
+ * @param {KPOptionsObject} options - kaltura player options
+ * @returns {void}
+ */
+function maybeApplyStartTimeQueryParam(options: KPOptionsObject): void {
+  let startTime = parseFloat(getUrlParameter(KALTURA_PLAYER_START_TIME_QS));
+  if (!isNaN(startTime)) {
+    Utils.Object.createPropertyPath(options, 'sources.startTime', startTime);
+  }
+}
+
 /**
  * set the logger
  * @private
@@ -230,13 +241,24 @@ function setLogOptions(options: KPOptionsObject): void {
  * gets the url query string parameter
  * @private
  * @param {string} name - name of query string param
- * @returns {string} - value of the query string param
- */
-function getUrlParameter(name: string) {
-  name = name.replace(/[[]/, '\\[').replace(/[\]]/, '\\]');
-  const regex = new RegExp('[\\?&]' + name + '=([^&#]*)');
-  const results = regex.exec(location.search);
-  return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, ' '));
+ * @returns {?string} - value of the query string param or null if doesn't exist
+ */
+function getUrlParameter(name: string): ?string {
+  const getUrlParamPolyfill = (name: string) => {
+    name = name.replace(/[[]/, '\\[').replace(/[\]]/, '\\]');
+    const regex = new RegExp('[\\?&]' + name + '=([^&#]*)');
+    const results = regex.exec(location.search);
+    const isExist = location.search.indexOf(name) > -1;
+    return results === null ? (isExist ? '' : null) : decodeURIComponent(results[1].replace(/\+/g, ' '));
+  };
+  let value;
+  if (window.URLSearchParams) {
+    const urlParams = new URLSearchParams(window.location.search);
+    value = urlParams.get(name);
+  } else {
+    value = getUrlParamPolyfill(name);
+  }
+  return value;
 }
 
 /**
@@ -705,6 +727,7 @@ export {
   attachToFirstClick,
   validateConfig,
   setLogOptions,
+  maybeApplyStartTimeQueryParam,
   createKalturaPlayerContainer,
   checkNativeHlsSupport,
   getDefaultOptions,

src/kaltura-player.js

@@ -124,32 +124,26 @@ class KalturaPlayer extends FakeEventTarget {
     this._localPlayer.loadingMedia = true;
     this._uiWrapper.setLoadingSpinnerState(true);
     return new Promise((resolve, reject) => {
-      this._provider
-        .getMediaConfig(mediaInfo)
-        .then(
-          (providerMediaConfig: ProviderMediaConfigObject) => {
-            const mediaConfig = Utils.Object.copyDeep(providerMediaConfig);
-            if (mediaOptions) {
-              mediaConfig.sources = mediaConfig.sources || {};
-              mediaConfig.sources = Utils.Object.mergeDeep(mediaConfig.sources, mediaOptions);
-            }
-            const mergedPluginsConfigAndFromApp = mergeProviderPluginsConfig(mediaConfig.plugins, this.config.plugins);
-            mediaConfig.plugins = mergedPluginsConfigAndFromApp[0];
-            this._appPluginConfig = mergedPluginsConfigAndFromApp[1];
-            this.configure(getDefaultRedirectOptions(({sources: this.sources}: any), mediaConfig));
-            this.setMedia(mediaConfig);
-            return mediaConfig;
-          },
-          e => {
-            const error = new Error(Error.Severity.CRITICAL, Error.Category.PLAYER, Error.Code.LOAD_FAILED, e);
-            this._localPlayer.dispatchEvent(new FakeEvent(CoreEventType.ERROR, error));
-            reject(e);
+      this._provider.getMediaConfig(mediaInfo).then(
+        (providerMediaConfig: ProviderMediaConfigObject) => {
+          const mediaConfig = Utils.Object.copyDeep(providerMediaConfig);
+          if (mediaOptions) {
+            mediaConfig.sources = mediaConfig.sources || {};
+            mediaConfig.sources = Utils.Object.mergeDeep(mediaConfig.sources, mediaOptions);
           }
-        )
-        .then(mediaConfig => {
-          this._maybeSetEmbedConfig();
+          const mergedPluginsConfigAndFromApp = mergeProviderPluginsConfig(mediaConfig.plugins, this.config.plugins);
+          mediaConfig.plugins = mergedPluginsConfigAndFromApp[0];
+          this._appPluginConfig = mergedPluginsConfigAndFromApp[1];
+          this.configure(getDefaultRedirectOptions(({sources: this.sources}: any), mediaConfig));
+          this.setMedia(mediaConfig);
           resolve(mediaConfig);
-        });
+        },
+        e => {
+          const error = new Error(Error.Severity.CRITICAL, Error.Category.PLAYER, Error.Code.LOAD_FAILED, e);
+          this._localPlayer.dispatchEvent(new FakeEvent(CoreEventType.ERROR, error));
+          reject(e);
+        }
+      );
     });
   }
 
@@ -279,8 +273,7 @@ class KalturaPlayer extends FakeEventTarget {
     this._localPlayer.configure(localPlayerConfig);
     const uiConfig = config.ui;
     if (uiConfig) {
-      this._configEvaluator.evaluateUIConfig(uiConfig, this.config);
-      this._uiWrapper.setConfig(uiConfig);
+      this._uiWrapper.setConfig(configDictionary.ui);
     }
     if (config.playlist) {
       this._playlistManager.configure(config.playlist);
@@ -859,19 +852,6 @@ class KalturaPlayer extends FakeEventTarget {
     }
   }
 
-  /**
-   * set the share config
-   * @returns {void}
-   * @private
-   */
-  _maybeSetEmbedConfig(): void {
-    const ui = this.config.ui;
-    if (ui && ui.components && ui.components.share) {
-      this._configEvaluator.evaluateUIConfig(ui, this.config);
-      this._uiWrapper.setConfig(ui);
-    }
-  }
-
   attachMediaSource(): void {
     this._localPlayer.attachMediaSource();
   }

src/setup.js

@@ -6,6 +6,7 @@ import {
   applyStorageSupport,
   attachToFirstClick,
   getDefaultOptions,
+  maybeApplyStartTimeQueryParam,
   printKalturaPlayerVersionToLog,
   printSetupMessages,
   setLogOptions,
@@ -27,6 +28,7 @@ function setup(options: PartialKPOptionsObject | LegacyPartialKPOptionsObject):
   validateConfig(options);
   const defaultOptions = getDefaultOptions(options);
   setLogOptions(defaultOptions);
+  maybeApplyStartTimeQueryParam(defaultOptions);
   printSetupMessages();
   setStorageConfig(defaultOptions);
   const player = getPlayerProxy(defaultOptions);