pb-sxp-ui 1.0.38 → 1.0.39

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.
Files changed (15) hide show
  1. package/dist/index.cjs +28 -18
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.js +28 -18
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.min.cjs +3 -3
  6. package/dist/index.min.cjs.map +1 -1
  7. package/dist/index.min.js +3 -3
  8. package/dist/index.min.js.map +1 -1
  9. package/dist/pb-ui.js +28 -18
  10. package/dist/pb-ui.js.map +1 -1
  11. package/dist/pb-ui.min.js +3 -3
  12. package/dist/pb-ui.min.js.map +1 -1
  13. package/es/core/components/SxpPageRender/VideoWidget/index.js +26 -18
  14. package/lib/core/components/SxpPageRender/VideoWidget/index.js +26 -18
  15. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -12016,6 +12016,7 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
12016
12016
  }
12017
12017
  }, [bffEventReport, data, index, isFirstPlay]);
12018
12018
  const handleCanplay = useCallback(() => {
12019
+ handLoadeddata();
12019
12020
  setIsLoadFinish(true);
12020
12021
  }, []);
12021
12022
  const handleClickVideo = useCallback((type) => () => {
@@ -12085,21 +12086,28 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
12085
12086
  return ((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.cover) || firstFrameSrc;
12086
12087
  }, [firstFrameSrc, rec]);
12087
12088
  const handLoadeddata = useCallback(() => {
12089
+ var _a;
12088
12090
  const videoDomRef = document.getElementById(`${videoId}_html5_api`);
12089
- if (!canvasRef || !videoDomRef || !canvasRef.current)
12091
+ if (((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.cover) || !canvasRef || !videoDomRef || !canvasRef.current)
12090
12092
  return;
12091
- const video = videoDomRef;
12092
- const canvas = canvasRef === null || canvasRef === void 0 ? void 0 : canvasRef.current;
12093
- const ctx = canvas.getContext('2d');
12094
- const targetWidth = window === null || window === void 0 ? void 0 : window.innerWidth;
12095
- const targetHeight = window === null || window === void 0 ? void 0 : window.innerHeight;
12096
- canvas.height = targetHeight;
12097
- canvas.width = targetWidth;
12098
- ctx === null || ctx === void 0 ? void 0 : ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
12099
- setFirstFrameSrc(canvas.toDataURL());
12093
+ const setFrameImg = () => {
12094
+ const video = videoDomRef;
12095
+ const canvas = canvasRef === null || canvasRef === void 0 ? void 0 : canvasRef.current;
12096
+ const ctx = canvas.getContext('2d');
12097
+ const targetWidth = window === null || window === void 0 ? void 0 : window.innerWidth;
12098
+ const targetHeight = window === null || window === void 0 ? void 0 : window.innerHeight;
12099
+ canvas.height = targetHeight;
12100
+ canvas.width = targetWidth;
12101
+ ctx === null || ctx === void 0 ? void 0 : ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
12102
+ setFirstFrameSrc(canvas.toDataURL());
12103
+ };
12104
+ setFrameImg();
12105
+ setTimeout(() => {
12106
+ setFrameImg();
12107
+ }, 500);
12100
12108
  }, []);
12101
12109
  useEffect(() => {
12102
- var _a, _b, _c, _d, _e, _f;
12110
+ var _a, _b, _c, _d, _e;
12103
12111
  setIsPauseVideo(false);
12104
12112
  const videoSrc = rec.video.url;
12105
12113
  if (videoSrc && typeof TCPlayer === 'function') {
@@ -12118,21 +12126,23 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
12118
12126
  posterImage: false,
12119
12127
  bigPlayButton: true
12120
12128
  });
12129
+ videoRef.current.play();
12130
+ videoRef.current.pause();
12121
12131
  }
12122
12132
  (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.on('loadedmetadata', handleCanplay);
12123
12133
  (_b = videoRef.current) === null || _b === void 0 ? void 0 : _b.on('canplay', handleCanplay);
12124
12134
  (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.on('playing', handlePlaying);
12125
- (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.on('loadeddata', handLoadeddata);
12126
- (_e = videoRef.current) === null || _e === void 0 ? void 0 : _e.on('pause', handlePause);
12127
- (_f = videoRef.current) === null || _f === void 0 ? void 0 : _f.on('ended', handleEnded);
12135
+ // videoRef.current?.on('loadeddata', handLoadeddata);
12136
+ (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.on('pause', handlePause);
12137
+ (_e = videoRef.current) === null || _e === void 0 ? void 0 : _e.on('ended', handleEnded);
12128
12138
  return () => {
12129
- var _a, _b, _c, _d, _e, _f;
12139
+ var _a, _b, _c, _d, _e;
12130
12140
  (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.off('loadedmetadata', handleCanplay);
12131
12141
  (_b = videoRef.current) === null || _b === void 0 ? void 0 : _b.off('canplay', handleCanplay);
12132
12142
  (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.off('playing', handlePlaying);
12133
- (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.off('loadeddata', handLoadeddata);
12134
- (_e = videoRef.current) === null || _e === void 0 ? void 0 : _e.off('pause', handlePause);
12135
- (_f = videoRef.current) === null || _f === void 0 ? void 0 : _f.off('ended', handleEnded);
12143
+ // videoRef.current?.off('loadeddata', handLoadeddata);
12144
+ (_d = videoRef.current) === null || _d === void 0 ? void 0 : _d.off('pause', handlePause);
12145
+ (_e = videoRef.current) === null || _e === void 0 ? void 0 : _e.off('ended', handleEnded);
12136
12146
  videoRef.current.dispose();
12137
12147
  };
12138
12148
  }, []);