pb-sxp-ui 1.16.6 → 1.16.8

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