Mirrors/audiobookshelf
Mirrors/audiobookshelf
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf.git synced 2025-10-27 11:18:14 +01:00
Code Issues Packages Projects Releases Wiki Activity

Fix player track tooltip overflowing on share player

Browse Source
This commit is contained in:
advplyr 2025-04-29 17:46:54 -05:00
parent 9f834a5345
commit 6819c0b108
2 changed files with 13 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
client/components/player/PlayerTrackBar.vue
View File

@ -74,6 +74,9 @@ export default {
currentChapterStart() { currentChapterStart() {
if (!this.currentChapter) return 0 if (!this.currentChapter) return 0
return this.currentChapter.start return this.currentChapter.start
},
isMobile() {
return this.$store.state.globals.isMobile
} }
}, },
methods: { methods: {
@ -145,6 +148,9 @@ export default {
}) })
}, },
mousemoveTrack(e) { mousemoveTrack(e) {
if (this.isMobile) {
return
}
const offsetX = e.offsetX const offsetX = e.offsetX
const baseTime = this.useChapterTrack ? this.currentChapterStart : 0 const baseTime = this.useChapterTrack ? this.currentChapterStart : 0
@ -198,6 +204,7 @@ export default {
setTrackWidth() { setTrackWidth() {
if (this.$refs.track) { if (this.$refs.track) {
this.trackWidth = this.$refs.track.clientWidth this.trackWidth = this.$refs.track.clientWidth
this.trackOffsetLeft = this.$refs.track.getBoundingClientRect().left
} else { } else {
console.error('Track not loaded', this.$refs) console.error('Track not loaded', this.$refs)
} }

5
client/pages/share/_slug.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<div class="w-full h-dvh max-h-dvh overflow-hidden" :style="{ backgroundColor: coverRgb }"> <div class="w-full max-w-full h-dvh max-h-dvh overflow-hidden" :style="{ backgroundColor: coverRgb }">
<div class="w-screen h-screen absolute inset-0 pointer-events-none" style="background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(38, 38, 38, 1) 80%)"></div> <div class="w-screen h-screen absolute inset-0 pointer-events-none" style="background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(38, 38, 38, 1) 80%)"></div>
<div class="absolute inset-0 w-screen h-dvh flex items-center justify-center z-10"> <div class="absolute inset-0 w-screen h-dvh flex items-center justify-center z-10">
<div class="w-full p-2 sm:p-4 md:p-8"> <div class="w-full p-2 sm:p-4 md:p-8">
@ -335,8 +335,11 @@ export default {
} }
}, },
resize() { resize() {
setTimeout(() => {
this.windowWidth = window.innerWidth this.windowWidth = window.innerWidth
this.windowHeight = window.innerHeight this.windowHeight = window.innerHeight
this.$store.commit('globals/updateWindowSize', { width: window.innerWidth, height: window.innerHeight })
}, 100)
}, },
playerError(error) { playerError(error) {
console.error('Player error', error) console.error('Player error', error)