@mottosports/motto-video-player 1.0.1-rc.27 → 1.0.1-rc.29

package/dist/index.mjs

@@ -1107,7 +1107,7 @@ import { forwardRef, useEffect as useEffect5, useRef as useRef8, useImperativeHa
 import shaka3 from "shaka-player/dist/shaka-player.ui";
 
 // src/hooks/useShakePlayer.ts
-import { useRef, useCallback } from "react";
+import { useCallback } from "react";
 import shaka from "shaka-player/dist/shaka-player.ui";
 
 // src/utils/devices.ts
@@ -1140,9 +1140,10 @@ var useShakePlayer = ({
   shakaConfig,
   drmConfig,
   onError,
-  onPlayerReady
+  onPlayerReady,
+  onBeforeLoad,
+  playerRef
 }) => {
-  const playerRef = useRef(null);
   const initializePlayer = useCallback(async (video) => {
     try {
       shaka.polyfill.installAll();
@@ -1155,6 +1156,55 @@ var useShakePlayer = ({
       if (shakaConfig) {
         player.configure(shakaConfig);
       }
+      let manifestUrl = src.url;
+      const isDRM = Boolean(src.drm);
+      let cert = null;
+      if (isDRM) {
+        const isPlayReady = isPlayReadySupported();
+        const isFairPlay = isAppleDevice();
+        if (isAppleDevice() && src.drm.fairplay?.certificate_url) {
+          const req = await fetch(src.drm.fairplay.certificate_url);
+          cert = await req.arrayBuffer();
+          manifestUrl = src.drm.fairplay.playlist_url;
+        } else if (isPlayReady && src.drm.playready?.license_url) {
+          manifestUrl = src.drm.playready.playlist_url;
+        } else {
+          manifestUrl = src.drm?.widevine?.playlist_url || "";
+        }
+        player.configure({
+          drm: {
+            servers: {
+              "com.widevine.alpha": src.drm.widevine?.license_url,
+              "com.microsoft.playready": src.drm.playready?.license_url,
+              "com.apple.fps": src.drm.fairplay?.license_url
+            },
+            ...cert && {
+              advanced: {
+                "com.apple.fps": {
+                  serverCertificate: new Uint8Array(cert)
+                }
+              }
+            }
+          }
+        });
+        const netEngine = player.getNetworkingEngine();
+        if (netEngine) {
+          netEngine.registerRequestFilter((type, request) => {
+            if (type === shaka.net.NetworkingEngine.RequestType.LICENSE) {
+              request.headers["x-dt-custom-data"] = src.drm.token;
+            }
+          });
+          netEngine.registerResponseFilter((type, response) => {
+            if (type === shaka.net.NetworkingEngine.RequestType.LICENSE) {
+              const ks = player.keySystem && player.keySystem();
+              if (ks === "com.apple.fps") {
+                const responseText = shaka.util.StringUtils.fromUTF8(response.data);
+                response.data = shaka.util.Uint8ArrayUtils.fromBase64(responseText).buffer;
+              }
+            }
+          });
+        }
+      }
       player?.addEventListener("error", (event) => {
         const error = event.detail;
         if (error?.code === 7e3) {
@@ -1163,6 +1213,8 @@ var useShakePlayer = ({
         console.error("Shaka Player Error:", error);
         onError?.(new Error(`Shaka Player Error: ${error.message || "Unknown error"}`));
       });
+      onBeforeLoad?.();
+      await player.load(manifestUrl);
       onPlayerReady?.(player);
       return player;
     } catch (error) {
@@ -1173,61 +1225,7 @@ var useShakePlayer = ({
       onError?.(error);
       throw error;
     }
-  }, [shakaConfig, drmConfig, src, onError, onPlayerReady]);
-  const loadSource = useCallback(async () => {
-    const player = playerRef.current;
-    if (!player) return;
-    let manifestUrl = src.url;
-    const isDRM = Boolean(src.drm);
-    let cert = null;
-    if (isDRM) {
-      const isPlayReady = isPlayReadySupported();
-      const isFairPlay = isAppleDevice();
-      if (isFairPlay && src.drm.fairplay?.certificate_url) {
-        const req = await fetch(src.drm.fairplay.certificate_url);
-        cert = await req.arrayBuffer();
-        manifestUrl = src.drm.fairplay.playlist_url;
-      } else if (isPlayReady && src.drm.playready?.license_url) {
-        manifestUrl = src.drm.playready.playlist_url;
-      } else {
-        manifestUrl = src.drm?.widevine?.playlist_url || "";
-      }
-      player.configure({
-        drm: {
-          servers: {
-            "com.widevine.alpha": src.drm.widevine?.license_url,
-            "com.microsoft.playready": src.drm.playready?.license_url,
-            "com.apple.fps": src.drm.fairplay?.license_url
-          },
-          ...cert && {
-            advanced: {
-              "com.apple.fps": {
-                serverCertificate: new Uint8Array(cert)
-              }
-            }
-          }
-        }
-      });
-      const netEngine = player.getNetworkingEngine();
-      if (netEngine) {
-        netEngine.registerRequestFilter((type, request) => {
-          if (type === shaka.net.NetworkingEngine.RequestType.LICENSE) {
-            request.headers["x-dt-custom-data"] = src.drm.token;
-          }
-        });
-        netEngine.registerResponseFilter((type, response) => {
-          if (type === shaka.net.NetworkingEngine.RequestType.LICENSE) {
-            const ks = player.keySystem && player.keySystem();
-            if (ks === "com.apple.fps") {
-              const responseText = shaka.util.StringUtils.fromUTF8(response.data);
-              response.data = shaka.util.Uint8ArrayUtils.fromBase64(responseText).buffer;
-            }
-          }
-        });
-      }
-    }
-    await player.load(manifestUrl);
-  }, [src]);
+  }, [shakaConfig, drmConfig, src, onError, onPlayerReady, onBeforeLoad, playerRef]);
   const destroyPlayer = useCallback(async () => {
     if (playerRef.current) {
       try {
@@ -1238,11 +1236,9 @@ var useShakePlayer = ({
         playerRef.current = null;
       }
     }
-  }, []);
+  }, [playerRef]);
   return {
-    playerRef,
     initializePlayer,
-    loadSource,
     destroyPlayer
   };
 };
@@ -1367,7 +1363,7 @@ import initShakaPlayerMux from "@mux/mux-data-shakaplayer";
 import shaka2 from "shaka-player/dist/shaka-player.ui";
 
 // package.json
-var version = "1.0.1-rc.27";
+var version = "1.0.1-rc.29";
 
 // src/hooks/useMuxAnalytics.ts
 var useMuxAnalytics = (playerRef, muxConfig, onMuxReady, onMuxDataUpdate) => {
@@ -3272,12 +3268,21 @@ var Player = forwardRef(
     const containerRef = useRef8(null);
     const adContainerRef = useRef8(null);
     useImperativeHandle(ref, () => videoRef.current, []);
-    const { playerRef, initializePlayer, loadSource, destroyPlayer } = useShakePlayer({
+    const playerRef = useRef8(null);
+    const {
+      initializeMux,
+      updateMuxData,
+      handleMuxError,
+      destroyMux
+    } = useMuxAnalytics(playerRef, muxConfig, events?.onMuxReady, events?.onMuxDataUpdate);
+    const { initializePlayer, destroyPlayer } = useShakePlayer({
       src,
       shakaConfig,
       drmConfig,
       onError: events?.onError,
-      onPlayerReady: events?.onPlayerReady
+      onPlayerReady: events?.onPlayerReady,
+      onBeforeLoad: initializeMux,
+      playerRef
     });
     const {
       getAvailableQualities,
@@ -3296,12 +3301,6 @@ var Player = forwardRef(
       skipForward,
       enabled: true
     });
-    const {
-      initializeMux,
-      updateMuxData,
-      handleMuxError,
-      destroyMux
-    } = useMuxAnalytics(playerRef, muxConfig, events?.onMuxReady, events?.onMuxDataUpdate);
     const { setupEventListeners, cleanupEventListeners } = useEventHandlers(videoRef, {
       onPlay: events?.onPlay,
       onPause: events?.onPause,
@@ -3380,8 +3379,6 @@ var Player = forwardRef(
       const initialize = async () => {
         try {
           await initializePlayer(video);
-          initializeMux();
-          await loadSource();
           setupEventListeners();
           const cleanupQuality = setupQualityTracking();
           configureQuality();
@@ -4053,7 +4050,7 @@ var Video = ({
 };
 
 // src/Event.tsx
-import { useCallback as useCallback8, useEffect as useEffect8, useState as useState4 } from "react";
+import { useCallback as useCallback9, useEffect as useEffect8, useState as useState4 } from "react";
 import { twMerge as twMerge4 } from "tailwind-merge";
 import { useQuery as useQuery2 } from "@tanstack/react-query";
 import { Fragment, jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
@@ -4264,7 +4261,7 @@ function PreEvent({
     }, 1e3);
     return () => clearInterval(interval);
   }, [date, remainingTime]);
-  const renderCountdown = useCallback8(() => {
+  const renderCountdown = useCallback9(() => {
     if (shouldBeStarted) {
       return /* @__PURE__ */ jsx10("span", { className: "text-base-content text-xl", children: t("EVENT_NOT_STARTED") });
     }