Browse Source

ceshi

dev_trial
wenlele 2 years ago
parent
commit
91af0880bc
  1. 108
      code/VideoAccess-VCMP/web/client/src/components/videoPlayer/videoPlay.jsx
  2. 29
      code/VideoAccess-VCMP/web/client/src/sections/openness/components/container.jsx

108
code/VideoAccess-VCMP/web/client/src/components/videoPlayer/videoPlay.jsx

@ -332,7 +332,7 @@ const VideoPlay = ({ dispatch, actions,
if (histroyTime.length) { if (histroyTime.length) {
setHistroyBegain(histroyTime[0]) setHistroyBegain(histroyTime[0])
Begain.current = histroyTime[0] Begain.current = histroyTime[0]
if(document.getElementById('process_point')){ if (document.getElementById('process_point')) {
document.getElementById('process_point').style.left = 0 + 'px'; // document.getElementById('process_point').style.left = 0 + 'px'; //
} }
if (videoObj.type == 'yingshi') { if (videoObj.type == 'yingshi') {
@ -455,27 +455,27 @@ const VideoPlay = ({ dispatch, actions,
flvPlayer.current = flv flvPlayer.current = flv
} else { } else {
videoFront = new moment(); // videoFront = new moment(); //
const player = new EZUIKit.EZUIKitPlayer({ // const player = new EZUIKit.EZUIKitPlayer({
id: containerId, // ID // id: containerId, // ID
accessToken: videoObj?.yingshiToken, // accessToken: videoObj?.yingshiToken,
url: videoObj.playUrlSd, // url: videoObj.playUrlSd,
width: setupSize('width'), // width: -10,
height: setupSize('height'), // height: -10,
handleSuccess: (e) => { // // handleSuccess: (e) => { //
setRoll(true) // setRoll(true)
setVideoMask(false) // setVideoMask(false)
playState.current = true // playState.current = true
videoAfter = new moment(); // // videoAfter = new moment(); //
}, // },
handleError: (e) => { // // handleError: (e) => { //
console.log(e, '播放失败'); // console.log(e, '');
setNumbers(e.retcode) // setNumbers(e.retcode)
videoAfter = new moment(); // // videoAfter = new moment(); //
setDisappear(true) // setDisappear(true)
}, // },
}) // })
setPlayer(player) // setPlayer(player)
yingshiPlayer.current = player // yingshiPlayer.current = player
} }
} }
@ -581,38 +581,38 @@ const VideoPlay = ({ dispatch, actions,
setShowTime={setShowTime} setShowTime={setShowTime}
setShowTimeSelect={setShowTimeSelect} setShowTimeSelect={setShowTimeSelect}
/> */} /> */}
{/* 视频内容 */} {/* 视频内容 */}
{ {
// <iframe // <iframe
// frameBorder="0" // frameBorder="0"
// allowFullScreen='true' // allowFullScreen='true'
// id={containerId} // id={containerId}
// src={ // src={
// `${yingshiUrl}?audio=${videoObj.audio && operationState && !operationState.histroy.select ? '1' : '0'}&url=${operationState && operationState.histroy.select && histroyBegain ? `${videoObj.replayUrl}?begin=${moment(histroyBegain).format("YYYYMMDDHHmmss")}&end=${moment(histroyTime[1]).format("YYYYMMDDHHmmss")}` : resolution == 'sd' ? videoObj.playUrlSd : videoObj.playUrlHd}&autoplay=${'1'}&accessToken=${videoObj.yingshiToken}` // `${yingshiUrl}?audio=${videoObj.audio && operationState && !operationState.histroy.select ? '1' : '0'}&url=${operationState && operationState.histroy.select && histroyBegain ? `${videoObj.replayUrl}?begin=${moment(histroyBegain).format("YYYYMMDDHHmmss")}&end=${moment(histroyTime[1]).format("YYYYMMDDHHmmss")}` : resolution == 'sd' ? videoObj.playUrlSd : videoObj.playUrlHd}&autoplay=${'1'}&accessToken=${videoObj.yingshiToken}`
// } // }
// // https://open.ys7.com/doc/zh/book/index/live_proto.html // // https://open.ys7.com/doc/zh/book/index/live_proto.html
// // {width: 400px;height: 300px;} // // {width: 400px;height: 300px;}
// width={'100%'} // width={'100%'}
// height={'100%'} // height={'100%'}
// wmode="transparent" // wmode="transparent"
// style={{ pointerEvents: 'none' }} // style={{ pointerEvents: 'none' }}
// /> // />
} }
{ {
videoObj.type == 'yingshi' ? videoObj.type == 'yingshi' ?
<div id={containerId} style={{ height: '100%', width: '100%', }}></div> : <div id={containerId} style={{ height: '100%', width: '100%', }}></div> :
<video id={containerId} <video id={containerId}
autoplay muted autoplay muted
style={{ height: '100%', width: '100%', }}> style={{ height: '100%', width: '100%', }}>
</video> </video>
} }
{/* {videoMask ? <div style={{ height: '100%', width: '100%', position: 'absolute', top: '0', left: '0', backgroundColor: 'black', color: "red", }}><div style={{ position: 'absolute', top: 'calc(60%)', left: 0, zIndex: 99, textAlign: 'center', width: '100%' }}>{written}</div></div> : ''} */} {/* {videoMask ? <div style={{ height: '100%', width: '100%', position: 'absolute', top: '0', left: '0', backgroundColor: 'black', color: "red", }}><div style={{ position: 'absolute', top: 'calc(60%)', left: 0, zIndex: 99, textAlign: 'center', width: '100%' }}>{written}</div></div> : ''} */}
{/* 下方操作栏 */} {/* 下方操作栏 */}
{/* 显示操作功能条件(宽高) */} {/* 显示操作功能条件(宽高) */}
{/* {size?.parentWidth > 479 ? {/* {size?.parentWidth > 479 ?
<VideoOperation <VideoOperation
operationState={operationState} operation={operation} operationState={operationState} operation={operation}
voiceDisY={voiceDisY} setVoiceDisY={setVoiceDisY} voiceDisY={voiceDisY} setVoiceDisY={setVoiceDisY}
@ -639,9 +639,9 @@ const VideoPlay = ({ dispatch, actions,
microAppVideo={microAppVideo} microAppVideo={microAppVideo}
/> : "" /> : ""
} */} } */}
</div>
</div> </div>
</div>
</> </>
) )
} }

29
code/VideoAccess-VCMP/web/client/src/sections/openness/components/container.jsx

@ -6,18 +6,21 @@ import { useState } from 'react';
const Container = ({ videoObj, pageSize, showHeader, videoPlay, mould }) => { const Container = ({ videoObj, pageSize, showHeader, videoPlay, mould }) => {
const [videoWidth, setVideoWidth] = useState() const [videoWidth, setVideoWidth] = useState(300)
const [videoHeight, setVideoHeight] = useState() const [videoHeight, setVideoHeight] = useState(200)
// console.log(videoObj); // console.log(videoObj);
useEffect(() => { useEffect(() => {
const resize_ = async () => { const resize_ = async () => {
let video = document.getElementById('video' + videoObj.key) try {
if (video) { let video = document.getElementById('video' + videoObj.key)
await setVideoWidth(video.clientWidth) if (video) {
await setVideoHeight(video.clientHeight) await setVideoWidth(video.clientWidth)
await setVideoHeight(video.clientHeight)
}
} catch (error) {
console.error(error)
} }
} }
resize_() resize_()
window.addEventListener('resize', resize_); // window.addEventListener('resize', resize_); //
@ -27,10 +30,14 @@ const Container = ({ videoObj, pageSize, showHeader, videoPlay, mould }) => {
}, []) }, [])
useEffect(() => { useEffect(() => {
let video = document.getElementById('video' + videoObj.key) try {
if(video){ let video = document.getElementById('video' + videoObj.key)
setVideoWidth(video.clientWidth) if (video) {
setVideoHeight(video.clientHeight) setVideoWidth(video.clientWidth)
setVideoHeight(video.clientHeight)
}
} catch (error) {
console.error(error)
} }
}, [pageSize, showHeader]) }, [pageSize, showHeader])
// console.log(videoWidth, videoHeight); // console.log(videoWidth, videoHeight);

Loading…
Cancel
Save