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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/pb-ui.js CHANGED
@@ -17677,6 +17677,7 @@ Made in Italy` })));
17677
17677
  })();
17678
17678
 
17679
17679
  const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activeIndex, videoPostConfig, videoPlayIcon, loopPlay, swiperRef }, ref) => {
17680
+ var _a, _b, _c, _d, _e;
17680
17681
  const [isPauseVideo, setIsPauseVideo] = React.useState(false);
17681
17682
  const { bffEventReport, sxpParameter, waterFallData, openHashtag, bffFbReport, isDiyH5 } = useSxpDataSource();
17682
17683
  const videoStartTime = React.useRef(0);
@@ -17694,6 +17695,11 @@ Made in Italy` })));
17694
17695
  const isFirstPlayRef = React.useRef(true);
17695
17696
  const loopPlayRef = React.useRef(loopPlay);
17696
17697
  const scene = rec.video.scene;
17698
+ 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);
17699
+ 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;
17700
+ const videoPoster = (scene === null || scene === void 0 ? void 0 : scene.mediaUrl)
17701
+ ? (_c = scene === null || scene === void 0 ? void 0 : scene.cover) !== null && _c !== void 0 ? _c : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.placeholder_image
17702
+ : (_e = (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.cover) !== null && _e !== void 0 ? _e : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.placeholder_image;
17697
17703
  React.useImperativeHandle(ref, () => {
17698
17704
  return {
17699
17705
  setLoopPlay(v) {
@@ -17714,8 +17720,7 @@ Made in Italy` })));
17714
17720
  : 'translateY(-50%)';
17715
17721
  }, [videoPostConfig]);
17716
17722
  const blurBgSrc = React.useMemo(() => {
17717
- var _a;
17718
- return ((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.cover) || firstFrameSrc;
17723
+ return videoCover || firstFrameSrc;
17719
17724
  }, [firstFrameSrc, rec]);
17720
17725
  const blurStyle = React.useMemo(() => {
17721
17726
  return blur
@@ -17750,28 +17755,27 @@ Made in Italy` })));
17750
17755
  setIsLoadFinish(true);
17751
17756
  }, []);
17752
17757
  const handleStartPlay = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
17753
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
17758
+ var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
17754
17759
  if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
17755
17760
  return;
17756
17761
  setIsPauseVideo(false);
17757
17762
  const item = data[index];
17758
- if (item && ((_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.duration)) {
17759
- videoStartTime.current = ((_b = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _b === void 0 ? void 0 : _b.currentTime) || 0;
17760
- 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);
17761
- 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);
17763
+ if (item && ((_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.duration)) {
17764
+ videoStartTime.current = ((_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.currentTime) || 0;
17765
+ const videoDuration = ((_j = (_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.duration) !== null && _j !== void 0 ? _j : 0).toFixed(2);
17766
+ const videoCurrentTime = ((_l = (_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.currentTime) !== null && _l !== void 0 ? _l : 0).toFixed(2);
17762
17767
  const playType = (isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) ? '0' : '1';
17763
17768
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
17764
- 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) + '' }))
17769
+ eventInfo: Object.assign({ eventSubject: 'playVideo', eventDescription: 'User played the video', contentId: (_o = (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId) !== null && _o !== void 0 ? _o : '', contentName: (_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.title) !== null && _q !== void 0 ? _q : '', playType, startTime: videoCurrentTime, videoDuration, contentTags: JSON.stringify((_s = (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.tags) !== null && _s !== void 0 ? _s : []), position: index + '', contentFormat: 'video', traceInfo: (_t = item === null || item === void 0 ? void 0 : item.video) === null || _t === void 0 ? void 0 : _t.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) + '' }))
17765
17770
  });
17766
17771
  isFirstPlayRef.current = false;
17767
17772
  }
17768
17773
  }), [bffEventReport, data, index, isFirstPlayRef, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
17769
17774
  const handLoadeddata = React.useCallback(() => {
17770
- var _a;
17771
17775
  if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) || firstFrameSrc || !blur)
17772
17776
  return;
17773
17777
  videoRef.current.style.objectFit = 'contain';
17774
- if (((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.cover) || !canvasRef || !canvasRef.current || isBgColor)
17778
+ if (videoCover || !canvasRef || !canvasRef.current || isBgColor)
17775
17779
  return;
17776
17780
  const setFrameImg = () => {
17777
17781
  const canvas = canvasRef === null || canvasRef === void 0 ? void 0 : canvasRef.current;
@@ -17887,7 +17891,7 @@ Made in Italy` })));
17887
17891
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
17888
17892
  if (!isActive)
17889
17893
  return;
17890
- const videoSrc = rec === null || rec === void 0 ? void 0 : rec.video.url;
17894
+ const videoSrc = videoUrl;
17891
17895
  if (!videoSrc)
17892
17896
  return;
17893
17897
  const videoPlayerWrapperNode = document.querySelector(`#${videoId}`);
@@ -17991,8 +17995,7 @@ Made in Italy` })));
17991
17995
  };
17992
17996
  }, [handleClickVideo, isActive]);
17993
17997
  const renderPoster = React.useMemo(() => {
17994
- var _a, _b;
17995
- 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) {
17998
+ if (!videoPoster || isLoadFinish) {
17996
17999
  return null;
17997
18000
  }
17998
18001
  return (React.createElement("img", { style: {
@@ -18002,8 +18005,8 @@ Made in Italy` })));
18002
18005
  width: '100%',
18003
18006
  height: '100%',
18004
18007
  objectFit: 'cover'
18005
- }, 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' }));
18006
- }, [rec, isLoadFinish, sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.placeholder_image]);
18008
+ }, src: videoPoster, alt: 'placeholder image' }));
18009
+ }, [isLoadFinish]);
18007
18010
  const renderLoading = React.useMemo(() => {
18008
18011
  if (!waiting || !isLoadFinish)
18009
18012
  return;
@@ -18023,8 +18026,7 @@ Made in Italy` })));
18023
18026
  if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
18024
18027
  return;
18025
18028
  const handleBeforeUnload = () => {
18026
- var _a;
18027
- 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) {
18029
+ if (activeIndex === index && videoUrl && (videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) && !isPauseVideo) {
18028
18030
  handleClickVideo('pause')();
18029
18031
  }
18030
18032
  };