free-sun
/
FS-IOT
15
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

ceshi

dev_trial
wenlele 2 years ago
parent
155d292140
commit
91af0880bc
2 changed files with 72 additions and 65 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  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
View File

@ -332,7 +332,7 @@ const VideoPlay = ({ dispatch, actions,
if (histroyTime.length) {
setHistroyBegain(histroyTime[0])
Begain.current = histroyTime[0]
if(document.getElementById('process_point')){
if (document.getElementById('process_point')) {
document.getElementById('process_point').style.left = 0 + 'px'; // 重置进度条的位置
}
if (videoObj.type == 'yingshi') {
@ -455,27 +455,27 @@ const VideoPlay = ({ dispatch, actions,
flvPlayer.current = flv
} else {
videoFront = new moment(); //验证前时间
const player = new EZUIKit.EZUIKitPlayer({
id: containerId, // 视频容器ID
accessToken: videoObj?.yingshiToken,
url: videoObj.playUrlSd,
width: setupSize('width'),
height: setupSize('height'),
handleSuccess: (e) => { //播放成功
setRoll(true)
setVideoMask(false)
playState.current = true
videoAfter = new moment(); //验证后时间
},
handleError: (e) => { //播放失败
console.log(e, '播放失败');
setNumbers(e.retcode)
videoAfter = new moment(); //验证后时间
setDisappear(true)
},
})
setPlayer(player)
yingshiPlayer.current = player
// const player = new EZUIKit.EZUIKitPlayer({
// id: containerId, // 视频容器ID
// accessToken: videoObj?.yingshiToken,
// url: videoObj.playUrlSd,
// width: -10,
// height: -10,
// handleSuccess: (e) => { //播放成功
// setRoll(true)
// setVideoMask(false)
// playState.current = true
// videoAfter = new moment(); //验证后时间
// },
// handleError: (e) => { //播放失败
// console.log(e, '播放失败');
// setNumbers(e.retcode)
// videoAfter = new moment(); //验证后时间
// setDisappear(true)
// },
// })
// setPlayer(player)
// yingshiPlayer.current = player
}
}
@ -581,38 +581,38 @@ const VideoPlay = ({ dispatch, actions,
setShowTime={setShowTime}
setShowTimeSelect={setShowTimeSelect}
/> */}
{/* 视频内容 */}
{
// <iframe
// frameBorder="0"
// allowFullScreen='true'
// id={containerId}
// 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}`
// }
// // https://open.ys7.com/doc/zh/book/index/live_proto.html
// // 单个播放器的长宽比例限制最小为{width: 400px;height: 300px;}
// width={'100%'}
// height={'100%'}
// wmode="transparent"
// style={{ pointerEvents: 'none' }}
// />
}
{
videoObj.type == 'yingshi' ?
<div id={containerId} style={{ height: '100%', width: '100%', }}></div> :
<video id={containerId}
autoplay muted
style={{ height: '100%', width: '100%', }}>
</video>
}
{/* 视频内容 */}
{
// <iframe
// frameBorder="0"
// allowFullScreen='true'
// id={containerId}
// 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}`
// }
// // https://open.ys7.com/doc/zh/book/index/live_proto.html
// // 单个播放器的长宽比例限制最小为{width: 400px;height: 300px;}
// width={'100%'}
// height={'100%'}
// wmode="transparent"
// style={{ pointerEvents: 'none' }}
// />
}
{
videoObj.type == 'yingshi' ?
<div id={containerId} style={{ height: '100%', width: '100%', }}></div> :
<video id={containerId}
autoplay muted
style={{ height: '100%', width: '100%', }}>
</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
operationState={operationState} operation={operation}
voiceDisY={voiceDisY} setVoiceDisY={setVoiceDisY}
@ -639,9 +639,9 @@ const VideoPlay = ({ dispatch, actions,
microAppVideo={microAppVideo}
/> : ""
} */}
</div>
</div>
</div>
</>
)
}

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

@ -6,18 +6,21 @@ import { useState } from 'react';
const Container = ({ videoObj, pageSize, showHeader, videoPlay, mould }) => {
const [videoWidth, setVideoWidth] = useState()
const [videoHeight, setVideoHeight] = useState()
const [videoWidth, setVideoWidth] = useState(300)
const [videoHeight, setVideoHeight] = useState(200)
// console.log(videoObj);
useEffect(() => {
const resize_ = async () => {
let video = document.getElementById('video' + videoObj.key)
if (video) {
await setVideoWidth(video.clientWidth)
await setVideoHeight(video.clientHeight)
try {
let video = document.getElementById('video' + videoObj.key)
if (video) {
await setVideoWidth(video.clientWidth)
await setVideoHeight(video.clientHeight)
}
} catch (error) {
console.error(error)
}
}
resize_()
window.addEventListener('resize', resize_); //只要窗口殴大小发生像素变化就会触发
@ -27,10 +30,14 @@ const Container = ({ videoObj, pageSize, showHeader, videoPlay, mould }) => {
}, [])
useEffect(() => {
let video = document.getElementById('video' + videoObj.key)
if(video){
setVideoWidth(video.clientWidth)
setVideoHeight(video.clientHeight)
try {
let video = document.getElementById('video' + videoObj.key)
if (video) {
setVideoWidth(video.clientWidth)
setVideoHeight(video.clientHeight)
}
} catch (error) {
console.error(error)
}
}, [pageSize, showHeader])
// console.log(videoWidth, videoHeight);

Write Preview
Loading…
Cancel
Save