mirror/advplyr.audiobookshelf-app
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf-app.git synced 2025-08-01 08:34:33 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix:Switch to library of item when clicking on title of fullscreen audio player #803

Browse source
This commit is contained in:
advplyr 2023-09-11 17:08:15 -05:00
parent 72f687b079
commit 6d61b2acaf
3 changed files with 15 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

6
components/app/AudioPlayer.vue
View file

@ -48,7 +48,7 @@
<div id="playerContent" class="playerContainer w-full z-20 absolute bottom-0 left-0 right-0 p-2 pointer-events-auto transition-all" :style="{ backgroundColor: showFullscreen ? '' : coverRgb }" @click="clickContainer"> <div id="playerContent" class="playerContainer w-full z-20 absolute bottom-0 left-0 right-0 p-2 pointer-events-auto transition-all" :style="{ backgroundColor: showFullscreen ? '' : coverRgb }" @click="clickContainer">
<div v-if="showFullscreen" class="absolute bottom-4 left-0 right-0 w-full pb-4 pt-2 mx-auto px-6" style="max-width: 414px"> <div v-if="showFullscreen" class="absolute bottom-4 left-0 right-0 w-full pb-4 pt-2 mx-auto px-6" style="max-width: 414px">
<div class="flex items-center justify-between pointer-events-auto"> <div class="flex items-center justify-between pointer-events-auto">
<span v-if="!isPodcast && isServerItem && networkConnected" class="material-icons text-3xl text-white text-opacity-75 cursor-pointer" @click="$emit('showBookmarks')">{{ bookmarks.length ? 'bookmark' : 'bookmark_border' }}</span> <span v-if="!isPodcast && serverLibraryItemId && networkConnected" class="material-icons text-3xl text-white text-opacity-75 cursor-pointer" @click="$emit('showBookmarks')">{{ bookmarks.length ? 'bookmark' : 'bookmark_border' }}</span>
<!-- hidden for podcasts but still using this as a placeholder --> <!-- hidden for podcasts but still using this as a placeholder -->
<span v-else class="material-icons text-3xl text-white text-opacity-0">bookmark</span> <span v-else class="material-icons text-3xl text-white text-opacity-0">bookmark</span>
@ -115,7 +115,7 @@ export default {
}, },
sleepTimerRunning: Boolean, sleepTimerRunning: Boolean,
sleepTimeRemaining: Number, sleepTimeRemaining: Number,
isServerItem: Boolean serverLibraryItemId: String
}, },
data() { data() {
return { return {
@ -391,7 +391,7 @@ export default {
}, },
clickTitleAndAuthor() { clickTitleAndAuthor() {
if (!this.showFullscreen) return if (!this.showFullscreen) return
const llid = this.libraryItem ? this.libraryItem.id : this.localLibraryItem ? this.localLibraryItem.id : null const llid = this.serverLibraryItemId || this.libraryItem?.id || this.localLibraryItem?.id
if (llid) { if (llid) {
this.$router.push(`/item/${llid}`) this.$router.push(`/item/${llid}`)
this.showFullscreen = false this.showFullscreen = false

2
components/app/AudioPlayerContainer.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<div> <div>
<app-audio-player ref="audioPlayer" :bookmarks="bookmarks" :sleep-timer-running="isSleepTimerRunning" :sleep-time-remaining="sleepTimeRemaining" :is-server-item="!!serverLibraryItemId" @selectPlaybackSpeed="showPlaybackSpeedModal = true" @updateTime="(t) => (currentTime = t)" @showSleepTimer="showSleepTimer" @showBookmarks="showBookmarks" /> <app-audio-player ref="audioPlayer" :bookmarks="bookmarks" :sleep-timer-running="isSleepTimerRunning" :sleep-time-remaining="sleepTimeRemaining" :serverLibraryItemId="serverLibraryItemId" @selectPlaybackSpeed="showPlaybackSpeedModal = true" @updateTime="(t) => (currentTime = t)" @showSleepTimer="showSleepTimer" @showBookmarks="showBookmarks" />
<modals-playback-speed-modal v-model="showPlaybackSpeedModal" :playback-rate.sync="playbackSpeed" @update:playbackRate="updatePlaybackSpeed" @change="changePlaybackSpeed" /> <modals-playback-speed-modal v-model="showPlaybackSpeedModal" :playback-rate.sync="playbackSpeed" @update:playbackRate="updatePlaybackSpeed" @change="changePlaybackSpeed" />
<modals-sleep-timer-modal v-model="showSleepTimerModal" :current-time="sleepTimeRemaining" :sleep-timer-running="isSleepTimerRunning" :current-end-of-chapter-time="currentEndOfChapterTime" :is-auto="isAutoSleepTimer" @change="selectSleepTimeout" @cancel="cancelSleepTimer" @increase="increaseSleepTimer" @decrease="decreaseSleepTimer" /> <modals-sleep-timer-modal v-model="showSleepTimerModal" :current-time="sleepTimeRemaining" :sleep-timer-running="isSleepTimerRunning" :current-end-of-chapter-time="currentEndOfChapterTime" :is-auto="isAutoSleepTimer" @change="selectSleepTimeout" @cancel="cancelSleepTimer" @increase="increaseSleepTimer" @decrease="decreaseSleepTimer" />

12
pages/item/_id/index.vue
View file

@ -602,7 +602,7 @@ export default {
} else if (this.isLocal) { } else if (this.isLocal) {
localEpisode = episode localEpisode = episode
} }
const serverEpisodeId = !this.isLocal ? episodeId : localEpisode ? localEpisode.serverEpisodeId : null const serverEpisodeId = !this.isLocal ? episodeId : localEpisode?.serverEpisodeId || null
if (serverEpisodeId && this.serverLibraryItemId && this.isCasting) { if (serverEpisodeId && this.serverLibraryItemId && this.isCasting) {
// If casting and connected to server for local library item then send server library item id // If casting and connected to server for local library item then send server library item id
@ -837,9 +837,19 @@ export default {
console.log('RSS Feed Closed', data) console.log('RSS Feed Closed', data)
this.rssFeed = null this.rssFeed = null
} }
},
async setLibrary() {
if (!this.libraryItem.libraryId) return
await this.$store.dispatch('libraries/fetch', this.libraryItem.libraryId)
this.$localStore.setLastLibraryId(this.libraryItem.libraryId)
} }
}, },
mounted() { mounted() {
// If library of this item is different from current library then switch libraries
if (this.$store.state.libraries.currentLibraryId !== this.libraryItem.libraryId) {
this.setLibrary()
}
this.windowWidth = window.innerWidth this.windowWidth = window.innerWidth
window.addEventListener('resize', this.windowResized) window.addEventListener('resize', this.windowResized)
this.$eventBus.$on('library-changed', this.libraryChanged) this.$eventBus.$on('library-changed', this.libraryChanged)