pb-sxp-ui 1.16.12 → 1.16.13

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 (33) hide show
  1. package/dist/index.cjs +181 -130
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.js +181 -130
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.min.cjs +6 -6
  6. package/dist/index.min.cjs.map +1 -1
  7. package/dist/index.min.js +6 -6
  8. package/dist/index.min.js.map +1 -1
  9. package/dist/pb-ui.js +181 -130
  10. package/dist/pb-ui.js.map +1 -1
  11. package/dist/pb-ui.min.js +6 -6
  12. package/dist/pb-ui.min.js.map +1 -1
  13. package/es/core/components/DiyPortalPreview/VideoWidget.js +10 -8
  14. package/es/core/components/SxpPageRender/LikeButton/index.js +17 -15
  15. package/es/core/components/SxpPageRender/PictureGroup/index.d.ts +5 -0
  16. package/es/core/components/SxpPageRender/PictureGroup/index.js +39 -13
  17. package/es/core/components/SxpPageRender/VideoWidget/index.js +32 -45
  18. package/es/core/components/SxpPageRender/WaterFall/index.js +4 -3
  19. package/es/core/components/SxpPageRender/index.js +53 -37
  20. package/es/core/context/SxpDataSourceProvider.d.ts +1 -0
  21. package/es/core/context/SxpDataSourceProvider.js +20 -4
  22. package/es/core/hooks/useEventReport.js +6 -5
  23. package/lib/core/components/DiyPortalPreview/VideoWidget.js +10 -8
  24. package/lib/core/components/SxpPageRender/LikeButton/index.js +17 -15
  25. package/lib/core/components/SxpPageRender/PictureGroup/index.d.ts +5 -0
  26. package/lib/core/components/SxpPageRender/PictureGroup/index.js +38 -12
  27. package/lib/core/components/SxpPageRender/VideoWidget/index.js +32 -45
  28. package/lib/core/components/SxpPageRender/WaterFall/index.js +4 -3
  29. package/lib/core/components/SxpPageRender/index.js +53 -37
  30. package/lib/core/context/SxpDataSourceProvider.d.ts +1 -0
  31. package/lib/core/context/SxpDataSourceProvider.js +20 -4
  32. package/lib/core/hooks/useEventReport.js +6 -5
  33. package/package.json +1 -1
@@ -22,7 +22,7 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
22
22
  }, []);
23
23
  const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
24
24
  const handlePlaying = useCallback(() => {
25
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
25
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
26
26
  setIsPauseVideo(false);
27
27
  const item = data[index];
28
28
  if (item && ((_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.duration)) {
@@ -35,14 +35,15 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
35
35
  eventSubject: 'playVideo',
36
36
  eventDescription: 'User played the video',
37
37
  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 : '',
38
- 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 : '',
38
+ sceneId: (_l = (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.scene) === null || _k === void 0 ? void 0 : _k.sceneId) !== null && _l !== void 0 ? _l : '',
39
+ contentName: (_o = (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.title) !== null && _o !== void 0 ? _o : '',
39
40
  playType,
40
41
  startTime: videoCurrentTime,
41
42
  videoDuration,
42
- 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 : []),
43
+ contentTags: JSON.stringify((_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.tags) !== null && _q !== void 0 ? _q : []),
43
44
  position: index + '',
44
45
  contentFormat: 'video',
45
- traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo
46
+ traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
46
47
  }
47
48
  });
48
49
  setIsFirstPlay(false);
@@ -81,7 +82,7 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
81
82
  }
82
83
  }, [isLoadFinish]);
83
84
  const onPause = useCallback(() => {
84
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
85
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
85
86
  const item = data[index];
86
87
  const videoDuration = ((_b = (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.duration) !== null && _b !== void 0 ? _b : 0).toFixed(2);
87
88
  const videoCurrentTime = ((_d = (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.currentTime) !== null && _d !== void 0 ? _d : 0).toFixed(2);
@@ -92,14 +93,15 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
92
93
  eventSubject: 'playOverVideo',
93
94
  eventDescription: 'User finished playing the video',
94
95
  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 : '',
95
- 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 : '',
96
+ sceneId: (_l = (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.scene) === null || _k === void 0 ? void 0 : _k.sceneId) !== null && _l !== void 0 ? _l : '',
97
+ contentName: (_o = (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.title) !== null && _o !== void 0 ? _o : '',
96
98
  endTime: videoCurrentTime,
97
99
  videoDuration,
98
100
  playDuration,
99
- 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 : []),
101
+ contentTags: JSON.stringify((_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.tags) !== null && _q !== void 0 ? _q : []),
100
102
  position: index + '',
101
103
  contentFormat: 'video',
102
- traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo
104
+ traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
103
105
  }
104
106
  });
105
107
  }
@@ -13,7 +13,7 @@ const LikeButton = (_a) => {
13
13
  const likeIcon = useIconLink(defaultLikeIconPath);
14
14
  const unlikeIcon = useIconLink(defaultUnLikeIconPath);
15
15
  const handleClick = debounce(() => __awaiter(void 0, void 0, void 0, function* () {
16
- var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
16
+ var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5;
17
17
  if (state) {
18
18
  setState(false);
19
19
  const result = (_e = (yield (mutateUnlike === null || mutateUnlike === void 0 ? void 0 : mutateUnlike({ videoItemId: (_d = (_c = recData === null || recData === void 0 ? void 0 : recData.video) === null || _c === void 0 ? void 0 : _c.itemId) !== null && _d !== void 0 ? _d : '' })))) !== null && _e !== void 0 ? _e : false;
@@ -22,51 +22,53 @@ const LikeButton = (_a) => {
22
22
  eventSubject: 'favoriteContentCanceled',
23
23
  eventDescription: 'This content was unfavorite by the user',
24
24
  contentId: (_g = (_f = recData === null || recData === void 0 ? void 0 : recData.video) === null || _f === void 0 ? void 0 : _f.itemId) !== null && _g !== void 0 ? _g : '',
25
- contentName: (_j = (_h = recData === null || recData === void 0 ? void 0 : recData.video) === null || _h === void 0 ? void 0 : _h.title) !== null && _j !== void 0 ? _j : '',
26
- contentTags: JSON.stringify((_l = (_k = recData === null || recData === void 0 ? void 0 : recData.video) === null || _k === void 0 ? void 0 : _k.tags) !== null && _l !== void 0 ? _l : []),
25
+ sceneId: (_k = (_j = (_h = recData === null || recData === void 0 ? void 0 : recData.video) === null || _h === void 0 ? void 0 : _h.scene) === null || _j === void 0 ? void 0 : _j.sceneId) !== null && _k !== void 0 ? _k : '',
26
+ contentName: (_m = (_l = recData === null || recData === void 0 ? void 0 : recData.video) === null || _l === void 0 ? void 0 : _l.title) !== null && _m !== void 0 ? _m : '',
27
+ contentTags: JSON.stringify((_p = (_o = recData === null || recData === void 0 ? void 0 : recData.video) === null || _o === void 0 ? void 0 : _o.tags) !== null && _p !== void 0 ? _p : []),
27
28
  position: position + '',
28
- contentFormat: ((_m = recData === null || recData === void 0 ? void 0 : recData.video) === null || _m === void 0 ? void 0 : _m.url) ? 'video' : 'image',
29
- traceInfo: (_o = recData === null || recData === void 0 ? void 0 : recData.video) === null || _o === void 0 ? void 0 : _o.traceInfo
29
+ contentFormat: ((_q = recData === null || recData === void 0 ? void 0 : recData.video) === null || _q === void 0 ? void 0 : _q.url) ? 'video' : 'image',
30
+ traceInfo: (_r = recData === null || recData === void 0 ? void 0 : recData.video) === null || _r === void 0 ? void 0 : _r.traceInfo
30
31
  }
31
32
  });
32
33
  if (!result) {
33
34
  setState(true);
34
35
  }
35
36
  else {
36
- const nRtcList = (_p = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
37
+ const nRtcList = (_s = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
37
38
  if (index === position) {
38
39
  item.isCollected = false;
39
40
  }
40
41
  return item;
41
- })) !== null && _p !== void 0 ? _p : [];
42
+ })) !== null && _s !== void 0 ? _s : [];
42
43
  setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
43
44
  }
44
45
  }
45
46
  else {
46
47
  setState(true);
47
- const result = (_q = (yield (mutateLike === null || mutateLike === void 0 ? void 0 : mutateLike({ content: JSON.stringify(recData) })))) !== null && _q !== void 0 ? _q : false;
48
+ const result = (_t = (yield (mutateLike === null || mutateLike === void 0 ? void 0 : mutateLike({ content: JSON.stringify(recData) })))) !== null && _t !== void 0 ? _t : false;
48
49
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
49
50
  eventInfo: {
50
51
  eventSubject: 'favoriteContent',
51
52
  eventDescription: 'This content was favorite by the user',
52
- contentId: (_s = (_r = recData === null || recData === void 0 ? void 0 : recData.video) === null || _r === void 0 ? void 0 : _r.itemId) !== null && _s !== void 0 ? _s : '',
53
- contentName: (_u = (_t = recData === null || recData === void 0 ? void 0 : recData.video) === null || _t === void 0 ? void 0 : _t.title) !== null && _u !== void 0 ? _u : '',
54
- contentTags: JSON.stringify((_w = (_v = recData === null || recData === void 0 ? void 0 : recData.video) === null || _v === void 0 ? void 0 : _v.tags) !== null && _w !== void 0 ? _w : []),
53
+ contentId: (_v = (_u = recData === null || recData === void 0 ? void 0 : recData.video) === null || _u === void 0 ? void 0 : _u.itemId) !== null && _v !== void 0 ? _v : '',
54
+ sceneId: (_y = (_x = (_w = recData === null || recData === void 0 ? void 0 : recData.video) === null || _w === void 0 ? void 0 : _w.scene) === null || _x === void 0 ? void 0 : _x.sceneId) !== null && _y !== void 0 ? _y : '',
55
+ contentName: (_0 = (_z = recData === null || recData === void 0 ? void 0 : recData.video) === null || _z === void 0 ? void 0 : _z.title) !== null && _0 !== void 0 ? _0 : '',
56
+ contentTags: JSON.stringify((_2 = (_1 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _1 === void 0 ? void 0 : _1.tags) !== null && _2 !== void 0 ? _2 : []),
55
57
  position: position + '',
56
- contentFormat: ((_x = recData === null || recData === void 0 ? void 0 : recData.video) === null || _x === void 0 ? void 0 : _x.url) ? 'video' : 'image',
57
- traceInfo: (_y = recData === null || recData === void 0 ? void 0 : recData.video) === null || _y === void 0 ? void 0 : _y.traceInfo
58
+ contentFormat: ((_3 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _3 === void 0 ? void 0 : _3.url) ? 'video' : 'image',
59
+ traceInfo: (_4 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _4 === void 0 ? void 0 : _4.traceInfo
58
60
  }
59
61
  });
60
62
  if (!result) {
61
63
  setState(false);
62
64
  }
63
65
  else {
64
- const nRtcList = (_z = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
66
+ const nRtcList = (_5 = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
65
67
  if (index === position) {
66
68
  item.isCollected = true;
67
69
  }
68
70
  return item;
69
- })) !== null && _z !== void 0 ? _z : [];
71
+ })) !== null && _5 !== void 0 ? _5 : [];
70
72
  setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
71
73
  }
72
74
  }
@@ -12,6 +12,11 @@ interface IPictureGroupProps {
12
12
  loadTime: string;
13
13
  }, enableCapi?: boolean) => void;
14
14
  imgUrlsPostConfig?: postConfigType;
15
+ data: RecItemType[];
16
+ swiperRef?: any;
17
+ }
18
+ export interface IPictureGroupRef {
19
+ setLoopPlay: (v: boolean) => void;
15
20
  }
16
21
  declare const _default: React.NamedExoticComponent<IPictureGroupProps>;
17
22
  export default _default;
@@ -1,25 +1,51 @@
1
1
  import { __awaiter } from "tslib";
2
- import React, { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
2
+ import React, { forwardRef, memo, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
3
3
  import { Autoplay, Pagination, Navigation, A11y, Mousewheel, Keyboard } from 'swiper/modules';
4
4
  import { Swiper, SwiperSlide, useSwiperSlide } from 'swiper/react';
5
+ import { css } from '@emotion/css';
5
6
  import Picture from './Picture';
6
7
  import { useSxpDataSource } from '../../../../core/hooks';
7
- import { css } from '@emotion/css';
8
8
  import SXP_EVENT_BUS, { SXP_EVENT_TYPE } from '../../../../core/utils/event';
9
9
  import { getScreenReader } from '../../../../core/utils/tool';
10
- const PictureGroup = ({ imgUrls, width, height, rec, index, onViewImageEndEvent, onViewImageStartEvent, imgUrlsPostConfig }) => {
10
+ const PictureGroup = forwardRef(({ imgUrls, data, height, rec, index, onViewImageEndEvent, onViewImageStartEvent, imgUrlsPostConfig, swiperRef }, ref) => {
11
11
  var _a, _b;
12
12
  const { isActive } = useSwiperSlide();
13
- const { sxpParameter, openHashtag } = useSxpDataSource();
13
+ const { firstRtcList, openHashtag, isDiyH5 } = useSxpDataSource();
14
14
  const [isLoad, setIsLoad] = useState(false);
15
15
  const [imgInfo, setImgInfo] = useState();
16
16
  const [swiperActiveIndex, setSwiperActiveIndex] = useState(0);
17
- const swiperRef = useRef();
17
+ const imgsSwiperRef = useRef();
18
18
  const isFirstPlayRef = useRef(true);
19
+ const loopPlayRef = useRef(true);
19
20
  const initTime = new Date();
21
+ useImperativeHandle(ref, () => {
22
+ return {
23
+ setLoopPlay(v) {
24
+ loopPlayRef.current = v;
25
+ }
26
+ };
27
+ });
28
+ useEffect(() => {
29
+ let timerId;
30
+ if (isLoad && isActive && isDiyH5) {
31
+ timerId = setTimeout(() => {
32
+ var _a, _b, _c, _d;
33
+ if (!loopPlayRef.current)
34
+ return;
35
+ if (firstRtcList && index < (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) - 1) {
36
+ const i = (_b = (_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper) === null || _b === void 0 ? void 0 : _b.activeIndex;
37
+ (_d = (_c = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _c === void 0 ? void 0 : _c.swiper) === null || _d === void 0 ? void 0 : _d.slideTo(i + 1);
38
+ }
39
+ }, 3000);
40
+ }
41
+ return () => {
42
+ if (timerId)
43
+ clearTimeout(timerId);
44
+ };
45
+ }, [isLoad, isActive, isDiyH5, index, swiperRef, firstRtcList]);
20
46
  useEffect(() => {
21
47
  if (isLoad && isActive) {
22
- (swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) && swiperRef.current.swiper.autoplay.start();
48
+ (imgsSwiperRef === null || imgsSwiperRef === void 0 ? void 0 : imgsSwiperRef.current) && imgsSwiperRef.current.swiper.autoplay.start();
23
49
  if (openHashtag) {
24
50
  onViewImageEndEvent(rec);
25
51
  }
@@ -29,7 +55,7 @@ const PictureGroup = ({ imgUrls, width, height, rec, index, onViewImageEndEvent,
29
55
  }
30
56
  }
31
57
  else {
32
- (swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) && swiperRef.current.swiper.autoplay.stop();
58
+ (imgsSwiperRef === null || imgsSwiperRef === void 0 ? void 0 : imgsSwiperRef.current) && imgsSwiperRef.current.swiper.autoplay.stop();
33
59
  }
34
60
  }, [rec, isActive, onViewImageEndEvent, openHashtag, index, onViewImageStartEvent, isLoad, imgInfo]);
35
61
  const showFirstImageFn = useCallback((e) => __awaiter(void 0, void 0, void 0, function* () {
@@ -53,13 +79,13 @@ const PictureGroup = ({ imgUrls, width, height, rec, index, onViewImageEndEvent,
53
79
  };
54
80
  }, [isActive, imgInfo]);
55
81
  const handleMouseEnter = useCallback(() => {
56
- if (swiperRef.current && swiperRef.current.swiper && isAlly) {
57
- swiperRef.current.swiper.autoplay.stop();
82
+ if (imgsSwiperRef.current && imgsSwiperRef.current.swiper && isAlly) {
83
+ imgsSwiperRef.current.swiper.autoplay.stop();
58
84
  }
59
85
  }, []);
60
86
  const handleMouseLeave = useCallback(() => {
61
- if (swiperRef.current && swiperRef.current.swiper && isAlly) {
62
- swiperRef.current.swiper.autoplay.start();
87
+ if (imgsSwiperRef.current && imgsSwiperRef.current.swiper && isAlly) {
88
+ imgsSwiperRef.current.swiper.autoplay.start();
63
89
  }
64
90
  }, []);
65
91
  const handleSlideChange = useCallback((swiper) => {
@@ -80,7 +106,7 @@ const PictureGroup = ({ imgUrls, width, height, rec, index, onViewImageEndEvent,
80
106
  enabled: true
81
107
  }
82
108
  }
83
- : {}), { loop: true, ref: swiperRef, onSlideChange: handleSlideChange, className: css(Object.assign(Object.assign({ '.swiper-pagination': {
109
+ : {}), { loop: true, ref: imgsSwiperRef, onSlideChange: handleSlideChange, className: css(Object.assign(Object.assign({ '.swiper-pagination': {
84
110
  bottom: (_a = imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.marginBottom) !== null && _a !== void 0 ? _a : 0,
85
111
  fontSize: '14px'
86
112
  } }, ((imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.dotsBgColor) && {
@@ -97,5 +123,5 @@ const PictureGroup = ({ imgUrls, width, height, rec, index, onViewImageEndEvent,
97
123
  return (React.createElement(SwiperSlide, { key: srcKey, "aria-hidden": srcKey !== swiperActiveIndex },
98
124
  React.createElement(Picture, { src: !isLoad && srcKey > 0 ? '' : url, height: height, imgUrlsPostConfig: imgUrlsPostConfig, onShowFirstImage: showFirstImageFn })));
99
125
  }))));
100
- };
126
+ });
101
127
  export default memo(PictureGroup);
@@ -10,7 +10,7 @@ import SXP_EVENT_BUS, { SXP_EVENT_TYPE } from '../../../../core/utils/event';
10
10
  const VideoWidget = forwardRef(({ rec, index, height, data, muted, activeIndex, videoPostConfig, videoPlayIcon, loopPlay, swiperRef }, ref) => {
11
11
  var _a, _b;
12
12
  const [isPauseVideo, setIsPauseVideo] = useState(false);
13
- const { bffEventReport, sxpParameter, waterFallData, openHashtag, bffFbReport, isDiyH5 } = useSxpDataSource();
13
+ const { bffEventReport, sxpParameter, firstRtcList, openHashtag, bffFbReport, isDiyH5 } = useSxpDataSource();
14
14
  const videoStartTime = useRef(0);
15
15
  const [isLoadFinish, setIsLoadFinish] = useState(false);
16
16
  const { isActive } = useSwiperSlide();
@@ -76,6 +76,23 @@ const VideoWidget = forwardRef(({ rec, index, height, data, muted, activeIndex,
76
76
  return;
77
77
  (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
78
78
  }, [videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
79
+ const handleEnd = () => {
80
+ var _a, _b, _c, _d, _e, _f;
81
+ if (!videoRef.current)
82
+ return;
83
+ if (isDiyH5) {
84
+ (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.pause();
85
+ if (!loopPlayRef.current)
86
+ return;
87
+ if (firstRtcList && index < (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) - 1) {
88
+ const i = (_c = (_b = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _b === void 0 ? void 0 : _b.swiper) === null || _c === void 0 ? void 0 : _c.activeIndex;
89
+ (_e = (_d = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _d === void 0 ? void 0 : _d.swiper) === null || _e === void 0 ? void 0 : _e.slideTo(i + 1);
90
+ }
91
+ }
92
+ else {
93
+ (_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.play();
94
+ }
95
+ };
79
96
  const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
80
97
  const handlePlaying = useCallback(() => {
81
98
  if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
@@ -84,7 +101,7 @@ const VideoWidget = forwardRef(({ rec, index, height, data, muted, activeIndex,
84
101
  setIsLoadFinish(true);
85
102
  }, []);
86
103
  const handleStartPlay = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
87
- var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
104
+ var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
88
105
  if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
89
106
  return;
90
107
  setIsPauseVideo(false);
@@ -95,16 +112,11 @@ const VideoWidget = forwardRef(({ rec, index, height, data, muted, activeIndex,
95
112
  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);
96
113
  const playType = (isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) ? '0' : '1';
97
114
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
98
- 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) + '' }))
115
+ 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 : '', sceneId: (_o = (_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.scene) === null || _m === void 0 ? void 0 : _m.sceneId) !== 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) + '' }))
99
116
  });
100
117
  isFirstPlayRef.current = false;
101
118
  }
102
119
  }), [bffEventReport, data, index, isFirstPlayRef, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
103
- const setCurrentTimeByStartTime = useCallback(() => {
104
- if (isDiyH5) {
105
- videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
106
- }
107
- }, []);
108
120
  const handLoadeddata = useCallback(() => {
109
121
  if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) || firstFrameSrc || !blur)
110
122
  return;
@@ -129,13 +141,12 @@ const VideoWidget = forwardRef(({ rec, index, height, data, muted, activeIndex,
129
141
  const handleLoadedmetadata = useCallback(() => {
130
142
  if (!videoRef.current)
131
143
  return;
132
- setCurrentTimeByStartTime();
133
144
  loadedTimeRef.current = new Date();
134
145
  handleStartPlay();
135
146
  handLoadeddata();
136
147
  }, [videoRef.current, handLoadeddata, handleStartPlay]);
137
148
  const handleClickVideo = useCallback((type) => () => {
138
- var _a, _b, _c, _d, _e, _f;
149
+ var _a, _b, _c, _d, _e;
139
150
  if (!videoRef.current)
140
151
  return;
141
152
  if (!isLoadFinish)
@@ -156,20 +167,17 @@ const VideoWidget = forwardRef(({ rec, index, height, data, muted, activeIndex,
156
167
  break;
157
168
  default:
158
169
  if (isPause) {
159
- if (isDiyH5 && Math.round((_d = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _d === void 0 ? void 0 : _d.currentTime) >= (scene === null || scene === void 0 ? void 0 : scene.endTime)) {
160
- videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
161
- }
162
- (_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.play();
170
+ (_d = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _d === void 0 ? void 0 : _d.play();
163
171
  }
164
172
  else {
165
- (_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.pause();
173
+ (_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.pause();
166
174
  }
167
175
  setIsPauseVideo(!isPause);
168
176
  break;
169
177
  }
170
178
  }, [isLoadFinish, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
171
179
  const handlePause = useCallback(() => {
172
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
180
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
173
181
  if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
174
182
  return;
175
183
  if (activeIndex !== index)
@@ -185,14 +193,15 @@ const VideoWidget = forwardRef(({ rec, index, height, data, muted, activeIndex,
185
193
  eventSubject: 'playOverVideo',
186
194
  eventDescription: 'User finished playing the video',
187
195
  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 : '',
188
- 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 : '',
196
+ sceneId: (_l = (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.scene) === null || _k === void 0 ? void 0 : _k.sceneId) !== null && _l !== void 0 ? _l : '',
197
+ contentName: (_o = (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.title) !== null && _o !== void 0 ? _o : '',
189
198
  endTime: videoCurrentTime,
190
199
  videoDuration,
191
200
  playDuration,
192
- 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 : []),
201
+ contentTags: JSON.stringify((_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.tags) !== null && _q !== void 0 ? _q : []),
193
202
  position: index + '',
194
203
  contentFormat: 'video',
195
- traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo
204
+ traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
196
205
  }
197
206
  });
198
207
  }
@@ -200,27 +209,8 @@ const VideoWidget = forwardRef(({ rec, index, height, data, muted, activeIndex,
200
209
  const handleWaiting = useCallback(() => {
201
210
  setWaiting(true);
202
211
  }, []);
203
- const handleTimeUpload = () => {
204
- if (!videoRef.current || !isDiyH5)
205
- return;
206
- setTimeout(() => {
207
- var _a, _b, _c, _d, _e, _f, _g, _h, _j;
208
- if (Math.round((_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.currentTime) >= ((_b = scene === null || scene === void 0 ? void 0 : scene.endTime) !== null && _b !== void 0 ? _b : 0)) {
209
- (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.pause();
210
- if (!loopPlayRef.current)
211
- return;
212
- if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
213
- (_e = (_d = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _d === void 0 ? void 0 : _d.swiper) === null || _e === void 0 ? void 0 : _e.slideTo(0);
214
- }
215
- else {
216
- const i = (_g = (_f = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _f === void 0 ? void 0 : _f.swiper) === null || _g === void 0 ? void 0 : _g.activeIndex;
217
- (_j = (_h = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _h === void 0 ? void 0 : _h.swiper) === null || _j === void 0 ? void 0 : _j.slideTo(i + 1);
218
- }
219
- }
220
- });
221
- };
222
212
  useEffect(() => {
223
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
213
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
224
214
  if (!isActive)
225
215
  return;
226
216
  const videoSrc = videoUrl;
@@ -241,7 +231,6 @@ const VideoWidget = forwardRef(({ rec, index, height, data, muted, activeIndex,
241
231
  hls === null || hls === void 0 ? void 0 : hls.attachMedia(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current);
242
232
  hls === null || hls === void 0 ? void 0 : hls.on(Hls.Events.MANIFEST_PARSED, function () {
243
233
  var _a;
244
- setCurrentTimeByStartTime();
245
234
  (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
246
235
  });
247
236
  }
@@ -255,12 +244,11 @@ const VideoWidget = forwardRef(({ rec, index, height, data, muted, activeIndex,
255
244
  (_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.addEventListener('play', handleStartPlay);
256
245
  (_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.addEventListener('playing', handlePlaying);
257
246
  (_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.addEventListener('pause', handlePause);
258
- (_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended', handlePlay);
247
+ (_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended', handleEnd);
259
248
  (_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.addEventListener('canplay', handlePlay);
260
249
  (_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.addEventListener('waiting', handleWaiting);
261
- (_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.addEventListener('timeupdate', handleTimeUpload);
262
250
  return () => {
263
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
251
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
264
252
  const isPause = (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.paused;
265
253
  if (!isPause)
266
254
  handlePause();
@@ -272,10 +260,9 @@ const VideoWidget = forwardRef(({ rec, index, height, data, muted, activeIndex,
272
260
  (_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.removeEventListener('play', handleStartPlay);
273
261
  (_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.removeEventListener('playing', handlePlaying);
274
262
  (_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.removeEventListener('pause', handlePause);
275
- (_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended', handlePlay);
263
+ (_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended', handleEnd);
276
264
  (_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.removeEventListener('canplay', handlePlay);
277
265
  (_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.removeEventListener('waiting', handleWaiting);
278
- (_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.removeEventListener('timeupdate', handleTimeUpload);
279
266
  };
280
267
  }, [isActive]);
281
268
  useEffect(() => {
@@ -41,7 +41,7 @@ const WaterFall = (props) => {
41
41
  }
42
42
  }, [waterFallData]);
43
43
  const reportTagsView = useCallback(() => {
44
- var _a, _b, _c, _d, _e, _f;
44
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j;
45
45
  const rec = recData === null || recData === void 0 ? void 0 : recData.rec;
46
46
  if (!rec)
47
47
  return;
@@ -61,9 +61,10 @@ const WaterFall = (props) => {
61
61
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
62
62
  eventInfo: {
63
63
  contentId: (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.itemId,
64
+ sceneId: (_g = (_f = (_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.scene) === null || _f === void 0 ? void 0 : _f.sceneId) !== null && _g !== void 0 ? _g : '',
64
65
  position: cacheActiveIndex + '',
65
- contentTags: JSON.stringify((_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.tags),
66
- traceInfo: (_f = rec === null || rec === void 0 ? void 0 : rec.video) === null || _f === void 0 ? void 0 : _f.traceInfo,
66
+ contentTags: JSON.stringify((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.tags),
67
+ traceInfo: (_j = rec === null || rec === void 0 ? void 0 : rec.video) === null || _j === void 0 ? void 0 : _j.traceInfo,
67
68
  hashTags: JSON.stringify([recData === null || recData === void 0 ? void 0 : recData.hashTag]),
68
69
  fromKName,
69
70
  fromKPage: location === null || location === void 0 ? void 0 : location.href,