bugfix
This commit is contained in:
@ -25,7 +25,7 @@
|
||||
class="time-slider"
|
||||
reverse
|
||||
vertical
|
||||
@update-value="getPlaybackProcess"></n-slider>
|
||||
@update-value="setPlaybackProcess"></n-slider>
|
||||
<div ref="rotateElementRef" :class="`modal`">
|
||||
<video
|
||||
ref="videoElementRef"
|
||||
@ -223,10 +223,6 @@ const closePlayModal = async () => {
|
||||
`${url.protocol}//${url.host}/api/v1/playback/stop?serial=${serial}&code=${serial}&streamid=${playbackStreamId.value}&token=${tokenStore.token}`
|
||||
);
|
||||
|
||||
// document.removeEventListener("touchstart", handleZoomStart)
|
||||
// document.removeEventListener("touchend", handleZoomEnd)
|
||||
// document.removeEventListener("touchmove", handleZooming)
|
||||
// console.log('zoom event unbind')
|
||||
};
|
||||
|
||||
// url: "https://sf1-hscdn-tos.pstatp.com/obj/media-fe/xgplayer_doc_video/flv/xgplayer-demo-360p.flv",
|
||||
@ -337,7 +333,7 @@ const playbackProcess = ref(0)
|
||||
* @param value 秒
|
||||
* @return {Promise<void>}
|
||||
*/
|
||||
const getPlaybackProcess = debounce(async (value) => {
|
||||
const setPlaybackProcess = debounce(async (value) => {
|
||||
if (!tokenStore.token) {
|
||||
await tokenStore.fetchToken();
|
||||
}
|
||||
@ -347,20 +343,16 @@ const getPlaybackProcess = debounce(async (value) => {
|
||||
`${url.protocol}//${url.host}/api/v1/playback/control?serial=${serial}&code=${serial}&streamid=${playbackStreamId.value}&command=play&range=${value}&token=${tokenStore.token}`
|
||||
);
|
||||
}, 500)
|
||||
|
||||
onUnmounted(() => {
|
||||
console.log("destroy player here");
|
||||
if (flvPlayer) {
|
||||
flvDestroy();
|
||||
}
|
||||
// document.removeEventListener("touchstart", handleZoomStart)
|
||||
// document.removeEventListener("touchend", handleZoomEnd)
|
||||
// document.removeEventListener("touchmove", handleZooming)
|
||||
});
|
||||
|
||||
|
||||
const lastDistance = ref(0)
|
||||
const scaleFactor = ref(1)
|
||||
const zoomStatus = ref(0) // 0 stop, 1 zoomin, 2 zoomout
|
||||
|
||||
|
||||
const isToday = ref(false)
|
||||
const handleConfirmRange = (value) => {
|
||||
@ -420,85 +412,6 @@ watch(playbackFlvUrl, async (url, oldUrl) => {
|
||||
|
||||
})
|
||||
|
||||
/*摄像头缩放操作*/
|
||||
function handleZoomStart(event) {
|
||||
console.log(event.touches.length)
|
||||
if (event.touches.length === 2) {
|
||||
// 计算两个手指的距离
|
||||
let touch1 = event.touches[0];
|
||||
let touch2 = event.touches[1];
|
||||
lastDistance.value = Math.sqrt(
|
||||
Math.pow(touch2.pageX - touch1.pageX, 2) +
|
||||
Math.pow(touch2.pageY - touch1.pageY, 2)
|
||||
);
|
||||
// 防止整个网页被放大
|
||||
event.preventDefault();
|
||||
}
|
||||
}
|
||||
|
||||
function handleZooming(event) {
|
||||
console.log('zoom in')
|
||||
if (event.touches.length === 2) {
|
||||
// 计算两个手指的距离
|
||||
let touch1 = event.touches[0];
|
||||
let touch2 = event.touches[1];
|
||||
let distance = Math.sqrt(
|
||||
Math.pow(touch2.pageX - touch1.pageX, 2) +
|
||||
Math.pow(touch2.pageY - touch1.pageY, 2)
|
||||
);
|
||||
if (distance - lastDistance.value > 0) {
|
||||
/*如果距离增加则放大*/
|
||||
zoomStatus.value = 1
|
||||
} else if (lastDistance.value - distance > 0) {
|
||||
/*如果距离减小则缩小*/
|
||||
zoomStatus.value = 2
|
||||
}
|
||||
// 计算缩放比例
|
||||
scaleFactor.value *= distance / lastDistance.value;
|
||||
// 保存上一次的距离
|
||||
lastDistance.value = distance;
|
||||
console.log(scaleFactor.value)
|
||||
console.log(lastDistance.value)
|
||||
// 防止整个网页被放大
|
||||
event.preventDefault();
|
||||
}
|
||||
}
|
||||
|
||||
function handleZoomEnd(event) {
|
||||
zoomStatus.value = 0
|
||||
if (event.touches.length < 2) {
|
||||
// 重置缩放比例和距离
|
||||
scaleFactor.value = 1;
|
||||
lastDistance.value = 0;
|
||||
}
|
||||
}
|
||||
|
||||
// watch(zoomStatus, async (value, oldValue) => {
|
||||
// if (!tokenStore.token) {
|
||||
// await tokenStore.fetchToken();
|
||||
// }
|
||||
// const serial = source.value.split("/flv/hls/")[1].split("_")[0];
|
||||
// const url = new URL(source.value);
|
||||
// if (value === 0) {
|
||||
// await axios.get(
|
||||
// `${url.protocol}//${url.host}/api/v1/control/ptz?serial=${serial}&code=${serial}&command=stop&token=${tokenStore.token}`
|
||||
// );
|
||||
// } else if (value === 1) {
|
||||
// oldValue !== 0 && await axios.get(
|
||||
// `${url.protocol}//${url.host}/api/v1/control/ptz?serial=${serial}&code=${serial}&command=stop&token=${tokenStore.token}`
|
||||
// );
|
||||
// await axios.get(
|
||||
// `${url.protocol}//${url.host}/api/v1/control/ptz?serial=${serial}&code=${serial}&command=zoomin&token=${tokenStore.token}`
|
||||
// );
|
||||
// } else if (value === 2) {
|
||||
// oldValue !== 0 && await axios.get(
|
||||
// `${url.protocol}//${url.host}/api/v1/control/ptz?serial=${serial}&code=${serial}&command=stop&token=${tokenStore.token}`
|
||||
// );
|
||||
// await axios.get(
|
||||
// `${url.protocol}//${url.host}/api/v1/control/ptz?serial=${serial}&code=${serial}&command=zoomout&token=${tokenStore.token}`
|
||||
// );
|
||||
// }
|
||||
// })
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import "../assets/fonts/iconfont.css";
|
||||
|
@ -144,7 +144,7 @@ const loadProjectList = async () => {
|
||||
// "CEDATE": 1703260800000,
|
||||
// "PROFILE": "",
|
||||
// "ACCDATE": 1703260800000,
|
||||
// "ID": "a0fb6df5-48e4-442f-8b9d-da5861c1bf41"
|
||||
// "ID": "a0fb6df5-48e4-442f-8b9d-da5861c1bf41"q
|
||||
// }]
|
||||
// }
|
||||
const resp = await axios.get(
|
||||
|
Reference in New Issue
Block a user