@x-edu/live-player 0.0.34 → 0.0.35

package/src/detail/hook/usePullSource.js

@@ -1,82 +0,0 @@
-import { useEffect, useRef } from 'react'
-import axios from 'axios'
-import useIsMounted from '@/hook/useIsMounted'
-import { PUBLIC_LIVE_STATUS } from '@/config/publicLive'
-import { getOpenClassLiveSimple } from '@/service/live'
-
-const pullInterval = 10 * 1000
-const pullStatusInterval = 30 * 1000
-const pullMultiply = pullStatusInterval / pullInterval
-
-const pullTimeout = 10 * 1000
-
-export default function usePullSource({
-  liveInfo,
-  reload,
-  onStatusChange,
-  shouldStartPull
-}) {
-  const sourceSrc = liveInfo?.imInfo?.param?.url
-    || liveInfo?.imInfo?.param?.playurl?.[0]
-  const isMounted = useIsMounted()
-  const counterIdRef = useRef()
-
-  const loopIndex = useRef()
-  const getIsCurrentLop = (index) => index <= loopIndex.current
-
-  async function checkLiveReadyInterval(i = 0) {
-    loopIndex.current = i
-    let liveStatus
-    if (i % pullMultiply === 0) {
-      liveStatus = await getLiveNewStatus(liveInfo)
-      if (getIsCurrentLop(i)) {
-        onStatusChange(liveStatus)
-      }
-    }
-    if (liveStatus !== PUBLIC_LIVE_STATUS.COMPLETEED
-      && sourceSrc) {
-      const isSourceReady = await checkSourceReady(sourceSrc)
-      if (getIsCurrentLop(i)) {
-        if (isSourceReady && isMounted) {
-          reload()
-          return
-        }
-      }
-    }
-    if (isMounted && getIsCurrentLop(i)) {
-      counterIdRef.current = setTimeout(() => {
-        checkLiveReadyInterval(i + 1)
-      }, pullInterval)
-    }
-  }
-
-  useEffect(() => {
-    clearTimeout(counterIdRef.current)
-    if (shouldStartPull) {
-      counterIdRef.current = setTimeout(() => {
-        checkLiveReadyInterval(0)
-      }, pullInterval)
-    }
-    return () => {
-      if (shouldStartPull) {
-        clearTimeout(counterIdRef.current)
-      }
-    }
-  }, [sourceSrc, liveInfo.status, shouldStartPull])
-}
-
-async function checkSourceReady(url) {
-  try {
-    await axios.get(url, {
-      timeout: pullTimeout
-    })
-    return true
-  } catch (e) {
-    return false
-  }
-}
-
-async function getLiveNewStatus(liveInfo) {
-  const newLiveInfo = await getOpenClassLiveSimple(liveInfo)
-  return newLiveInfo.status
-}

package/src/detail/hook/usePullState.js

@@ -1,51 +0,0 @@
-import { useEffect, useRef } from 'react'
-import { getOpenClassLiveSimple } from '@/service/live'
-import useIsMounted from '@/hook/useIsMounted'
-import { PUBLIC_LIVE_STATUS } from '@/config/publicLive'
-
-const pullInterval = 1 * 60 * 1000
-
-export default function usePullState({
-  liveInfo,
-  reload,
-  shouldStartPull
-}) {
-  const isMounted = useIsMounted()
-  const counterIdRef = useRef()
-
-  function checkSourceReadyInterval() {
-    isSourceReady(liveInfo)
-      .then(
-        () => {
-          if (isMounted) {
-            reload()
-          }
-        },
-        () => {
-          if (isMounted) {
-            counterIdRef.current = setTimeout(() => {
-              checkSourceReadyInterval()
-            }, pullInterval)
-          }
-        }
-      )
-  }
-
-  useEffect(() => {
-    if (liveInfo && shouldStartPull) {
-      checkSourceReadyInterval()
-    }
-    return () => {
-      clearTimeout(counterIdRef.current)
-    }
-  }, [liveInfo, shouldStartPull])
-}
-
-async function isSourceReady(liveInfo) {
-  const newLiveInfo = await getOpenClassLiveSimple(liveInfo)
-  if (newLiveInfo.status === PUBLIC_LIVE_STATUS.LIVEING) {
-    return true
-  } else {
-    throw new Error('not started')
-  }
-}

package/src/detail/index.jsx

@@ -1,483 +0,0 @@
-/* eslint-disable camelcase */
-import React, { useState, useEffect } from 'react'
-import { Icon } from 'fish'
-import dayjs from 'dayjs'
-import classNames from 'classnames'
-// import Empty from '@/component/Empty'
-import {
-  getOpenClassLive
-  // getServerTime
-} from '@/service/live'
-import { getIMLiveInfo, getGuestIMLiveInfo } from '@/service/imBroadcasts'
-import Loading from '@/component/status/Loading'
-import {
-  PUBLIC_LIVE_STATUS, PUBLIC_LIVE_MODE, SUB_TYPE
-} from '@/config/publicLive'
-import { getUrlQuery } from '@/util/url'
-import { getRecordLiveStatus } from '@/util/live'
-import { isEmpty } from '@/util/object'
-// import IMChatroom from '@/component/IMChatroom'
-import RecordVideo from './RecordVideo'
-import LiveVideo from './LiveVideo'
-import LineSwitch from './LineSwitch'
-import ReplayVideo from './ReplayVideo'
-import style from './index.module.less'
-import LiveOnlineCount from './LiveOnlineCount'
-import { LOGIN_STATUS } from '@/config/constant/user'
-import { USER_IDENTITY_NAME } from '@/config/live'
-// import NotLoginChatroom from './NotLoginChatroom'
-import netUrl from '@/util/netUrl'
-import { ShortUrlMap } from './const'
-import { setUC } from '@/util/auth/func'
-import config from '@/config/env'
-
-const TrackPageName = 'edu_Platform_publiclive_detail_page'
-
-export default function PublicLiveDetail({
-  containerClassName,
-  className,
-  infoClassName,
-  playerClassName,
-  descriptionClassName,
-  errorCover, // 当直播不存在或者错误时候的封面展示
-  errorText,
-  replay: propRelay,
-  liveId: propLiveId,
-  sdpAppId: propSdpAppId,
-  uc,
-  loginInfo = {},
-  handleLogin,
-  onOnlineCountChange = () => {},
-  onStateChange = () => {},
-  onReportProgress = () => {},
-  onReportTeacherTrain = () => {},
-  onSendSensors = () => {}
-}) {
-  setUC(uc, loginInfo?.userInfo)
-  if (propSdpAppId) {
-    config.app.appid = propSdpAppId
-    window._propSdpAppId = propSdpAppId
-  }
-
-  const { replay, live_id } = getUrlQuery()
-  const matchId = propLiveId || live_id
-  const replayMode = propRelay || replay
-  const liveId = ShortUrlMap[matchId] || matchId
-
-  const [liveInfo, setLiveInfo] = useState()
-  const [visitTime, setVisitTime] = useState()
-  const [diffTime, setDiffTime] = useState()
-  const [isReplayMode, setIsReplayMode] = useState(!!replayMode)
-  const [isExist, setIsExist] = useState(true)
-  const [lineChanging, setLineChanging] = useState(false) // 线路切换中标识
-
-  const {
-    userInfo,
-    userRole,
-    loginStatus
-  } = loginInfo
-  const isLiveToReplay = !replay
-  const isStreamLive = liveInfo
-    && liveInfo.type === PUBLIC_LIVE_MODE.LIVING
-
-  const handleStatusChange = async (status) => {
-    const newLiveInfo = {
-      ...liveInfo,
-      status
-    }
-    setLiveInfo(newLiveInfo)
-    onStateChange(newLiveInfo)
-    const isRecordLive = liveInfo.type === PUBLIC_LIVE_MODE.RECORDED
-    if (!isRecordLive
-      && [
-        PUBLIC_LIVE_STATUS.NOSTARTED,
-        PUBLIC_LIVE_STATUS.LIVEING,
-        PUBLIC_LIVE_STATUS.PASUED
-      ].includes(status)
-      && isEmpty(liveInfo.imInfo)
-    ) {
-      const {
-        sub_type: subType,
-        bid,
-        room_id: roomId
-      } = liveInfo
-      let imLiveInfoResp = {}
-      // 如果类型为外部推流, 则去请求新的直播详情接口
-      if (subType === SUB_TYPE.OUTSIDE || subType === SUB_TYPE.REBROADCAST) {
-        imLiveInfoResp = await getGuestIMLiveInfo(bid)
-          .catch(() => ({}))
-
-        // 默认使用lines[0] 作为直播源
-        imLiveInfoResp = {
-          ...imLiveInfoResp,
-          param: {
-            ...imLiveInfoResp.param,
-            ...imLiveInfoResp.param?.lines?.[0]
-          }
-        }
-      } else {
-        imLiveInfoResp = await getIMLiveInfo(roomId)
-          .catch(() => ({}))
-      }
-      setLiveInfo({
-        ...liveInfo,
-        status,
-        imInfo: imLiveInfoResp
-      })
-    }
-  }
-
-  const handleSelectChange = (lineSource) => {
-    setLineChanging(true)
-    setTimeout(() => {
-      setLiveInfo({
-        ...liveInfo,
-        imInfo: {
-          ...liveInfo.imInfo,
-          param: {
-            ...liveInfo.imInfo.param,
-            ...lineSource
-          }
-        }
-      })
-      setLineChanging(false)
-    }, 0)
-  }
-
-  useEffect(() => {
-    const init = async () => {
-      const [data, error] = await getOpenClassLive(liveId)
-        .then((v) => [v], (err) => [null, err])
-      if (error) {
-        const { response } = error
-        if (response.status === 404 || response.status === 400) {
-          setIsExist(false)
-        }
-        return
-      }
-
-      // 调试代码 模拟直播倒计时结束
-      // data.status = PUBLIC_LIVE_STATUS.NOSTARTED
-
-      const isRecordLive = data.type === PUBLIC_LIVE_MODE.RECORDED
-      const isNoStarted = data.status === PUBLIC_LIVE_STATUS.NOSTARTED
-      const isCompleted = data.status === PUBLIC_LIVE_STATUS.COMPLETEED
-      const isOffline = data.status === PUBLIC_LIVE_STATUS.OFFLINE
-
-      // 录播未完成或未下架，直播未开始时需要服务器时间
-      let serverTime
-      if ((isRecordLive && (!isCompleted || !isOffline)) || (!isRecordLive && !isReplayMode && isNoStarted)) {
-        // const response = await getServerTime()
-        serverTime = data.serverTime
-        setDiffTime(data.diffTime)
-        setVisitTime(serverTime)
-      }
-      // 录播计算状态
-      if (isRecordLive) {
-        const status = getRecordLiveStatus(data.status, serverTime, data.begin_time, data.end_time)
-        data.status = status
-      }
-      if (!isRecordLive) {
-        const {
-          sub_type: subType,
-          bid,
-          room_id: roomId
-        } = data
-        let imLiveInfoResp = {}
-        // 如果类型为外部推流, 则去请求新的直播详情接口
-        if (subType === SUB_TYPE.OUTSIDE || subType === SUB_TYPE.REBROADCAST) {
-          // if (subType === SUB_TYPE.OUTSIDE) {
-          imLiveInfoResp = await getGuestIMLiveInfo(bid)
-            .catch(() => ({}))
-          // 默认使用lines[0] 作为直播源
-          imLiveInfoResp = {
-            ...imLiveInfoResp,
-            param: {
-              ...imLiveInfoResp.param,
-              ...imLiveInfoResp.param?.lines?.[0]
-            }
-          }
-        } else if (data.status === PUBLIC_LIVE_STATUS.LIVEING) {
-          imLiveInfoResp = await getIMLiveInfo(roomId)
-            .catch(() => ({}))
-        }
-        data.imInfo = imLiveInfoResp
-      }
-      // 如果是转播或者是推流 直接播放（用于调试模式）
-      const { preview } = getUrlQuery() // 后台点预览会加这个参数
-      const generateInfo = preview ? Object.assign(data, {
-        status: 1
-      }) : data
-      setLiveInfo(generateInfo)
-    }
-    init()
-  }, [])
-
-  useEffect(() => {
-    if (userInfo) {
-      onReportProgress()
-    }
-  }, [userInfo])
-
-  useEffect(() => {
-    if (loginStatus !== LOGIN_STATUS.WAIT && liveInfo) {
-      onSendSensors({
-        pageName: TrackPageName,
-        eventName: 'edu_Platform_publiclive_detail_page',
-        params: {
-          publiclive_id: liveInfo.live_id,
-          publiclive_name: liveInfo.live_name,
-          // 1-直播, 2-录播
-          publiclive_type: liveInfo.type === 1 ? '实时直播' : '录播直播',
-          identity: userRole
-            ? USER_IDENTITY_NAME[userRole]
-            : '游客'
-        }
-      })
-    }
-  }, [!!userRole, !!liveInfo, loginStatus])
-
-  if (!isExist) {
-    return (
-      <div
-        className={classNames(
-          style['public-live-detail-wrapper'],
-          style['live-empty'],
-          containerClassName
-        )}
-        style={{
-          backgroundImage: `url(${errorCover})`
-        }}
-      >
-        <div className={style['empty-marker']} />
-        <div className={style['empty-content']}>
-          {/* eslint-disable-next-line max-len */}
-          <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADYAAAA2CAYAAACMRWrdAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAALOSURBVHgB7VqLbeMwDGVugctt4BEygje4bFBv0G5y2SC5Rc4jpBNEneDaLtBXCVIA16asL50U8AMEA7ZF6pG0PqSJVqxYIYkNCQHAVl8a3Xa6/dTt1+Dxs25v5rrZbN7o3qHJtLoddDsjHmfXp6V7gvGMbo+JZHxQuj3QraEHsXeDqQ11E4JaaaNbD3kcjS5aAlrRDmEvmefmu+lgjbAd9N86GXv3ToysHUlCK3hA2MItJcIRPQVky4RmgFSPCiED693TYuScRX14osowMnV79eirE5bOimqG2JEEMKNX1YgOQjj2b0GupxLAzmqxkCJnPgMuLPeUC4+1TPyfFib3xOhSGCwjKcK6uYHfgFzP6EqfuMB7qxm9sxg52O9tjHOqkDZ2sAuT43S1KQIOjIBdosLq5DwGP6QIGB9BVESfpcipkfy4cITdpGZZZQly4KMpPDt63P2bIiFNDvxsHd5mwR4n0jt+lSFGDvzs2I3f+8H05Ui8UAJ0gqbTl7/Mo64COS75MwlFjtgEOZkkKXKeseQRKxhER3KemwVHbGIR5OzJHGqTix1LFDFiXJ2CyuQa5t5kLeOIPTP3WipERXINc++dQkDBAh2D0qUAuQu065y8pUpBCTnkbqlcZ84qLVVEDjnwSaWkTXD0saUEqeRQemxxQrgiQ0OVEUsO/FbqQqkAn2coyw75dQXJed5JT6DCzo6KEVY9QUo0Tw62TFXurYEybqdvUmEiRQLE5TDzvTVS1jNCFYTKO1gqQQvpVDOvc47cpZpe+LOx5p5EUeLRQ+oDtT8DzKe7j6hXRupnSHUkAYRz+ccci8JuCObC778YqcEgUkq1e/f+uFTbOCPFlGovkC7VDgbXIG1qzoEJvX9Yqrg+ImisrlAXhpDxUn6Z6M4IXj1kZsSiE3t1IP+Xoz+ofCyS/knMfPTX6xWvZI/yJgXx8i1+EluxYsUEn1PRdSb/XhDOAAAAAElFTkSuQmCC" alt="" />
-          <p>{errorText || '内容已失效'}</p>
-        </div>
-
-      </div>
-    )
-  }
-
-  if (!liveInfo) {
-    return <Loading />
-  }
-
-  const isRecordLive = liveInfo.type === PUBLIC_LIVE_MODE.RECORDED
-  const beginTime = dayjs(liveInfo.begin_time)
-
-  const handlePlayReplay = (needReport) => {
-    if (needReport) {
-      onSendSensors({
-        pageName: TrackPageName,
-        eventName: 'edu_Platform_publiclive_detail_replay_click',
-        params: {
-          publiclive_id: liveInfo.live_id,
-          publiclive_name: liveInfo.live_name,
-          // 1-直播, 2-录播
-          publiclive_type: liveInfo.type === 1 ? '实时直播' : '录播直播'
-        }
-      })
-    }
-
-    setIsReplayMode(true)
-  }
-
-  const handleRequestFullScreen = () => {
-    onSendSensors({
-      pageName: TrackPageName,
-      eventName: 'edu_Platform_publiclive_detail_fullscreen_click'
-    })
-  }
-
-  const handleVideoPlay = (needReport) => {
-    if (needReport) {
-      onSendSensors({
-        pageName: TrackPageName,
-        eventName: 'edu_Platform_publiclive_detail_play_click',
-        params: {
-          publiclive_id: liveInfo.live_id,
-          publiclive_name: liveInfo.live_name,
-          // 1-直播, 2-录播
-          publiclive_type: liveInfo.type === 1 ? '实时直播' : '录播直播'
-        }
-      })
-    }
-    if (userInfo) {
-      // 登录且播放后上报
-      onReportTeacherTrain(userInfo?.user_id, liveId)
-    }
-  }
-
-  return (
-    <>
-      <div
-        className={classNames(
-          style['public-live-detail-wrapper'],
-          containerClassName
-        )}
-      >
-        <div
-          className={classNames(
-            className, style['live-panel']
-          )}
-        >
-          <div className={infoClassName}>
-
-            <div className={style['live-title']}>
-              <div className={style['live-name']}>
-                {liveInfo.live_name}
-              </div>
-              {
-                // eslint-disable-next-line no-nested-ternary
-                liveInfo.status === PUBLIC_LIVE_STATUS.LIVEING
-                  ? (
-                    <LiveOnlineCount
-                      className={style['live-online-count']}
-                      resId={liveId}
-                      onOnlineCountChange={onOnlineCountChange}
-                    />
-                  )
-                  : (
-                    liveInfo.status === PUBLIC_LIVE_STATUS.COMPLETEED
-                      ? (<div className={style['live-end']}>已结束</div>)
-                      : (<></>)
-                  )
-              }
-            </div>
-            <div className={style['live-info']}>
-              {/*
-                暂时隐藏主播
-                <div className={classNames(style['live-user'], {
-                [style['empty-user']]: !liveInfo.lecture_user_id && !liveInfo.lecture_user_name
-              })}
-              >
-                <Avatar className={style.avatar} src={getAvatarURL(liveInfo.lecture_user_id)} />
-                <span title={liveInfo.lecture_user_name}>{liveInfo.lecture_user_name}</span>
-              </div> */
-              }
-              <div className={style['live-time']}>
-                <Icon
-                  className={style['icon-time']}
-                  type="clock-circle"
-                />
-                <span>
-                  {`${beginTime.format(beginTime.isSame(dayjs(), 'day') ? '[今天] HH:mm' : 'YYYY-MM-DD HH:mm')} 开始`}
-                </span>
-              </div>
-            </div>
-          </div>
-          <div
-            className={classNames(style['live-video-wrapper'], playerClassName)}
-          >
-            <div className={style['live-wrap']}>
-              {
-                // eslint-disable-next-line no-nested-ternary
-                isReplayMode
-                  ? (
-                    <ReplayVideo
-                      handleLogin={handleLogin}
-                      liveInfo={liveInfo}
-                      autoplay={isLiveToReplay}
-                      onVideoPlay={() => {
-                        handleVideoPlay(false)
-                      }}
-                      onRequestFullScreen={handleRequestFullScreen}
-                    />
-                  )
-                  : isRecordLive
-                    ? (
-                      <RecordVideo
-                        isStreamLive={isStreamLive}
-                        userInfo={userInfo}
-                        liveInfo={liveInfo}
-                        visitTime={visitTime}
-                        diffTime={diffTime}
-                        onStatusChange={handleStatusChange}
-                        onPlayReplay={() => {
-                          handlePlayReplay(true)
-                        }}
-                        onVideoPlay={() => {
-                          handleVideoPlay(true)
-                        }}
-                        onRequestFullScreen={handleRequestFullScreen}
-                      />
-                    )
-                    : (
-                      <LiveVideo
-                        isStreamLive={isStreamLive}
-                        handleLogin={handleLogin}
-                        userInfo={userInfo}
-                        liveInfo={liveInfo}
-                        visitTime={visitTime}
-                        lineChanging={lineChanging}
-                        onStatusChange={handleStatusChange}
-                        onPlayReplay={() => {
-                          handlePlayReplay(true)
-                        }}
-                        onVideoPlay={() => {
-                          handleVideoPlay(true)
-                        }}
-                        onRequestFullScreen={handleRequestFullScreen}
-                      />
-                    )
-              }
-              {/* {
-                liveInfo?.chat_type && (
-                  <div className={style['chatroom-wrap']}>
-                    <div className={style['chatroom-title']}>
-                      讨论区
-                    </div>
-                    {
-                      userInfo ? (
-                        <>
-                          <div className={style['chatroom-top-hint']}>
-                            系统提示：倡导建康的直播环境，若发布违法、违规、低俗等不良消息，我们会对违规内容及帐号进行封禁处理。
-                          </div>
-                          <IMChatroom
-                            roomId={liveInfo.chat_room_id}
-                            disableEditor={!liveInfo.chat_enabled}
-                          />
-                        </>
-                      ) : (
-                        <NotLoginChatroom
-                          handleLogin={handleLogin}
-                        />
-                      )
-                    }
-                  </div>
-                )
-              } */}
-            </div>
-            {
-              !isReplayMode && !isRecordLive
-              && liveInfo.sub_type !== SUB_TYPE.NET_DRAGON
-              && liveInfo.status !== PUBLIC_LIVE_STATUS.COMPLETEED
-              && (
-                <LineSwitch
-                  className={style['live-line-switch']}
-                  liveInfo={liveInfo}
-                  onChange={handleSelectChange}
-                />
-              )
-            }
-          </div>
-        </div>
-        <div
-          className={classNames(
-            style['live-description-panel'],
-            descriptionClassName
-          )}
-        >
-          <div className={style['desc-title']}>开播介绍</div>
-          <div className={style['desc-content']}>
-            {!liveInfo.desc_pic_web_url ? '暂无介绍' : (
-              <img className={style['desc-content-img']} src={netUrl(liveInfo.desc_pic_web_url)} alt="" />
-            )}
-          </div>
-        </div>
-      </div>
-    </>
-  )
-}