Browse Source

优化视频组件

pull/19/head
zyronon 3 years ago
parent
commit
b2daccf106
  1. 21
      src/components/BVideo.vue
  2. 1
      src/pages/slide/SlideVerticalInfinite.vue
  3. 4
      src/utils/mixin.js

21
src/components/BVideo.vue

@ -195,6 +195,7 @@ export default {
line: null, line: null,
point: null, point: null,
isMove: false, isMove: false,
isSingleClick: false,
test: [1, 2], test: [1, 2],
lVideo: this.video, lVideo: this.video,
@ -210,15 +211,14 @@ export default {
let video = this.$refs.video let video = this.$refs.video
video.currentTime = 0 video.currentTime = 0
let fun = e => { let fun = e => {
this.loading = false
this.currentTime = Math.ceil(e.target.currentTime) this.currentTime = Math.ceil(e.target.currentTime)
this.pageX = this.currentTime * this.step this.pageX = this.currentTime * this.step
} }
video.addEventListener('loadedmetadata', e => { video.addEventListener('loadedmetadata', e => {
this.videoScreenHeight = video.videoHeight / (video.videoWidth / this.width) this.videoScreenHeight = video.videoHeight / (video.videoWidth / this.width)
this.duration = video.duration this.duration = video.duration
// if (this.duration > 60) { if (this.duration > 60) {
if (this.duration > 6) { // if (this.duration > 6) {
this.step = this.width / Math.floor(this.duration) this.step = this.width / Math.floor(this.duration)
video.addEventListener('timeupdate', fun) video.addEventListener('timeupdate', fun)
} }
@ -228,14 +228,11 @@ export default {
video.addEventListener(e, () => { video.addEventListener(e, () => {
if (e === 'playing') this.loading = false if (e === 'playing') this.loading = false
if (e === 'waiting') { if (e === 'waiting') {
// console.log('paused',this.paused) if (!this.paused && !this.isSingleClick) {
console.log('!this.paused ', !this.paused)
console.log(' !this.isPlaying', !this.isPlaying)
if (!this.paused && !this.isPlaying) {
this.loading = true this.loading = true
} }
} }
console.log(e, t) // console.log(e, t)
}, false); }, false);
} }
@ -270,10 +267,13 @@ export default {
videoWrapper.on('singleClick', () => { videoWrapper.on('singleClick', () => {
if (this.isPlaying) { if (this.isPlaying) {
this.pause() this.pause()
this.paused = true
} else { } else {
this.play() this.play()
this.paused = false //playgwaitingloading
this.isSingleClick = true
setTimeout(()=>{
this.isSingleClick = false
},300)
} }
this.loading = false this.loading = false
}) })
@ -305,6 +305,7 @@ export default {
new Dom(`.${this.name}-music`).trigger('pause') new Dom(`.${this.name}-music`).trigger('pause')
// console.log('trigger-pause') // console.log('trigger-pause')
this.$refs.video.pause() this.$refs.video.pause()
this.paused = true
this.isPlaying = false this.isPlaying = false
}, },
$likeNum(v) { $likeNum(v) {

1
src/pages/slide/SlideVerticalInfinite.vue

@ -155,6 +155,7 @@ export default {
this.startY = e.touches[0].pageY this.startY = e.touches[0].pageY
this.startTime = Date.now() this.startTime = Date.now()
}, },
//TODO 2022-3-28:
touchMove(e) { touchMove(e) {
this.moveX = e.touches[0].pageX - this.startX this.moveX = e.touches[0].pageX - this.startX
this.moveY = e.touches[0].pageY - this.startY this.moveY = e.touches[0].pageY - this.startY

4
src/utils/mixin.js

@ -142,13 +142,13 @@ export default {
} }
} }
let check = (e) => { let check = (e) => {
let checkTime = 400 let checkTime = 300
if (isDbClick) { if (isDbClick) {
dbClick(e) dbClick(e)
clearTimeout(dbClickTimer); clearTimeout(dbClickTimer);
dbClickTimer = setTimeout(() => { dbClickTimer = setTimeout(() => {
isDbClick = false isDbClick = false
}, 400); }, checkTime);
return return
} }
let nowTime = new Date().getTime(); let nowTime = new Date().getTime();

Loading…
Cancel
Save