groove/audiobookshelf
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf.git synced 2025-12-21 19:29:37 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge branch 'master' into feat/book-series-info

Browse source
This commit is contained in:
Greg Lorenzen 2025-01-22 13:38:47 -08:00
commit 93a4f30d38
49 changed files with 812 additions and 350 deletions
Download patch file Download diff file Expand all files Collapse all files

2
client/components/app/MediaPlayerContainer.vue
View file

@ -55,7 +55,7 @@
@showPlayerQueueItems="showPlayerQueueItemsModal = true"
/>
<modals-bookmarks-modal v-model="showBookmarksModal" :bookmarks="bookmarks" :current-time="bookmarkCurrentTime" :library-item-id="libraryItemId" @select="selectBookmark" />
<modals-bookmarks-modal v-model="showBookmarksModal" :bookmarks="bookmarks" :current-time="bookmarkCurrentTime" :playback-rate="currentPlaybackRate" :library-item-id="libraryItemId" @select="selectBookmark" />
<modals-sleep-timer-modal v-model="showSleepTimerModal" :timer-set="sleepTimerSet" :timer-type="sleepTimerType" :remaining="sleepTimerRemaining" :has-chapters="!!chapters.length" @set="setSleepTimer" @cancel="cancelSleepTimer" @increment="incrementSleepTimer" @decrement="decrementSleepTimer" />

41
client/components/modals/BookmarksModal.vue
View file

@ -5,24 +5,26 @@
<p class="text-3xl text-white truncate">{{ $strings.LabelYourBookmarks }}</p>
</div>
</template>
<div ref="container" class="w-full rounded-lg bg-bg box-shadow-md overflow-y-auto overflow-x-hidden" style="max-height: 80vh">
<div v-if="show" class="w-full h-full">
<div v-if="show" class="w-full rounded-lg bg-bg box-shadow-md relative" style="max-height: 80vh">
<div v-if="bookmarks.length" class="h-full max-h-[calc(80vh-60px)] w-full relative overflow-y-auto overflow-x-hidden">
<template v-for="bookmark in bookmarks">
<modals-bookmarks-bookmark-item :key="bookmark.id" :highlight="currentTime === bookmark.time" :bookmark="bookmark" @click="clickBookmark" @update="submitUpdateBookmark" @delete="deleteBookmark" />
<modals-bookmarks-bookmark-item :key="bookmark.id" :highlight="currentTime === bookmark.time" :bookmark="bookmark" :playback-rate="playbackRate" @click="clickBookmark" @delete="deleteBookmark" />
</template>
<div v-if="!bookmarks.length" class="flex h-32 items-center justify-center">
<p class="text-xl">{{ $strings.MessageNoBookmarks }}</p>
</div>
<div v-if="!hideCreate" class="w-full h-px bg-white bg-opacity-10" />
<form v-if="!hideCreate" @submit.prevent="submitCreateBookmark">
<div v-show="canCreateBookmark" class="flex px-4 py-2 items-center text-center border-b border-white border-opacity-10 text-white text-opacity-80">
</div>
<div v-else class="flex h-32 items-center justify-center">
<p class="text-xl">{{ $strings.MessageNoBookmarks }}</p>
</div>
<div v-if="canCreateBookmark && !hideCreate" class="w-full border-t border-white/10">
<form @submit.prevent="submitCreateBookmark">
<div class="flex px-4 py-2 items-center text-center border-b border-white border-opacity-10 text-white text-opacity-80">
<div class="w-16 max-w-16 text-center">
<p class="text-sm font-mono text-gray-400">
{{ this.$secondsToTimestamp(currentTime) }}
{{ this.$secondsToTimestamp(currentTime / playbackRate) }}
</p>
</div>
<div class="flex-grow px-2">
<ui-text-input v-model="newBookmarkTitle" placeholder="Note" class="w-full" />
<ui-text-input v-model="newBookmarkTitle" placeholder="Note" class="w-full h-10" />
</div>
<ui-btn type="submit" color="success" :padding-x="4" class="h-10"><span class="material-symbols text-2xl -mt-px">add</span></ui-btn>
</div>
@ -45,6 +47,7 @@ export default {
default: 0
},
libraryItemId: String,
playbackRate: Number,
hideCreate: Boolean
},
data() {
@ -57,6 +60,7 @@ export default {
watch: {
show(newVal) {
if (newVal) {
this.selectedBookmark = null
this.showBookmarkTitleInput = false
this.newBookmarkTitle = ''
}
@ -72,7 +76,7 @@ export default {
}
},
canCreateBookmark() {
return !this.bookmarks.find((bm) => bm.time === this.currentTime)
return !this.bookmarks.find((bm) => Math.abs(this.currentTime - bm.time) < 1)
},
dateFormat() {
return this.$store.state.serverSettings.dateFormat
@ -102,19 +106,6 @@ export default {
clickBookmark(bm) {
this.$emit('select', bm)
},
submitUpdateBookmark(updatedBookmark) {
var bookmark = { ...updatedBookmark }
this.$axios
.$patch(`/api/me/item/${this.libraryItemId}/bookmark`, bookmark)
.then(() => {
this.$toast.success(this.$strings.ToastBookmarkUpdateSuccess)
})
.catch((error) => {
this.$toast.error(this.$strings.ToastFailedToUpdate)
console.error(error)
})
this.show = false
},
submitCreateBookmark() {
if (!this.newBookmarkTitle) {
this.newBookmarkTitle = this.$formatDatetime(Date.now(), this.dateFormat, this.timeFormat)

25
client/components/modals/bookmarks/BookmarkItem.vue
View file

@ -1,8 +1,8 @@
<template>
<div class="flex items-center px-4 py-4 justify-start relative bg-primary hover:bg-opacity-25" :class="wrapperClass" @click.stop="click" @mouseover="mouseover" @mouseleave="mouseleave">
<div class="flex items-center px-4 py-4 justify-start relative hover:bg-primary/10" :class="wrapperClass" @click.stop="click" @mouseover="mouseover" @mouseleave="mouseleave">
<div class="w-16 max-w-16 text-center">
<p class="text-sm font-mono text-gray-400">
{{ this.$secondsToTimestamp(bookmark.time) }}
{{ this.$secondsToTimestamp(bookmark.time / playbackRate) }}
</p>
</div>
<div class="flex-grow overflow-hidden px-2">
@ -10,7 +10,7 @@
<form @submit.prevent="submitUpdate">
<div class="flex items-center">
<div class="flex-grow pr-2">
<ui-text-input v-model="newBookmarkTitle" placeholder="Note" class="w-full" />
<ui-text-input v-model="newBookmarkTitle" placeholder="Note" class="w-full h-10" />
</div>
<ui-btn type="submit" color="success" :padding-x="4" class="h-10"><span class="material-symbols text-2xl -mt-px">forward</span></ui-btn>
<div class="pl-2 flex items-center">
@ -35,7 +35,8 @@ export default {
type: Object,
default: () => {}
},
highlight: Boolean
highlight: Boolean,
playbackRate: Number
},
data() {
return {
@ -83,11 +84,19 @@ export default {
if (this.newBookmarkTitle === this.bookmark.title) {
return this.cancelEditing()
}
var bookmark = { ...this.bookmark }
const bookmark = { ...this.bookmark }
bookmark.title = this.newBookmarkTitle
this.$emit('update', bookmark)
this.$axios
.$patch(`/api/me/item/${bookmark.libraryItemId}/bookmark`, bookmark)
.then(() => {
this.isEditing = false
})
.catch((error) => {
this.$toast.error(this.$strings.ToastFailedToUpdate)
console.error(error)
})
}
},
mounted() {}
}
}
</script>

12
client/components/modals/rssfeed/OpenCloseModal.vue
View file

@ -12,7 +12,7 @@
<div class="w-full relative">
<ui-text-input :value="feedUrl" readonly />
<span class="material-symbols absolute right-2 bottom-2 p-0.5 text-base transition-transform duration-100 text-gray-300 hover:text-white transform hover:scale-125 cursor-pointer" @click="copyToClipboard(feedUrl)">content_copy</span>
<span class="material-symbols absolute right-2 bottom-2 p-0.5 text-base transition-transform duration-100 transform hover:scale-125 cursor-pointer" :class="copiedToClipboard ? 'text-success' : 'text-gray-300 hover:text-white'" @click="copyToClipboard(feedUrl)">{{ copiedToClipboard ? 'check' : 'content_copy' }}</span>
</div>
<div v-if="currentFeed.meta" class="mt-5">
@ -68,7 +68,8 @@ export default {
preventIndexing: true,
ownerName: '',
ownerEmail: ''
}
},
copiedToClipboard: false
}
},
watch: {
@ -160,8 +161,11 @@ export default {
this.processing = false
})
},
copyToClipboard(str) {
this.$copyToClipboard(str, this)
async copyToClipboard(str) {
this.copiedToClipboard = await this.$copyToClipboard(str)
setTimeout(() => {
this.copiedToClipboard = false
}, 2000)
},
closeFeed() {
this.processing = true

12
client/components/modals/rssfeed/ViewFeedModal.vue
View file

@ -6,7 +6,7 @@
<div class="w-full relative">
<ui-text-input :value="feedUrl" readonly />
<span class="material-symbols absolute right-2 bottom-2 p-0.5 text-base transition-transform duration-100 text-gray-300 hover:text-white transform hover:scale-125 cursor-pointer" @click="copyToClipboard(feedUrl)">content_copy</span>
<span class="material-symbols absolute right-2 bottom-2 p-0.5 text-base transition-transform duration-100 transform hover:scale-125 cursor-pointer" :class="copiedToClipboard ? 'text-success' : 'text-gray-300 hover:text-white'" @click="copyToClipboard(feedUrl)">{{ copiedToClipboard ? 'check' : 'content_copy' }}</span>
</div>
<div v-if="feed.meta" class="mt-5">
@ -56,7 +56,8 @@ export default {
},
data() {
return {
processing: false
processing: false,
copiedToClipboard: false
}
},
computed: {
@ -76,8 +77,11 @@ export default {
}
},
methods: {
copyToClipboard(str) {
this.$copyToClipboard(str, this)
async copyToClipboard(str) {
this.copiedToClipboard = await this.$copyToClipboard(str)
setTimeout(() => {
this.copiedToClipboard = false
}, 2000)
}
},
mounted() {}

4
client/components/readers/EpubReader.vue
View file

@ -97,9 +97,9 @@ export default {
},
ebookUrl() {
if (this.fileId) {
return `/api/items/${this.libraryItemId}/ebook/${this.fileId}`
return `${this.$config.routerBasePath}/api/items/${this.libraryItemId}/ebook/${this.fileId}`
}
return `/api/items/${this.libraryItemId}/ebook`
return `${this.$config.routerBasePath}/api/items/${this.libraryItemId}/ebook`
},
themeRules() {
const isDark = this.ereaderSettings.theme === 'dark'