|
@ -6,15 +6,15 @@ import VideoOperation from './videoOperation' |
|
|
import './videoPlay.less'; |
|
|
import './videoPlay.less'; |
|
|
|
|
|
|
|
|
const VideoPlay = ({ |
|
|
const VideoPlay = ({ |
|
|
height, width, |
|
|
height, width, type, containerId = 'myPlayer', yingshiToken, |
|
|
// playUrl, |
|
|
// playUrl, |
|
|
|
|
|
|
|
|
}) => { |
|
|
}) => { |
|
|
const [jessibuca, setjessibuca] = useState(null) |
|
|
const [jessibuca, setjessibuca] = useState(null) |
|
|
const [playUrl, setPlayUrl] = useState( |
|
|
const [playUrl, setPlayUrl] = useState( |
|
|
// 'http://flv.bdplay.nodemedia.cn/live/bbb.flv' // TEST |
|
|
// 'http://flv.bdplay.nodemedia.cn/live/bbb.flv' // TEST |
|
|
// 'http://221.230.55.27:2020/hdl/36011200002002021114/36011200581314002916.flv', |
|
|
'ws://221.230.55.27:8081/jessica/34020000001110000077/34020000001310000001', |
|
|
'ws://221.230.55.27:8081/jessica/34020000001110000077/34020000001310000003' |
|
|
// 'ws://221.230.55.27:8081/jessica/34020000001110000077/34020000001310000003' |
|
|
) |
|
|
) |
|
|
const [isPlaying, setIsPlaying] = useState(false) |
|
|
const [isPlaying, setIsPlaying] = useState(false) |
|
|
const [operationState, setoperationState] = useState() |
|
|
const [operationState, setoperationState] = useState() |
|
@ -121,12 +121,27 @@ const VideoPlay = ({ |
|
|
{/* 顶部信息 */} |
|
|
{/* 顶部信息 */} |
|
|
<VideoHeader operationState={operationState} changeSelectState={changeSelectState} setoperationState={setoperationState} /> |
|
|
<VideoHeader operationState={operationState} changeSelectState={changeSelectState} setoperationState={setoperationState} /> |
|
|
{/* 视频内容 */} |
|
|
{/* 视频内容 */} |
|
|
|
|
|
{ |
|
|
|
|
|
type == 'yingshi' ? |
|
|
|
|
|
<iframe |
|
|
|
|
|
frameBorder="0" |
|
|
|
|
|
id={containerId} |
|
|
|
|
|
src={`https://open.ys7.com/ezopen/h5/iframe?audio=${'audio' ? '1' : '0'}&url=${playUrl}&autoplay=${1}&accessToken=${yingshiToken}`} |
|
|
|
|
|
// https://open.ys7.com/doc/zh/book/index/live_proto.html |
|
|
|
|
|
// 单个播放器的长宽比例限制最小为{width: 400px;height: 300px;} |
|
|
|
|
|
width={'100%'} |
|
|
|
|
|
height={'100%'} |
|
|
|
|
|
allowFullScreen |
|
|
|
|
|
wmode="transparent" |
|
|
|
|
|
/> : |
|
|
<div id="container" |
|
|
<div id="container" |
|
|
style={{ |
|
|
style={{ |
|
|
height: '100%', width: '100%' |
|
|
height: '100%', width: '100%' |
|
|
}}> |
|
|
}}> |
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
{/* 云控 对讲 对应操作内容 */} |
|
|
{/* 云控 对讲 对应操作内容 */} |
|
|
<VideoOperation |
|
|
<VideoOperation |
|
|
operationState={operationState} operation={operation} |
|
|
operationState={operationState} operation={operation} |
|
|