pb-sxp-ui 1.15.22-alpha.3 → 1.15.22-alpha.5

package/dist/index.cjs

@@ -17684,6 +17684,7 @@ const mountVideoPlayerAtNode = (() => {
 })();
 
 const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activeIndex, videoPostConfig, videoPlayIcon, loopPlay, swiperRef }, ref) => {
+    var _a, _b;
     const [isPauseVideo, setIsPauseVideo] = React.useState(false);
     const { bffEventReport, sxpParameter, waterFallData, openHashtag, bffFbReport, isDiyH5 } = useSxpDataSource();
     const videoStartTime = React.useRef(0);
@@ -17701,6 +17702,9 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
     const isFirstPlayRef = React.useRef(true);
     const loopPlayRef = React.useRef(loopPlay);
     const scene = rec.video.scene;
+    const videoUrl = (scene === null || scene === void 0 ? void 0 : scene.mediaUrl) || ((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.url);
+    const videoCover = (scene === null || scene === void 0 ? void 0 : scene.mediaUrl) ? scene === null || scene === void 0 ? void 0 : scene.cover : (_b = rec === null || rec === void 0 ? void 0 : rec.video) === null || _b === void 0 ? void 0 : _b.cover;
+    const videoPoster = videoCover || (sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.placeholder_image);
     React.useImperativeHandle(ref, () => {
         return {
             setLoopPlay(v) {
@@ -17721,8 +17725,7 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
             : 'translateY(-50%)';
     }, [videoPostConfig]);
     const blurBgSrc = React.useMemo(() => {
-        var _a;
-        return ((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.cover) || firstFrameSrc;
+        return videoCover || firstFrameSrc;
     }, [firstFrameSrc, rec]);
     const blurStyle = React.useMemo(() => {
         return blur
@@ -17757,28 +17760,32 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
         setIsLoadFinish(true);
     }, []);
     const handleStartPlay = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
+        var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
         if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
             return;
         setIsPauseVideo(false);
         const item = data[index];
-        if (item && ((_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.duration)) {
-            videoStartTime.current = ((_b = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _b === void 0 ? void 0 : _b.currentTime) || 0;
-            const videoDuration = ((_d = (_c = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _c === void 0 ? void 0 : _c.duration) !== null && _d !== void 0 ? _d : 0).toFixed(2);
-            const videoCurrentTime = ((_f = (_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.currentTime) !== null && _f !== void 0 ? _f : 0).toFixed(2);
+        if (item && ((_c = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _c === void 0 ? void 0 : _c.duration)) {
+            videoStartTime.current = ((_d = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _d === void 0 ? void 0 : _d.currentTime) || 0;
+            const videoDuration = ((_f = (_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.duration) !== null && _f !== void 0 ? _f : 0).toFixed(2);
+            const videoCurrentTime = ((_h = (_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.currentTime) !== null && _h !== void 0 ? _h : 0).toFixed(2);
             const playType = (isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) ? '0' : '1';
             bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
-                eventInfo: Object.assign({ eventSubject: 'playVideo', eventDescription: 'User played the video', contentId: (_h = (_g = item === null || item === void 0 ? void 0 : item.video) === null || _g === void 0 ? void 0 : _g.itemId) !== null && _h !== void 0 ? _h : '', contentName: (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.title) !== null && _k !== void 0 ? _k : '', playType, startTime: videoCurrentTime, videoDuration, contentTags: JSON.stringify((_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.tags) !== null && _m !== void 0 ? _m : []), position: index + '', contentFormat: 'video', traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo }, ((isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) && { loadTime: (loadedTimeRef === null || loadedTimeRef === void 0 ? void 0 : loadedTimeRef.current) - (initTimeRef === null || initTimeRef === void 0 ? void 0 : initTimeRef.current) + '' }))
+                eventInfo: Object.assign({ eventSubject: 'playVideo', eventDescription: 'User played the video', contentId: (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.itemId) !== null && _k !== void 0 ? _k : '', contentName: (_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.title) !== null && _m !== void 0 ? _m : '', playType, startTime: videoCurrentTime, videoDuration, contentTags: JSON.stringify((_p = (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.tags) !== null && _p !== void 0 ? _p : []), position: index + '', contentFormat: 'video', traceInfo: (_q = item === null || item === void 0 ? void 0 : item.video) === null || _q === void 0 ? void 0 : _q.traceInfo }, ((isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) && { loadTime: (loadedTimeRef === null || loadedTimeRef === void 0 ? void 0 : loadedTimeRef.current) - (initTimeRef === null || initTimeRef === void 0 ? void 0 : initTimeRef.current) + '' }))
             });
             isFirstPlayRef.current = false;
         }
     }), [bffEventReport, data, index, isFirstPlayRef, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
+    const setCurrentTimeByStartTime = React.useCallback(() => {
+        if (isDiyH5) {
+            videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
+        }
+    }, []);
     const handLoadeddata = React.useCallback(() => {
-        var _a;
         if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) || firstFrameSrc || !blur)
             return;
         videoRef.current.style.objectFit = 'contain';
-        if (((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.cover) || !canvasRef || !canvasRef.current || isBgColor)
+        if (videoCover || !canvasRef || !canvasRef.current || isBgColor)
             return;
         const setFrameImg = () => {
             const canvas = canvasRef === null || canvasRef === void 0 ? void 0 : canvasRef.current;
@@ -17798,9 +17805,7 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
     const handleLoadedmetadata = React.useCallback(() => {
         if (!videoRef.current)
             return;
-        if (isDiyH5) {
-            videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
-        }
+        setCurrentTimeByStartTime();
         loadedTimeRef.current = new Date();
         handleStartPlay();
         handLoadeddata();
@@ -17894,7 +17899,7 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
         if (!isActive)
             return;
-        const videoSrc = rec === null || rec === void 0 ? void 0 : rec.video.url;
+        const videoSrc = videoUrl;
         if (!videoSrc)
             return;
         const videoPlayerWrapperNode = document.querySelector(`#${videoId}`);
@@ -17912,7 +17917,7 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
             hls === null || hls === void 0 ? void 0 : hls.attachMedia(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current);
             hls === null || hls === void 0 ? void 0 : hls.on(Hls.Events.MANIFEST_PARSED, function () {
                 var _a;
-                videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
+                setCurrentTimeByStartTime();
                 (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
             });
         }
@@ -17998,8 +18003,7 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
         };
     }, [handleClickVideo, isActive]);
     const renderPoster = React.useMemo(() => {
-        var _a, _b;
-        if ((!((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.cover) && !(sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.placeholder_image)) || isLoadFinish) {
+        if (!videoPoster || isLoadFinish) {
             return null;
         }
         return (React.createElement("img", { style: {
@@ -18009,8 +18013,8 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
                 width: '100%',
                 height: '100%',
                 objectFit: 'cover'
-            }, src: ((_b = rec === null || rec === void 0 ? void 0 : rec.video) === null || _b === void 0 ? void 0 : _b.cover) || (sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.placeholder_image), alt: 'placeholder image' }));
-    }, [rec, isLoadFinish, sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.placeholder_image]);
+            }, src: videoPoster, alt: 'placeholder image' }));
+    }, [isLoadFinish]);
     const renderLoading = React.useMemo(() => {
         if (!waiting || !isLoadFinish)
             return;
@@ -18030,8 +18034,7 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
         if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
             return;
         const handleBeforeUnload = () => {
-            var _a;
-            if (activeIndex === index && ((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.url) && (videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) && !isPauseVideo) {
+            if (activeIndex === index && videoUrl && (videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) && !isPauseVideo) {
                 handleClickVideo('pause')();
             }
         };