@x-edu/live-player 0.0.13 → 0.0.15

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 (10) hide show
  1. package/dist/XEduLivePlayer.common.js +232 -229
  2. package/dist/XEduLivePlayerPre.common.js +528 -886
  3. package/package.json +1 -1
  4. package/src/demo/List.jsx +16 -14
  5. package/src/detail/LiveStatus/index.jsx +186 -186
  6. package/src/detail/index.jsx +501 -501
  7. package/src/list/ListItem/Action/index.jsx +1 -1
  8. package/src/list/ListItem/index.jsx +3 -2
  9. package/src/list/ListItem/index.module.less +1 -1
  10. package/src/list/index.jsx +1 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@x-edu/live-player",
3
- "version": "0.0.13",
3
+ "version": "0.0.15",
4
4
  "main": "dist/XEduLivePlayer.common.js",
5
5
  "scripts": {
6
6
  "start": "cross-env SDP_ENV=local gms dev",
package/src/demo/List.jsx CHANGED
@@ -2,24 +2,24 @@ import React, { useEffect, useState } from 'react'
2
2
  import { UC } from '@sdp.nd/nd-uc-sdk'
3
3
  import Live from '../App'
4
4
 
5
- const uc = new UC({
6
- env: 'ncet-xedu',
7
- sdpAppId: 'e5649925-441d-4a53-b525-51a2f1c4e0a8',
8
- origins: {
9
- UC: 'https://uc-gateway.ykt.eduyun.cn',
10
- SSO: 'https://sso.basic.smartedu.cn'
11
- },
12
- isGlobalSDKCacheEnabled: true
13
- })
14
5
  // const uc = new UC({
15
- // env: 'preproduction',
16
- // sdpAppId: '331593d3-af38-456e-bdb8-5263525608f4',
6
+ // env: 'ncet-xedu',
7
+ // sdpAppId: 'e5649925-441d-4a53-b525-51a2f1c4e0a8',
17
8
  // origins: {
18
- // UC: 'https://uc-gateway.beta.101.com',
19
- // SSO: 'https://ysc-sso.ykt.eduyun.cn'
9
+ // UC: 'https://uc-gateway.ykt.eduyun.cn',
10
+ // SSO: 'https://sso.basic.smartedu.cn'
20
11
  // },
21
12
  // isGlobalSDKCacheEnabled: true
22
13
  // })
14
+ const uc = new UC({
15
+ env: 'preproduction',
16
+ sdpAppId: '331593d3-af38-456e-bdb8-5263525608f4',
17
+ origins: {
18
+ UC: 'https://uc-gateway.beta.101.com',
19
+ SSO: 'https://ysc-sso.ykt.eduyun.cn'
20
+ },
21
+ isGlobalSDKCacheEnabled: true
22
+ })
23
23
 
24
24
  export default function List() {
25
25
  const [ucInstance, setUcInstance] = useState(uc)
@@ -34,7 +34,9 @@ export default function List() {
34
34
  try {
35
35
  await ucInstance.login({
36
36
  loginName: '18695708674',
37
- password: 'gyh123456'
37
+ password: 'Gyh.2233'
38
+ // loginName: '18695708674',
39
+ // password: 'gyh123456'
38
40
  })
39
41
  const account = ucInstance.getCurrentAccount()
40
42
  const info = await account.getAccountInfo()
package/src/detail/LiveStatus/index.jsx CHANGED
@@ -1,186 +1,186 @@
1
- import React, { useState } from 'react'
2
- import dayjs from 'dayjs'
3
- import { Icon, Spin } from 'fish'
4
- import { PROVIDE_RECORD, PUBLIC_LIVE_STATUS, VIEW_REPLAY, PUBLIC_LIVE_MODE } from '@/config/publicLive'
5
- import LiveCountDown from '../LiveCountDown'
6
- import style from './index.module.less'
7
- import AnchorOnTheWay from './AnchorOnTheWay'
8
-
9
- function LiveStatus({
10
- handleLogin,
11
- userInfo,
12
- liveInfo,
13
- hasPlayed,
14
- visitTime,
15
- isLiveException, // 拉流异常
16
- isLiveLoading,
17
- isLiveLoadError, // 视频加载失败
18
- onStatusChange = () => undefined,
19
- onPlayReplay = () => undefined,
20
- onReloadLive = () => undefined
21
- }) {
22
- const [countDownTime, setCountDownTime] = useState(dayjs(liveInfo.begin_time).valueOf() - visitTime)
23
- const isNoStarted = liveInfo.status === PUBLIC_LIVE_STATUS.NOSTARTED
24
- const isLiving = liveInfo.status === PUBLIC_LIVE_STATUS.LIVEING
25
- const isCompleted = liveInfo.status === PUBLIC_LIVE_STATUS.COMPLETEED
26
- const isPaused = liveInfo.status === PUBLIC_LIVE_STATUS.PASUED
27
- const isOffline = liveInfo.status === PUBLIC_LIVE_STATUS.OFFLINE
28
- const isRecordLive = liveInfo.type === PUBLIC_LIVE_MODE.RECORDED
29
- const isStreamLive = liveInfo.type === PUBLIC_LIVE_MODE.LIVING && (liveInfo.sub_type === SUB_TYPE.OUTSIDE || liveInfo.sub_type === SUB_TYPE.REBROADCAST)
30
-
31
- // 当前时间是否在回放时间开始前, 如果没有回放开始时间, 则直接判断未回放还没生成
32
- const isBeforeRecordTime = liveInfo.replay_begin_time
33
- ? dayjs().isBefore(dayjs(liveInfo.replay_begin_time))
34
- : true
35
-
36
- const mustLogin = !userInfo && liveInfo.login
37
- const canLiveStart = isLiving && !mustLogin
38
- const hasReplayBtn = isCompleted && liveInfo.view_replay === VIEW_REPLAY.ALLOW && liveInfo.provide_record !== PROVIDE_RECORD.NOT_PROVIDED
39
- const hasLoginBtn = mustLogin && (isNoStarted || isLiving)
40
- const coverBgStyle = {
41
- backgroundImage: `url("${liveInfo.cover_pic_web_url}")`
42
- }
43
-
44
- const startLiving = () => {
45
- if (isRecordLive || isStreamLive) {
46
- onStatusChange(PUBLIC_LIVE_STATUS.LIVEING, {
47
- play: !mustLogin
48
- })
49
- } else {
50
- setCountDownTime(0)
51
- }
52
- }
53
-
54
- const handleViewReplay = () => {
55
- if (mustLogin) {
56
- handleLogin()
57
- } else {
58
- onPlayReplay()
59
- }
60
- }
61
-
62
- if (canLiveStart && !isLiveException && !isLiveLoading && !isLiveLoadError) {
63
- return null
64
- }
65
-
66
- // 播放状态
67
- if (canLiveStart) {
68
- return (
69
- <>
70
- <div className={style['live-status-wrapper']}>
71
- <div className={style['live-status']}>
72
- {isLiveLoadError && (
73
- <>
74
- <div className={style['status-load-error']}>
75
- <Icon type="exclamation-circle" className={style.icon} />
76
- <div className={style.text}>加载失败，请重试</div>
77
- </div>
78
- <button className={style['primary-btn']} onClick={onReloadLive}>重试</button>
79
- </>
80
- )}
81
- {!isLiveLoadError && isLiveException && (
82
- <AnchorOnTheWay
83
- liveInfo={liveInfo}
84
- isStreamLive={isStreamLive}
85
- hasPlayed={hasPlayed}
86
- reload={onReloadLive}
87
- />
88
- )}
89
- {!isLiveLoadError && !isLiveException && isLiveLoading && (
90
- <div className={style['status-living-loading']}>
91
- <Spin indicator={(
92
- <Icon type="loading" spin className={style.icon} />
93
- )}
94
- />
95
- <div className={style.text}>加载中...</div>
96
- </div>
97
- )}
98
- </div>
99
- </div>
100
- {!isRecordLive && (isLiveLoadError || isLiveException) && (
101
- <div className={style['video-poster']} style={coverBgStyle} />
102
- )}
103
- </>
104
- )
105
- }
106
- return (
107
- <>
108
- <div className={style['live-status-wrapper']}>
109
- <div className={style['live-status']}>
110
- {isNoStarted && (countDownTime > 0 ? (
111
- <LiveCountDown
112
- liveInfo={liveInfo}
113
- isStreamLive={isStreamLive}
114
- time={countDownTime}
115
- reload={onReloadLive}
116
- onEnd={startLiving}
117
- />
118
- ) : (
119
- <AnchorOnTheWay
120
- liveInfo={liveInfo}
121
- isStreamLive={isStreamLive}
122
- hasPlayed={hasPlayed}
123
- reload={onReloadLive}
124
- />
125
- ))}
126
- {isLiving && (
127
- <div className={style['status-living']}>
128
- <div className={style.icon}>
129
- <div />
130
- <div />
131
- <div />
132
- </div>
133
- <div className={style.text}>开播中</div>
134
- </div>
135
- )}
136
- {isCompleted && (
137
- <div className={style['status-completed']}>
138
- <div className={style.icon} />
139
- <div className={style.text}>已结束</div>
140
- </div>
141
- )}
142
- {isPaused && (
143
- <AnchorOnTheWay
144
- liveInfo={liveInfo}
145
- isStreamLive={isStreamLive}
146
- hasPlayed={hasPlayed}
147
- reload={onReloadLive}
148
- />
149
- )}
150
- {isOffline && (
151
- <div className={style['status-offline']}>
152
- <Icon type="exclamation-circle" className={style.icon} />
153
- <div className={style.text}>已下架</div>
154
- </div>
155
- )}
156
- {hasLoginBtn && (
157
- <button
158
- className={style['primary-btn']}
159
- onClick={handleLogin}
160
- >
161
- 请登录查看
162
- </button>
163
- )}
164
- {hasReplayBtn && liveInfo.replay_url && (
165
- <button
166
- className={style['primary-btn']}
167
- onClick={handleViewReplay}
168
- >
169
- {mustLogin ? '登录观看回放' : '观看回放'}
170
- </button>
171
- )}
172
- {hasReplayBtn && !liveInfo.replay_url && isBeforeRecordTime && (
173
- <div className={style['replay-encoding']}>
174
- 回放生成中，请稍后再来...
175
- </div>
176
- )}
177
- </div>
178
- </div>
179
- {!isRecordLive && (!isLiving || (isLiving && mustLogin)) && (
180
- <div className={style['video-poster']} style={coverBgStyle} />
181
- )}
182
- </>
183
- )
184
- }
185
-
186
- export default LiveStatus
1
+ import React, { useState } from 'react'
2
+ import dayjs from 'dayjs'
3
+ import { Icon, Spin } from 'fish'
4
+ import { PROVIDE_RECORD, PUBLIC_LIVE_STATUS, VIEW_REPLAY, PUBLIC_LIVE_MODE, SUB_TYPE } from '@/config/publicLive'
5
+ import LiveCountDown from '../LiveCountDown'
6
+ import style from './index.module.less'
7
+ import AnchorOnTheWay from './AnchorOnTheWay'
8
+
9
+ function LiveStatus({
10
+ handleLogin,
11
+ userInfo,
12
+ liveInfo,
13
+ hasPlayed,
14
+ visitTime,
15
+ isLiveException, // 拉流异常
16
+ isLiveLoading,
17
+ isLiveLoadError, // 视频加载失败
18
+ onStatusChange = () => undefined,
19
+ onPlayReplay = () => undefined,
20
+ onReloadLive = () => undefined
21
+ }) {
22
+ const [countDownTime, setCountDownTime] = useState(dayjs(liveInfo.begin_time).valueOf() - visitTime)
23
+ const isNoStarted = liveInfo.status === PUBLIC_LIVE_STATUS.NOSTARTED
24
+ const isLiving = liveInfo.status === PUBLIC_LIVE_STATUS.LIVEING
25
+ const isCompleted = liveInfo.status === PUBLIC_LIVE_STATUS.COMPLETEED
26
+ const isPaused = liveInfo.status === PUBLIC_LIVE_STATUS.PASUED
27
+ const isOffline = liveInfo.status === PUBLIC_LIVE_STATUS.OFFLINE
28
+ const isRecordLive = liveInfo.type === PUBLIC_LIVE_MODE.RECORDED
29
+ const isStreamLive = liveInfo.type === PUBLIC_LIVE_MODE.LIVING && (liveInfo.sub_type === SUB_TYPE.OUTSIDE || liveInfo.sub_type === SUB_TYPE.REBROADCAST)
30
+
31
+ // 当前时间是否在回放时间开始前, 如果没有回放开始时间, 则直接判断未回放还没生成
32
+ const isBeforeRecordTime = liveInfo.replay_begin_time
33
+ ? dayjs().isBefore(dayjs(liveInfo.replay_begin_time))
34
+ : true
35
+
36
+ const mustLogin = !userInfo && liveInfo.login
37
+ const canLiveStart = isLiving && !mustLogin
38
+ const hasReplayBtn = isCompleted && liveInfo.view_replay === VIEW_REPLAY.ALLOW && liveInfo.provide_record !== PROVIDE_RECORD.NOT_PROVIDED
39
+ const hasLoginBtn = mustLogin && (isNoStarted || isLiving)
40
+ const coverBgStyle = {
41
+ backgroundImage: `url("${liveInfo.cover_pic_web_url}")`
42
+ }
43
+
44
+ const startLiving = () => {
45
+ if (isRecordLive || isStreamLive) {
46
+ onStatusChange(PUBLIC_LIVE_STATUS.LIVEING, {
47
+ play: !mustLogin
48
+ })
49
+ } else {
50
+ setCountDownTime(0)
51
+ }
52
+ }
53
+
54
+ const handleViewReplay = () => {
55
+ if (mustLogin) {
56
+ handleLogin()
57
+ } else {
58
+ onPlayReplay()
59
+ }
60
+ }
61
+
62
+ if (canLiveStart && !isLiveException && !isLiveLoading && !isLiveLoadError) {
63
+ return null
64
+ }
65
+
66
+ // 播放状态
67
+ if (canLiveStart) {
68
+ return (
69
+ <>
70
+ <div className={style['live-status-wrapper']}>
71
+ <div className={style['live-status']}>
72
+ {isLiveLoadError && (
73
+ <>
74
+ <div className={style['status-load-error']}>
75
+ <Icon type="exclamation-circle" className={style.icon} />
76
+ <div className={style.text}>加载失败，请重试</div>
77
+ </div>
78
+ <button className={style['primary-btn']} onClick={onReloadLive}>重试</button>
79
+ </>
80
+ )}
81
+ {!isLiveLoadError && isLiveException && (
82
+ <AnchorOnTheWay
83
+ liveInfo={liveInfo}
84
+ isStreamLive={isStreamLive}
85
+ hasPlayed={hasPlayed}
86
+ reload={onReloadLive}
87
+ />
88
+ )}
89
+ {!isLiveLoadError && !isLiveException && isLiveLoading && (
90
+ <div className={style['status-living-loading']}>
91
+ <Spin indicator={(
92
+ <Icon type="loading" spin className={style.icon} />
93
+ )}
94
+ />
95
+ <div className={style.text}>加载中...</div>
96
+ </div>
97
+ )}
98
+ </div>
99
+ </div>
100
+ {!isRecordLive && (isLiveLoadError || isLiveException) && (
101
+ <div className={style['video-poster']} style={coverBgStyle} />
102
+ )}
103
+ </>
104
+ )
105
+ }
106
+ return (
107
+ <>
108
+ <div className={style['live-status-wrapper']}>
109
+ <div className={style['live-status']}>
110
+ {isNoStarted && (countDownTime > 0 ? (
111
+ <LiveCountDown
112
+ liveInfo={liveInfo}
113
+ isStreamLive={isStreamLive}
114
+ time={countDownTime}
115
+ reload={onReloadLive}
116
+ onEnd={startLiving}
117
+ />
118
+ ) : (
119
+ <AnchorOnTheWay
120
+ liveInfo={liveInfo}
121
+ isStreamLive={isStreamLive}
122
+ hasPlayed={hasPlayed}
123
+ reload={onReloadLive}
124
+ />
125
+ ))}
126
+ {isLiving && (
127
+ <div className={style['status-living']}>
128
+ <div className={style.icon}>
129
+ <div />
130
+ <div />
131
+ <div />
132
+ </div>
133
+ <div className={style.text}>开播中</div>
134
+ </div>
135
+ )}
136
+ {isCompleted && (
137
+ <div className={style['status-completed']}>
138
+ <div className={style.icon} />
139
+ <div className={style.text}>已结束</div>
140
+ </div>
141
+ )}
142
+ {isPaused && (
143
+ <AnchorOnTheWay
144
+ liveInfo={liveInfo}
145
+ isStreamLive={isStreamLive}
146
+ hasPlayed={hasPlayed}
147
+ reload={onReloadLive}
148
+ />
149
+ )}
150
+ {isOffline && (
151
+ <div className={style['status-offline']}>
152
+ <Icon type="exclamation-circle" className={style.icon} />
153
+ <div className={style.text}>已下架</div>
154
+ </div>
155
+ )}
156
+ {hasLoginBtn && (
157
+ <button
158
+ className={style['primary-btn']}
159
+ onClick={handleLogin}
160
+ >
161
+ 请登录查看
162
+ </button>
163
+ )}
164
+ {hasReplayBtn && liveInfo.replay_url && (
165
+ <button
166
+ className={style['primary-btn']}
167
+ onClick={handleViewReplay}
168
+ >
169
+ {mustLogin ? '登录观看回放' : '观看回放'}
170
+ </button>
171
+ )}
172
+ {hasReplayBtn && !liveInfo.replay_url && isBeforeRecordTime && (
173
+ <div className={style['replay-encoding']}>
174
+ 回放生成中，请稍后再来...
175
+ </div>
176
+ )}
177
+ </div>
178
+ </div>
179
+ {!isRecordLive && (!isLiving || (isLiving && mustLogin)) && (
180
+ <div className={style['video-poster']} style={coverBgStyle} />
181
+ )}
182
+ </>
183
+ )
184
+ }
185
+
186
+ export default LiveStatus