mirror of
https://github.com/advplyr/audiobookshelf-app.git
synced 2025-08-28 22:08:47 +02:00
Update:Minimized audio player allow swipe up to fullscreen #1046
This commit is contained in:
parent
6e6dd00523
commit
f5ec247b47
1 changed files with 27 additions and 14 deletions
|
@ -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) {
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue