pb-sxp-ui 1.15.22-alpha.2 → 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/index.cjs +24 -20
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +24 -20
- package/dist/index.js.map +1 -1
- package/dist/index.min.cjs +4 -4
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.js +4 -4
- package/dist/index.min.js.map +1 -1
- package/dist/pb-ui.js +24 -20
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +4 -4
- package/dist/pb-ui.min.js.map +1 -1
- package/es/core/components/SxpPageRender/VideoWidget/index.js +20 -16
- package/es/core/components/SxpPageRender/index.js +3 -3
- package/lib/core/components/SxpPageRender/VideoWidget/index.js +20 -16
- package/lib/core/components/SxpPageRender/index.js +3 -3
- package/package.json +1 -1
package/dist/index.js
CHANGED
@@ -17662,6 +17662,7 @@ const mountVideoPlayerAtNode = (() => {
|
|
17662
17662
|
})();
|
17663
17663
|
|
17664
17664
|
const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex, videoPostConfig, videoPlayIcon, loopPlay, swiperRef }, ref) => {
|
17665
|
+
var _a, _b, _c, _d, _e;
|
17665
17666
|
const [isPauseVideo, setIsPauseVideo] = useState(false);
|
17666
17667
|
const { bffEventReport, sxpParameter, waterFallData, openHashtag, bffFbReport, isDiyH5 } = useSxpDataSource();
|
17667
17668
|
const videoStartTime = useRef(0);
|
@@ -17679,6 +17680,11 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
|
|
17679
17680
|
const isFirstPlayRef = useRef(true);
|
17680
17681
|
const loopPlayRef = useRef(loopPlay);
|
17681
17682
|
const scene = rec.video.scene;
|
17683
|
+
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);
|
17684
|
+
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;
|
17685
|
+
const videoPoster = (scene === null || scene === void 0 ? void 0 : scene.mediaUrl)
|
17686
|
+
? (_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
|
17687
|
+
: (_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;
|
17682
17688
|
useImperativeHandle(ref, () => {
|
17683
17689
|
return {
|
17684
17690
|
setLoopPlay(v) {
|
@@ -17699,8 +17705,7 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
|
|
17699
17705
|
: 'translateY(-50%)';
|
17700
17706
|
}, [videoPostConfig]);
|
17701
17707
|
const blurBgSrc = useMemo(() => {
|
17702
|
-
|
17703
|
-
return ((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.cover) || firstFrameSrc;
|
17708
|
+
return videoCover || firstFrameSrc;
|
17704
17709
|
}, [firstFrameSrc, rec]);
|
17705
17710
|
const blurStyle = useMemo(() => {
|
17706
17711
|
return blur
|
@@ -17735,28 +17740,27 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
|
|
17735
17740
|
setIsLoadFinish(true);
|
17736
17741
|
}, []);
|
17737
17742
|
const handleStartPlay = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
17738
|
-
var
|
17743
|
+
var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
|
17739
17744
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
17740
17745
|
return;
|
17741
17746
|
setIsPauseVideo(false);
|
17742
17747
|
const item = data[index];
|
17743
|
-
if (item && ((
|
17744
|
-
videoStartTime.current = ((
|
17745
|
-
const videoDuration = ((
|
17746
|
-
const videoCurrentTime = ((
|
17748
|
+
if (item && ((_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.duration)) {
|
17749
|
+
videoStartTime.current = ((_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.currentTime) || 0;
|
17750
|
+
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);
|
17751
|
+
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);
|
17747
17752
|
const playType = (isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) ? '0' : '1';
|
17748
17753
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
17749
|
-
eventInfo: Object.assign({ eventSubject: 'playVideo', eventDescription: 'User played the video', contentId: (
|
17754
|
+
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) + '' }))
|
17750
17755
|
});
|
17751
17756
|
isFirstPlayRef.current = false;
|
17752
17757
|
}
|
17753
17758
|
}), [bffEventReport, data, index, isFirstPlayRef, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
17754
17759
|
const handLoadeddata = useCallback(() => {
|
17755
|
-
var _a;
|
17756
17760
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) || firstFrameSrc || !blur)
|
17757
17761
|
return;
|
17758
17762
|
videoRef.current.style.objectFit = 'contain';
|
17759
|
-
if (
|
17763
|
+
if (videoCover || !canvasRef || !canvasRef.current || isBgColor)
|
17760
17764
|
return;
|
17761
17765
|
const setFrameImg = () => {
|
17762
17766
|
const canvas = canvasRef === null || canvasRef === void 0 ? void 0 : canvasRef.current;
|
@@ -17823,6 +17827,7 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
|
|
17823
17827
|
return;
|
17824
17828
|
if (activeIndex !== index)
|
17825
17829
|
return;
|
17830
|
+
setIsPauseVideo(true);
|
17826
17831
|
const item = data[index];
|
17827
17832
|
const videoDuration = ((_b = (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.duration) !== null && _b !== void 0 ? _b : 0).toFixed(2);
|
17828
17833
|
const videoCurrentTime = ((_d = (_c = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _c === void 0 ? void 0 : _c.currentTime) !== null && _d !== void 0 ? _d : 0).toFixed(2);
|
@@ -17871,7 +17876,7 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
|
|
17871
17876
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
17872
17877
|
if (!isActive)
|
17873
17878
|
return;
|
17874
|
-
const videoSrc =
|
17879
|
+
const videoSrc = videoUrl;
|
17875
17880
|
if (!videoSrc)
|
17876
17881
|
return;
|
17877
17882
|
const videoPlayerWrapperNode = document.querySelector(`#${videoId}`);
|
@@ -17975,7 +17980,7 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
|
|
17975
17980
|
};
|
17976
17981
|
}, [handleClickVideo, isActive]);
|
17977
17982
|
const renderPoster = useMemo(() => {
|
17978
|
-
if (!
|
17983
|
+
if (!videoPoster || isLoadFinish) {
|
17979
17984
|
return null;
|
17980
17985
|
}
|
17981
17986
|
return (React.createElement("img", { style: {
|
@@ -17985,8 +17990,8 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
|
|
17985
17990
|
width: '100%',
|
17986
17991
|
height: '100%',
|
17987
17992
|
objectFit: 'cover'
|
17988
|
-
}, src:
|
17989
|
-
}, [isLoadFinish
|
17993
|
+
}, src: videoPoster, alt: 'placeholder image' }));
|
17994
|
+
}, [isLoadFinish]);
|
17990
17995
|
const renderLoading = useMemo(() => {
|
17991
17996
|
if (!waiting || !isLoadFinish)
|
17992
17997
|
return;
|
@@ -18006,8 +18011,7 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
|
|
18006
18011
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
18007
18012
|
return;
|
18008
18013
|
const handleBeforeUnload = () => {
|
18009
|
-
|
18010
|
-
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) {
|
18014
|
+
if (activeIndex === index && videoUrl && (videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) && !isPauseVideo) {
|
18011
18015
|
handleClickVideo('pause')();
|
18012
18016
|
}
|
18013
18017
|
};
|
@@ -18508,7 +18512,7 @@ var NavBack$1 = memo(NavBack);
|
|
18508
18512
|
* @Author: binruan@chatlabs.com
|
18509
18513
|
* @Date: 2024-03-20 10:27:31
|
18510
18514
|
* @LastEditors: binruan@chatlabs.com
|
18511
|
-
* @LastEditTime: 2025-05-
|
18515
|
+
* @LastEditTime: 2025-05-07 13:33:18
|
18512
18516
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
18513
18517
|
*
|
18514
18518
|
*/
|
@@ -18703,7 +18707,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18703
18707
|
}, [minusHeight, containerHeight, tagHeight]);
|
18704
18708
|
const visList = useMemo(() => {
|
18705
18709
|
var _a;
|
18706
|
-
const list = activeIndex === 0 && !waterFallData && !isEditor
|
18710
|
+
const list = activeIndex === 0 && !waterFallData && !isEditor && !isDiyH5
|
18707
18711
|
? [(_a = data === null || data === void 0 ? void 0 : data[0]) !== null && _a !== void 0 ? _a : null]
|
18708
18712
|
: data === null || data === void 0 ? void 0 : data.map((item, index) => {
|
18709
18713
|
if (activeIndex === index || index - 1 === activeIndex || index + 1 === activeIndex) {
|
@@ -18715,8 +18719,8 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18715
18719
|
});
|
18716
18720
|
if (!(list === null || list === void 0 ? void 0 : list.length))
|
18717
18721
|
return [];
|
18718
|
-
return !waterFallData && !isNoMoreData ? list.concat([{ loading: true }]) : list;
|
18719
|
-
}, [data, activeIndex, waterFallData, isEditor, isNoMoreData]);
|
18722
|
+
return !waterFallData && !isNoMoreData && !isDiyH5 ? list.concat([{ loading: true }]) : list;
|
18723
|
+
}, [data, activeIndex, waterFallData, isEditor, isNoMoreData, isDiyH5]);
|
18720
18724
|
const renderLogo = useMemo(() => {
|
18721
18725
|
var _a, _b, _c, _d;
|
18722
18726
|
if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.logoUrl) && (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowLogo)) {
|