pb-sxp-ui 1.0.38 → 1.0.40
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/index.cjs +38 -20
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +38 -20
- package/dist/index.js.map +1 -1
- package/dist/index.min.cjs +3 -3
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.js +3 -3
- package/dist/index.min.js.map +1 -1
- package/dist/pb-ui.js +38 -20
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +3 -3
- package/dist/pb-ui.min.js.map +1 -1
- package/es/core/components/SxpPageRender/VideoWidget/index.js +26 -18
- package/es/core/components/SxpPageRender/index.js +6 -1
- package/lib/core/components/SxpPageRender/VideoWidget/index.js +26 -18
- package/lib/core/components/SxpPageRender/index.js +6 -1
- 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
|
12092
|
-
|
12093
|
-
|
12094
|
-
|
12095
|
-
|
12096
|
-
|
12097
|
-
|
12098
|
-
|
12099
|
-
|
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
|
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
|
-
|
12126
|
-
(
|
12127
|
-
(
|
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
|
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
|
-
|
12134
|
-
(
|
12135
|
-
(
|
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
|
}, []);
|
@@ -12552,7 +12562,7 @@ const Nudge = ({ nudge }) => {
|
|
12552
12562
|
* @Author: binruan@chatlabs.com
|
12553
12563
|
* @Date: 2024-01-15 19:03:09
|
12554
12564
|
* @LastEditors: binruan@chatlabs.com
|
12555
|
-
* @LastEditTime: 2024-04-
|
12565
|
+
* @LastEditTime: 2024-04-25 17:03:41
|
12556
12566
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
12557
12567
|
*
|
12558
12568
|
*/
|
@@ -12913,7 +12923,12 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
12913
12923
|
} })),
|
12914
12924
|
renderLogo,
|
12915
12925
|
isShowFingerTip ? React.createElement(FingerSwipeTip, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon }) : null,
|
12916
|
-
React.createElement(Swiper, { ref: swiperRef,
|
12926
|
+
React.createElement(Swiper, { ref: swiperRef, onSlideChange: () => {
|
12927
|
+
swiperRef.current.swiper.allowTouchMove = false;
|
12928
|
+
setTimeout(() => {
|
12929
|
+
swiperRef.current.swiper.allowTouchMove = true;
|
12930
|
+
}, 500);
|
12931
|
+
}, onActiveIndexChange: (swiper) => {
|
12917
12932
|
setActiveIndex(swiper.activeIndex);
|
12918
12933
|
if (openHashtag)
|
12919
12934
|
return;
|
@@ -12930,6 +12945,9 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
12930
12945
|
}
|
12931
12946
|
}
|
12932
12947
|
},
|
12948
|
+
// style={{
|
12949
|
+
// pointerEvents: canSwiper ? 'auto' : 'none'
|
12950
|
+
// }}
|
12933
12951
|
// onReachEnd={() => {
|
12934
12952
|
// // 由hashtaglist跳转过来时不执行下面的方法
|
12935
12953
|
// if (waterFallData) return;
|