Update:Minimized audio player allow swipe up to fullscreen #1046

This commit is contained in:
advplyr 2024-02-01 18:20:10 -06:00
parent 6e6dd00523
commit f5ec247b47

View file

@ -145,7 +145,6 @@ export default {
onPlaybackSpeedChangedListener: null, onPlaybackSpeedChangedListener: null,
touchStartY: 0, touchStartY: 0,
touchStartTime: 0, touchStartTime: 0,
touchEndY: 0,
playerSettings: { playerSettings: {
useChapterTrack: false, useChapterTrack: false,
useTotalTrack: true, useTotalTrack: true,
@ -423,6 +422,9 @@ export default {
AbsAudioPlayer.requestSession() AbsAudioPlayer.requestSession()
}, },
clickContainer() { clickContainer() {
this.expandToFullscreen()
},
expandToFullscreen() {
this.showFullscreen = true this.showFullscreen = true
// Update track for total time bar if useChapterTrack is set // Update track for total time bar if useChapterTrack is set
@ -639,38 +641,49 @@ export default {
resetStream(startTime) { resetStream(startTime) {
this.closePlayback() this.closePlayback()
}, },
handleGesture() {
var touchDistance = this.touchEndY - this.touchStartY
if (touchDistance > 100) {
this.collapseFullscreen()
}
},
touchstart(e) { touchstart(e) {
if (!this.showFullscreen || !e.changedTouches) return if (!e.changedTouches) return
if (e.pageX < 20) { const touchPosY = e.changedTouches[0].pageY
// when minimized only listen to touchstart on the player
if (!this.showFullscreen && touchPosY < window.innerHeight - 120) return
// for ios
if (!this.showFullscreen && e.pageX < 20) {
e.preventDefault() e.preventDefault()
e.stopImmediatePropagation() e.stopImmediatePropagation()
} }
this.touchStartY = e.changedTouches[0].screenY this.touchStartY = touchPosY
this.touchStartTime = Date.now() this.touchStartTime = Date.now()
}, },
touchend(e) { touchend(e) {
if (!e.changedTouches) return if (!e.changedTouches) return
const touchDuration = Date.now() - this.touchStartTime
const touchEndY = e.changedTouches[0].pageY
const touchDistanceY = touchEndY - this.touchStartY
// reset touch start data
this.touchStartTime = 0
this.touchStartY = 0
if (this.isDraggingCursor) { if (this.isDraggingCursor) {
if (this.draggingCurrentTime !== this.currentTime) { if (this.draggingCurrentTime !== this.currentTime) {
this.seek(this.draggingCurrentTime) this.seek(this.draggingCurrentTime)
} }
this.isDraggingCursor = false this.isDraggingCursor = false
} else if (this.showFullscreen) { } else {
this.touchEndY = e.changedTouches[0].screenY
var touchDuration = Date.now() - this.touchStartTime
if (touchDuration > 1200) { if (touchDuration > 1200) {
// console.log('touch too long', touchDuration) // console.log('touch too long', touchDuration)
return return
} }
this.handleGesture() if (this.showFullscreen) {
// Touch start higher than touchend
if (touchDistanceY > 100) {
this.collapseFullscreen()
}
} else if (touchDistanceY < -100) {
this.expandToFullscreen()
}
} }
}, },
touchmove(e) { touchmove(e) {