starred/audiobookshelf-app
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf-app.git synced 2026-08-26 13:24:39 +02:00
Code Issues 454 Packages Projects Releases 10 Wiki Activity

Merge branch 'master' into new_jwt_auth

Browse Source
This commit is contained in:
advplyr
2025-07-06 09:07:17 -05:00
parent fab94cd363 2f3a9a5d96
commit d35dd2df1a
1 changed files with 18 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/cards/LazyListBookCard.vue
+18 -3
View File
@@ -30,8 +30,13 @@
</p> </p>
</div> </div>
<div v-if="showPlayButton" class="absolute top-0 bottom-0 right-0 h-full flex items-center justify-center z-20 pr-1"> <div v-if="showPlayButton" class="absolute top-0 bottom-0 right-0 h-full flex items-center justify-center z-20 pr-1">
<button type="button" class="p-2 rounded-full bg-fg-muted/50" @click.stop.prevent="play"> <button type="button" class="relative rounded-full bg-fg-muted/50" :class="{ 'p-2': !playerIsStartingForThisMedia }" @click.stop.prevent="play">
<span class="material-symbols text-2xl fill text-white">{{ playerIsPlaying ? 'pause' : 'play_arrow' }}</span> <span v-if="!playerIsStartingForThisMedia" class="material-symbols text-2xl fill text-white">{{ playerIsPlaying ? 'pause' : 'play_arrow' }}</span>
<div v-else class="p-2 text-fg w-10 h-10 flex items-center justify-center bg-fg-muted/80 rounded-full overflow-hidden">
<svg class="animate-spin" style="width: 24px; height: 24px" viewBox="0 0 24 24">
<path fill="currentColor" d="M12,4V2A10,10 0 0,0 2,12H4A8,8 0 0,1 12,4Z" />
</svg>
</div>
</button> </button>
</div> </div>
@@ -234,6 +239,14 @@ export default {
playerIsPlaying() { playerIsPlaying() {
return this.store.state.playerIsPlaying && (this.isStreaming || this.isPlaying) return this.store.state.playerIsPlaying && (this.isStreaming || this.isPlaying)
}, },
playerIsStartingPlayback() {
// Play has been pressed and waiting for native play response
return this.store.state.playerIsStartingPlayback
},
playerIsStartingForThisMedia() {
const mediaId = this.store.state.playerStartingPlaybackMediaId
return mediaId === this.libraryItemId
},
isCasting() { isCasting() {
return this.store.state.isCasting return this.store.state.isCasting
}, },
@@ -312,6 +325,8 @@ export default {
this.$emit('select', this.libraryItem) this.$emit('select', this.libraryItem)
}, },
async play() { async play() {
if (this.playerIsStartingPlayback) return
const hapticsImpact = this.$hapticsImpact || this.$nuxt.$hapticsImpact const hapticsImpact = this.$hapticsImpact || this.$nuxt.$hapticsImpact
if (hapticsImpact) { if (hapticsImpact) {
await hapticsImpact() await hapticsImpact()
@@ -332,7 +347,7 @@ export default {
libraryItemId = this.localLibraryItem.id libraryItemId = this.localLibraryItem.id
} }
this.store.commit('setPlayerIsStartingPlayback', libraryItemId) this.store.commit('setPlayerIsStartingPlayback', this.libraryItemId)
eventBus.$emit('play-item', { libraryItemId, serverLibraryItemId: this.libraryItemId }) eventBus.$emit('play-item', { libraryItemId, serverLibraryItemId: this.libraryItemId })
} }
}, },